/* Icosaedro A — luminous edges, quiet reading surfaces.
   Bundled defaults only: design-runtime's inline theme/element styles win.
   Keep gradients off text and off editable surface backgrounds. The warm-paper
   editorial sections intentionally retain their ink/paper contrast pairing. */
:root {
  --ember: #ff4b0a;
  --lime: #ff0a8a; /* Legacy editor key: magenta, not green. */
  --violet: #aa35ff;
  --electric: #3867ff;
  --cyan: #28d9f7;
  --brand-spectrum: linear-gradient(110deg, var(--ember) 0%, var(--lime) 36%, var(--violet) 67%, var(--electric) 91%, var(--cyan) 100%);
  --brand-warm-text: #ffad8a;
  --brand-pink-text: #ff9dcc;
  --brand-violet-text: #d9afff;
  --brand-blue-text: #a5baff;
  --brand-ink-accent: #79309b;
  --brand-border: #887299;
}
/* Derived accents follow owner palette changes; fallbacks above support older
   engines. Saturated logo colors remain structural, not small body copy. */
@supports (color: color-mix(in srgb, red, white)) {
  :root {
    --brand-warm-text: color-mix(in srgb, var(--ember) 45%, var(--white));
    --brand-pink-text: color-mix(in srgb, var(--lime) 40%, var(--white));
    --brand-violet-text: color-mix(in srgb, var(--violet) 40%, var(--white));
    --brand-blue-text: color-mix(in srgb, var(--electric) 40%, var(--white));
    --brand-ink-accent: color-mix(in srgb, var(--violet) 52%, var(--ink));
    --brand-border: color-mix(in srgb, var(--violet) 20%, #817589);
  }
}

/* Identity: preserve the silhouette and the supplied asset colors. */
.brand-mark { width: 52px; height: 52px; border: 0; border-radius: 0; background: transparent; overflow: visible; flex: 0 0 auto; }
.brand-mark::after { display: none; }
.brand img { width: 48px; height: 48px; }
.brand:hover img { transform: translateY(-2px); }
.brand strong { letter-spacing: .055em; font-weight: 800; text-transform: uppercase; }
.brand strong span { color: var(--brand-blue-text); }
.brand small { color: #c1cbd3; letter-spacing: .13em; }
.site-header { background: var(--night-2); border-color: var(--brand-border); box-shadow: 0 12px 36px #0005; }
.site-header.scrolled { background: var(--night); border-color: var(--brand-border); }
.scroll-meter span { background: var(--brand-spectrum); }

/* Solid text and controls; the spectrum sits in thin, nonessential trim. */
.hero [data-site-headline] em { color: var(--brand-pink-text); background: none; }
.hero .kicker { display: flex; align-items: baseline; gap: 12px; }
.hero .kicker::before { content: ""; display: inline-block; width: 22px; height: 3px; background: var(--brand-spectrum); flex: 0 0 22px; }
.hero-entry-links a { text-decoration-color: var(--brand-warm-text); text-decoration-thickness: 2px; }
.hero-entry-links a:hover { color: var(--brand-pink-text); }
.hero-entry-links a span { color: var(--brand-blue-text); }
.main-nav .nav-cta, .button-primary, .dialog-close {
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--white);
  box-shadow: 0 3px 0 var(--violet);
}
.main-nav .nav-cta:hover, .button-primary:hover, .dialog-close:hover {
  color: var(--ink);
  background: var(--white);
  border-color: var(--brand-pink-text);
  filter: none;
}
.hero-actions .button-primary { box-shadow: 0 3px 0 var(--lime), 0 10px 24px #aa35ff18; }
.hero-actions .button-primary:hover { transform: translateY(-2px); box-shadow: 0 3px 0 var(--violet), 0 12px 28px #aa35ff24; }
.button-ghost { color: var(--white); border-color: var(--brand-border); }
.button-ghost:hover { color: var(--ink); background: var(--white); border-color: var(--white); }
.skip-link, .status-message { color: var(--ink); background: var(--white); border: 2px solid var(--violet); }

/* No new animation or opaque overlay on owner backgrounds. */
.hero-lab { background: var(--night-2); border: 1px solid var(--brand-border); border-bottom-right-radius: 42px; box-shadow: 0 24px 70px #0005, 0 0 38px #aa35ff10; }
.hero-lab::before { inset: 0 0 auto; height: 3px; background: var(--brand-spectrum); pointer-events: none; }
.lab-topline::after { content: ""; width: 8px; height: 8px; margin-block: 3px; background: var(--ember); flex: 0 0 8px; }
.lab-orbit { background: var(--night); border-color: var(--line); }
.orbit-a { border-color: var(--ember); }
.orbit-b { border-color: var(--lime); }
.orbit-c { border-color: var(--electric); }
.hero-specimen figcaption { background: var(--night-2); border-color: var(--brand-border); }
.hero-specimen figcaption small { color: var(--brand-violet-text); }
.hero-path button { background: var(--night-3); border-color: var(--brand-border); }
.hero-path button:hover { border-color: var(--brand-violet-text); }
.hero-path button[aria-selected="true"], .hero-path button[aria-pressed="true"] {
  color: var(--ink); background: var(--white); border-color: var(--white); box-shadow: inset 0 -3px var(--violet);
}
.hero-path button[aria-selected="true"] span, .hero-path button[aria-pressed="true"] span { color: var(--ink); }
.signal-strip { position: relative; background: var(--night-2); color: #c4cbd6; }
.signal-strip::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: var(--brand-spectrum); pointer-events: none; }
.signal-strip i { color: var(--brand-violet-text); }

/* Commercial entry points keep every delivery/limit visible and unchanged. */
.solutions-section { background: var(--night-2); }
.commercial-heading .section-code { color: var(--brand-warm-text); }
.entry-card, .entry-card:nth-child(2) { position: relative; background: var(--night-3); border: 1px solid var(--brand-border); }
.entry-card::before { content: ""; position: absolute; top: 0; left: 24px; right: 24px; height: 3px; background: var(--brand-spectrum); pointer-events: none; }
.entry-card .section-code, .entry-delivery span { color: var(--brand-warm-text); }
.entry-card:nth-child(2) .section-code, .entry-card:nth-child(2) .entry-delivery span { color: var(--brand-violet-text); }
.entry-action { border: 1px solid var(--white); }
.entry-action:hover { background: var(--white); color: var(--ink); border-color: var(--brand-pink-text); text-decoration: underline; text-underline-offset: 4px; }
.scope-note { border-left-color: var(--brand-violet-text); }
.light-heading h2 em, .solutions-section .section-heading h2 em { color: var(--brand-blue-text); }
.solution-card { background: var(--night-3); }
.solution-card:hover { background: var(--night-3); border-color: var(--brand-violet-text); }
.solution-index { color: var(--brand-pink-text); }
.solution-card li::after { color: var(--brand-blue-text); }
.manifesto-copy h2 em:first-of-type { color: var(--brand-warm-text); }
.manifesto-copy h2 em:last-of-type { color: var(--brand-pink-text); }

/* Warm-paper editorial islands: use dark variants, never luminous text. */
.projects-section .section-heading h2 em, .capabilities-section .section-heading h2 em,
.studio-copy h2 em { color: var(--brand-ink-accent); }
.capability .index, .case-narrative small { color: var(--brand-ink-accent); }
.capability:hover .index { color: var(--brand-warm-text); }
.capability:hover p { color: #c1c8d3; }
.trajectory-list li::after { color: var(--brand-ink-accent); }
.legal-index a:hover { color: var(--brand-ink-accent); text-decoration: underline; }
.project-card { border-color: var(--brand-border); }
.project-card-body, .project-card:nth-child(even) .project-card-body { background: var(--night-2); }
.project-card:hover { box-shadow: 0 18px 42px #0b0d1230; }
.project-state { color: var(--brand-blue-text); border-color: var(--brand-border); }
.project-preview-status span:last-child { color: var(--brand-blue-text); }

.process-section, .faq-section { background: var(--night-2); }
.process-step { background: var(--night-3); }
.process-step:hover { background: var(--night-3); border-color: var(--brand-pink-text); }
.process-step .number { color: var(--brand-pink-text); }
.faq-section .section-heading h2 em { color: var(--brand-violet-text); }
.faq-item summary i { background: var(--white); color: var(--ink); }
.faq-item[open] summary i { background: var(--brand-violet-text); color: var(--ink); }
.contact-section, .case-next-step { background: var(--night-2); }
.contact-section { border-top: 1px solid var(--brand-border); }
.contact-section h2 em { color: var(--brand-pink-text); }
.contact-topics button { border-color: #8993a4; }
.contact-topics button:hover { border-color: var(--brand-pink-text); }
.contact-topics button[aria-pressed="true"] { color: var(--ink); background: var(--white); border-color: var(--white); box-shadow: inset 0 -3px var(--violet); }
.contact-link > span:last-child { background: var(--white); color: var(--ink); }
.contact-link:hover { color: var(--brand-pink-text); }
.contact-link-whatsapp:hover { color: var(--brand-blue-text); }
.contact-link:hover > span:last-child { background: var(--brand-violet-text); }
.contact-privacy a:hover, .footer-legal a:hover { color: var(--brand-blue-text); }
.footer-brand { color: var(--white); font-weight: 700; letter-spacing: .035em; }
.footer-brand img { width: 40px; height: 40px; object-fit: contain; }
.site-footer { border-top-color: var(--brand-border); }

/* Do not depend on color alone for focus or selected controls. Avoid changing
   the builder's own selection styles or its editable element geometry. */
:focus-visible { outline: 3px solid var(--brand-blue-text); outline-offset: 5px; }
:where(.projects-section,.capabilities-section,.proof-band,.project-detail-panel,.studio-section,.legal-page) :focus-visible { outline-color: #663194; }
.project-card:focus-visible, .project-detail-toolbar :focus-visible, .case-next-step :focus-visible { outline-color: var(--brand-blue-text); }

@media (max-width:760px) {
  .brand { gap: 7px; }
  .brand-mark { width: 40px; height: 40px; }
  .brand-mark img { width: 40px; height: 40px; }
  .brand strong { font-size: .67rem; letter-spacing: .02em; }
  .brand small { font-size: .46rem; }
  .hero-lab { border-bottom-right-radius: 30px; }
  .menu-button { background: var(--white); border: 1px solid var(--brand-border); }
  .main-nav { background: var(--night); border-color: var(--brand-border); }
  /* Preserve the existing fix: 34px FAQ glyph overflowed its 30px track. */
  .faq-item summary i { width: 30px; height: 30px; min-width: 0; }
}
@media (max-width:360px) {
  .brand-mark, .brand-mark img { width: 32px; height: 32px; }
  .brand strong { font-size: .6rem; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  /* premium.css already disables animation/transition globally. These remove
     residual hover movement, not stateful menu/FAQ open-state transforms. */
  .brand:hover img, .hero-actions .button-primary:hover, .button:hover,
  .main-nav .nav-cta:hover, .dialog-close:hover, .hero-path button:hover,
  .solution-card:hover, .process-step:hover, .source-links a:hover,
  .filter-button:hover, .studio-media:hover img, .contact-link:hover > span:last-child { transform: none; }
  .process-step:hover::before { scale: none; }
  .capability:hover { padding-inline: 24px; }
  .contact-link:hover { padding-inline: 0; }
}
@media (prefers-reduced-motion:reduce) and (max-width:760px) {
  .capability:hover { padding-inline: 0; }
}
@media (forced-colors:active) {
  /* Gradients/glow are optional decoration. Leave content and controls to the
     system palette; only the multicolor logo gets a stable dark backplate. */
  .brand-mark { background: #090b10; forced-color-adjust: none; }
  .hero-lab::before, .entry-card::before, .signal-strip::before { display: none; }
  .scroll-meter span { background: Highlight; }
  .hero [data-site-headline] em { color: CanvasText; }
  .site-header, .hero-lab, .entry-card, .entry-card:nth-child(2), .project-card,
  .solution-card, .process-step, .hero-path button, .contact-topics button,
  .menu-button, .button, .entry-action, .main-nav .nav-cta, .dialog-close { border-color: ButtonText; box-shadow: none; }
  .main-nav .nav-cta:hover, .hero-actions .button-primary, .hero-actions .button-primary:hover { box-shadow: none; }
  .hero-path button[aria-selected="true"], .hero-path button[aria-pressed="true"],
  .contact-topics button[aria-pressed="true"], .filter-button[aria-pressed="true"] {
    border-color: Highlight; outline: 2px solid Highlight; outline-offset: -4px; box-shadow: none;
  }
  :focus-visible,
  :where(.projects-section,.capabilities-section,.proof-band,.project-detail-panel,.studio-section,.legal-page) :focus-visible,
  .project-card:focus-visible, .project-detail-toolbar :focus-visible, .case-next-step :focus-visible { outline-color: Highlight; }
}