/* ════════════════════════════════════════════════════════════════ LUCIANA MELAMED — premium system Dark-wine conservatory brand · one gold · Cormorant + Jost. Loaded by: / · /programas/** · /ferramentas/ · /biblioteca/ · /404.html NOT loaded together with styles.css — the two define the same :root and the same base reset. styles.css still serves the biblioteca article bodies and /privacidade/. /fale-com-a-luciana/ inlines its own styles. Nav, footer, skip-link, the reveal gate and the floating CTA are written against the markup in site/partials/, not against the design export's class names, so one nav partial renders under either stylesheet. ════════════════════════════════════════════════════════════════ */ :root{ --bg:#3A0F1C; --bg-alt:#2B0A15; --bg-dk:#1E0710; --bg-ink:#14060A; --bg-module:#2F0C17; --text:#FAF7F2; --muted:#C8B8A4; --muted-dk:#A8977F; --gold:#C49A3C; --gold-lt:#E2C97E; --ink:#0A0906; --line:rgba(196,154,60,0.18); --line-strong:rgba(196,154,60,0.34); --tf:'Cormorant Garamond',serif; --bf:'Jost',sans-serif; --gutter:clamp(22px,6vw,96px); --maxw:1240px; --ls-eyebrow:0.34em; --ls-label:0.2em; } *,*::before,*::after{margin:0;padding:0;box-sizing:border-box;} html{scroll-behavior:smooth;} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}} body{ font-family:var(--bf);font-weight:300;background:var(--bg);color:var(--text); overflow-x:hidden;line-height:1.6;-webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:rgba(196,154,60,0.2); } ::selection{background:rgba(196,154,60,0.3);color:var(--text);} a{color:var(--gold-lt);text-decoration:none;transition:color .2s;} a:hover{color:var(--gold);} em{font-style:italic;} img{max-width:100%;display:block;} .tnum{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum","lnum";} .skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;} .skip-link:focus{position:fixed;left:16px;top:16px;width:auto;height:auto;z-index:9999;padding:12px 20px; background:var(--gold);color:var(--ink);font-family:var(--bf);font-weight:500;font-size:.9375rem;} .wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);} .eyebrow{ font-family:var(--bf);font-size:.72rem;font-weight:400;letter-spacing:var(--ls-eyebrow); text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:15px; } .eyebrow::before,.eyebrow::after{content:"";width:34px;height:1px;background:var(--gold);opacity:.85;flex:none;} .h-title{font-family:var(--tf);font-weight:400;line-height:1.06;letter-spacing:-0.015em;color:var(--text);} .h-title em{font-style:italic;color:var(--gold-lt);} .lede{font-size:1.075rem;line-height:1.78;color:var(--muted);max-width:60ch;font-weight:300;} .lede strong{color:var(--text);font-weight:400;} /* ── reveal ── Gated on html.reveal-on, which the inline guard sets only when motion is allowed and clears after a 2.5s safety timeout. Without JS the content is never hidden — the export's ungated `.rv{opacity:0}` would blank the page. */ html.reveal-on .rv{opacity:0;} html.reveal-on .rv.in{animation:revealUp .7s cubic-bezier(.22,.61,.36,1) forwards;} @keyframes revealUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}} /* ═══ NAV ═══ (markup: site/partials/site-nav.html) */ nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:24px; padding-block:18px;padding-inline:max(var(--gutter),calc((100% - var(--maxw)) / 2 + var(--gutter))); background:rgba(30,7,16,0.82);border-bottom:1px solid var(--line); backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);} .logo{font-family:var(--tf);font-size:1.24rem;font-weight:500;letter-spacing:.02em;color:var(--text);white-space:nowrap;flex:none;} .logo em{font-style:italic;color:var(--gold);} .nav-links{display:flex;gap:24px;align-items:center;list-style:none;} .nav-links a{font-family:var(--bf);font-size:.72rem;font-weight:400;letter-spacing:var(--ls-label); text-transform:uppercase;color:var(--muted);} .nav-links a:hover{color:var(--gold-lt);} .nav-links a[aria-current="page"]{color:var(--gold-lt);} .nav-links a:focus-visible,.logo:focus-visible{outline:2px solid var(--gold-lt);outline-offset:4px;} /* dropdown submenus */ .nav-has-sub{position:relative;} .nav-sub{position:absolute;top:100%;left:0;background:var(--bg-dk);border:1px solid var(--line);list-style:none; margin:0;padding:8px 0;min-width:220px;opacity:0;visibility:hidden;z-index:100; transition:opacity .2s,visibility 0s linear .2s;} .nav-has-sub:hover .nav-sub,.nav-has-sub:focus-within .nav-sub{opacity:1;visibility:visible; transition:opacity .2s,visibility 0s linear 0s;} .nav-sub li{padding:0;} .nav-sub a{display:block;padding:8px 16px;font-family:var(--bf);font-size:.6875rem;letter-spacing:var(--ls-label); text-transform:uppercase;color:var(--muted);transition:color .2s,background .2s;} .nav-sub a:hover,.nav-sub a:focus-visible{color:var(--gold-lt);background:var(--bg-alt);outline:none;} /* The nav carries no CTA button (see commit d4528b5 — one persistent bottom CTA). The rule survives for /privacidade/, which is hand-edited and still uses it. */ .nav-cta{font-family:var(--bf);font-size:.7rem;letter-spacing:var(--ls-label);text-transform:uppercase; background:var(--gold);color:var(--ink);padding:11px 18px;white-space:nowrap;flex:none;transition:background .2s;} .nav-cta:hover{background:var(--gold-lt);color:var(--ink);} .nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px;flex-direction:column;gap:5px;} .nav-toggle span{width:24px;height:1.5px;background:var(--gold-lt);display:block;} /* ═══ BUTTONS ═══ */ .btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:11px; font-family:var(--bf);font-size:.74rem;letter-spacing:.15em;text-transform:uppercase;font-weight:500; padding:17px 34px;white-space:nowrap;cursor:pointer;border:1px solid transparent; transition:background .25s,color .25s,border-color .25s,box-shadow .3s,transform .25s;} .btn .arw{font-family:var(--tf);font-weight:400;font-size:1.05em;transition:transform .25s;} .btn:hover .arw{transform:translateX(4px);} .btn:active{transform:translateY(0);} .btn:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;} /* primary: dark ink on gold (7.6:1) — lifts + warms to gold-lt on hover */ .btn-gold{background:var(--gold);color:var(--ink); box-shadow:inset 0 1px 0 rgba(255,246,222,.28),0 12px 26px -16px rgba(0,0,0,.85);} .btn-gold:hover{background:var(--gold-lt);color:var(--ink);transform:translateY(-2px); box-shadow:inset 0 1px 0 rgba(255,246,222,.4),0 16px 34px -14px rgba(196,154,60,.6);} /* subtle gold sheen on primary CTAs — a single soft glint every ~6.5s, pauses on hover */ .btn-gold,.floating-cta{overflow:hidden;isolation:isolate;} .btn-gold::after,.floating-cta::after{content:'';position:absolute;top:0;bottom:0;left:0;width:34%; background:linear-gradient(100deg,transparent 0%,rgba(255,248,228,.45) 50%,transparent 100%); transform:translateX(-260%) skewX(-20deg);pointer-events:none;animation:ctaSheen 6.5s ease-in-out infinite;} @keyframes ctaSheen{0%{transform:translateX(-260%) skewX(-20deg);}16%{transform:translateX(320%) skewX(-20deg);}100%{transform:translateX(320%) skewX(-20deg);}} @media(hover:hover) and (pointer:fine){.btn-gold:hover::after,.floating-cta:hover::after{animation-play-state:paused;}} @media(prefers-reduced-motion:reduce){.btn-gold::after,.floating-cta::after{animation:none;content:none;}} /* ghost: outline that fills gold on hover, text flips to ink */ .btn-ghost{background:transparent;color:var(--text);border-color:var(--line-strong);} .btn-ghost:hover{border-color:var(--gold);background:var(--gold);color:var(--ink);transform:translateY(-2px); box-shadow:0 14px 30px -16px rgba(196,154,60,.55);} /* ═══ SECTION SCAFFOLD ═══ */ .sec{padding-block:clamp(76px,11vh,128px);} .sec-head{max-width:none;margin-bottom:clamp(44px,6vh,72px);} .sec-head .eyebrow{margin-bottom:24px;} .sec-head.center{text-align:center;display:flex;flex-direction:column;align-items:center;} .sec-head.center .lede{text-align:center;margin-top:18px;} .sec-title{font-size:clamp(2.2rem,4vw,3.4rem);} /* ═══ PROGRAM HEADER (no photo — a sub-page, not the landing) ═══ */ .phead{position:relative;overflow:hidden;background: radial-gradient(90% 120% at 78% -10%,rgba(196,154,60,0.10),transparent 60%), linear-gradient(180deg,var(--bg-dk),var(--bg) 78%); padding-block:clamp(60px,10vh,104px) clamp(52px,8vh,88px);border-bottom:1px solid var(--line);} .phead .wrap{max-width:960px;} .phead-eyebrow{margin-bottom:30px;} .phead-title{font-size:clamp(2.8rem,6vw,5rem);margin-bottom:28px;max-width:16ch;} .phead-title em{display:block;} .phead-lede{margin-bottom:38px;max-width:56ch;} .hero-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center;} .phead-meta{margin-top:40px;padding-top:28px;border-top:1px solid var(--line); display:flex;gap:clamp(28px,5vw,56px);flex-wrap:wrap;} .phead-meta .mi{display:flex;flex-direction:column;gap:6px;} .phead-meta .mi b{font-family:var(--tf);font-size:1.7rem;font-weight:500;color:var(--gold-lt);line-height:1;} .phead-meta .mi span{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-dk);} .phead-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px;} .phead-chips span{font-family:var(--bf);font-size:.72rem;font-weight:400;letter-spacing:.04em;color:var(--muted); border:1px solid var(--line);padding:9px 15px;display:inline-flex;align-items:center;gap:9px;} .phead-chips span::before{content:"";width:5px;height:5px;background:var(--gold);flex:none;} .scarcity{margin-top:22px;font-family:var(--bf);font-size:.7rem;font-weight:500;letter-spacing:.18em; text-transform:uppercase;color:var(--gold-lt);display:inline-flex;align-items:center;gap:11px;} .scarcity::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold); box-shadow:0 0 0 0 rgba(196,154,60,.5);animation:scarcityPulse 2.4s ease-out infinite;} @keyframes scarcityPulse{0%{box-shadow:0 0 0 0 rgba(196,154,60,.5);}70%{box-shadow:0 0 0 8px rgba(196,154,60,0);}100%{box-shadow:0 0 0 0 rgba(196,154,60,0);}} @media(prefers-reduced-motion:reduce){.scarcity::before{animation:none;}} /* ═══ VALUE / INCLUSO ═══ */ .value{background:linear-gradient(180deg,var(--bg),var(--bg-alt));border-top:1px solid var(--line);} .value .wrap{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(44px,6vw,96px);align-items:start;} /* No decorative rule here: this quote always sits directly under an .eyebrow, whose ::before/::after dashes already carry the gold flourish. A second bar stacked under the eyebrow's left dash read as a stray line. The 32px it used to occupy (2px bar + 30px margin) now lives on the quote itself, so the spacing is unchanged. */ .value-quote{font-family:var(--tf);font-style:italic;font-size:clamp(1.7rem,2.6vw,2.35rem); line-height:1.34;color:var(--text);margin-top:32px;} .value-attr{margin-top:26px;font-size:.72rem;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted-dk);} .incl-group{margin-bottom:40px;} .incl-group:last-child{margin-bottom:0;} .incl-label{font-family:var(--bf);font-size:.7rem;letter-spacing:var(--ls-eyebrow);text-transform:uppercase; color:var(--gold);margin-bottom:22px;display:flex;align-items:center;gap:14px;} .incl-list{list-style:none;} .incl-list li{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:baseline; padding:18px 0;border-top:1px solid var(--line);} .incl-list li:first-child{border-top:0;padding-top:0;} .incl-num{font-family:var(--tf);font-style:italic;font-size:1.05rem;color:var(--gold);line-height:1;} .incl-list p{font-size:1.02rem;line-height:1.6;color:var(--muted);font-weight:300;} .incl-list p strong{color:var(--text);font-weight:400;} /* ═══ PRICING TIERS ═══ */ .pricing{background:var(--bg-dk);} .pricing-top{background:radial-gradient(85% 120% at 50% -20%,rgba(196,154,60,0.11),transparent 60%),var(--bg-dk); padding-top:clamp(60px,9vh,96px);border-bottom:1px solid var(--line);} .pricing .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .pricing .lede{text-align:center;margin-top:22px;} .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:clamp(40px,6vh,64px);align-items:stretch;} .tier{position:relative;background:var(--bg-alt);border:1px solid var(--line);padding:44px 34px 38px;min-width:0; display:flex;flex-direction:column;transition:transform .3s,border-color .3s,box-shadow .3s;} .tier > *{position:relative;z-index:2;} @media(hover:hover){.tier:hover{border-color:var(--line-strong);transform:translateY(-4px); box-shadow:0 26px 60px -38px rgba(0,0,0,.85);}} /* Featured tier — raised, with a slow golden light circling the border */ .tier-feat{background:linear-gradient(180deg,var(--bg-module),var(--bg-alt));border-color:transparent; transform:translateY(-14px);box-shadow:0 40px 80px -44px rgba(0,0,0,.9),0 0 44px -30px rgba(196,154,60,.5);} .tier-feat:hover{transform:translateY(-18px);} .tier-feat::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none; border:1px solid var(--line-strong);} .tier-feat::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;padding:1.5px; background:conic-gradient(from var(--tier-ang,0deg), transparent 0deg,transparent 265deg, rgba(226,201,126,.15) 300deg,var(--gold-lt) 330deg,#FFF4D6 342deg,var(--gold-lt) 354deg,transparent 360deg); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor;mask-composite:exclude; animation:tierGlow 7s linear infinite;} @property --tier-ang{syntax:"";initial-value:0deg;inherits:false;} @keyframes tierGlow{to{--tier-ang:360deg;}} @media(prefers-reduced-motion:reduce){ .tier-feat::after{animation:none; background:conic-gradient(from 300deg,transparent,var(--gold-lt) 40deg,transparent 90deg),var(--line-strong);} } .tier-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);white-space:nowrap;z-index:3; background:var(--gold);color:var(--ink);font-size:.62rem;font-weight:600;letter-spacing:.22em; text-transform:uppercase;padding:7px 17px;box-shadow:0 6px 16px -8px rgba(0,0,0,.7);} .tier-period{font-family:var(--bf);font-size:.7rem;font-weight:500;letter-spacing:var(--ls-eyebrow); text-transform:uppercase;color:var(--gold);margin-bottom:22px;} .tier-price{font-family:var(--tf);font-size:3.2rem;font-weight:500;color:var(--gold-lt);line-height:1;} .tier-price span{font-family:var(--bf);font-size:.9rem;font-weight:300;color:var(--muted);letter-spacing:.02em;} .tier-per{font-size:.82rem;color:var(--muted);margin-top:10px;letter-spacing:.02em;} .tier-save{margin-top:20px;padding-top:18px;border-top:1px dotted var(--line-strong); font-family:var(--tf);font-style:italic;font-size:1rem;line-height:1.5;color:var(--gold);} .tier-save strong{font-weight:500;color:var(--gold-lt);font-style:normal;} .tier-detail{font-size:.92rem;line-height:1.68;color:var(--muted);margin-top:24px;margin-bottom:30px;flex:1;} .tier-detail em{color:var(--gold-lt);font-style:italic;} .tier .btn{width:100%;letter-spacing:.11em;padding-inline:18px;font-size:.72rem;white-space:normal;} /* Overview tiers end on the price line rather than a description, so the CTA needs its own breathing room. */ .tier-per + .btn{margin-top:26px;} .tier-plain .btn{background:transparent;color:var(--gold-lt);border-color:var(--line-strong);box-shadow:none;} .tier-plain .btn:hover{border-color:var(--gold);background:var(--gold);color:var(--ink);transform:translateY(-2px); box-shadow:0 14px 30px -16px rgba(196,154,60,.5);} .tier-alt{margin-top:14px;text-align:center;font-size:.78rem;letter-spacing:.04em;color:var(--muted);} .tier-alt a{color:var(--gold-lt);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;} .tier-alt a:hover{color:var(--gold);} /* program name inside a tier (home overview + /programas/ hub) */ .tier .pname{font-family:var(--tf);font-size:1.85rem;font-weight:500;color:var(--text);line-height:1.1;margin:4px 0 16px;} .tier .pname em{font-style:italic;color:var(--gold-lt);} /* Microcopy under the pricing tiers + beside the closing ask (reassurance, not friction) */ .tiers-note{margin-top:26px;text-align:center;font-size:.9rem;color:var(--muted-dk);font-weight:300;} .contact-fine{margin-top:20px;font-size:.9rem;line-height:1.6;color:var(--muted-dk);font-weight:300;} /* ═══ FAQ (native
/ — no JS) ═══ */ .faq-list{max-width:840px;margin:clamp(36px,5vh,52px) auto 0;} .faq-item{border-bottom:1px solid var(--line);} .faq-item:first-child{border-top:1px solid var(--line);} .faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:24px; padding:24px 0;font-family:var(--tf);font-size:clamp(1.08rem,1.6vw,1.3rem);font-weight:500;line-height:1.35;color:var(--text); transition:color .2s;} .faq-item summary::-webkit-details-marker{display:none;} .faq-item summary::after{content:'+';flex:none;font-family:var(--bf);font-size:1.35rem;line-height:1;color:var(--gold);} .faq-item[open] summary::after{content:'\2013';} .faq-item[open] summary{color:var(--gold-lt);} .faq-item summary:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;} @media(hover:hover){.faq-item summary:hover{color:var(--gold-lt);}} .faq-a{padding:0 0 26px;max-width:70ch;} .faq-a p{font-size:.98rem;line-height:1.75;color:var(--muted);font-weight:300;margin-bottom:12px;} .faq-a p:last-child{margin-bottom:0;} .faq-a strong{color:var(--text);font-weight:400;} /* ═══ REASSURE (pay + exit) ═══ */ .reassure{background:linear-gradient(180deg,var(--bg-alt),var(--bg));} .reassure .wrap{display:grid;grid-template-columns:1fr 1fr;gap:18px;} .rcard{background:var(--bg-dk);border:1px solid var(--line);padding:clamp(34px,4vw,52px);} .rcard-eyebrow{margin-bottom:22px;} .rcard-quote{font-family:var(--tf);font-style:italic;font-size:1.32rem;line-height:1.5;color:var(--text);margin-bottom:30px;} .rcard h3{font-family:var(--bf);font-size:.72rem;font-weight:500;letter-spacing:var(--ls-label); text-transform:uppercase;color:var(--gold);margin:28px 0 16px;} .rcard h3:first-of-type{margin-top:0;} .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;} .rcard p{font-size:.98rem;line-height:1.7;color:var(--muted);margin-bottom:14px;font-weight:300;} .rcard p strong{color:var(--text);font-weight:400;} .pay-rows{list-style:none;margin:6px 0 4px;} .pay-rows li{display:flex;justify-content:space-between;align-items:baseline;gap:16px; padding:13px 0;border-top:1px solid var(--line);font-size:.95rem;color:var(--muted);} .pay-rows li:first-child{border-top:0;} .pay-rows li b{font-family:var(--tf);font-size:1.15rem;font-weight:500;color:var(--gold-lt);} .pay-rows li b span{font-family:var(--bf);font-size:.72rem;font-weight:300;color:var(--muted);} .exit-eg{margin-top:22px;padding:22px 24px;background:var(--bg-ink);border-left:2px solid var(--gold);} .exit-eg p{margin-bottom:12px;} .exit-eg p:last-child{margin-bottom:0;} /* ═══ AVALIAÇÃO (cross-sell block on sub-pages) ═══ */ .aval{background:var(--bg-ink);border-block:1px solid var(--line);text-align:center;} .aval .wrap{max-width:820px;} .aval .eyebrow{margin-bottom:24px;} .aval-title{font-size:clamp(2rem,3.6vw,3rem);margin-bottom:26px;} .aval-deliverable{font-family:var(--tf);font-style:italic;font-size:clamp(1.15rem,1.8vw,1.4rem);color:var(--gold-lt);margin-bottom:20px;} .aval-lede{margin:0 auto 34px;text-align:center;font-size:1.12rem;color:var(--muted);} .aval-lede em{color:var(--gold-lt);font-style:italic;} .aval-credit{margin-top:26px;font-size:.86rem;color:var(--gold-lt);letter-spacing:.01em;} .aval-alt{margin-top:14px;font-size:.9rem;color:var(--muted-dk);} /* ═══ OPERFORMA LEAD FORM (lazy iframe — mirrors .reading-form in styles.css) ═══ Ground, border and padding are kept identical to the biblioteca treatment, so the frame sits on the same colour on every page and one Operforma brand kit can match it. Never tune these to the form — set the form's tokens instead. */ .lead{background:var(--bg-alt);} .lead .wrap{max-width:600px;text-align:center;} .lead .eyebrow{margin-bottom:22px;} .reading-form-title{font-family:var(--tf);font-weight:400;font-size:clamp(1.9rem,3vw,2.6rem); line-height:1.15;color:var(--text);margin-bottom:20px;} .reading-form-text{margin:0 auto 32px;font-size:1rem;line-height:1.7;color:var(--muted);max-width:480px;} .reading-form-embed{min-height:320px;max-width:560px;margin:0 auto;text-align:left; background:rgba(255,255,255,0.025);border:1px solid var(--line-strong);padding:24px;overflow-x:hidden;} .reading-form-embed iframe{width:100%;border:0;display:block;transition:height .25s ease;} .reading-form-loading{font-family:var(--bf);font-size:.82rem;color:var(--muted);font-style:italic; text-align:center;min-height:272px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;} .reading-form-loading-bar{position:relative;overflow:hidden;width:110px;height:2px;background:var(--line-strong);} .reading-form-loading-bar::after{content:'';position:absolute;top:0;bottom:0;left:0;width:40%; background:linear-gradient(100deg,transparent 0%,var(--gold-lt) 50%,transparent 100%); animation:formLoadSheen 1.5s ease-in-out infinite;} @keyframes formLoadSheen{0%{transform:translateX(-140%);}100%{transform:translateX(360%);}} .reading-form-soon{max-width:480px;margin:0 auto;padding:40px 32px;text-align:center; border:1px solid var(--line);background:var(--bg-dk);} .reading-form-soon-label{font-size:.7rem;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--gold);} .reading-form-soon-note{font-family:var(--tf);font-style:italic;font-size:1.1rem;line-height:1.6;color:var(--muted);margin:16px 0 24px;} @media(max-width:640px){ .reading-form-embed{padding:16px;} } /* ═══ CURRICULUM — level selector + module timeline (Ateliê) ═══ */ .curric{background:linear-gradient(180deg,var(--bg),var(--bg-alt));border-top:1px solid var(--line);} .curric .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .level-tabs{display:inline-flex;gap:4px;margin:36px auto 0;padding:5px;border:1px solid var(--line); background:var(--bg-dk);flex-wrap:wrap;justify-content:center;} .level-tab{font-family:var(--bf);font-size:.74rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase; color:var(--muted);background:transparent;border:0;cursor:pointer;padding:13px 24px;transition:color .25s,background .25s; display:flex;align-items:center;gap:10px;} .level-tab .lt-price{font-family:var(--tf);font-style:italic;letter-spacing:0;text-transform:none;font-size:.92rem;color:var(--muted-dk);} .level-tab:hover{color:var(--gold-lt);} .level-tab:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px;} .level-tab[aria-selected="true"]{background:var(--gold);color:var(--ink);} .level-tab[aria-selected="true"] .lt-price{color:var(--ink);} .level-panel{margin-top:clamp(44px,6vh,68px);} .level-panel[hidden]{display:none;} .level-intro{max-width:70ch;margin:0 auto clamp(40px,5vh,60px);text-align:center; font-family:var(--tf);font-style:italic;font-size:clamp(1.4rem,2.2vw,1.85rem);line-height:1.42;color:var(--text);} .level-for{max-width:60ch;margin:-24px auto clamp(40px,5vh,58px);text-align:center;color:var(--muted);font-size:1rem;} .mods{display:grid;gap:2px;} .mod{display:grid;grid-template-columns:auto 1fr;gap:clamp(22px,3vw,42px);align-items:start; background:var(--bg-dk);border:1px solid var(--line);padding:clamp(26px,3vw,40px) clamp(24px,3vw,44px); transition:border-color .3s,transform .3s,box-shadow .3s;} .mod:hover{border-color:var(--line-strong);transform:translateY(-2px);box-shadow:0 22px 50px -30px rgba(0,0,0,.8);} .mod-num{font-family:var(--tf);font-size:clamp(2.4rem,4vw,3.4rem);font-weight:500;color:var(--gold);line-height:.9; font-variant-numeric:tabular-nums lining-nums;min-width:1.6ch;} .mod-num small{display:block;font-family:var(--bf);font-size:.58rem;font-weight:500;letter-spacing:.2em; text-transform:uppercase;color:var(--muted-dk);margin-top:8px;} .mod-body h3{font-family:var(--tf);font-size:clamp(1.4rem,2.1vw,1.85rem);font-weight:500;color:var(--text); line-height:1.22;margin-bottom:8px;} .mod-body h3 em{display:block;font-style:italic;font-size:.7em;color:var(--gold-lt);margin-top:6px;line-height:1.3;} .mod-body p{font-size:1rem;line-height:1.7;color:var(--muted);font-weight:300;margin-top:14px;} .mod-outcome{margin-top:18px;padding-top:16px;border-top:1px dotted var(--line); font-size:.92rem;color:var(--muted-dk);line-height:1.6;} .mod-outcome b{font-family:var(--bf);font-weight:500;color:var(--gold);text-transform:uppercase; letter-spacing:.12em;font-size:.66rem;display:inline-block;margin-right:8px;} .level-close{margin-top:clamp(36px,5vh,56px);text-align:center; display:flex;flex-direction:column;align-items:center;gap:20px;} .level-includes{max-width:640px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;} .level-includes span{font-size:.82rem;color:var(--muted);border:1px solid var(--line);padding:9px 15px; display:inline-flex;gap:9px;align-items:center;} .level-includes span::before{content:"";width:5px;height:5px;background:var(--gold);flex:none;} /* ═══ SPOTLIGHT PROGRAM CARD (single-offer — Voz em Cena) ═══ */ .spotlight{background:var(--bg-dk);} .spot-card{position:relative;max-width:920px;margin:0 auto;background:linear-gradient(180deg,var(--bg-module),var(--bg-alt)); border:1px solid var(--line-strong);padding:clamp(36px,5vw,64px);overflow:hidden;} .spot-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px; background:linear-gradient(90deg,transparent,var(--gold),transparent);} .spot-eyebrow{margin-bottom:22px;} .spot-lede{font-family:var(--tf);font-style:italic;font-size:clamp(1.5rem,2.4vw,2.05rem);line-height:1.4; color:var(--text);margin-bottom:36px;max-width:36ch;} .spot-meta{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:46px; border-top:1px solid var(--line);border-bottom:1px solid var(--line);} .spot-meta .smi{background:transparent;padding:30px 20px;display:flex;flex-direction:column;gap:12px; text-align:center;align-items:center;position:relative;} .spot-meta .smi + .smi::before{content:"";position:absolute;left:0;top:26px;bottom:26px;width:1px; background:linear-gradient(180deg,transparent,var(--line) 20%,var(--line) 80%,transparent);} .spot-meta .smi b{font-family:var(--tf);font-size:2.2rem;font-weight:500;color:var(--gold-lt);line-height:1;letter-spacing:.01em;} .spot-meta .smi b span{font-size:.8rem;color:var(--muted);text-transform:none;letter-spacing:0;margin-left:2px;} .spot-meta .smi > span{font-size:.63rem;letter-spacing:.19em;text-transform:uppercase;color:var(--muted-dk);line-height:1.55;max-width:18ch;} .spot-body{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,5vw,64px);align-items:start;} .spot-body p{font-size:1.02rem;line-height:1.75;color:var(--muted);font-weight:300;margin-bottom:16px;} .spot-body p strong{color:var(--text);font-weight:400;} .spot-incl h2{font-family:var(--bf);font-size:.7rem;font-weight:500;letter-spacing:var(--ls-eyebrow); text-transform:uppercase;color:var(--gold);margin-bottom:18px;} .spot-incl ul{list-style:none;margin-bottom:30px;} .spot-incl li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:baseline; padding:13px 0;border-top:1px solid var(--line);font-size:.98rem;color:var(--muted);line-height:1.5;} .spot-incl li:first-child{border-top:0;padding-top:0;} .spot-incl li::before{content:"";width:5px;height:5px;background:var(--gold);align-self:center;} .spot-price{font-family:var(--tf);font-size:2.6rem;font-weight:500;color:var(--gold-lt);line-height:1;margin-bottom:6px;} .spot-price-sub{font-size:.9rem;color:var(--muted);margin-bottom:26px;letter-spacing:.01em;} .spot-price-sub strong{color:var(--gold-lt);font-weight:500;} .spot-incl .btn{width:100%;} /* ═══ BIBLIOTECA CARD STRIP ═══ Rendered at build time by scripts/build.js (@biblioteca-strip / @biblioteca-cards) from each article's @meta block. */ .biblio-prog{background:var(--bg-dk);border-top:1px solid var(--line);} .bw-head{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:clamp(30px,4vh,48px);} .bw-eyebrow{font-family:var(--bf);font-size:.72rem;font-weight:400;letter-spacing:var(--ls-eyebrow); text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:15px;} .bw-eyebrow::before,.bw-eyebrow::after{content:'';width:34px;height:1px;background:var(--gold);opacity:.85;flex:none;} .bw-title{font-family:var(--tf);font-weight:400;line-height:1.06;letter-spacing:-.015em;color:var(--text); font-size:clamp(1.9rem,3.4vw,2.9rem);margin-top:22px;} .bw-title em{font-style:italic;color:var(--gold-lt);} .bw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;} .bw-grid.n2{grid-template-columns:repeat(2,1fr);max-width:900px;margin-inline:auto;} .bw-grid.n1{grid-template-columns:1fr;max-width:560px;margin-inline:auto;} .bw-card{position:relative;display:flex;flex-direction:column;background:var(--bg-alt);border:1px solid var(--line); padding:clamp(26px,2.6vw,34px);color:inherit;transition:border-color .3s,transform .3s,box-shadow .3s;} @media(hover:hover){.bw-card:hover{border-color:var(--line-strong);transform:translateY(-4px);box-shadow:0 26px 60px -38px rgba(0,0,0,.85);}} .bw-card-eyebrow{font-family:var(--bf);font-size:.66rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase; color:var(--gold);margin-bottom:16px;} .bw-card-title{font-family:var(--tf);font-size:clamp(1.35rem,1.9vw,1.65rem);font-weight:500;line-height:1.2; color:var(--text);margin-bottom:14px;} .bw-card-title em{font-style:italic;color:var(--gold-lt);} .bw-card-deck{font-size:.94rem;line-height:1.66;color:var(--muted);font-weight:300;margin-bottom:24px;flex:1;} .bw-card-meta{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-family:var(--bf);font-size:.66rem; letter-spacing:.12em;text-transform:uppercase;color:var(--muted-dk);padding-top:18px;border-top:1px solid var(--line);} .bw-card-meta .bw-dot{width:3px;height:3px;border-radius:50%;background:var(--muted-dk);opacity:.7;flex:none;} .bw-card-go{margin-left:auto;color:var(--gold-lt);display:inline-flex;align-items:center;gap:7px;} .bw-card:hover .bw-card-go{color:var(--gold);} .bw-arrow{transition:transform .3s;} .bw-card:hover .bw-arrow{transform:translateX(4px);} .bw-more{margin-top:clamp(30px,4vh,44px);text-align:center;} .bw-more a{font-family:var(--bf);font-size:.72rem;letter-spacing:var(--ls-label);text-transform:uppercase; color:var(--gold-lt);display:inline-flex;align-items:center;gap:11px;border-bottom:1px solid var(--line-strong); padding-bottom:6px;transition:color .2s,border-color .2s;} .bw-more a:hover{color:var(--gold);border-color:var(--gold);} .bw-more a:hover .bw-arrow{transform:translateX(4px);} /* ═══ FINAL CTA ═══ */ .finalcta{background:radial-gradient(90% 150% at 50% -10%,rgba(196,154,60,.13),transparent 62%),var(--bg-alt); border-top:1px solid var(--line);text-align:center;} .finalcta .wrap{max-width:780px;} .finalcta .eyebrow{margin-bottom:22px;} .finalcta-title{font-size:clamp(2.2rem,4vw,3.4rem);margin:24px 0 22px;} .finalcta .lede{margin:0 auto 34px;text-align:center;} .finalcta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;} .finalcta-note{margin-top:24px;font-size:.82rem;color:var(--muted-dk);letter-spacing:.02em;} /* ═══ FOOTER ═══ (markup: site/partials/site-footer.html) */ footer{background:var(--bg-ink);padding:clamp(50px,7vh,80px) var(--gutter);border-top:1px solid var(--line);text-align:center;} .footer-logo{font-family:var(--tf);font-size:1.5rem;font-weight:500;color:var(--text);margin-bottom:14px;} .footer-logo em{font-style:italic;color:var(--gold);} .footer-note{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-dk);margin-bottom:18px;} .footer-credit{font-size:.8rem;color:var(--muted-dk);} .footer-credit a{color:var(--muted);border-bottom:1px solid var(--line);} .footer-credit a:hover{color:var(--gold-lt);border-color:var(--gold);} .footer-credit a:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;} /* ═══ FLOATING CTA ═══ A fixed bottom bar at EVERY width — the nav carries no CTA (commit d4528b5). main.js hides it whenever an in-page [data-offer="avaliacao"] is on screen. The .cta-glint compound selector keeps specificity (0,2,0) so position:fixed wins over any .cta-glint position:relative rule. */ .floating-cta.cta-glint{display:flex;align-items:center;justify-content:center;position:fixed;left:0;right:0;bottom:0; z-index:150;font-family:var(--bf);font-size:.72rem;letter-spacing:var(--ls-label);text-transform:uppercase; color:var(--ink);background:var(--gold); padding:16px 20px;padding-bottom:calc(16px + env(safe-area-inset-bottom)); box-shadow:0 -8px 24px -12px rgba(0,0,0,.6); transition:opacity .3s ease,transform .3s ease,visibility .3s;} .floating-cta.cta-hidden{opacity:0;visibility:hidden;transform:translateY(120%);pointer-events:none;} /* ════════════════════════════════════════════════════════════════ HOME PAGE ════════════════════════════════════════════════════════════════ */ /* ─── HERO (full-bleed, warm) ─── */ .lhero{position:relative;min-height:clamp(560px,90vh,860px);display:flex;align-items:center;overflow:hidden;} .lhero-bg{position:absolute;inset:0;z-index:0;} .lhero-bg img{width:100%;height:100%;object-fit:cover;object-position:80% 30%; filter:brightness(.82) contrast(1.02) saturate(.9);} .lhero-bg::after{content:"";position:absolute;inset:0;background: linear-gradient(102deg,rgba(20,6,10,.94) 0%,rgba(30,7,16,.78) 40%,rgba(58,15,28,.34) 78%,rgba(58,15,28,.12) 100%), linear-gradient(0deg,var(--bg) 1%,transparent 24%);} /* width:100% — as a flex item it would otherwise shrink to fit and the .wrap auto-margins would centre the copy instead of anchoring it to the gutter. */ .lhero-inner{position:relative;z-index:2;width:100%;max-width:var(--maxw);} .lhero-quote{font-family:var(--tf);font-style:italic;font-size:clamp(1.15rem,1.8vw,1.5rem);color:var(--gold-lt); line-height:1.5;max-width:30ch;border-left:2px solid var(--gold);padding-left:20px;margin-bottom:34px;} .lhero-eyebrow{margin-bottom:22px;} .lhero-name{font-family:var(--tf);font-size:clamp(3.2rem,7vw,6rem);font-weight:400;line-height:.94; letter-spacing:-.01em;color:var(--text);} .lhero-name em{font-style:italic;color:var(--gold-lt);display:block;margin-top:2px;} .lhero-role{font-family:var(--bf);font-size:clamp(1rem,1.5vw,1.15rem);font-weight:300;color:var(--muted); margin:26px 0 38px;max-width:44ch;line-height:1.6;} .lhero-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center;} .lhero-note{margin-top:22px;font-size:.86rem;color:var(--muted-dk);letter-spacing:.01em;} /* ─── DOORS (two-door self-sort) ─── */ .doors{background:var(--bg-dk);} .doors .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .doors-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:clamp(36px,5vh,56px);} .door{position:relative;background:var(--bg-alt);border:1px solid var(--line);padding:clamp(32px,4vw,48px); display:flex;flex-direction:column;transition:border-color .3s,transform .3s,box-shadow .3s;} @media(hover:hover){.door:hover{border-color:var(--line-strong);transform:translateY(-4px);box-shadow:0 26px 60px -38px rgba(0,0,0,.85);}} .door-tag{font-family:var(--bf);font-size:.68rem;font-weight:500;letter-spacing:var(--ls-eyebrow); text-transform:uppercase;color:var(--gold);margin-bottom:18px;} .door-name{font-family:var(--tf);font-size:clamp(1.7rem,2.6vw,2.3rem);font-weight:500;color:var(--text); line-height:1.12;margin-bottom:16px;} .door-name em{font-style:italic;color:var(--gold-lt);} .door-desc{font-size:1rem;line-height:1.68;color:var(--muted);font-weight:300;margin-bottom:30px;flex:1;} .door .btn{align-self:flex-start;} .doors-alt{text-align:center;margin-top:32px;font-size:.95rem;color:var(--muted);} .doors-alt a{text-decoration:underline;text-underline-offset:3px;} /* ─── VIDEO FACADE (main.js `.lite-yt` handler) ─── */ .lite-yt{position:relative;display:block;width:100%;aspect-ratio:16/9;border:1px solid var(--line);cursor:pointer; background-color:var(--bg-dk);background-size:cover;background-position:center;overflow:hidden;padding:0;} .lite-yt::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,6,10,.1),rgba(20,6,10,.78)); transition:background .3s;} .lite-yt:hover::before{background:linear-gradient(180deg,rgba(20,6,10,.05),rgba(20,6,10,.5));} .lite-yt:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;} .lite-yt-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%; background:rgba(196,154,60,.92);display:flex;align-items:center;justify-content:center; transition:transform .3s,background .3s;z-index:2;} .lite-yt:hover .lite-yt-play{transform:translate(-50%,-50%) scale(1.08);background:var(--gold-lt);} .lite-yt-play::after{content:"";margin-left:4px;border-style:solid;border-width:11px 0 11px 18px; border-color:transparent transparent transparent var(--ink);} .lite-yt-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 20px 16px;text-align:left; font-family:var(--bf);font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text);} .lite-yt.is-playing::before,.lite-yt.is-playing .lite-yt-play,.lite-yt.is-playing .lite-yt-cap{display:none;} /* ─── DEPOIMENTOS ─── */ .deps{background:linear-gradient(180deg,var(--bg),var(--bg-alt));} .deps .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .deps .lede{text-align:center;margin-top:18px;} .dep-featured{max-width:820px;margin:clamp(36px,5vh,56px) auto 0;} .dep-name{margin-top:16px;font-family:var(--tf);font-size:1.3rem;color:var(--text);} .dep-name span{font-family:var(--bf);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-left:10px;} .dep-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px;} .dep-grid .dep-name{font-size:1rem;} .dep-grid .dep-name span{display:block;margin:5px 0 0;} /* ─── AVALIAÇÃO OFFER CARD (home) ─── */ .offer{background:var(--bg-dk);} .offer .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .offer-card{max-width:900px;margin:clamp(36px,5vh,54px) auto 0;background:linear-gradient(180deg,var(--bg-module),var(--bg-alt)); border:1px solid var(--line-strong);padding:clamp(34px,5vw,60px);text-align:center;position:relative;overflow:hidden;} .offer-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);} .offer-lede{font-family:var(--tf);font-style:italic;font-size:clamp(1.4rem,2.3vw,1.95rem);line-height:1.42; color:var(--text);max-width:34ch;margin:0 auto 34px;} .offer-meta{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:46px; border-top:1px solid var(--line);border-bottom:1px solid var(--line);} .offer-meta .omi{background:transparent;padding:20px;display:flex;flex-wrap:wrap;gap:6px 12px; align-items:baseline;justify-content:center;text-align:center;position:relative;} .offer-meta .omi + .omi::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px; background:linear-gradient(180deg,transparent,var(--line) 20%,var(--line) 80%,transparent);} .offer-meta .omi b{font-family:var(--tf);font-size:1.85rem;font-weight:500;color:var(--gold-lt);line-height:1;letter-spacing:.01em;} .offer-meta .omi b span{font-size:.75rem;color:var(--muted);text-transform:none;letter-spacing:0;margin-left:2px;} .offer-meta .omi > span{font-size:.63rem;letter-spacing:.17em;text-transform:uppercase;color:var(--muted-dk);line-height:1.4;} .offer-steps{max-width:560px;margin:0 auto 34px;text-align:left;list-style:none;counter-reset:st;} .offer-steps li{position:relative;padding:16px 0 16px 52px;border-top:1px solid var(--line); font-size:1rem;line-height:1.6;color:var(--muted);counter-increment:st;} .offer-steps li:first-child{border-top:0;} .offer-steps li::before{content:counter(st);position:absolute;left:0;top:14px;width:32px;height:32px; border:1px solid var(--line-strong);color:var(--gold);font-family:var(--tf);font-size:1.05rem; display:flex;align-items:center;justify-content:center;} .offer-credit{margin-top:22px;font-size:.86rem;color:var(--gold-lt);} /* ─── PROGRAMAS overview (reuses .tier) ─── */ .progs .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .progs .lede{text-align:center;margin-top:18px;} .progs .tier-detail{margin-top:0;} /* ─── SOBRE ─── */ .about{background:linear-gradient(180deg,var(--bg-alt),var(--bg));} .about .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,6vw,88px);align-items:center;} .about-body .eyebrow{margin-bottom:24px;} .about-body h2{margin-bottom:26px;} .about-body p{font-size:1.05rem;line-height:1.8;color:var(--muted);font-weight:300;margin-bottom:18px;} .about-body p.lead{font-size:1.15rem;color:var(--text);} .about-body p strong{color:var(--text);font-weight:400;} .about-body p em{color:var(--gold-lt);font-style:italic;} .about-foto{position:relative;aspect-ratio:4/5;} .about-foto img{width:100%;height:100%;object-fit:cover;object-position:center 20%; filter:brightness(.9) contrast(1.03) saturate(.88);} .about-foto::before{content:"";position:absolute;top:-16px;left:-16px;right:16px;bottom:16px; border:1px solid var(--line-strong);z-index:2;pointer-events:none;} /* ─── PERFORMANCES ─── */ .perf{background:var(--bg-dk);} .perf .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .perf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(34px,5vh,52px);} /* main.js picks the featured tile at random each load (.is-featured); `order` floats it to the top of the grid without touching DOM order. */ .perf-grid .lite-yt.is-featured{grid-column:1/-1;aspect-ratio:2.4/1;order:-1;} /* ─── TRAJETÓRIA ─── */ .traj{background:linear-gradient(180deg,var(--bg),var(--bg-ink));} .traj .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(40px,5vw,72px);align-items:start;} .traj-head{grid-column:1/-1;margin-bottom:8px;} .tl{list-style:none;} .tl li{position:relative;padding:0 0 30px 30px;border-left:1px solid var(--line);} .tl li:last-child{padding-bottom:0;} .tl li::before{content:"";position:absolute;left:-5px;top:5px;width:9px;height:9px;background:var(--gold);border-radius:50%;} .tl li.dest::before{box-shadow:0 0 0 5px rgba(196,154,60,.18);} .tl-year{font-family:var(--bf);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;} .tl-title{font-family:var(--tf);font-size:1.35rem;font-weight:500;color:var(--text);line-height:1.2;margin-bottom:6px;} .tl-desc{font-size:.95rem;line-height:1.65;color:var(--muted);font-weight:300;} .cred{background:var(--bg-dk);border:1px solid var(--line);padding:clamp(28px,3vw,40px);} .cred h3{font-family:var(--bf);font-size:.7rem;font-weight:500;letter-spacing:var(--ls-eyebrow);text-transform:uppercase; color:var(--gold);margin-bottom:20px;} .cred h3:not(:first-child){margin-top:34px;} .cred-item{padding:14px 0;border-top:1px solid var(--line);} .cred-item:first-of-type{border-top:0;padding-top:0;} .cred-item b{font-family:var(--tf);font-size:1.12rem;font-weight:500;color:var(--text);display:block;line-height:1.3;} .cred-item span{font-size:.88rem;color:var(--muted);} .cred-item .dist{color:var(--gold-lt);font-style:italic;font-family:var(--tf);font-size:.98rem;} .maestros{margin-top:30px;padding-top:22px;border-top:1px solid var(--line);} .maestros .ml{font-size:.9rem;line-height:1.9;color:var(--muted-dk);} /* ─── MATERIAIS (biblioteca strip) ─── */ .freecta{background:var(--bg-ink);border-block:1px solid var(--line);} /* ─── CONTATO ─── */ .contact{background:radial-gradient(90% 150% at 50% -10%,rgba(196,154,60,.13),transparent 62%),var(--bg-alt);text-align:center;} .contact .wrap{max-width:900px;} .contact .eyebrow{margin-bottom:22px;} .contact-title{font-size:clamp(2.2rem,4vw,3.4rem);margin:24px 0 20px;} .contact-sub{max-width:52ch;margin:0 auto 8px;text-align:center;} .contact-note{font-size:.9rem;color:var(--muted-dk);margin-bottom:34px;} .contact-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:44px;} .contact-grid{display:grid;grid-template-columns:repeat(4,1fr);text-align:left;} .cg-cell{padding:22px;display:flex;align-items:center;justify-content:center;gap:14px;color:inherit;position:relative; transition:background .3s;} .cg-cell + .cg-cell::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px; background:linear-gradient(180deg,transparent,var(--line) 18%,var(--line) 82%,transparent);} a.cg-cell:hover{background:var(--bg-module);} a.cg-cell:hover .cg-icon{border-color:var(--gold);color:var(--gold-lt);} a.cg-cell:hover .c-val{color:var(--gold-lt);} a.cg-cell:focus-visible{outline:2px solid var(--gold-lt);outline-offset:-2px;} .cg-icon{width:34px;height:34px;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center; color:var(--gold);transition:border-color .3s,color .3s;flex:none;} .cg-icon svg{width:16px;height:16px;display:block;} .cg-txt{display:flex;flex-direction:column;gap:4px;} .c-lbl{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-dk);} .c-val{font-size:.95rem;color:var(--text);font-weight:300;line-height:1.5;transition:color .25s; overflow-wrap:normal;word-break:keep-all;} .c-val.is-email{font-size:.82rem;letter-spacing:-.005em;overflow-wrap:break-word;} .contact-addr{margin-top:24px;font-size:.86rem;color:var(--muted-dk);} /* ─── SCREENING ROOM (video lightbox — main.js) ─── */ .deps .lite-yt,.perf .lite-yt{transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s;} .deps .lite-yt:hover,.perf .lite-yt:hover{transform:translateY(-4px); box-shadow:0 30px 60px -34px rgba(0,0,0,.85),0 0 46px -22px rgba(196,154,60,.4);} .sr{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center; padding:clamp(16px,4vh,48px) clamp(16px,4vw,64px); background:radial-gradient(120% 90% at 50% -12%,rgba(196,154,60,.17),transparent 55%),rgba(8,4,6,.94); -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px); opacity:0;visibility:hidden; /* visibility flips instantly on open (so .sr-close can take focus in the same tick) and only after the fade-out on close. */ transition:opacity .5s ease,visibility 0s linear .5s;} .sr.sr-open{opacity:1;visibility:visible;transition:opacity .5s ease,visibility 0s linear 0s;} .sr-close{position:absolute;top:clamp(16px,3vh,30px);right:clamp(16px,3vw,36px);width:48px;height:48px;border-radius:50%; border:1px solid var(--line-strong);background:transparent;color:var(--gold-lt);cursor:pointer; display:flex;align-items:center;justify-content:center;transition:border-color .3s,background .3s,transform .4s;z-index:4;} .sr-close:hover{border-color:var(--gold);background:rgba(196,154,60,.12);transform:rotate(90deg);} .sr-close::before,.sr-close::after{content:"";position:absolute;width:18px;height:1.5px;background:currentColor;} .sr-close::before{transform:rotate(45deg);} .sr-close::after{transform:rotate(-45deg);} .sr-stage{position:relative;width:100%;max-width:min(1040px,88vw); transform:translateY(16px) scale(.985);transition:transform .55s cubic-bezier(.16,1,.3,1);} .sr.sr-open .sr-stage{transform:translateY(0) scale(1);} .sr-frame{position:relative;aspect-ratio:16/9;background:#000;border:1px solid var(--line-strong); box-shadow:0 44px 120px -30px rgba(0,0,0,.92),0 0 0 1px rgba(196,154,60,.08),0 0 90px -22px rgba(196,154,60,.26);} .sr-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;} .sr-caption{margin-top:26px;text-align:center;} .sr-name{font-family:var(--tf);font-style:italic;font-weight:500;font-size:clamp(1.8rem,3.4vw,2.7rem);line-height:1.05;color:var(--gold-lt);} .sr-voice{margin-top:11px;font-family:var(--bf);font-size:.72rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);} .sr-note{margin-top:14px;font-family:var(--tf);font-style:italic;font-size:1.08rem;color:var(--muted-dk);} .sr-nav{position:absolute;top:calc(50% - 108px);transform:translateY(-50%);width:52px;height:52px;border-radius:50%; border:1px solid var(--line-strong);background:rgba(8,4,6,.55);color:var(--gold-lt);cursor:pointer; display:flex;align-items:center;justify-content:center;transition:border-color .3s,background .3s,transform .3s;z-index:3;} .sr-nav:hover{border-color:var(--gold);background:rgba(196,154,60,.16);} .sr-nav svg{width:20px;height:20px;} .sr-prev{left:-26px;} .sr-next{right:-26px;} .sr-prev:hover{transform:translateY(-50%) translateX(-3px);} .sr-next:hover{transform:translateY(-50%) translateX(3px);} .sr-close:focus-visible,.sr-nav:focus-visible,.sr-thumb:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;} .sr-rail{display:flex;gap:12px;margin-top:clamp(22px,4vh,40px);max-width:100%;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none;} .sr-rail::-webkit-scrollbar{display:none;} .sr-thumb{position:relative;flex:none;width:120px;aspect-ratio:16/10;border:1px solid var(--line); background-size:cover;background-position:center 25%;cursor:pointer;opacity:.5;padding:0; transition:opacity .3s,border-color .3s,transform .3s;filter:grayscale(.35);} .sr-thumb::after{content:"";position:absolute;inset:0;background:rgba(8,4,6,.35);transition:background .3s;} .sr-thumb:hover{opacity:.9;transform:translateY(-3px);} .sr-thumb.is-active{opacity:1;border-color:var(--gold);filter:none;} .sr-thumb.is-active::after{background:transparent;} .sr-thumb-name{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 8px 6px; font-family:var(--bf);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text); text-align:center;background:linear-gradient(transparent,rgba(8,4,6,.88));} /* ════════════════════════════════════════════════════════════════ FERRAMENTAS — hub page + home tools section ════════════════════════════════════════════════════════════════ */ .fhead-title em{display:block;} .fhead-note{margin-top:26px;display:inline-flex;align-items:center;gap:11px;font-size:.74rem; letter-spacing:.14em;text-transform:uppercase;color:var(--muted-dk);} .fhead-note::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);flex:none;} .sec.tools{background:linear-gradient(180deg,var(--bg-ink),var(--bg-dk));} .tools.tools-hub{background:var(--bg-dk);} .tools .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .tools .lede{text-align:center;margin-top:16px;} .tools-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:clamp(36px,5vh,56px);} .tool{position:relative;display:flex;flex-direction:column;background:var(--bg-alt);border:1px solid var(--line); padding:clamp(30px,3.4vw,46px);overflow:hidden;transition:border-color .3s,transform .3s,box-shadow .3s;} .tool:hover{border-color:var(--line-strong);transform:translateY(-4px);box-shadow:0 28px 64px -40px rgba(0,0,0,.85);} .tool-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:30px;} .tool-ic{width:56px;height:56px;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center; color:var(--gold);flex:none;transition:border-color .3s,color .3s;} .tool:hover .tool-ic{border-color:var(--gold);color:var(--gold-lt);} .tool-ic svg{width:26px;height:26px;display:block;} .tool-flag{font-family:var(--bf);font-size:.6rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase; color:var(--gold);border:1px solid var(--line-strong);padding:6px 12px;white-space:nowrap;} .tool-flag.soon{color:var(--muted-dk);border-color:var(--line);} .tool-name{font-family:var(--tf);font-size:clamp(1.75rem,2.6vw,2.35rem);font-weight:500;color:var(--text); line-height:1.1;margin-bottom:16px;} .tool-name em{font-style:italic;color:var(--gold-lt);} .tool-desc{font-size:1.02rem;line-height:1.72;color:var(--muted);font-weight:300;margin-bottom:26px;flex:1;} .tool-feats{list-style:none;margin-bottom:32px;} .tool-feats li{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:baseline; padding:11px 0;border-top:1px solid var(--line);font-size:.92rem;color:var(--muted);line-height:1.5;} .tool-feats li:first-child{border-top:0;padding-top:0;} .tool-feats li::before{content:"";width:5px;height:5px;background:var(--gold);align-self:center;} .tool .btn{align-self:flex-start;} .tools-note{text-align:center;margin-top:clamp(34px,5vh,52px);font-size:.95rem;color:var(--muted);} .tools-note a{text-decoration:underline;text-underline-offset:3px;} /* ─── PRIVACY / HOW (hub) ─── */ .how{background:linear-gradient(180deg,var(--bg),var(--bg-alt));border-top:1px solid var(--line);} .how .sec-head{text-align:center;display:flex;flex-direction:column;align-items:center;} .how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;border:1px solid var(--line);} .how-cell{background:var(--bg-dk);padding:clamp(30px,3.4vw,44px);display:flex;flex-direction:column;gap:14px;} .how-num{font-family:var(--tf);font-style:italic;font-size:1.3rem;color:var(--gold);line-height:1;} .how-cell h3{font-family:var(--tf);font-size:1.4rem;font-weight:500;color:var(--text);line-height:1.2;} .how-cell p{font-size:.96rem;line-height:1.68;color:var(--muted);font-weight:300;} /* ─── LIVE TUNER (home tools card — main.js) ─── */ .tuner{border:1px solid var(--line);background:var(--bg-dk);padding:20px;margin-bottom:30px;} .tuner-start{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:12px;cursor:pointer; font-family:var(--bf);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500; color:var(--gold-lt);background:transparent;border:1px solid var(--line-strong);padding:16px 18px; transition:background .25s,border-color .25s,color .25s;} .tuner-start:hover{background:rgba(196,154,60,.1);border-color:var(--gold);color:var(--gold);} .tuner-start:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px;} .tuner-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex:none;animation:tunerPulse 2s infinite;} @keyframes tunerPulse{0%{box-shadow:0 0 0 0 rgba(196,154,60,.5);}70%{box-shadow:0 0 0 9px rgba(196,154,60,0);}100%{box-shadow:0 0 0 0 rgba(196,154,60,0);}} @media(prefers-reduced-motion:reduce){.tuner-dot{animation:none;}} .tuner-live[hidden]{display:none;} .tuner-read{display:flex;align-items:baseline;justify-content:space-between;gap:14px;} .tuner-name{font-family:var(--tf);font-size:3.4rem;font-weight:500;line-height:1;color:var(--gold-lt);font-variant-numeric:tabular-nums;} .tuner-cents{font-family:var(--bf);font-size:.9rem;letter-spacing:.1em;color:var(--muted);font-variant-numeric:tabular-nums;} .tuner-scale{position:relative;height:40px;margin:16px 0 4px;border:1px solid var(--line); background:linear-gradient(90deg,transparent,rgba(196,154,60,.05) 50%,transparent);overflow:hidden;} .tuner-mid{position:absolute;top:6px;bottom:6px;left:50%;width:1px;background:var(--line-strong);transform:translateX(-50%);} .tuner-flat,.tuner-sharp{position:absolute;top:50%;transform:translateY(-50%);font-family:var(--tf);font-size:1.25rem;color:var(--muted-dk);} .tuner-flat{left:12px;} .tuner-sharp{right:12px;} .tuner-needle{position:absolute;top:4px;bottom:4px;left:50%;width:2px;background:var(--gold-lt);transform:translateX(-50%); transition:left .07s linear,background .15s,box-shadow .15s;} .tuner.in-tune .tuner-needle{background:#7FCF9F;box-shadow:0 0 14px 2px rgba(127,207,159,.6);} .tuner.in-tune .tuner-cents{color:#7FCF9F;} @media(prefers-reduced-motion:reduce){.tuner-needle{transition:none;}} .tuner-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:10px;} .tuner-hz{font-family:var(--bf);font-size:.72rem;letter-spacing:.08em;color:var(--muted-dk);font-variant-numeric:tabular-nums;} .tuner-stop{cursor:pointer;font-family:var(--bf);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase; color:var(--muted);background:transparent;border:1px solid var(--line);padding:8px 14px;transition:color .2s,border-color .2s;} .tuner-stop:hover{color:var(--gold-lt);border-color:var(--line-strong);} .tuner-msg{margin-top:14px;font-size:.86rem;line-height:1.5;color:var(--gold-lt);} .tuner-msg:empty{display:none;} /* ════════════════════════════════════════════════════════════════ BIBLIOTECA INDEX (article bodies still use styles.css) ════════════════════════════════════════════════════════════════ */ .biblioteca-hero{background:radial-gradient(85% 120% at 50% -20%,rgba(196,154,60,.11),transparent 60%),var(--bg-dk); border-bottom:1px solid var(--line);padding-block:clamp(60px,10vh,104px) clamp(46px,7vh,76px);text-align:center;} .biblioteca-hero .wrap{max-width:820px;display:flex;flex-direction:column;align-items:center;} .biblioteca-hero .eyebrow{margin-bottom:26px;} .biblioteca-hero h1{font-size:clamp(2.6rem,5.4vw,4.4rem);margin-bottom:26px;} .biblioteca-hero .lede{text-align:center;} .biblioteca-list{background:var(--bg);} /* ════════════════════════════════════════════════════════════════ RESPONSIVE ════════════════════════════════════════════════════════════════ */ /* The nav carries six top-level items plus two submenus — it needs more room than the export's 1000px, so the drawer takes over at the repo's 1180px. */ @media(max-width:1180px){ nav{padding:14px 24px;} .nav-links{display:none;} .nav-toggle{display:flex;position:relative;z-index:110;width:44px;height:44px;padding:0;margin-left:auto; align-items:center;justify-content:center;gap:0;flex-shrink:0;} .nav-toggle span{position:absolute;left:9px;width:26px;height:1.5px;background:var(--gold-lt);display:block; transition:transform .42s cubic-bezier(.4,0,.2,1),opacity .25s ease;} .nav-toggle span:nth-child(1){top:15px;} .nav-toggle span:nth-child(2){top:22px;} .nav-toggle span:nth-child(3){top:29px;} .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);} .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(.3);} .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);} .nav-links.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0; max-height:calc(100dvh - 64px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch; /* 0.97, not the export's 0.94 — the hero sits directly behind the drawer and ghosts through at 6% wherever backdrop-filter is unsupported. */ background:rgba(26,6,13,0.97);backdrop-filter:blur(22px) saturate(1.1);-webkit-backdrop-filter:blur(22px) saturate(1.1); border-bottom:1px solid var(--line);padding:6px var(--gutter) 22px; box-shadow:0 44px 80px -44px rgba(0,0,0,.9);transform-origin:top; animation:navDrop .5s cubic-bezier(.2,.75,.2,1);} .nav-links.open::before{content:"";position:absolute;top:0;left:0;right:0;height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent);} .nav-links.open > li{width:100%;border-top:1px solid var(--line);opacity:0; animation:navItem .5s cubic-bezier(.2,.7,.2,1) forwards;} .nav-links.open > li:first-child{border-top:0;} .nav-links.open > li:nth-child(1){animation-delay:.05s;} .nav-links.open > li:nth-child(2){animation-delay:.11s;} .nav-links.open > li:nth-child(3){animation-delay:.17s;} .nav-links.open > li:nth-child(4){animation-delay:.23s;} .nav-links.open > li:nth-child(5){animation-delay:.29s;} .nav-links.open > li:nth-child(6){animation-delay:.35s;} .nav-links.open > li > a{display:flex;align-items:center;justify-content:space-between;width:100%; font-family:var(--tf);font-size:1.5rem;font-weight:500;letter-spacing:.01em;text-transform:none; color:var(--text);padding:17px 2px;transition:color .25s,padding .3s cubic-bezier(.2,.7,.2,1);} .nav-links.open > li > a::after{content:"\2192";font-family:var(--bf);font-size:.85rem;color:var(--gold); opacity:0;transform:translateX(-7px);transition:opacity .25s,transform .25s;} .nav-links.open > li > a:hover,.nav-links.open > li > a[aria-current="page"]{color:var(--gold-lt);padding-left:10px;} .nav-links.open > li > a:hover::after,.nav-links.open > li > a[aria-current="page"]::after{opacity:1;transform:none;} /* submenus render as static stacked lists inside the drawer */ .nav-sub{position:static;opacity:1;visibility:visible;border:0;padding:0 0 12px;margin:0;background:transparent;min-width:0;} .nav-sub a{padding:9px 2px 9px 18px;font-size:.72rem;} .nav-sub a::after{content:none;} } @keyframes navDrop{from{opacity:0;transform:translateY(-12px) scaleY(.97);}to{opacity:1;transform:none;}} @keyframes navItem{from{opacity:0;transform:translateY(9px);}to{opacity:1;transform:none;}} @media(prefers-reduced-motion:reduce){ .nav-links.open,.nav-links.open > li{animation:none;opacity:1;} .nav-toggle span{transition:none;} } @media(max-width:1000px){ .value .wrap{grid-template-columns:1fr;gap:44px;} .value-quote br{display:none;} .spot-body{grid-template-columns:1fr;gap:36px;} .spot-meta{grid-template-columns:1fr 1fr;} .spot-meta .smi:nth-child(2n+1)::before{display:none;} .spot-meta .smi:nth-child(n+3){border-top:1px solid var(--line);} .about .wrap{grid-template-columns:1fr;gap:44px;} .about-foto{max-width:420px;order:-1;} .traj .wrap{grid-template-columns:1fr;gap:40px;} .contact-grid{grid-template-columns:1fr 1fr;} .contact-grid .cg-cell:nth-child(2n+1)::before{display:none;} .contact-grid .cg-cell:nth-child(n+3){border-top:1px solid var(--line);} } @media(max-width:860px){ .tiers{grid-template-columns:1fr;max-width:440px;margin-inline:auto;} .tier-feat{order:-1;transform:none;margin-top:12px;} .tier-feat:hover{transform:translateY(-4px);} .reassure .wrap{grid-template-columns:1fr;} .doors-grid{grid-template-columns:1fr;} .door{min-width:0;} .door .btn{white-space:normal;} .tools-grid{grid-template-columns:1fr;} .how-grid{grid-template-columns:1fr;} .bw-grid,.bw-grid.n2{grid-template-columns:1fr;max-width:560px;margin-inline:auto;} } @media(max-width:640px){ .dep-grid{grid-template-columns:1fr 1fr;} .perf-grid{grid-template-columns:1fr;} .perf-grid .lite-yt.is-featured{aspect-ratio:16/9;} .offer-meta{grid-template-columns:1fr;} .offer-card .btn{white-space:normal;} .offer-meta .omi + .omi::before{display:none;} .offer-meta .omi + .omi{border-top:1px solid var(--line);} .contact-grid{grid-template-columns:1fr;} .contact-grid .cg-cell::before{display:none;} .contact-grid .cg-cell + .cg-cell{border-top:1px solid var(--line);} .lhero-actions{flex-direction:column;align-items:stretch;} .lhero-actions .btn{justify-content:center;} .sr-prev{left:4px;} .sr-next{right:4px;} .sr-nav{width:42px;height:42px;background:rgba(8,4,6,.72);} } @media(prefers-reduced-motion:reduce){ .sr{transition:opacity .2s ease,visibility 0s linear .2s;} .sr.sr-open{transition:opacity .2s ease,visibility 0s linear 0s;} .sr-stage,.sr-close,.sr-nav,.sr-thumb{transition:opacity .2s;} .sr.sr-open .sr-stage{transform:none;} } @media(max-width:560px){ .tool .btn{white-space:normal;} .hero-actions{flex-direction:column;align-items:stretch;} .hero-actions .btn{justify-content:center;} .spot-meta{grid-template-columns:1fr;} .spot-meta .smi::before{display:none;} .spot-meta .smi + .smi{border-top:1px solid var(--line);} .mod{grid-template-columns:1fr;gap:12px;} .mod-num{display:flex;align-items:baseline;gap:12px;} .mod-num small{margin-top:0;} .level-tab{padding:11px 16px;} .level-close .btn{white-space:normal;max-width:100%;text-align:center;} }