/* Refinamento 03: ações discretas, acentos por estudo e curadoria de conteúdo. */
:root{--demo-accent:#b91e50;--demo-strong:#a31a46;--action-accent:#a21a46}

/* Botões mantêm uma escala de interface, sem relevo ou brilho excessivo. */
.metal-button{min-height:42px;padding:10px 16px;gap:12px;font-size:12px;font-weight:500;border-width:1px;border-radius:4px;box-shadow:none;line-height:1.4}
.metal-button:hover,.metal-button:focus-visible{box-shadow:none;transform:none}
.metal-button svg,.text-link svg{width:16px;height:16px}
.metal-button::after{display:none}
.header-actions .metal-button{min-height:36px;padding:8px 12px;font-size:11px;gap:10px}
.hero-actions{gap:18px}.hero-actions .text-link{font-size:12px}
.hero-copy>p{max-width:44ch;line-height:1.75}
.reference-grid img{height:auto!important;aspect-ratio:3/4;object-fit:cover;object-position:center}
.creation-demo figure img{height:auto!important;aspect-ratio:3/4;object-position:center}
.output-piece img{filter:none;object-position:center}
.output-heading h3{max-width:28ch;line-height:1.3}
.hero-demo-panels{min-height:0!important}
.hero-window{transform:none!important}
.demo-search,.reference-grid figcaption,.ai-insight p,.ai-insight b{font-size:12px}
.window-label{font-size:11px}.product-caption,.demo-note{font-size:12px}

/* 01 — Papel, preto e rosa apenas nos detalhes. */
[data-theme=editorial] .metal-button,[data-theme=portfolio] .metal-button{background:#171916;border-color:#171916;color:#f3f1ea;box-shadow:none}
[data-theme=editorial] .metal-button:hover,[data-theme=portfolio] .metal-button:hover{background:#30332c;border-color:#30332c}
[data-theme=editorial] .hero-actions .metal-button,[data-theme=portfolio] .hero-actions .metal-button{min-height:40px;padding:10px 16px;gap:12px;font-size:12px}
[data-theme=editorial] .preview-button,.theme-editorial .preview-button,.theme-portfolio .preview-button{background:#171916;border-color:#171916;color:#f3f1ea;border-radius:3px;box-shadow:none}

/* 02 — Ouro é o acento. Nenhum rosa ou azul na interface. */
[data-theme=ouro]{--accent:#946b16;--core:#946b16;--demo-accent:#946b16;--demo-strong:#7f5a10;--action-accent:#805c15}
[data-theme=ouro] .metal-button{border-width:1px;border-radius:4px;box-shadow:none;background:linear-gradient(115deg,#f8f9fa,#d9dce0 25%,#f6f7f8 49%,#c7cbd0 73%,#f4f5f7) padding-box,conic-gradient(from var(--metal-angle,115deg),#957023,#efd185,#a3771f,#f7e4ab,#ac802c,#957023) border-box;background-size:170% 100%,100% 100%;color:#22251f}
[data-theme=ouro] .metal-button:hover{background-position:var(--shine-x,75%) 50%,50% 50%}
[data-theme=ouro] .hero-copy h1{font-size:clamp(40px,4.2vw,62px);line-height:1.14}
[data-theme=ouro] .hero-product{width:min(640px,100%)}
[data-theme=ouro] .hero-window .creation-demo{padding-inline:28px}
[data-theme=ouro] .hero-copy>p{max-width:48ch;margin-inline:auto}

/* 03 — Cromo, foco na continuidade da operação. */
[data-theme=cromo]{--accent:#c9cec9;--core:#c9cec9;--demo-accent:#515c53;--demo-strong:#38463c;--action-accent:#515c53}
[data-theme=cromo] .metal-button{background:linear-gradient(115deg,#e1e5e3,#f5f6f5 45%,#c9d0cd) padding-box;border-color:#c4ceca;box-shadow:none;border-radius:4px}
[data-theme=cromo] .hero-copy h1{font-size:clamp(42px,4.4vw,66px)}
[data-theme=cromo] .product-window{border-color:#5c665a}

/* 04 — Portfólio claro. As criações chegam antes da explicação. */
[data-theme=portfolio]{--paper:#f8f7f2;--soft:#eeeee6;--line:#d9d9d0}
[data-theme=portfolio] .hero-layout{grid-template-columns:1.45fr .7fr;gap:70px;align-items:end}
[data-theme=portfolio] .hero-copy h1{font-size:clamp(40px,4.1vw,62px);max-width:19ch}
[data-theme=portfolio] .hero-copy>p{max-width:46ch}
[data-theme=portfolio] .scroll-cue{display:none}
.portfolio-intro{padding-bottom:4px;display:flex;flex-direction:column;align-items:start}
.portfolio-intro .mini-nexo{margin-bottom:30px}
.portfolio-intro .mini-nexo svg{width:28px;height:28px}
.portfolio-intro p{font-size:15px;line-height:1.8;color:var(--muted)}
.portfolio-intro .eyebrow{margin-top:22px;font-size:10px}
.portfolio-showcase{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;margin-top:52px;align-items:start}
.portfolio-showcase figure{margin:0;min-width:0}
.portfolio-showcase figure:nth-child(2){margin-top:44px}
.portfolio-showcase img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:3px}
.portfolio-showcase figcaption{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted);padding-top:12px}
[data-theme=portfolio] .hero-foot{margin-top:35px}
[data-theme=portfolio] .proof-section{background:#ebece4;color:#171916;--muted:#63695c;--line:#c8cdbe}
[data-theme=portfolio] .proof-top .eyebrow,[data-theme=portfolio] .almost,[data-theme=portfolio] .proof-description>span,[data-theme=portfolio] .proof-source,[data-theme=portfolio] .report-inner>p,[data-theme=portfolio] .report-stats span,[data-theme=portfolio] .report-details summary>span:last-child,[data-theme=portfolio] thead th,[data-theme=portfolio] table caption,[data-theme=portfolio] .output-piece .eyebrow,[data-theme=portfolio] .piece-index{color:#606654}
[data-theme=portfolio] .proof-source,[data-theme=portfolio] .report-details,[data-theme=portfolio] th,[data-theme=portfolio] td{border-color:#bcc4b3}
[data-theme=portfolio] .gallery-controls button{color:#252d1c;border-color:#979f89}
[data-theme=portfolio] .gallery-controls button:hover{background:#d5deca}
[data-theme=portfolio] .period{border-color:#a3ad95}

/* Quatro opções na galeria e na navegação persistente. */
.theme-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 30px}
.preview-art{height:370px}.preview-heading{font-size:29px;max-width:80%;line-height:1.13;top:77px}
.preview-pieces{right:20px;bottom:47px;width:auto;gap:10px}.preview-pieces img{width:100px;min-width:100px;height:134px;object-fit:cover}
.preview-button{font-size:10px;bottom:22px}.preview-meta p{min-height:0;max-width:43ch}
.theme-ouro .preview-heading{max-width:none;width:calc(100% - 40px);font-size:27px;top:60px}
.theme-ouro .preview-heading br:first-of-type{display:none}
.theme-ouro .preview-pieces{bottom:62px}.theme-ouro .preview-pieces img{width:83px;min-width:83px;height:111px}
.theme-ouro .preview-button{border-radius:3px;bottom:18px;background:var(--silver) padding-box,var(--gold) border-box;color:#222}
.theme-cromo .preview-pieces{right:20px;bottom:47px}.theme-cromo .preview-button{background:#e4e8e5;border-color:#bfc9c0;color:#20261f}
.theme-portfolio .preview-art{background:#f8f7f2}.theme-portfolio .preview-heading{font-size:28px;max-width:90%}
.theme-portfolio .preview-pieces{transform:none;right:22px;bottom:49px}
.theme-portfolio .preview-pieces img:last-child{transform:translateY(15px)}
.index-notes{font-size:12px}
.comparison-bar{gap:8px}.comparison-bar nav>a{padding-inline:11px}

@media(min-width:681px){.story-window .reference-grid img{max-height:270px;object-fit:contain;background:#f1f0e9}.story-window .creation-demo figure img{max-height:260px;object-fit:contain;background:#f1f0e9}}
@media(min-width:681px) and (max-height:800px){.story-window .reference-grid img{max-height:200px}.story-window .creation-demo figure img{max-height:210px}.story-window .demo-search{margin-bottom:10px}.story-window .ai-insight{margin-top:10px;padding-top:10px}}
@media(max-width:1000px){.preview-heading{font-size:24px}.theme-ouro .preview-heading,.theme-portfolio .preview-heading{font-size:24px}.preview-pieces img{width:86px;min-width:86px;height:115px}.preview-art{height:350px}}
@media(max-width:900px){[data-theme=portfolio] .hero-layout{grid-template-columns:1.4fr .7fr;gap:30px}[data-theme=portfolio] .hero-copy h1{font-size:44px}.portfolio-intro p{font-size:13px}.portfolio-showcase{gap:18px}.portfolio-showcase figcaption{font-size:11px}.hero-copy>p{font-size:15px}.demo-search,.reference-grid figcaption,.ai-insight p,.ai-insight b{font-size:11px}}
@media(max-width:680px){
 .metal-button,.hero-actions .metal-button,[data-theme=editorial] .hero-actions .metal-button,[data-theme=portfolio] .hero-actions .metal-button{min-height:44px;padding:10px 15px;gap:10px;font-size:12px}
 .header-actions .metal-button{min-height:36px;padding:8px 11px;font-size:10px}
 .hero-actions .text-link{font-size:12px}.hero-copy>p{max-width:36ch}
 [data-theme=ouro] .hero-copy h1{font-size:clamp(38px,9.7vw,54px)}
 [data-theme=ouro] .hero-copy h1 br:first-of-type{display:block}
 [data-theme=ouro] .hero-product{padding-inline:4px}
 [data-theme=cromo] .hero-copy h1{font-size:clamp(40px,10.6vw,56px)}
 .hero-window .creation-demo,[data-theme=ouro] .hero-window .creation-demo{padding-inline:18px}
 .reference-grid figcaption{font-size:10px}.demo-note{font-size:11px}
 [data-theme=portfolio] .hero-layout{display:block}
 [data-theme=portfolio] .hero-copy h1{font-size:clamp(38px,9.8vw,53px);max-width:20ch}
 .portfolio-intro{display:none}
 .portfolio-showcase{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin-top:32px;padding-bottom:16px;scrollbar-width:thin}
 .portfolio-showcase figure{flex:0 0 77%;scroll-snap-align:start}.portfolio-showcase figure:nth-child(2){margin-top:0}
 .portfolio-showcase figcaption{font-size:11px}
 .output-heading h3{font-size:20px;max-width:20ch}
 .theme-gallery{grid-template-columns:1fr;gap:24px}.preview-art{height:380px}
 .preview-heading{font-size:28px;top:72px}.preview-pieces{right:18px;bottom:57px}
 .preview-pieces img{width:95px;min-width:95px;height:127px}.preview-button{bottom:14px}
 .theme-ouro .preview-heading{top:52px;font-size:26px}.theme-ouro .preview-pieces{bottom:58px}
 .theme-cromo .preview-pieces{bottom:57px;right:18px}
 .theme-portfolio .preview-heading{font-size:26px;max-width:90%}.theme-portfolio .preview-pieces{bottom:64px;right:18px}
 .comparison-home{display:none}.comparison-bar{gap:3px;max-width:calc(100% - 12px);padding:5px}
 .comparison-bar nav>a{font-size:10px;padding:8px;min-height:36px}.comparison-bar>button{font-size:9px;padding:7px;max-width:82px}
}
@media(max-width:360px){.comparison-bar nav>a{font-size:9px;padding-inline:6px}.comparison-bar>button{max-width:75px;font-size:9px}.preview-heading{font-size:25px}.theme-ouro .preview-heading,.theme-portfolio .preview-heading{font-size:24px}.preview-pieces img{width:86px;min-width:86px;height:115px}.preview-button{font-size:9px}.reference-grid figcaption{font-size:9px}}

/* 05 — Rosa. Carmim é a cor primária do Growth.
   Regra: rosa é acento (texto, linhas, botões, estados), nunca fundo de seção.
   Assim o botão rosa nunca fica sobre um fundo rosa. Layout e telas do app ficam em rosa-app.css. */
[data-theme=rosa]{--accent:#b91e50;--demo-accent:#b91e50;--demo-strong:#a31a46;--action-accent:#a21a46;--rose-ink:#8f163e;--rose-soft:#f6e6ea;--rose-line:#e6bfcb;--rose-light:#f08cab}
[data-theme=rosa] .metal-button{border-width:1.5px;border-radius:4px;box-shadow:none;background:linear-gradient(115deg,#f8f9fa,#d9dce0 25%,#f6f7f8 49%,#c7cbd0 73%,#f4f5f7) padding-box,conic-gradient(from var(--metal-angle,115deg),#9e2449,#f5b3c7,#b02d57,#fbdbe4,#bd3a63,#9e2449) border-box;background-size:170% 100%,100% 100%;color:#22251f}
[data-theme=rosa] .metal-button:hover{background-position:var(--shine-x,75%) 50%,50% 50%}
[data-theme=rosa] .metal-button svg{color:var(--accent)}
[data-theme=rosa] .brand>span{color:var(--accent)}
[data-theme=rosa] .main-nav a:hover,[data-theme=rosa] .main-nav a[aria-current]{color:var(--rose-ink)}
[data-theme=rosa] .main-nav a::after{background:var(--accent)}
[data-theme=rosa] .login-link:hover{color:var(--accent)}
[data-theme=rosa] .product-label{color:var(--rose-ink)}
[data-theme=rosa] h1 em,[data-theme=rosa] h2 em{color:var(--accent)}
[data-theme=rosa] .text-link{color:var(--rose-ink)}
[data-theme=rosa] .text-link svg{color:var(--accent)}
[data-theme=rosa] .section-heading>.eyebrow,[data-theme=rosa] .faq-layout .eyebrow,[data-theme=rosa] .closing .eyebrow{color:var(--rose-ink)}
[data-theme=rosa] .proof-top .eyebrow,[data-theme=rosa] .almost{color:var(--rose-light)}
[data-theme=rosa] .million em,[data-theme=rosa] .proof-description>p em{color:var(--rose-light)}
[data-theme=rosa] .period{border-color:#8c3a55}
[data-theme=rosa] .proof-source>a{color:var(--rose-light)}
[data-theme=rosa] .output-piece .eyebrow{color:var(--rose-light)}
[data-theme=rosa] .gallery-controls button{border-color:#8c3a55}
[data-theme=rosa] .gallery-controls button:hover{background:#3a2a30}
[data-theme=rosa] .output-gallery{scrollbar-color:#8c3a55 transparent}
[data-theme=rosa] .report-stats b{color:var(--rose-light)}
[data-theme=rosa] .ecosystem-nexo{color:var(--accent)}
[data-theme=rosa] .product-row.growth{border-top-color:var(--accent)}
[data-theme=rosa] .product-row-footer a:hover{color:var(--accent)}
[data-theme=rosa] .growth-plan{position:relative}
[data-theme=rosa] .growth-plan::before{content:'';position:absolute;top:-1px;left:32px;right:0;height:2px;background:var(--accent)}
[data-theme=rosa] .growth-plan .eyebrow,[data-theme=rosa] .growth-plan h3{color:var(--rose-ink)}
[data-theme=rosa] .growth-tiers span{border-color:var(--rose-line);color:var(--rose-ink)}
[data-theme=rosa] .growth-tiers span:nth-child(2){border-color:var(--accent);color:var(--accent);font-weight:600}
[data-theme=rosa] .price strong,[data-theme=rosa] .bundle-price em{color:var(--accent)}
[data-theme=rosa] .faq-layout summary>span{color:var(--accent)}
[data-theme=rosa] .faq-layout details[open] summary{color:var(--rose-ink)}
[data-theme=rosa] .faq-layout details[open]{border-top-color:var(--accent)}
[data-theme=rosa] .footer-top>span{color:var(--rose-ink)}
[data-theme=rosa] .comparison-bar nav>a[aria-current]{background:var(--demo-strong)}
[data-theme=rosa] .comparison-bar a:hover:not([aria-current]){background:#ecebe3}
/* home: sem a barra de comparação dos estudos, sem o respiro que ela pedia */
[data-theme=rosa] body{padding-bottom:0}
@media(max-width:680px){[data-theme=rosa] .growth-plan::before{left:0}}