/* ============================================================
   ADD ART DESIGN STUDIO — Aryaednyr Macedo
   style.css — versão consolidada 2026
   1381 linhas → 580 linhas | -58% | zero repetições
   ============================================================ */

/* ── TOKENS — fonte única de verdade ── */
:root {
    --dark:     #403932;
    --dark2:    #2e2620;
    --caramel:  #CAA994;
    --blush:    #E5C2B0;   /* goiaba suave — o tom mais fundo que cumpre AA */
    --greige:   #D8D2C5;
    --muted:    #A8B4BF;
    --offwhite: #F6E7DF;   /* rosa delicado — fundo do modo claro */
    --white:    #FBF7F2;   /* papel quente — sem branco puro */
    --caramel-ink: #6E4A32;   /* caramelo legível — WCAG AA sobre fundos claros */
    --muted-ink:   #3F4D5A;
    --ink-on-dark: #F2DDD1;  /* texto sobre superfícies permanentemente escuras — igual nos dois modos */   /* chumbo legível — WCAG AA sobre fundos claros */

    --border-soft:    rgba(64,57,50,.08);
    --border-medium:  rgba(64,57,50,.15);
    --border-caramel: rgba(202,169,148,.35);

    --font-d: 'Bodoni Moda', Georgia, serif;
    --font-b: 'Inter', system-ui, sans-serif;
    --wrap:   1140px;
    --pad:    4rem;
    --t:      .25s;
}

/* ── DARK MODE — equilibrio castanho + chumbo-azulado ── */
body.dark-mode {
    --caramel-ink: #CAA994;   /* no escuro, o caramelo original já passa (8.6:1) */
    --muted-ink:   #C4B4A5;
    --dark:     #F2DDD1;
    --dark2:    #251E18;
    --caramel:  #CAA994;
    --blush:    #1A1714;
    --greige:   #4A4038;
    --muted:    #9C8B7E;
    --offwhite: #1A1410;   /* espresso quente — fim do azul frio */
    --white:    #332B24;   /* superfície elevada v2 — 1.35:1 sobre o fundo */

    --border-soft:    rgba(242,221,209,.14);
    --border-medium:  rgba(242,221,209,.26);
    --border-caramel: rgba(202,169,148,.45);
}

/* ══ BASE ══ */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
    font-family:var(--font-b);
    background:var(--offwhite);
    color:var(--dark);
    overflow-x:hidden;
    cursor:auto;
    transition:background .35s,color .35s;
}
a { text-decoration:none; color: var(--caramel-ink); transition:color var(--t); }
a:hover { text-decoration:underline; }
img { max-width:100%; display:block; }


/* Acessibilidade: conteúdo apenas para leitores de ecrã */
.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;
}

/* O cursor personalizado só é ativado em dispositivos adequados. */
.dot,.ring { display:none; }
@media (hover:hover) and (pointer:fine) {
    body { cursor:none; }
    .dot,.ring { display:block; }
}

/* Foco de teclado visível */
:focus-visible { outline:2px solid var(--caramel-ink); outline-offset:3px; }

/* ══ CURSOR ══ */
.dot {
    position:fixed; width:7px; height:7px;
    background:var(--caramel); border-radius:50%;
    pointer-events:none; z-index:9999;
    transform:translate(-50%,-50%); transition:transform .08s;
}
.ring {
    position:fixed; width:28px; height:28px;
    border:1px solid rgba(202,169,148,.6); border-radius:50%;
    pointer-events:none; z-index:9998;
    transform:translate(-50%,-50%); transition:all .15s ease;
}


/* ══ LAYOUT ══ */
.wrap { max-width:var(--wrap); margin:0 auto; padding:0 var(--pad); }
section { padding:6rem 0; }

/* ══ TIPOGRAFIA DE SECÇÃO ══ */
.s-eye {
    font-size:.67rem; letter-spacing:.2em; text-transform:uppercase;
    color: var(--caramel-ink); margin-bottom:.9rem;
    display:flex; align-items:center; gap:.6rem;
}
.s-eye::after { content:''; width:28px; height:1px; background:var(--caramel); }
.s-h { font-family:var(--font-d); font-size:2.5rem; color:var(--dark); line-height:1.12; margin-bottom:.75rem; }
.s-h em { color: var(--caramel-ink); font-style:italic; }
.s-sub { font-size:.9rem; color: var(--muted-ink); line-height:1.7; max-width:480px; }

/* ══ NAVEGAÇÃO ══ */
nav {
    position:fixed; top:0; left:0; right:0; z-index:200;
    display:flex; flex-direction:row; justify-content:space-between; align-items:center; gap:1.5rem;
    padding:.75rem var(--pad);
    background:rgba(246,231,223,.92); backdrop-filter:blur(16px);
    border-bottom:1px solid var(--border-soft);
    transition:background .35s;
}
nav a > img { height:42px; width:auto; display:block; }
body.dark-mode nav a > img { filter:brightness(0) invert(1) opacity(.88); }
body.dark-mode nav { background:rgba(26,20,16,.95); }
.logo { font-family:var(--font-d); font-size:1.05rem; font-weight:700; color:var(--dark); letter-spacing:.02em; }
.logo span { color: var(--caramel-ink); font-style:italic; font-weight:400; }
.nav-links { display:flex; gap:2.5rem; list-style:none; }
.nav-links a {
    font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
    color:rgba(64,57,50,.55); position:relative; transition:color var(--t);
}
body.dark-mode .nav-links a { color:rgba(242,221,209,.65); }
.nav-links a::after {
    content:''; position:absolute; bottom:-3px; left:0;
    width:0; height:1px; background:var(--caramel); transition:width .3s;
}
.nav-links a:hover,
.nav-links a.active { color:var(--dark); text-decoration:none; }
body.dark-mode .nav-links a:hover,
body.dark-mode .nav-links a.active { color:var(--dark); }
.nav-links a:hover::after,
.nav-links a.active::after { width:100%; }
.nav-btn {
    background:var(--dark); color:var(--offwhite);
    padding:.5rem 1.3rem; border-radius:2px;
    font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
    transition:background var(--t),color var(--t); border:none; cursor:pointer;
}
.nav-btn:hover { background:var(--dark2); color: var(--ink-on-dark); text-decoration:none; }

/* ══ BOTÕES — base partilhada + modificadores ══ */
.btn-dark,.btn-outline,.btn-caramel {
    display:inline-flex; align-items:center; gap:.5rem;
    padding:.82rem 2rem; border-radius:2px;
    font-size:.78rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase;
    transition:all .35s; text-decoration:none; cursor:pointer; border:none;
}
.btn-dark { background:var(--dark); color:var(--offwhite); }
.btn-dark:hover { background:var(--dark2); transform:translateY(-2px); box-shadow:0 8px 24px rgba(64,57,50,.2); color: var(--ink-on-dark); text-decoration:none; }
.btn-outline { background:transparent; color:var(--dark); border:1px solid var(--border-medium); padding:.82rem 1.5rem; }
.btn-outline:hover { border-color: var(--caramel-ink); color: var(--caramel-ink); text-decoration:none; }
.btn-caramel { background:var(--caramel); color:var(--white); }
.btn-caramel:hover { background:#b8947e; transform:translateY(-2px); color:var(--white); text-decoration:none; }

/* ══ PAGE INTRO ══ */
.page-intro { background:var(--dark2); padding:9rem 0 5rem; position:relative; overflow:hidden; }
body.dark-mode .page-intro { background:#0D1217; }
.page-intro::after {
    content:''; position:absolute; bottom:0; left:0; right:0;
    height:3px; background:linear-gradient(to right,var(--caramel),var(--greige));
}
.page-intro .s-h { color: var(--ink-on-dark); font-size:3rem; }
.page-intro .s-sub { color:rgba(216,210,197,.78); max-width:540px; }

/* ══ MARQUEE ══ */
.mq { background:var(--dark2); padding:.7rem 0; overflow:hidden; }
.mq-track { display:flex; width:max-content; animation:mq 22s linear infinite; }
@keyframes mq { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.mq-item {
    font-size:.67rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase;
    color:rgba(242,221,209,.5); white-space:nowrap; padding:0 2rem;
    display:flex; align-items:center; gap:1.5rem;
}
.mq-sep { color: var(--caramel-ink); }

/* ══ HERO ══ */
.hero { min-height:100vh; display:grid; grid-template-columns:52% 48%; position:relative; overflow:hidden; }
.hero-left {
    display:flex; flex-direction:column; justify-content:center;
    padding:9rem 4rem 5rem 5rem; background:var(--offwhite); position:relative; z-index:2;
}
.eyebrow { font-size:.67rem; letter-spacing:.2em; text-transform:uppercase; color: var(--caramel-ink); margin-bottom:1.75rem; display:flex; align-items:center; gap:.75rem; }
.eyebrow::before { content:''; width:28px; height:1px; background:var(--caramel); }
h1.hero-h { font-family:var(--font-d); font-size:3.6rem; line-height:1.07; color:var(--dark); margin-bottom:1.5rem; font-weight:700; }
h1.hero-h em { color: var(--caramel-ink); font-style:italic; }
.hero-p { font-size:.95rem; line-height:1.85; color: var(--muted-ink); max-width:400px; margin-bottom:2.5rem; }
.btns { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; }
.hero-meta { display:flex; gap:2.5rem; margin-top:3rem; padding-top:2rem; border-top:1px solid var(--border-soft); }
.meta-n { font-family:var(--font-d); font-size:2rem; font-weight:700; color:var(--dark); }
.meta-l { font-size:.67rem; letter-spacing:.1em; color: var(--muted-ink); text-transform:uppercase; margin-top:.15rem; }
.hero-right { position:relative; overflow:hidden; background:var(--blush); }
.hero-deco-line { position:absolute; bottom:0; left:0; right:0; height:3px; background:linear-gradient(to right,var(--caramel),var(--greige)); }

/* Placeholders de imagem — hero e cards */
.hero-img-ph { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem; }
.ph-box {
    width:80px; height:80px; border:1.5px dashed var(--border-medium); border-radius:4px;
    display:flex; align-items:center; justify-content:center;
    font-size:.55rem; letter-spacing:.1em; text-transform:uppercase;
    color:rgba(64,57,50,.25); text-align:center; line-height:1.6; padding:.5rem;
}
.ph-label { font-size:.67rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(64,57,50,.3); text-align:center; line-height:1.8; }
.ph-label small,.about-ph-txt small { font-size:.58rem; opacity:.6; display:block; margin-top:.2rem; }
/* Texto placeholder partilhado por todos os cards */
.svc-ph-txt,.val-ph,.about-ph-txt {
    font-size:.62rem; letter-spacing:.1em; text-transform:uppercase;
    color:rgba(64,57,50,.3); line-height:1.7; text-align:center;
}

/* ══ CARDS — grid separador partilhado ══ */
.svc-grid,.process-grid,.contact-3 {
    gap:1.5px; background:var(--border-soft);
    border-radius:6px; overflow:hidden; border:1px solid var(--border-soft);
}
/* Superfície e hover partilhados por cards clicáveis */
.svc-card,.ct-card { background:var(--white); transition:background .35s; cursor:pointer; }
.svc-card:hover,.ct-card:hover { background:var(--blush); }
/* Placeholders de imagem dentro dos cards */
.svc-img-wrap,.val-img-wrap,.ct-img-wrap,.about-frame {
    background:var(--blush); border:1.5px dashed var(--border-medium);
    overflow:hidden; transition:border-color var(--t);
}
.svc-card:hover .svc-img-wrap,
.ct-card:hover .ct-img-wrap { border-color: var(--caramel-ink); }
.svc-img-wrap img,.val-img-wrap img,.about-frame img { width:100%; height:100%; object-fit:cover; }
/* Títulos partilhados */
.svc-title,.ct-title,.val-title { font-family:var(--font-d); font-size:1.1rem; color:var(--dark); margin-bottom:.6rem; }
.svc-title { font-size:1.25rem; }
/* Descrições partilhadas */
.svc-desc,.ct-desc,.val-desc,.proc-desc { font-size:.84rem; line-height:1.75; color: var(--muted-ink); }
/* Tags e chips partilhados */
.svc-tag,.chip {
    font-size:.63rem; letter-spacing:.09em; text-transform:uppercase;
    padding:.28rem .65rem; border:1px solid var(--border-caramel);
    color: var(--caramel-ink); border-radius:2px; transition:all var(--t); cursor:default;
}
.chip:hover { border-color: var(--caramel-ink); color: var(--caramel-ink); }

/* ══ SERVIÇOS ══ */
.svc-section { background:var(--offwhite); }
.svc-grid { display:grid; grid-template-columns:repeat(2,1fr); }
.svc-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:3rem; }
.svc-card { padding:2.75rem 2.25rem; position:relative; }
.svc-img-wrap { width:100%; height:160px; border-radius:4px; display:flex; flex-direction:column; align-items:center; justify-content:center; margin-bottom:1.5rem; }
.svc-ph-inner { display:flex; flex-direction:column; align-items:center; gap:.4rem; text-align:center; }
.svc-num { font-family:var(--font-d); font-size:3rem; font-weight:700; color:rgba(64,57,50,.04); position:absolute; top:.5rem; right:1.25rem; line-height:1; pointer-events:none; user-select:none; }
.svc-tags { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:1.1rem; }
.svc-desc { max-width:360px; }
.svc-arr {
    font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--dark);
    margin-top:1.25rem; opacity:0; transform:translateX(-8px);
    transition:all var(--t); display:inline-flex; align-items:center; gap:.4rem; text-decoration:none;
}
.svc-card:hover .svc-arr { opacity:1; transform:translateX(0); }

/* ══ PROCESSO ══ */
.process-section { background:var(--blush); }
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:3rem; }
.proc-card { background:var(--blush); padding:2rem 1.5rem; transition:background var(--t); }
.proc-card:hover { background:var(--greige); }
.proc-line { width:100%; height:2px; background:linear-gradient(to right,var(--caramel),transparent); margin-bottom:1.5rem; }
.proc-n { font-family:var(--font-d); font-size:.78rem; color: var(--caramel-ink); font-style:italic; margin-bottom:.4rem; }
.proc-title { font-size:.92rem; font-weight:500; color:var(--dark); margin-bottom:.55rem; }

/* ══ SOBRE ══ */
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:7rem; align-items:center; }
.about-visual { position:relative; }
.about-frame { aspect-ratio:4/5; border-radius:4px; border:1px solid var(--border-soft); display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; gap:.75rem; }
.about-ph-inner { display:flex; flex-direction:column; align-items:center; gap:.75rem; z-index:1; }
.about-deco { position:absolute; top:-1rem; right:-1rem; width:100%; height:100%; border:1px solid var(--border-caramel); border-radius:4px; z-index:-1; }
.about-badge { position:absolute; bottom:1.5rem; left:-1.5rem; background:var(--caramel); padding:.6rem 1.2rem; border-radius:2px; }
.about-badge-t { font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--white); font-weight:500; }
.lang-tag { font-size:.63rem; letter-spacing:.14em; text-transform:uppercase; color: var(--caramel-ink); margin:1rem 0 .4rem; display:flex; align-items:center; gap:.4rem; }
.lang-tag::before { content:''; width:12px; height:1px; background:var(--caramel); }
.about-p { font-size:.9rem; line-height:1.85; color: var(--muted-ink); }
.chips { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:1.75rem; }

/* ══ VALORES ══ */
.valores-section { background:var(--offwhite); }
.valores-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:3rem; }
.val-card { background:var(--white); border-radius:4px; border:1px solid var(--border-soft); border-top:3px solid var(--caramel); padding:2rem 1.75rem; transition:box-shadow .35s,transform .35s; }
.val-card:hover { box-shadow:0 8px 28px rgba(64,57,50,.1); transform:translateY(-3px); }
.val-img-wrap { width:100%; height:120px; border-radius:2px; display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; }

/* ══ SPLIT — Qualidade/História (CESAE) ══ */
.split-section { background:var(--offwhite); }
.split-pair { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--border-soft); border-radius:4px; overflow:hidden; margin-top:3rem; }
.sp { padding:3.25rem 2.75rem; position:relative; overflow:hidden; }
.sp-l { background:var(--white); border-right:1px solid var(--border-soft); }
.sp-r { background:rgba(242,221,209,.28); }
.sp-big { font-family:var(--font-d); font-size:9rem; font-weight:700; font-style:italic; color:rgba(202,169,148,.10); position:absolute; bottom:-2rem; right:1rem; line-height:1; pointer-events:none; user-select:none; }
.sp-tag { font-size:.65rem; letter-spacing:.18em; text-transform:uppercase; color: var(--caramel-ink); margin-bottom:1.25rem; display:flex; align-items:center; gap:.5rem; }
.sp-tag::before { content:''; width:18px; height:1px; background:var(--caramel); }
.sp-h { font-family:var(--font-d); font-size:1.45rem; color:var(--dark); margin-bottom:1rem; line-height:1.3; }
.sp-p { font-size:.86rem; line-height:1.8; color:var(--muted-ink); margin-bottom:.75rem; }
.sp-link { font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color: var(--caramel-ink); display:inline-flex; align-items:center; gap:.4rem; margin-top:.5rem; transition:gap var(--t); }
.sp-link:hover { gap:.8rem; text-decoration:none; }

/* Página Sobre — Qualidade & História acompanha o tema */
.page-sobremim .split-section .s-eye,
.page-sobremim .split-section .s-h em {
    color:var(--caramel-ink);
}
.page-sobremim .split-section .s-h { color:var(--dark); }

body.dark-mode .page-sobremim .split-section { background:var(--dark2); }
body.dark-mode .page-sobremim .split-section .split-pair { border-color:var(--border-soft); }
body.dark-mode .page-sobremim .split-section .sp-l {
    background:rgba(64,57,50,.30);
    border-right-color:var(--border-soft);
}
body.dark-mode .page-sobremim .split-section .sp-r { background:rgba(64,57,50,.15); }
body.dark-mode .page-sobremim .split-section .s-h,
body.dark-mode .page-sobremim .split-section .sp-h { color:var(--ink-on-dark); }
body.dark-mode .page-sobremim .split-section .sp-p { color:rgba(216,210,197,.86); }
body.dark-mode .page-sobremim .split-section .sp-big { color:rgba(242,221,209,.04); }
body.dark-mode .page-sobremim .split-section .s-eye { color:var(--gold-soft); }
body.dark-mode .page-sobremim .split-section .s-h em { color:var(--gold); }

/* ══ CONTACTO — 3 colunas (CESAE) ══ */
.contact-section { background:var(--offwhite); }
.contact-3 { display:grid; grid-template-columns:repeat(3,1fr); margin-top:3rem; }
.ct-card { padding:2.25rem 1.75rem; }
.ct-img-wrap { width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; padding:.5rem; font-size:.52rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(64,57,50,.3); text-align:center; }
.ct-img-wrap img { border-radius:50%; object-fit:cover; }
.ct-card:hover .ct-img-wrap { border-color: var(--caramel-ink); }
.ct-card:hover .ct-cta { color: var(--caramel-ink); border-color: var(--caramel-ink); gap:.8rem; }
.ct-type { font-size:.63rem; letter-spacing:.15em; text-transform:uppercase; color: var(--caramel-ink); margin-bottom:.4rem; }
.ct-cta { font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--dark); display:inline-flex; align-items:center; gap:.4rem; border-bottom:1px solid var(--border-medium); padding-bottom:.2rem; transition:all var(--t); }
.ct-note { font-size:.72rem; color: var(--muted-ink); margin-top:.75rem; opacity:.6; }

/* ══ CTA FINAL ══ */
.cta-s { background:var(--dark2); padding:8rem 0; position:relative; overflow:hidden; text-align:center; }
body.dark-mode .cta-s { background:#0D1217; }
.cta-s::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 120%,rgba(202,169,148,.06) 0%,transparent 60%); }
.cta-over { font-size:.65rem; letter-spacing:.22em; text-transform:uppercase; color: var(--caramel-ink); margin-bottom:1.5rem; display:flex; align-items:center; justify-content:center; gap:1.25rem; }
.cta-over::before,.cta-over::after { content:''; width:36px; height:1px; background:rgba(202,169,148,.3); }
.cta-h { font-family:var(--font-d); font-size:3rem; color:var(--ink-on-dark); margin-bottom:1.25rem; line-height:1.1; }
.cta-h em { color: var(--caramel-ink); font-style:italic; }
.cta-p { font-size:.9rem; color:rgba(216,210,197,.78); line-height:1.8; max-width:420px; margin:0 auto 2.5rem; }

/* ══ FOOTER ══ */
footer { background:rgba(20,14,10,1); padding:2.5rem 0; border-top:1px solid var(--border-soft); }
body.dark-mode footer { background:#060a0d; }
.ft { max-width:var(--wrap); margin:0 auto; padding:0 var(--pad); display:flex; flex-direction:column; align-items:center; gap:1rem; text-align:center; }
.ft-copy { font-size:.73rem; color:rgba(216,210,197,.65); }
.ft-links { display:flex; gap:2rem; }
.ft-links a { font-size:.7rem; color:rgba(216,210,197,.55); letter-spacing:.06em; transition:color var(--t); }
.ft-links a:hover { color: var(--caramel-ink); text-decoration:none; }

/* ══ SCROLL REVEAL — atraso escalonado ══ */
.rv,.rv2,.rv3 { opacity:0; transform:translateY(22px); transition:opacity .65s ease,transform .65s ease; }
.rv2 { transition-delay:.15s; }
.rv3 { transition-delay:.30s; }
.rv.vis,.rv2.vis,.rv3.vis { opacity:1; transform:translateY(0); }

/* ══ JS FEEDBACK ══ */
#js-feedback { opacity:0; transition:opacity var(--t); font-size:.82rem; color: var(--caramel-ink); letter-spacing:.06em; height:1.5rem; }
#js-feedback.visivel { opacity:1; }

/* ══ RESPONSIVO MOBILE (≤ 575px) ══ */
@media (max-width:575px) {
    :root { --pad:1.25rem; }
    nav { padding:1rem var(--pad); }
    .nav-links,.nav-btn { display:none; }
    section { padding:3.5rem 0; }
    .hero { grid-template-columns:1fr; min-height:auto; }
    .hero-left { padding:7rem var(--pad) 3rem; }
    .hero-right { height:260px; }
    h1.hero-h { font-size:2.2rem; }
    .hero-meta { gap:1.5rem; }
    .svc-grid,.process-grid,.about-grid,.split-pair,.contact-3,.valores-grid { grid-template-columns:1fr; }
    .svc-header { flex-direction:column; align-items:flex-start; gap:1rem; }
    .about-grid { gap:3rem; }
    .about-badge { left:0; bottom:1rem; }
    .page-intro .s-h { font-size:2rem; }
    .cta-h { font-size:2rem; }
    .ft { flex-direction:column; gap:1.25rem; text-align:center; }
    .ft-links { flex-wrap:wrap; justify-content:center; }
}

/* ══ RESPONSIVO TABLET (576px – 991px) ══ */
@media (min-width:576px) and (max-width:991px) {
    :root { --pad:2rem; }
    nav { padding:1rem var(--pad); }
    .nav-links { display:none; }
    section { padding:4.5rem 0; }
    h1.hero-h { font-size:2.8rem; }
    .hero-right { min-height:320px; }
    .svc-grid { grid-template-columns:1fr; }
    .process-grid { grid-template-columns:repeat(2,1fr); }
    .about-grid { grid-template-columns:1fr; gap:3rem; }
    .split-pair,.contact-3 { grid-template-columns:1fr; }
    .valores-grid { grid-template-columns:repeat(2,1fr); }
    .svc-header { flex-direction:column; gap:1rem; }
    .about-badge { left:0; }
    .cta-h { font-size:2.4rem; }
}

/* ══ DESKTOP XL (> 1200px) ══ */
@media (min-width:1200px) {
    h1.hero-h { font-size:4rem; }
    .s-h { font-size:2.8rem; }
    .hero-left { padding:9rem 5rem 5rem 6rem; }
}

a.svc-arr { text-decoration:none; display:inline-block; padding:.55rem 1.2rem; border:1px solid var(--caramel-ink); border-radius:2px; color:var(--caramel-ink); font-weight:500; margin-top:.6rem; }
a.svc-arr:hover { background:var(--caramel-ink); color:var(--offwhite); }


/* ══ HERO COM VÍDEO DE FUNDO ══ */
.hero-video-sec { position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden; grid-template-columns:none; }
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-video-veu { position:absolute; inset:0; z-index:1;
    background:linear-gradient(100deg, rgba(26,20,16,.78) 0%, rgba(26,20,16,.55) 36%, rgba(26,20,16,.18) 62%, rgba(26,20,16,.05) 100%); }
.hero-video-conteudo { position:relative; z-index:2; max-width:640px; padding:8rem var(--pad) 5rem; }
.hero-video-sec .hero-h { color:var(--ink-on-dark); }
.hero-video-sec .hero-h em { color:var(--caramel); }
.hero-video-sec .eyebrow, .hero-video-sec .meta-n { color:var(--ink-on-dark); }
.hero-video-sec .hero-p { color:rgba(242,221,209,.85); max-width:460px; }
.hero-video-sec .meta-l { color:rgba(242,221,209,.6); }
.hero-video-sec .hero-meta { border-top:1px solid rgba(242,221,209,.22); }
.hero-video-sec .btn-dark { background:var(--caramel); color:var(--dark); border-color:var(--caramel); }
.hero-video-sec .btn-outline { border-color:rgba(242,221,209,.5); color:var(--ink-on-dark); }
.hero-video-sec .btn-outline:hover { background:var(--ink-on-dark); color:var(--dark); }
@media (max-width:900px){
    .hero-video-conteudo { padding:7rem var(--pad) 4rem; }
    .hero-video-veu { background:linear-gradient(180deg, rgba(26,20,16,.75) 0%, rgba(26,20,16,.52) 55%, rgba(26,20,16,.42) 100%); }
}
@media (prefers-reduced-motion: reduce){
    .hero-video { display:none; }
    .hero-video-sec { background:var(--dark); }
    .hero-video-sec::before { content:""; position:absolute; inset:0; background:url('../imagens/hero-poster.jpg') center/cover; opacity:.5; }
}

/* ══ MENU MOBILE (hambúrguer) ══ */
/* O nav permanece fixo; também serve de referência ao menu mobile. */
.nav-toggle {
    display:none; background:none; border:none; cursor:pointer;
    width:44px; height:44px; flex-direction:column; align-items:center;
    justify-content:center; gap:5px; padding:0; margin-left:auto;
}
.nav-toggle span {
    display:block; width:24px; height:2px; background:var(--dark);
    transition:transform .3s ease, opacity .2s ease; border-radius:2px;
}
.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; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:991px){
    .nav-toggle { display:flex !important; }
    .nav-btn { display:flex !important; }
    .nav-links {
        display:none; position:absolute; top:100%; left:0; right:0;
        background:var(--offwhite); flex-direction:column; align-items:stretch;
        gap:0; padding:.5rem var(--pad) 1.2rem; margin:0;
        border-top:1px solid var(--border-medium);
        box-shadow:0 10px 30px rgba(0,0,0,.10); z-index:60;
    }
    .nav-links.aberto { display:flex !important; }
    .nav-links li { width:100%; list-style:none; }
    .nav-links a {
        display:block; padding:.95rem .2rem; width:100%;
        border-bottom:1px solid var(--border-soft); font-size:.95rem;
    }
    .nav-links li:last-child a { border-bottom:none; }
}
@media (prefers-reduced-motion: reduce){
    .nav-toggle span { transition:none; }
}

/* ══ CLASSES UTILITÁRIAS (extraídas de estilos inline) ══ */
.btn-tema { cursor:pointer;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0; }
.ft-topo { text-align:center; padding:2rem 0 1rem; border-bottom:1px solid var(--border-soft); }
.ft-logo { margin:0 auto .85rem; opacity:.7; display:block; filter:brightness(0) invert(1); }
.ft-social { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(216,210,197,.7); transition:color .25s; text-decoration:none; }
.ft-icone { color:rgba(216,210,197,.7);margin-left:.9rem;text-decoration:none; }
.pos-rel { position:relative;z-index:1 }
.img-cover { width:100%;height:100%;object-fit:cover;display:block; }
.u-1 { min-height:80px; }
.u-2 { background:var(--offwhite); }
.u-3 { margin-top:1.25rem; }
.u-4 { background:var(--dark2);border-top-color:var(--caramel-ink); }
.u-5 { color:var(--ink-on-dark); }
.u-6 { font-size:.83rem;color:rgba(216,210,197,.6);margin-top:.5rem;line-height:1.7; }
.u-7 { margin-top:1.25rem;display:inline-flex; }
.u-8 { font-family:'Bodoni Moda',serif; font-size:1.25rem; color:var(--dark); margin:2rem 0 .75rem; }
.u-9 { background:var(--greige);padding:3rem 0; }
.u-10 { text-align:center;margin:0 0 3rem; }
.u-11 { color:var(--dark); }
.u-12 { background:var(--offwhite);padding:0 0 5rem; }
.ft-social-esp { margin-left:1.4rem; }


/* ══ FORMULÁRIO DE CONTACTO ══ */
.ct-bloco { padding:0 0 4.5rem; }
.ct-wrap { max-width:640px; margin:0 auto; padding:0 1.5rem; }
.ct-caixa { background:var(--white); border:1px solid var(--border-medium); border-radius:6px; padding:2.5rem 2rem; }
.ct-sub { font-size:.85rem; color:var(--muted-ink); margin-bottom:1.6rem; }
.ct-campos { display:grid; gap:1rem; }
.ct-campo { padding:.85rem 1rem; border:1px solid var(--border-medium); border-radius:4px; background:var(--offwhite); color:var(--dark); font-family:var(--font-b); font-size:.9rem; }
textarea.ct-campo { min-height:120px; resize:vertical; }
.ct-btn { justify-self:start; cursor:pointer; }
.ct-titulo { font-size:1.4rem; margin-bottom:.4rem; }

.form-feedback{

    margin-top:1rem;

    font-size:.95rem;

    color:var(--color-caramel);

    text-align:center;

}


/* utilitárias (2ª passagem) */
.v-1 { font-size:1.5rem; }
.v-2 { padding:1.75rem; background:var(--white); border-radius:4px; border:1px solid rgba(64,57,50,.08); height:100%; }
.v-3 { font-size:.65rem; letter-spacing:.16em; text-transform:uppercase; color:var(--caramel-ink); margin-bottom:.6rem; }
.v-4 { font-family:'Bodoni Moda',serif; font-size:1rem; color:var(--dark); margin-bottom:.4rem; }
.v-5 { font-size:.8rem; color:var(--muted-ink); }
.v-6 { background:var(--offwhite); padding:5rem 0; }
.v-7 { opacity:.4;pointer-events:none; }
.v-8 { color:rgba(255,255,255,.3); }
.v-9 { position:absolute;inset:0;width:100%;height:100%;object-fit:cover; }
.v-10 { color:var(--dark) }
.v-11 { background:linear-gradient(to right,var(--greige),transparent) }
.v-12 { color:inherit; }
.v-13 { color:inherit;text-decoration:none; }
.v-14 { max-width:760px; }
.v-15 { font-size:.9rem; line-height:1.9; color:var(--muted-ink); }
.v-16 { margin-top:.75rem; }
.v-17 { margin-bottom:.75rem; }
.v-18 { display:inline-flex;align-items:center;gap:.4rem;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--caramel-ink);text-decoration:none; }
.v-19 { color:rgba(255,255,255,.15); font-size:3.5rem; }
.v-20 { opacity:.35;pointer-events:none; }


/* ══════════ AJUSTES DE RESPONSIVIDADE E ESPAÇAMENTO ══════════ */

/* HERO COM VÍDEO — em tablet e mobile o vídeo aparece primeiro,
   o título fica por baixo e revela-se com scroll */
@media (max-width: 991px) {
    .hero-video-sec {
        display: block;
        min-height: auto;
        padding-top: 68px;
    }
    .hero-video-sec .hero-video {
        position: relative;
        height: 58vh;
        min-height: 320px;
    }
    .hero-video-sec .hero-video-veu {
        position: absolute;
        top: 68px;
        height: 58vh;
        min-height: 320px;
        background: linear-gradient(180deg, rgba(26,20,16,.25) 0%, rgba(26,20,16,.10) 60%, rgba(26,20,16,.45) 100%);
    }
    .hero-video-sec .hero-video-conteudo {
        position: relative;
        max-width: 100%;
        padding: 2.2rem var(--pad) 2.5rem;
        background: var(--offwhite);
    }
    .hero-video-sec .hero-h,
    .hero-video-sec .eyebrow,
    .hero-video-sec .meta-n { color: var(--dark); }
    .hero-video-sec .hero-h em { color: var(--caramel-ink); }
    .hero-video-sec .hero-p { color: var(--muted-ink); }
    .hero-video-sec .meta-l { color: var(--muted-ink); }
    .hero-video-sec .hero-meta { border-top-color: var(--border-medium); }
    .hero-video-sec .btn-outline { border-color: var(--dark); color: var(--dark); }
    .hero-video-sec .btn-outline:hover { background: var(--dark); color: var(--offwhite); }
    body.dark-mode .hero-video-sec .hero-video-conteudo { background: var(--offwhite); }
}

/* MÉTRICAS UX / UI / ID mais próximas do conteúdo */
.hero-meta { margin-top: 1.6rem !important; padding-top: 1.2rem !important; gap: 2rem; }
.hero-video-sec .hero-meta { margin-top: 1.4rem !important; padding-top: 1.1rem !important; }
@media (max-width: 575px) { .hero-meta { gap: 1.2rem; margin-top: 1.2rem !important; } }

/* ESPAÇO SUPERIOR DAS PÁGINAS — menos distância entre a nav e o conteúdo */
.page-intro { padding-top: 6.5rem !important; }
.det-hero { padding-top: 6.5rem !important; }
@media (max-width: 991px) {
    .page-intro, .det-hero { padding-top: 5.5rem !important; }
}

/* FOOTER — separar a linha do menu */
.ft-topo { padding-bottom: 2.2rem !important; }
.ft-links, .ft-menu { margin-top: 1.4rem; }
footer .ft-topo + * { margin-top: 1.6rem; }

/* IMAGENS DOS VALORES — enquadrar pelo terço superior (não cortar cabeças) */
.val-img-wrap img, .val-card img { object-position: center 50% !important; }

/* BRIEFING — títulos das caixas de categoria com contraste nos dois modos */
.cat-btn .cat-label { color: var(--dark) !important; }
.cat-btn .cat-sub { color: var(--muted-ink) !important; }
.cat-btn.ativo .cat-label { color: var(--blush) !important; }
.cat-btn.ativo .cat-sub { color: var(--blush) !important; opacity: .75; }
body.dark-mode .cat-btn .cat-label { color: var(--ink-on-dark) !important; }
body.dark-mode .cat-btn .cat-sub { color: rgba(242,221,209,.7) !important; }
body.dark-mode .cat-btn.ativo .cat-label { color: var(--dark) !important; }
body.dark-mode .cat-btn.ativo .cat-sub { color: var(--dark) !important; opacity: .8; }
.bf-div { color: var(--caramel-ink) !important; }
body.dark-mode .bf-div { color: var(--caramel) !important; }
.bf-label { color: var(--dark) !important; }
body.dark-mode .bf-label { color: var(--ink-on-dark) !important; }


/* ══════════ LIGHTBOX (ampliação de imagens) ══════════ */
.lightbox {
    position:fixed; inset:0; z-index:9999;
    background:rgba(20,15,12,.94);
    display:none; flex-direction:column; align-items:center; justify-content:center;
    gap:1.25rem; padding:4rem 4vw 2rem; cursor:zoom-out;
}
.lightbox.aberto { display:flex; }
.lightbox img {
    max-width:100%; max-height:calc(100vh - 10rem);
    object-fit:contain; border-radius:3px;
    box-shadow:0 24px 70px rgba(0,0,0,.6);
    animation:lbEntra .25s ease;
}
@keyframes lbEntra { from { opacity:0; transform:scale(.97); } to { opacity:1; transform:scale(1); } }
.lightbox-fechar {
    position:absolute; top:20px; right:24px;
    width:44px; height:44px; border:none; border-radius:50%;
    background:rgba(255,255,255,.12); color:#fff;
    font-size:1.6rem; line-height:1; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background-color .2s;
}
.lightbox-fechar:hover, .lightbox-fechar:focus-visible { background:rgba(255,255,255,.25); }
.lightbox-legenda {
    position:static; width:min(90%,900px); min-height:1.3em;
    text-align:center; color:rgba(255,255,255,.82);
    font-size:.82rem; line-height:1.55; letter-spacing:.04em; padding:0 1rem;
}
.lightbox-legenda:empty { display:none; }
.ampliavel { cursor:zoom-in; transition:opacity .2s; }
.ampliavel:hover { opacity:.88; }
@media (max-width:575px) {
    .lightbox { padding:4rem 1rem 1.5rem; gap:.9rem; }
    .lightbox img { max-height:calc(100vh - 9rem); }
    .lightbox-legenda { font-size:.76rem; }
}
@media (prefers-reduced-motion: reduce) { .lightbox img { animation:none; } }

/* número do WhatsApp junto ao ícone */
.ft-icone { display:inline-flex; align-items:center; gap:.4rem; }
.wa-num { font-size:.72rem; letter-spacing:.06em; }
@media (max-width:575px){ .wa-num { font-size:.68rem; } }


/* ══════════ GRID PRÓPRIO (substitui classes Bootstrap) ══════════ */
.row {
    display: flex; flex-wrap: wrap;
    margin-left: -.75rem; margin-right: -.75rem;
}
.row > [class*="col-"] {
    padding-left: .75rem; padding-right: .75rem;
    width: 100%;
}
.g-3 { gap: 1rem 0; } .g-4 { gap: 1.5rem 0; } .g-5 { gap: 2.5rem 0; }
.mt-1 { margin-top:.5rem; } .mt-2 { margin-top:1rem; } .mt-3 { margin-top:1.5rem; }
.mt-4 { margin-top:2rem; } .mt-5 { margin-top:3rem; }
.mb-3 { margin-bottom:1.5rem; } .mb-4 { margin-bottom:2rem; } .mb-5 { margin-bottom:3rem; }
.d-flex { display:flex; }

@media (min-width: 768px) {
    .col-md-3 { width: 25%; }
    .col-md-4 { width: 33.3333%; }
    .col-md-6 { width: 50%; }
    .col-md-8 { width: 66.6667%; }
    .col-md-12 { width: 100%; }
}
@media (min-width: 992px) {
    .col-lg-3 { width: 25%; }
    .col-lg-4 { width: 33.3333%; }
    .col-lg-6 { width: 50%; }
    .col-lg-8 { width: 66.6667%; }
}

/* ══════════ BRIEFING: número e título das categorias visíveis ══════════ */
.cat-n { color: rgba(64,57,50,.38) !important; }
.cat-btn:hover .cat-n { color: rgba(64,57,50,.55) !important; }
.cat-btn.ativo .cat-n { color: rgba(242,221,209,.85) !important; }
body.dark-mode .cat-n { color: rgba(242,221,209,.42) !important; }
body.dark-mode .cat-btn:hover .cat-n { color: rgba(242,221,209,.6) !important; }
body.dark-mode .cat-btn.ativo .cat-n { color: rgba(64,57,50,.75) !important; }


/* ══════════ GRELHA PRÓPRIA (substitui o Bootstrap removido) ══════════ */
.row { display:flex; flex-wrap:wrap; margin-left:-.75rem; margin-right:-.75rem; }
.row > [class*="col-"] { padding-left:.75rem; padding-right:.75rem; }
.col-md-4 { flex:0 0 33.333%; max-width:33.333%; }
.col-md-6 { flex:0 0 50%; max-width:50%; }
.col-md-8 { flex:0 0 66.666%; max-width:66.666%; }
.col-lg-4 { flex:0 0 33.333%; max-width:33.333%; }
.col-lg-8 { flex:0 0 66.666%; max-width:66.666%; }
.g-3 { gap:1rem 0; } .g-4 { gap:1.5rem 0; } .g-5 { gap:2rem 0; }
.mt-3 { margin-top:1rem; } .mt-4 { margin-top:1.5rem; } .mt-5 { margin-top:2.5rem; }
.mb-3 { margin-bottom:1rem; } .mb-4 { margin-bottom:1.5rem; } .mb-5 { margin-bottom:2.5rem; }
@media (max-width:991px){
    .col-md-4, .col-md-6, .col-md-8, .col-lg-4, .col-lg-8 { flex:0 0 50%; max-width:50%; }
}
@media (max-width:575px){
    .col-md-4, .col-md-6, .col-md-8, .col-lg-4, .col-lg-8 { flex:0 0 100%; max-width:100%; }
}


/* ══ ACESSIBILIDADE E FEEDBACK ══ */
.sr-only {
    position:absolute !important; width:1px !important; height:1px !important;
    padding:0 !important; margin:-1px !important; overflow:hidden !important;
    clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important;
}
:focus-visible { outline:2px solid var(--caramel-ink); outline-offset:3px; }
.form-feedback { font-size:.82rem; line-height:1.5; color:var(--caramel-ink); }
.form-feedback[hidden] { display:none; }
.ft-social:hover, .ft-social:focus-visible, .ft-icone:hover, .ft-icone:focus-visible {
    color:var(--caramel);
    text-decoration:none;
}


/* ══════════ AJUSTES V23 — contraste, logo e interação ══════════ */
/* Superfícies mais distintas no modo escuro */
body.dark-mode {
    --offwhite: #15100D;
    --white: #332B24;
    --blush: #2A1F1A;
    --greige: #51463D;
    --border-soft: rgba(242,221,209,.14);
    --border-medium: rgba(242,221,209,.26);
    --border-caramel: rgba(202,169,148,.45);
}

/* Logo da navbar com presença maior */
nav a > img {
    height: 58px;
    width: auto;
    max-width: 210px;
    object-fit: contain;
}

@media (max-width: 575px) {
    nav a > img {
        height: 50px;
        max-width: 175px;
    }
}

/* ===== PÁGINAS DE DETALHE ===== */
/* ============================================================
   ADD ART DESIGN STUDIO — CSS de detalhe
   Páginas de serviço e de projeto — mesmo sistema visual
   ============================================================ */

/* ── HERO DA PÁGINA DE DETALHE ── */
body.page-detail .det-hero {
    background: var(--dark2);
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}

body.page-detail .det-hero::after {
    content: "";
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(to right, var(--caramel), var(--greige));
}

body.page-detail .det-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 70% 50%, rgba(202,169,148,.06) 0%, transparent 65%);
    pointer-events: none;
}

body.page-detail .det-back {
    font-size: .67rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(202,169,148,.5);
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: 2rem;
    text-decoration: none;
    transition: color .25s;
}
body.page-detail .det-back:hover { color: var(--caramel-ink); text-decoration: none; }
body.page-detail .det-back::before { content: "←"; }

body.page-detail .det-tipo {
    font-size: .67rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--caramel-ink);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: .6rem;
}
body.page-detail .det-tipo::after { content: ""; width: 28px; height: 1px; background: var(--caramel); }

body.page-detail .det-titulo {
    font-family: "Bodoni Moda", serif;
    font-size: clamp(2rem, 4vw, 3.2rem);
    color: var(--ink-on-dark);
    line-height: 1.1;
    margin-bottom: 1.25rem;
}
body.page-detail .det-titulo em { color: var(--caramel-ink); font-style: italic; }

body.page-detail .det-sub {
    font-size: .95rem;
    color: rgba(216,210,197,.6);
    line-height: 1.8;
    max-width: 520px;
    margin-bottom: 2rem;
}

body.page-detail .det-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(242,221,209,.08);
    margin-top: .5rem;
}
body.page-detail .det-meta-item { }
body.page-detail .det-meta-label {
    font-size: .6rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(202,169,148,.5);
    margin-bottom: .3rem;
}
body.page-detail .det-meta-valor {
    font-family: "Bodoni Moda", serif;
    font-size: .95rem;
    color: var(--ink-on-dark);
}

/* ── IMAGEM PRINCIPAL ── */
body.page-detail .det-img-principal {
    width: 100%;
    max-height: 500px;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}

body.page-detail .det-img-ph {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 420px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    border: 1.5px dashed rgba(64,57,50,.15);
}

body.page-detail .det-img-ph-symbol {
    font-family: "Bodoni Moda", serif;
    font-size: 5rem;
    font-weight: 700;
    font-style: italic;
    line-height: 1;
    opacity: .2;
}

body.page-detail .det-img-ph-txt {
    font-size: .6rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(64,57,50,.3);
    text-align: center;
    line-height: 1.9;
}

/* ── CORPO DO CONTEÚDO ── */
body.page-detail .det-body {
    padding: 5rem 0 4rem;
}

body.page-detail .det-intro {
    font-size: 1.05rem;
    line-height: 1.85;
    color: var(--dark);
    font-weight: 400;
    max-width: 680px;
    margin-bottom: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid rgba(64,57,50,.08);
}

/* ── GRID 2 COLUNAS (texto + aside) ── */
body.page-detail .det-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 5rem;
    align-items: start;
}

body.page-detail .det-main h2 {
    font-family: "Bodoni Moda", serif;
    font-size: 1.6rem;
    color: var(--dark);
    margin-bottom: 1rem;
    margin-top: 2.5rem;
}
body.page-detail .det-main h2:first-child { margin-top: 0; }

body.page-detail .det-main h2 em { color: var(--caramel-ink); font-style: italic; }

body.page-detail .det-main p {
    font-size: .9rem;
    line-height: 1.85;
    color: var(--muted-ink);
    margin-bottom: 1rem;
}

/* Lista com traços caramel */
body.page-detail .det-list {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0 1.5rem;
}
body.page-detail .det-list li {
    font-size: .88rem;
    line-height: 1.7;
    color: var(--muted-ink);
    padding: .55rem 0;
    border-bottom: 1px solid rgba(64,57,50,.06);
    display: flex;
    align-items: flex-start;
    gap: .75rem;
}
body.page-detail .det-list li::before {
    content: "✦";
    color: var(--caramel-ink);
    font-size: .6rem;
    margin-top: .25rem;
    flex-shrink: 0;
}

/* ── ASIDE (sidebar) ── */
body.page-detail .det-aside {
    position: sticky;
    top: 100px;
}

body.page-detail .det-aside-card {
    background: var(--white);
    border: 1px solid rgba(64,57,50,.08);
    border-top: 3px solid var(--caramel);
    border-radius: 4px;
    padding: 2rem 1.75rem;
    margin-bottom: 1.5rem;
}

body.page-detail .det-aside-card h3 {
    font-family: "Bodoni Moda", serif;
    font-size: 1rem;
    color: var(--dark);
    margin-bottom: 1.25rem;
}

body.page-detail .det-aside-label {
    font-size: .6rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--caramel-ink);
    margin-bottom: .3rem;
    margin-top: 1rem;
}
body.page-detail .det-aside-label:first-of-type { margin-top: 0; }

body.page-detail .det-aside-val {
    font-size: .85rem;
    color: var(--dark);
    line-height: 1.6;
}

body.page-detail .det-tags-aside {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: .5rem;
}
body.page-detail .det-tag {
    font-size: .6rem;
    letter-spacing: .09em;
    text-transform: uppercase;
    padding: .25rem .6rem;
    border: 1px solid rgba(202,169,148,.35);
    color: var(--caramel-ink);
    border-radius: 2px;
}

/* ── GALERIA DE IMAGENS ── */
body.page-detail .det-galeria {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin: 2.5rem 0;
}

body.page-detail .det-gal-item {
    aspect-ratio: 4/3;
    border-radius: 4px;
    overflow: hidden;
    background: var(--greige);
    border: 1.5px dashed rgba(64,57,50,.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

body.page-detail .det-gal-item img {
    width: 100%; height: 100%;
    object-fit: cover;
}

body.page-detail .det-gal-ph {
    font-size: .55rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(64,57,50,.25);
    text-align: center;
    line-height: 1.9;
    padding: .5rem;
}

/* ── PROCESSO STEPS (serviço) ── */
body.page-detail .det-steps {
    counter-reset: step;
    margin: 1.5rem 0 2rem;
}

body.page-detail .det-step {
    display: flex;
    gap: 1.5rem;
    padding: 1.25rem 0;
    border-bottom: 1px solid rgba(64,57,50,.06);
    counter-increment: step;
    align-items: flex-start;
}

body.page-detail .det-step-n {
    font-family: "Bodoni Moda", serif;
    font-size: 1.5rem;
    font-weight: 700;
    font-style: italic;
    color: var(--caramel-ink);
    opacity: .4;
    min-width: 2rem;
    line-height: 1;
    padding-top: .2rem;
}

body.page-detail .det-step-body h4 {
    font-size: .88rem;
    font-weight: 500;
    color: var(--dark);
    margin-bottom: .3rem;
}

body.page-detail .det-step-body p {
    font-size: .83rem;
    color: var(--muted-ink);
    line-height: 1.7;
    margin: 0;
}

/* ── SECÇÃO CINZA (citação / destaque) ── */
body.page-detail .det-quote {
    background: var(--dark);
    padding: 4rem 0;
    margin: 4rem 0;
    position: relative;
    overflow: hidden;
}

body.page-detail .det-quote::before {
    content: "\"";
    font-family: "Bodoni Moda", serif;
    font-size: 18rem;
    color: rgba(242,221,209,.03);
    position: absolute;
    top: -3rem; left: 2rem;
    line-height: 1;
    pointer-events: none;
}

body.page-detail .det-quote blockquote {
    font-family: "Bodoni Moda", serif;
    font-size: 1.5rem;
    font-style: italic;
    color: var(--ink-on-dark);
    line-height: 1.5;
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
}

body.page-detail .det-quote blockquote em { color: var(--caramel-ink); }

/* ── NAVEGAÇÃO ENTRE PROJETOS ── */
body.page-detail .det-nav-proj {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5px;
    background: rgba(64,57,50,.06);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid rgba(64,57,50,.06);
    margin-top: 5rem;
}

body.page-detail .det-nav-item {
    background: var(--white);
    padding: 1.75rem 2rem;
    text-decoration: none;
    display: block;
    transition: background .3s;
}

body.page-detail .det-nav-item:hover { background: var(--blush); text-decoration: none; }

body.page-detail .det-nav-dir {
    font-size: .6rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(64,57,50,.35);
    margin-bottom: .4rem;
}

body.page-detail .det-nav-nome {
    font-family: "Bodoni Moda", serif;
    font-size: 1rem;
    color: var(--dark);
}

body.page-detail .det-nav-item.next { text-align: right; }

/* ── RESPONSIVO ── */
@media (max-width: 991px){
    body.page-detail .det-layout {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    body.page-detail .det-aside { position: static; }
    body.page-detail .det-galeria { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px){
    body.page-detail .det-hero { padding: 7rem 0 3.5rem; }
    body.page-detail .det-meta-row { gap: 1.5rem; }
    body.page-detail .det-galeria { grid-template-columns: 1fr; }
    body.page-detail .det-nav-proj { grid-template-columns: 1fr; }
    body.page-detail .det-img-ph { height: 240px; }
    body.page-detail .det-quote blockquote { font-size: 1.15rem; }
}

body.page-detail nav a > img { height:42px; width:auto; display:block; }
body.page-detail.dark-mode nav a > img { filter:brightness(0) invert(1) opacity(.88); }



/* ===== BRIEFING ===== */
/* ============================================================
   ADD ART DESIGN STUDIO — CSS de detalhe
   Páginas de serviço e de projeto — mesmo sistema visual
   ============================================================ */

/* ── HERO DA PÁGINA DE DETALHE ── */
body.page-briefing .det-hero {
    background: var(--dark2);
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}

body.page-briefing .det-hero::after {
    content: "";
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(to right, var(--caramel), var(--greige));
}

body.page-briefing .det-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 70% 50%, rgba(202,169,148,.06) 0%, transparent 65%);
    pointer-events: none;
}

body.page-briefing .det-back {
    font-size: .67rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(202,169,148,.5);
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: 2rem;
    text-decoration: none;
    transition: color .25s;
}
body.page-briefing .det-back:hover { color: var(--caramel-ink); text-decoration: none; }
body.page-briefing .det-back::before { content: "←"; }

body.page-briefing .det-tipo {
    font-size: .67rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--caramel-ink);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: .6rem;
}
body.page-briefing .det-tipo::after { content: ""; width: 28px; height: 1px; background: var(--caramel); }

body.page-briefing .det-titulo {
    font-family: "Bodoni Moda", serif;
    font-size: clamp(2rem, 4vw, 3.2rem);
    color: var(--ink-on-dark);
    line-height: 1.1;
    margin-bottom: 1.25rem;
}
body.page-briefing .det-titulo em { color: var(--caramel-ink); font-style: italic; }

body.page-briefing .det-sub {
    font-size: .95rem;
    color: rgba(216,210,197,.6);
    line-height: 1.8;
    max-width: 520px;
    margin-bottom: 2rem;
}

body.page-briefing .det-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(242,221,209,.08);
    margin-top: .5rem;
}
body.page-briefing .det-meta-item { }
body.page-briefing .det-meta-label {
    font-size: .6rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(202,169,148,.5);
    margin-bottom: .3rem;
}
body.page-briefing .det-meta-valor {
    font-family: "Bodoni Moda", serif;
    font-size: .95rem;
    color: var(--ink-on-dark);
}

/* ── IMAGEM PRINCIPAL ── */
body.page-briefing .det-img-principal {
    width: 100%;
    max-height: 500px;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}

body.page-briefing .det-img-ph {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 420px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    border: 1.5px dashed rgba(64,57,50,.15);
}

body.page-briefing .det-img-ph-symbol {
    font-family: "Bodoni Moda", serif;
    font-size: 5rem;
    font-weight: 700;
    font-style: italic;
    line-height: 1;
    opacity: .2;
}

body.page-briefing .det-img-ph-txt {
    font-size: .6rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(64,57,50,.3);
    text-align: center;
    line-height: 1.9;
}

/* ── CORPO DO CONTEÚDO ── */
body.page-briefing .det-body {
    padding: 5rem 0 4rem;
}

body.page-briefing .det-intro {
    font-size: 1.05rem;
    line-height: 1.85;
    color: var(--dark);
    font-weight: 400;
    max-width: 680px;
    margin-bottom: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid rgba(64,57,50,.08);
}

/* ── GRID 2 COLUNAS (texto + aside) ── */
body.page-briefing .det-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 5rem;
    align-items: start;
}

body.page-briefing .det-main h2 {
    font-family: "Bodoni Moda", serif;
    font-size: 1.6rem;
    color: var(--dark);
    margin-bottom: 1rem;
    margin-top: 2.5rem;
}
body.page-briefing .det-main h2:first-child { margin-top: 0; }

body.page-briefing .det-main h2 em { color: var(--caramel-ink); font-style: italic; }

body.page-briefing .det-main p {
    font-size: .9rem;
    line-height: 1.85;
    color: var(--muted-ink);
    margin-bottom: 1rem;
}

/* Lista com traços caramel */
body.page-briefing .det-list {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0 1.5rem;
}
body.page-briefing .det-list li {
    font-size: .88rem;
    line-height: 1.7;
    color: var(--muted-ink);
    padding: .55rem 0;
    border-bottom: 1px solid rgba(64,57,50,.06);
    display: flex;
    align-items: flex-start;
    gap: .75rem;
}
body.page-briefing .det-list li::before {
    content: "✦";
    color: var(--caramel-ink);
    font-size: .6rem;
    margin-top: .25rem;
    flex-shrink: 0;
}

/* ── ASIDE (sidebar) ── */
body.page-briefing .det-aside {
    position: sticky;
    top: 100px;
}

body.page-briefing .det-aside-card {
    background: var(--white);
    border: 1px solid rgba(64,57,50,.08);
    border-top: 3px solid var(--caramel);
    border-radius: 4px;
    padding: 2rem 1.75rem;
    margin-bottom: 1.5rem;
}

body.page-briefing .det-aside-card h3 {
    font-family: "Bodoni Moda", serif;
    font-size: 1rem;
    color: var(--dark);
    margin-bottom: 1.25rem;
}

body.page-briefing .det-aside-label {
    font-size: .6rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--caramel-ink);
    margin-bottom: .3rem;
    margin-top: 1rem;
}
body.page-briefing .det-aside-label:first-of-type { margin-top: 0; }

body.page-briefing .det-aside-val {
    font-size: .85rem;
    color: var(--dark);
    line-height: 1.6;
}

body.page-briefing .det-tags-aside {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: .5rem;
}
body.page-briefing .det-tag {
    font-size: .6rem;
    letter-spacing: .09em;
    text-transform: uppercase;
    padding: .25rem .6rem;
    border: 1px solid rgba(202,169,148,.35);
    color: var(--caramel-ink);
    border-radius: 2px;
}

/* ── GALERIA DE IMAGENS ── */
body.page-briefing .det-galeria {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin: 2.5rem 0;
}

body.page-briefing .det-gal-item {
    aspect-ratio: 4/3;
    border-radius: 4px;
    overflow: hidden;
    background: var(--greige);
    border: 1.5px dashed rgba(64,57,50,.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

body.page-briefing .det-gal-item img {
    width: 100%; height: 100%;
    object-fit: cover;
}

body.page-briefing .det-gal-ph {
    font-size: .55rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(64,57,50,.25);
    text-align: center;
    line-height: 1.9;
    padding: .5rem;
}

/* ── PROCESSO STEPS (serviço) ── */
body.page-briefing .det-steps {
    counter-reset: step;
    margin: 1.5rem 0 2rem;
}

body.page-briefing .det-step {
    display: flex;
    gap: 1.5rem;
    padding: 1.25rem 0;
    border-bottom: 1px solid rgba(64,57,50,.06);
    counter-increment: step;
    align-items: flex-start;
}

body.page-briefing .det-step-n {
    font-family: "Bodoni Moda", serif;
    font-size: 1.5rem;
    font-weight: 700;
    font-style: italic;
    color: var(--caramel-ink);
    opacity: .4;
    min-width: 2rem;
    line-height: 1;
    padding-top: .2rem;
}

body.page-briefing .det-step-body h4 {
    font-size: .88rem;
    font-weight: 500;
    color: var(--dark);
    margin-bottom: .3rem;
}

body.page-briefing .det-step-body p {
    font-size: .83rem;
    color: var(--muted-ink);
    line-height: 1.7;
    margin: 0;
}

/* ── SECÇÃO CINZA (citação / destaque) ── */
body.page-briefing .det-quote {
    background: var(--dark);
    padding: 4rem 0;
    margin: 4rem 0;
    position: relative;
    overflow: hidden;
}

body.page-briefing .det-quote::before {
    content: "\"";
    font-family: "Bodoni Moda", serif;
    font-size: 18rem;
    color: rgba(242,221,209,.03);
    position: absolute;
    top: -3rem; left: 2rem;
    line-height: 1;
    pointer-events: none;
}

body.page-briefing .det-quote blockquote {
    font-family: "Bodoni Moda", serif;
    font-size: 1.5rem;
    font-style: italic;
    color: var(--ink-on-dark);
    line-height: 1.5;
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
}

body.page-briefing .det-quote blockquote em { color: var(--caramel-ink); }

/* ── NAVEGAÇÃO ENTRE PROJETOS ── */
body.page-briefing .det-nav-proj {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5px;
    background: rgba(64,57,50,.06);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid rgba(64,57,50,.06);
    margin-top: 5rem;
}

body.page-briefing .det-nav-item {
    background: var(--white);
    padding: 1.75rem 2rem;
    text-decoration: none;
    display: block;
    transition: background .3s;
}

body.page-briefing .det-nav-item:hover { background: var(--blush); text-decoration: none; }

body.page-briefing .det-nav-dir {
    font-size: .6rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(64,57,50,.35);
    margin-bottom: .4rem;
}

body.page-briefing .det-nav-nome {
    font-family: "Bodoni Moda", serif;
    font-size: 1rem;
    color: var(--dark);
}

body.page-briefing .det-nav-item.next { text-align: right; }

/* ── RESPONSIVO ── */
@media (max-width: 991px){
    body.page-briefing .det-layout {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    body.page-briefing .det-aside { position: static; }
    body.page-briefing .det-galeria { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px){
    body.page-briefing .det-hero { padding: 7rem 0 3.5rem; }
    body.page-briefing .det-meta-row { gap: 1.5rem; }
    body.page-briefing .det-galeria { grid-template-columns: 1fr; }
    body.page-briefing .det-nav-proj { grid-template-columns: 1fr; }
    body.page-briefing .det-img-ph { height: 240px; }
    body.page-briefing .det-quote blockquote { font-size: 1.15rem; }
}

body.page-briefing nav a > img { height:42px; width:auto; display:block; }
body.page-briefing.dark-mode nav a > img { filter:brightness(0) invert(1) opacity(.88); }

/* ══ BRIEFING — estilos específicos ══ */
/* ── SELETOR DE CATEGORIA ── */
        body.page-briefing .cat-selector {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 1.5px;
            background: rgba(64,57,50,.06);
            border-radius: 6px;
            overflow: hidden;
            border: 1px solid rgba(64,57,50,.08);
            margin-bottom: 3.5rem;
        }

        body.page-briefing .cat-btn {
            background: var(--white);
            border: none;
            padding: 1.75rem 1.25rem;
            cursor: pointer;
            text-align: left;
            transition: background .3s;
            font-family: "Inter", sans-serif;
            position: relative;
        }

        body.page-briefing .cat-btn:hover { background: var(--blush); }

        body.page-briefing .cat-btn.ativo {
            background: var(--dark);
        }

        body.page-briefing .cat-btn.ativo .cat-n, body.page-briefing .cat-btn.ativo .cat-label { color:var(--blush); }
        body.page-briefing .cat-btn.ativo .cat-sub { color: var(--blush); opacity:.7; }

        body.page-briefing .cat-btn.ativo::after {
            content: "";
            position: absolute;
            bottom: 0; left: 0; right: 0;
            height: 3px;
            background: var(--caramel);
        }

        body.page-briefing .cat-n {
            font-family: "Bodoni Moda", serif;
            font-size: 1.6rem;
            font-weight: 700;
            font-style: italic;
            color: rgba(64,57,50,.12);
            line-height: 1;
            margin-bottom: .5rem;
        }

        body.page-briefing .cat-label {
            font-size: .8rem;
            font-weight: 500;
            color: var(--dark);
            display: block;
            margin-bottom: .25rem;
        }

        body.page-briefing .cat-sub {
            font-size: .68rem;
            letter-spacing: .06em;
            color:var(--muted-ink);
        }

        /* ── FORMULÁRIO ── */
        body.page-briefing .bf-section { display: none; }
        body.page-briefing .bf-section.visivel { display: block; animation: fadeIn .35s ease; }

        @keyframes fadeIn{
            from { opacity: 0; transform: translateY(10px); }
            to   { opacity: 1; transform: translateY(0); }
        }

        body.page-briefing .bf-grupo {
            margin-bottom: 1.75rem;
        }

        body.page-briefing .bf-label {
            font-size: .72rem;
            font-weight: 500;
            letter-spacing: .1em;
            text-transform: uppercase;
            color: var(--dark);
            display: block;
            margin-bottom: .6rem;
        }

        body.page-briefing .bf-label .obrig {
            color:var(--caramel-ink);
            margin-left: .2rem;
        }

        body.page-briefing .bf-label .dica {
            font-size: .65rem;
            letter-spacing: 0;
            text-transform: none;
            font-weight: 400;
            color:var(--muted-ink);
            margin-left: .5rem;
        }

        body.page-briefing .bf-input, body.page-briefing .bf-textarea, body.page-briefing .bf-select {
            width: 100%;
            background: var(--white);
            border: 1.5px solid rgba(64,57,50,.15);
            border-radius: 3px;
            padding: .85rem 1rem;
            font-size: .88rem;
            font-family: "Inter", sans-serif;
            color: var(--dark);
            transition: border-color .25s, box-shadow .25s;
            appearance: none;
        }

        body.page-briefing .bf-input:focus, body.page-briefing .bf-textarea:focus, body.page-briefing .bf-select:focus {
            outline: none;
            border-color:var(--caramel-ink);
            box-shadow: 0 0 0 3px rgba(202,169,148,.15);
        }

        body.page-briefing .bf-textarea { resize: vertical; min-height: 110px; }

        body.page-briefing .bf-select {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23CAA994' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
            background-repeat: no-repeat;
            background-position: right 1rem center;
            background-size: 12px;
            padding-right: 2.5rem;
            cursor: pointer;
        }

        /* Checkboxes / radio */
        body.page-briefing .bf-opcoes {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
        }

        body.page-briefing .bf-opc {
            display: none;
        }

        body.page-briefing .bf-opc-label {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem 1rem;
            border: 1.5px solid rgba(64,57,50,.15);
            border-radius: 2px;
            font-size: .75rem;
            font-weight: 500;
            letter-spacing: .04em;
            color:var(--muted-ink);
            cursor: pointer;
            transition: all .2s;
            user-select: none;
        }

        body.page-briefing .bf-opc:checked + .bf-opc-label {
            border-color:var(--caramel-ink);
            color: var(--dark);
            background: rgba(202,169,148,.08);
        }

        body.page-briefing .bf-opc-label:hover {
            border-color:var(--caramel-ink);
            color: var(--dark);
        }

        /* Grid 2 colunas */
        body.page-briefing .bf-row-2 {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1.25rem;
        }

        /* Divisor de secção */
        body.page-briefing .bf-div {
            font-size: .65rem;
            letter-spacing: .2em;
            text-transform: uppercase;
            color:var(--caramel-ink);
            display: flex;
            align-items: center;
            gap: .75rem;
            margin: 2.5rem 0 1.75rem;
        }
        body.page-briefing .bf-div::before, body.page-briefing .bf-div::after {
            content: "";
            flex: 1;
            height: 1px;
            background: rgba(64,57,50,.08);
        }

        /* Botão enviar */
        body.page-briefing .bf-enviar {
            background: var(--dark);
            color: var(--offwhite);
            border: none;
            padding: 1rem 2.5rem;
            border-radius: 3px;
            font-family: "Inter", sans-serif;
            font-size: .8rem;
            font-weight: 500;
            letter-spacing: .12em;
            text-transform: uppercase;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            gap: .6rem;
            transition: all .3s;
            margin-top: .5rem;
        }

        body.page-briefing .bf-enviar:hover {
            background: var(--dark2);
            transform: translateY(-2px);
            box-shadow: 0 8px 24px rgba(64,57,50,.2);
        }

        body.page-briefing .bf-nota {
            font-size: .75rem;
            color:var(--muted-ink);
            margin-top: 1rem;
            line-height: 1.7;
            display: flex;
            align-items: flex-start;
            gap: .5rem;
        }
        body.page-briefing .bf-nota::before { content: "✦"; color:var(--caramel-ink); font-size: .55rem; margin-top: .25rem; flex-shrink: 0; }

        /* Info lateral */
        body.page-briefing .bf-aside-info {
            background: var(--dark2);
            border-top: 3px solid var(--caramel);
            border-radius: 4px;
            padding: 2rem 1.75rem;
            margin-bottom: 1.5rem;
        }

        body.page-briefing .bf-aside-info h3 {
            font-family: "Bodoni Moda", serif;
            font-size: 1rem;
            color:var(--ink-on-dark);
            margin-bottom: 1.25rem;
        }

        body.page-briefing .bf-paso {
            display: flex;
            gap: .85rem;
            margin-bottom: 1.25rem;
            align-items: flex-start;
        }

        body.page-briefing .bf-paso-n {
            font-family: "Bodoni Moda", serif;
            font-size: 1.2rem;
            font-style: italic;
            color:var(--caramel-ink);
            opacity: .5;
            min-width: 1.5rem;
            line-height: 1.1;
        }

        body.page-briefing .bf-paso-txt h4 {
            font-size: .82rem;
            font-weight: 500;
            color:var(--ink-on-dark);
            margin-bottom: .2rem;
        }

        body.page-briefing .bf-paso-txt p {
            font-size: .75rem;
            color: rgba(216,210,197,.5);
            line-height: 1.6;
            margin: 0;
        }

        body.page-briefing .bf-aside-garantia {
            background: var(--white);
            border: 1px solid rgba(64,57,50,.08);
            border-top: 3px solid var(--caramel);
            border-radius: 4px;
            padding: 1.75rem;
        }

        body.page-briefing .bf-aside-garantia h3 {
            font-family: "Bodoni Moda", serif;
            font-size: 1rem;
            color: var(--dark);
            margin-bottom: 1rem;
        }

        body.page-briefing .bf-garantia-item {
            font-size: .8rem;
            color:var(--muted-ink);
            padding: .5rem 0;
            border-bottom: 1px solid rgba(64,57,50,.06);
            display: flex;
            align-items: center;
            gap: .6rem;
            line-height: 1.5;
        }
        body.page-briefing .bf-garantia-item:last-child { border: none; }
        body.page-briefing .bf-garantia-item::before { content: "✦"; color:var(--caramel-ink); font-size: .55rem; flex-shrink: 0; }

        /* Responsivo */
        @media (max-width: 767px){
            body.page-briefing .cat-selector { grid-template-columns: repeat(2, 1fr); }
            body.page-briefing .bf-row-2 { grid-template-columns: 1fr; }
        }

        @media (max-width: 400px){
            body.page-briefing .cat-selector { grid-template-columns: 1fr; }
        }


/* ══════════ CATEGORIAS DO BRIEFING — contraste garantido ══════════ */
/* Modo claro: cartão neutro, hover suave e seleção escura. */
body.page-briefing .cat-btn {
    background: #FBF7F2;
    color: #403932;
}
body.page-briefing .cat-btn .cat-label {
    color: #403932 !important;
    font-weight: 650 !important;
}
body.page-briefing .cat-btn .cat-sub {
    color: #6E4A32 !important;
    opacity: 1 !important;
}
body.page-briefing .cat-btn .cat-n {
    color: rgba(64,57,50,.42) !important;
}
body.page-briefing .cat-btn:hover,
body.page-briefing .cat-btn:focus-visible {
    background: #F2DDD1;
}
body.page-briefing .cat-btn:hover .cat-label,
body.page-briefing .cat-btn:focus-visible .cat-label {
    color: #2E2620 !important;
}
body.page-briefing .cat-btn:hover .cat-sub,
body.page-briefing .cat-btn:focus-visible .cat-sub {
    color: #68442F !important;
}
body.page-briefing .cat-btn:hover .cat-n,
body.page-briefing .cat-btn:focus-visible .cat-n {
    color: #9A7259 !important;
}
body.page-briefing .cat-btn.ativo,
body.page-briefing .cat-btn.ativo:hover,
body.page-briefing .cat-btn.ativo:focus-visible {
    background: #403932;
}
body.page-briefing .cat-btn.ativo .cat-label {
    color: #FFF8F3 !important;
}
body.page-briefing .cat-btn.ativo .cat-sub {
    color: #E8CDBD !important;
    opacity: 1 !important;
}
body.page-briefing .cat-btn.ativo .cat-n {
    color: #D8B69F !important;
}

/* Modo escuro: texto claro nos cartões e seleção creme com texto escuro. */
body.page-briefing.dark-mode .cat-selector {
    background: #2A201B;
    border-color: rgba(226,197,143,.30);
}
body.page-briefing.dark-mode .cat-btn {
    background: #40322B;
    border-right: 1px solid rgba(242,231,224,.14);
}
body.page-briefing.dark-mode .cat-btn:last-child {
    border-right: 0;
}
body.page-briefing.dark-mode .cat-btn .cat-label {
    color: #FFF7F0 !important;
    text-shadow: 0 1px 0 rgba(0,0,0,.18);
}
body.page-briefing.dark-mode .cat-btn .cat-sub {
    color: #E4BEA7 !important;
    opacity: 1 !important;
}
body.page-briefing.dark-mode .cat-btn .cat-n {
    color: #C9A071 !important;
    opacity: .72;
}
body.page-briefing.dark-mode .cat-btn:hover,
body.page-briefing.dark-mode .cat-btn:focus-visible {
    background: #594438;
}
body.page-briefing.dark-mode .cat-btn:hover .cat-label,
body.page-briefing.dark-mode .cat-btn:focus-visible .cat-label {
    color: #FFFFFF !important;
}
body.page-briefing.dark-mode .cat-btn:hover .cat-sub,
body.page-briefing.dark-mode .cat-btn:focus-visible .cat-sub {
    color: #F1CB91 !important;
}
body.page-briefing.dark-mode .cat-btn:hover .cat-n,
body.page-briefing.dark-mode .cat-btn:focus-visible .cat-n {
    color: #E2C58F !important;
    opacity: 1;
}
body.page-briefing.dark-mode .cat-btn.ativo,
body.page-briefing.dark-mode .cat-btn.ativo:hover,
body.page-briefing.dark-mode .cat-btn.ativo:focus-visible {
    background: #F2DDD1;
}
body.page-briefing.dark-mode .cat-btn.ativo .cat-label {
    color: #241A16 !important;
    text-shadow: none;
}
body.page-briefing.dark-mode .cat-btn.ativo .cat-sub {
    color: #68442F !important;
    opacity: 1 !important;
}
body.page-briefing.dark-mode .cat-btn.ativo .cat-n {
    color: #8A6042 !important;
    opacity: 1;
}
body.page-briefing .cat-btn:focus-visible {
    outline: 3px solid #D6B06F;
    outline-offset: -3px;
    z-index: 1;
}


/* ===== PORTEFÓLIO ===== */
/* ══ PÁGINA INTRO ══ */
body.page-portfolio .page-intro {
    background: var(--dark2);
    padding: 8rem 0 4rem;
    position: relative; overflow: hidden;
}
body.page-portfolio.dark-mode .page-intro { background: #0D1217; }
body.page-portfolio .page-intro::after {
    content: ""; position: absolute; bottom: 0; left: 0; right: 0;
    height: 3px; background: linear-gradient(to right, var(--caramel), var(--greige));
}
body.page-portfolio .s-eye {
    font-size: .67rem; letter-spacing: .2em; text-transform: uppercase;
    color: var(--caramel-ink); margin-bottom: .9rem;
    display: flex; align-items: center; gap: .6rem;
}
body.page-portfolio .s-eye::after { content: ""; width: 28px; height: 1px; background: var(--caramel); }
body.page-portfolio .s-h { font-family: var(--font-d); font-size: 2.5rem; color: var(--dark); line-height: 1.12; margin-bottom: .75rem; }
body.page-portfolio .s-h em { color: var(--caramel-ink); font-style: italic; }
body.page-portfolio .page-intro .s-h { color: var(--ink-on-dark); font-size: 3rem; }
body.page-portfolio .s-sub { font-size: .9rem; color: var(--muted-ink); line-height: 1.7; max-width: 480px; }
body.page-portfolio .page-intro .s-sub { color: rgba(216, 210, 197, .78); }

/* ══ FILTROS ══ */
body.page-portfolio .filtros {
    display: flex; flex-wrap: wrap; gap: .5rem;
    margin: 2.5rem 0 0;
}
body.page-portfolio .filtro-btn {
    background: transparent;
    border: 1px solid var(--border-medium);
    color: var(--muted-ink);
    padding: .4rem 1.1rem; border-radius: 2px;
    font-size: .7rem; font-weight: 500;
    letter-spacing: .08em; text-transform: uppercase;
    cursor: pointer; transition: all var(--t);
    font-family: var(--font-b);
}
body.page-portfolio .filtro-btn:hover, body.page-portfolio .filtro-btn.ativo {
    background: var(--dark); border-color: var(--dark); color: var(--offwhite);
}

/* ══ GRID DE PROJETOS ══ */
body.page-portfolio .portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: dense;
    gap: 1.5px;
    background: var(--border-soft);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--border-soft);
    margin-top: 2rem;
}

/* ══ CARD DE PROJETO ══ */
body.page-portfolio .proj-card {
    background: var(--white);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: background .4s;
    cursor: pointer;
}

/* Paleta de cores que cicla no card ao clicar */
body.page-portfolio .proj-card.cor-0 { background: var(--white); }
body.page-portfolio .proj-card.cor-1 { background: var(--blush); }
body.page-portfolio .proj-card.cor-2 { background: var(--greige); }
body.page-portfolio .proj-card.cor-3 { background: var(--caramel); }
body.page-portfolio .proj-card.cor-3 .proj-title, body.page-portfolio .proj-card.cor-3 .proj-cat { color: var(--white); }
body.page-portfolio .proj-card.cor-3 .proj-desc { color: rgba(255,255,255,.7); }
body.page-portfolio .proj-card.cor-3 .proj-tag { border-color: rgba(255,255,255,.4); color: var(--white); }

body.page-portfolio .proj-card:hover .proj-arr { opacity: 1; transform: translateX(0); }

/* ── Área de imagem ── */
body.page-portfolio .proj-img-wrap {
    width: 100%; height: 200px;
    border-bottom: 1.5px solid var(--border-soft);
    overflow: hidden; position: relative;
    transition: border-color var(--t);
}
body.page-portfolio .proj-card.destaque .proj-img-wrap { height: 280px; }
body.page-portfolio .proj-card.destaque { grid-column: span 2; }
body.page-portfolio .proj-card.destaque .proj-title { font-size: 1.45rem; }

/* Imagens do carrossel */
body.page-portfolio .proj-img-wrap img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    opacity: 0;
    transition: opacity .45s ease, transform .5s ease;
}
body.page-portfolio .proj-img-wrap img.ativa { opacity: 1; position: relative; }
body.page-portfolio .proj-card:hover .proj-img-wrap img.ativa { transform: scale(1.04); }

/* Placeholder — cor sólida sem texto */
body.page-portfolio .proj-ph {
    position: absolute; inset: 0;
    z-index: 0;
}

/* Dots do carrossel */
body.page-portfolio .proj-dots {
    position: absolute; bottom: 8px; left: 50%;
    transform: translateX(-50%);
    display: flex; gap: 5px; z-index: 2;
}
body.page-portfolio .proj-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: rgba(255, 255, 255, .45);
    cursor: pointer; transition: background .25s, transform .25s;
}
body.page-portfolio .proj-dot.ativa { background: var(--caramel); transform: scale(1.3); }

/* ── Corpo do card ── */
body.page-portfolio .proj-body { padding: 1.75rem 2rem 2rem; display: flex; flex-direction: column; flex: 1; }
body.page-portfolio .proj-num {
    font-family: var(--font-d); font-size: 2.5rem; font-weight: 700;
    color: rgba(64, 57, 50, .04); position: absolute; top: .4rem; right: 1rem;
    line-height: 1; pointer-events: none; user-select: none;
}
body.page-portfolio .proj-cat {
    font-size: .62rem; letter-spacing: .15em; text-transform: uppercase;
    color: var(--caramel-ink); margin-bottom: .5rem;
    display: flex; align-items: center; gap: .4rem;
    transition: color .4s;
}
body.page-portfolio .proj-cat::before { content: ""; width: 14px; height: 1px; background: var(--caramel); }
body.page-portfolio .proj-title {
    font-family: var(--font-d); font-size: 1.15rem;
    color: var(--dark); margin-bottom: .55rem; line-height: 1.25;
    transition: color .4s;
}
body.page-portfolio .proj-desc {
    font-size: .83rem; line-height: 1.75; color: var(--muted-ink);
    margin-bottom: 1rem; flex: 1; transition: color .4s;
}
body.page-portfolio .proj-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
body.page-portfolio .proj-tag {
    font-size: .6rem; letter-spacing: .09em; text-transform: uppercase;
    padding: .25rem .6rem; border: 1px solid var(--border-caramel);
    color: var(--caramel-ink); border-radius: 2px; transition: all .4s;
}
body.page-portfolio .proj-arr {
    font-size: .7rem; letter-spacing: .1em; text-transform: uppercase;
    color: var(--dark); opacity: 0; transform: translateX(-8px);
    transition: all .3s; display: inline-flex; align-items: center;
    gap: .4rem; text-decoration: none; margin-top: auto;
}
body.page-portfolio .proj-arr:hover { color: var(--caramel-ink); text-decoration: none; }

/* ══ FORMULÁRIO-HERO — elemento principal da página ══ */
body.page-portfolio .form-hero {
    background: var(--dark2);
    padding: 8rem 0 5rem;
    position: relative;
    overflow: hidden;
}
body.page-portfolio.dark-mode .form-hero { background: #0D1217; }
body.page-portfolio .form-hero::after {
    content: ""; position: absolute; bottom: 0; left: 0; right: 0;
    height: 3px; background: linear-gradient(to right, var(--caramel), var(--greige));
}

/* Frase inspiradora — muda dinamicamente */
body.page-portfolio .frase-topo {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 3rem;
}
body.page-portfolio .frase-topo p {
    font-family: var(--font-d);
    font-size: 1.3rem;
    font-style: italic;
    color: var(--ink-on-dark);
    line-height: 1.5;
    margin-bottom: .6rem;
    min-height: 2.4rem;
    transition: opacity .4s;
}
body.page-portfolio .frase-topo span {
    font-size: .72rem;
    letter-spacing: .1em;
    color: var(--caramel-ink);
}

/* Container do formulário grande */
body.page-portfolio .form-cartao-grid {
    max-width: 980px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 2rem;
    align-items: start;
}

body.page-portfolio .form-principal {
    background: var(--white);
    border-radius: 10px;
    padding: 3rem 3.5rem;
    border-top: 4px solid var(--caramel);
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
    transition: background .5s, box-shadow .5s;
}
body.page-portfolio.dark-mode .form-principal {
    background: #1c2530;
    box-shadow: 0 20px 60px rgba(0,0,0,.5);
}

/* Tema do formulário muda com a cor escolhida — classes aplicadas via JS */
body.page-portfolio .form-principal.tema-creme { background: #F5EFE6; }
body.page-portfolio .form-principal.tema-bege { background: #EFE3D3; }
body.page-portfolio .form-principal.tema-cinza { background: #E8E8E6; }
body.page-portfolio .form-principal.tema-petroleo { background: #1B2E35; }
body.page-portfolio .form-principal.tema-petroleo .form-label, body.page-portfolio .form-principal.tema-petroleo .form-titulo { color: var(--ink-on-dark); }
body.page-portfolio .form-principal.tema-escuro { background: #232323; }
body.page-portfolio .form-principal.tema-escuro .form-label, body.page-portfolio .form-principal.tema-escuro .form-titulo { color: var(--ink-on-dark); }

body.page-portfolio .form-titulo {
    font-family: var(--font-d);
    font-size: 1.5rem;
    color: var(--dark);
    text-align: center;
    margin-bottom: .5rem;
}
body.page-portfolio .form-subtitulo {
    font-size: .82rem;
    color: var(--muted-ink);
    text-align: center;
    margin-bottom: 2.5rem;
}

body.page-portfolio .form-grid-principal {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}
body.page-portfolio .form-grupo-p { display: flex; flex-direction: column; gap: .5rem; }
body.page-portfolio .form-grupo-p.full { grid-column: span 2; }

body.page-portfolio .form-label {
    font-size: .7rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--dark);
    font-weight: 500;
}

body.page-portfolio .form-input-p, body.page-portfolio .form-select-p, body.page-portfolio .form-textarea-p {
    width: 100%;
    padding: .95rem 1.15rem;
    border: 1.5px solid var(--border-medium);
    border-radius: 5px;
    font-size: .92rem;
    font-family: var(--font-b);
    color: var(--dark);
    background: var(--offwhite);
    transition: border-color var(--t), box-shadow var(--t);
}
body.page-portfolio .form-input-p:focus, body.page-portfolio .form-select-p:focus, body.page-portfolio .form-textarea-p:focus {
    outline: none;
    border-color: var(--caramel-ink);
    box-shadow: 0 0 0 4px rgba(202,169,148,.15);
}
body.page-portfolio .form-textarea-p { resize: vertical; min-height: 90px; }

body.page-portfolio .form-input-p[type="color"] { height: 50px; padding: 4px 6px; cursor: pointer; }

body.page-portfolio .form-acoes {
    display: flex;
    gap: .85rem;
    margin-top: 1rem;
    flex-wrap: wrap;
}

body.page-portfolio .btn-atualizar {
    flex: 1;
    min-width: 220px;
    background: var(--dark);
    color: var(--offwhite);
    border: none;
    padding: 1.1rem 2rem;
    border-radius: 5px;
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    font-family: var(--font-b);
    transition: all .3s;
}
body.page-portfolio .btn-atualizar:hover {
    background: var(--caramel);
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(202,169,148,.35);
}

body.page-portfolio .btn-inspiracao {
    background: transparent;
    border: 1.5px solid var(--caramel);
    color: var(--caramel-ink);
    padding: 1.1rem 1.75rem;
    border-radius: 5px;
    font-size: .85rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    cursor: pointer;
    font-family: var(--font-b);
    transition: all .3s;
    white-space: nowrap;
}
body.page-portfolio .btn-inspiracao:hover { background: var(--caramel); color: var(--white); }

/* Barra de progresso ao carregar imagem da API */
body.page-portfolio .barra-progresso {
    height: 3px;
    background: var(--border-soft);
    border-radius: 3px;
    overflow: hidden;
    margin-top: 1rem;
    display: none;
}
body.page-portfolio .barra-progresso.ativa { display: block; }
body.page-portfolio .barra-progresso-fill {
    height: 100%;
    width: 0%;
    background: var(--caramel);
    transition: width .3s ease;
}

/* ══ CARTÃO DE PERFIL — aparece após "Atualizar Perfil" ══ */
body.page-portfolio .cartao-perfil {
    max-width: 100%;
    margin: 0;
    background: var(--white);
    border-radius: 10px;
    padding: 2.5rem;
    border: 1px solid var(--border-soft);
    border-top: 4px solid var(--caramel);
    display: none;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .6s ease, transform .6s ease, background .5s, border-color .5s;
    position: sticky;
    top: 100px;
}
body.page-portfolio .cartao-perfil.visivel {
    display: block;
    opacity: 1;
    transform: translateY(0);
}
body.page-portfolio.dark-mode .cartao-perfil { background: #1c2530; }

/* Estado vazio do cartão — antes de submeter, mostra um placeholder convidativo */
body.page-portfolio .cartao-vazio {
    max-width: 100%;
    background: rgba(255,255,255,.06);
    border: 1.5px dashed var(--border-medium);
    border-radius: 10px;
    padding: 3rem 2rem;
    text-align: center;
    color: rgba(216,210,197,.5);
}
body.page-portfolio .cartao-vazio p { font-size: .85rem; line-height: 1.7; }
body.page-portfolio .cartao-vazio.escondido { display: none; }

body.page-portfolio .cartao-topo {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
    border-bottom: 1px solid var(--border-soft);
}
body.page-portfolio .cartao-foto {
    width: 84px; height: 84px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--caramel);
    flex-shrink: 0;
    transition: transform .5s;
}
body.page-portfolio .cartao-foto.entrada { animation: fotoEntra .6s ease; }
@keyframes fotoEntra{
    from { opacity: 0; transform: scale(.7) rotate(-8deg); }
    to   { opacity: 1; transform: scale(1) rotate(0); }
}
body.page-portfolio .cartao-nome { font-family: var(--font-d); font-size: 1.3rem; color: var(--dark); margin-bottom: .2rem; }
body.page-portfolio .cartao-email { font-size: .78rem; color: var(--muted-ink); }

body.page-portfolio .cartao-linha {
    display: flex;
    justify-content: space-between;
    padding: .85rem 0;
    border-bottom: 1px solid var(--border-soft);
    font-size: .85rem;
}
body.page-portfolio .cartao-linha:last-child { border: none; }
body.page-portfolio .cartao-linha-label { color: var(--muted-ink); letter-spacing: .04em; }
body.page-portfolio .cartao-linha-valor { color: var(--dark); font-weight: 500; text-align: right; }

/* Imagem de inspiração — vinda da API */
body.page-portfolio .cartao-inspiracao {
    margin-top: 1.75rem;
    padding-top: 1.75rem;
    border-top: 1px solid var(--border-soft);
}
body.page-portfolio .cartao-inspiracao-label {
    font-size: .65rem;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--caramel-ink);
    margin-bottom: .75rem;
}
body.page-portfolio #imgInspiracao {
    width: 100%;
    max-height: 280px;
    object-fit: cover;
    border-radius: 6px;
    transition: opacity .5s;
}
body.page-portfolio .cartao-inspiracao-credito {
    font-size: .68rem;
    color: var(--muted-ink);
    margin-top: .5rem;
    font-style: italic;
}



/* ══ NOTA EXPLICATIVA — pequena, acima do portfólio ══ */
body.page-portfolio .nota-demo {
    background: var(--offwhite);
    padding: 3.5rem 0 1rem;
    text-align: center;
}
body.page-portfolio .nota-demo p {
    font-size: .9rem;
    color: var(--dark);
    max-width: 520px;
    margin: 0 auto;
    line-height: 1.75;
}
body.page-portfolio .nota-demo strong { color: var(--caramel-ink); }

body.page-portfolio .seta-scroll {
    margin-top: 1.5rem;
    font-size: 1.4rem;
    color: var(--caramel-ink);
    animation: setaFlutua 1.8s ease-in-out infinite;
}
@keyframes setaFlutua{
    0%, 100% { transform: translateY(0); opacity: .5; }
    50%      { transform: translateY(8px); opacity: 1; }
}

/* Lista de hobbies — dentro do cartão de perfil */
body.page-portfolio #listaHobbies {
    list-style: none;
    padding: 0;
}
body.page-portfolio #listaHobbies li {
    padding: .45rem 0;
    border-bottom: 1px solid var(--border-soft);
    font-size: .85rem;
    color: var(--dark);
    display: flex;
    align-items: center;
    gap: .5rem;
}
body.page-portfolio #listaHobbies li::before { content: "✦"; color: var(--caramel-ink); font-size: .55rem; }

/* Feedback global */
body.page-portfolio #js-feedback {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: var(--dark);
    color: var(--offwhite);
    padding: .85rem 1.75rem;
    border-radius: 30px;
    font-size: .78rem;
    letter-spacing: .04em;
    z-index: 5000;
    opacity: 0;
    transition: opacity .3s, transform .3s;
    pointer-events: none;
    box-shadow: 0 10px 30px rgba(0,0,0,.2);
}
body.page-portfolio #js-feedback.visivel {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}


/* ══ FORMULÁRIO ══ */
body.page-portfolio .form-section {
    background: var(--blush);
    padding: 5rem 0;
}
body.page-portfolio.dark-mode .form-section { background: var(--dark2); }

body.page-portfolio .form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
body.page-portfolio .form-grupo { display: flex; flex-direction: column; gap: .4rem; }
body.page-portfolio .form-grupo.full { grid-column: span 2; }

body.page-portfolio .form-label {
    font-size: .68rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--dark);
    font-weight: 500;
}

body.page-portfolio .form-input, body.page-portfolio .form-select, body.page-portfolio .form-textarea {
    width: 100%;
    padding: .75rem 1rem;
    border: 1.5px solid var(--border-medium);
    border-radius: 3px;
    font-size: .88rem;
    font-family: var(--font-b);
    color: var(--dark);
    background: var(--white);
    transition: border-color var(--t), box-shadow var(--t);
}
body.page-portfolio .form-input:focus, body.page-portfolio .form-select:focus, body.page-portfolio .form-textarea:focus {
    outline: none;
    border-color: var(--caramel-ink);
    box-shadow: 0 0 0 3px rgba(202, 169, 148, .15);
}
body.page-portfolio .form-textarea { resize: vertical; min-height: 100px; }

body.page-portfolio .btn-submit {
    background: var(--dark);
    color: var(--offwhite);
    border: none;
    padding: .85rem 2.5rem;
    border-radius: 2px;
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    font-family: var(--font-b);
    transition: background var(--t), transform var(--t);
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}
body.page-portfolio .btn-submit:hover { background: var(--dark2); transform: translateY(-2px); }

/* ══ MODAL FRASE ══ */
body.page-portfolio #modal-frase {
    position: fixed; inset: 0; z-index: 9000;
    display: none; align-items: center; justify-content: center;
    background: rgba(26, 20, 16, .88);
    backdrop-filter: blur(8px);
    cursor: pointer;
}
body.page-portfolio #modal-frase.aberto { display: flex; }

body.page-portfolio .modal-caixa {
    background: #1c2530;
    border-radius: 6px;
    padding: 3rem 2.75rem;
    max-width: 520px; width: 90%;
    border-top: 3px solid var(--caramel);
    text-align: center;
    cursor: default;
    animation: modalEntrar .35s ease;
}
@keyframes modalEntrar{
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
body.page-portfolio .modal-label {
    font-size: .6rem; letter-spacing: .2em; text-transform: uppercase;
    color: var(--caramel-ink); margin-bottom: 1.5rem;
}
body.page-portfolio #modal-texto {
    font-family: var(--font-d); font-size: 1.2rem; font-style: italic;
    color: var(--ink-on-dark); line-height: 1.55; margin-bottom: .75rem;
}
body.page-portfolio #modal-autor {
    font-size: .75rem; color: var(--caramel-ink);
    letter-spacing: .08em; display: block; margin-bottom: 1.5rem;
}
body.page-portfolio .modal-sep { width: 32px; height: 1px; background: var(--caramel); margin: 0 auto 1.5rem; opacity: .4; }
body.page-portfolio .modal-btn-ok {
    background: var(--caramel); color: #1c2530;
    border: none; padding: .6rem 1.75rem; border-radius: 2px;
    font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
    cursor: pointer; font-family: var(--font-b); font-weight: 500;
    transition: background var(--t); margin-right: .5rem;
}
body.page-portfolio .modal-btn-ok:hover { background: #b8947e; }
body.page-portfolio .modal-btn-fechar {
    background: transparent; border: 1px solid rgba(202, 169, 148, .3);
    color: rgba(216, 210, 197, .5); padding: .6rem 1.25rem; border-radius: 2px;
    font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
    cursor: pointer; font-family: var(--font-b); transition: all var(--t);
}
body.page-portfolio .modal-btn-fechar:hover { border-color: var(--caramel-ink); color: var(--caramel-ink); }

/* ══════════ AJUSTES V23 — portefólio ══════════ */
/* Contraste real entre os estados dos cards no modo escuro */
body.page-portfolio.dark-mode .proj-card.cor-0 { background: #332B24; }
body.page-portfolio.dark-mode .proj-card.cor-1 { background: #402E27; }
body.page-portfolio.dark-mode .proj-card.cor-2 { background: #51463D; }
body.page-portfolio.dark-mode .proj-card.cor-3 { background: var(--caramel); }

body.page-portfolio.dark-mode .proj-card.cor-0 .proj-title, body.page-portfolio.dark-mode .proj-card.cor-1 .proj-title, body.page-portfolio.dark-mode .proj-card.cor-2 .proj-title, body.page-portfolio.dark-mode .proj-card.cor-0 .proj-cat, body.page-portfolio.dark-mode .proj-card.cor-1 .proj-cat, body.page-portfolio.dark-mode .proj-card.cor-2 .proj-cat { color: var(--ink-on-dark); }

body.page-portfolio.dark-mode .proj-card.cor-0 .proj-desc, body.page-portfolio.dark-mode .proj-card.cor-1 .proj-desc, body.page-portfolio.dark-mode .proj-card.cor-2 .proj-desc { color: rgba(242,221,209,.76); }

body.page-portfolio.dark-mode .proj-card.cor-0 .proj-tag, body.page-portfolio.dark-mode .proj-card.cor-1 .proj-tag, body.page-portfolio.dark-mode .proj-card.cor-2 .proj-tag {
    color: var(--caramel);
    border-color: rgba(202,169,148,.55);
}

/* portfolio.css é carregado depois de style.css: manter aqui o tamanho final */
body.page-portfolio nav a > img {
    height: 58px;
    width: auto;
    max-width: 210px;
    object-fit: contain;
}

@media (max-width: 991px){
    body.page-portfolio .proj-card {
        cursor: pointer;
        -webkit-tap-highlight-color: rgba(202,169,148,.18);
    }

    body.page-portfolio .proj-arr {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 575px){
    body.page-portfolio nav a > img {
        height: 50px;
        max-width: 175px;
    }
}


/* ══════════ AJUSTES V25 — modo escuro mais claro + dourado editorial ══════════ */
body.dark-mode {
    /* Texto */
    --dark:        #F4E9E2;
    --muted-ink:   #D3C2B7;
    --ink-on-dark: #F8EEE8;

    /* Acentos */
    --caramel:     #D2AE91;
    --caramel-ink: #D8B69F;
    --gold:        #D6B06F;
    --gold-soft:   #E2C58F;

    /* Fundos e superfícies — progressão mais clara */
    --offwhite:    #241A16;
    --dark2:       #2C211C;
    --blush:       #342822;
    --white:       #40322B;
    --greige:      #5B4A40;
    --muted:       #A99689;

    /* Bordas */
    --border-soft:    rgba(244,233,226,.12);
    --border-medium:  rgba(244,233,226,.24);
    --border-caramel: rgba(214,176,111,.58);
}

/* Fundo geral e superfícies com separação visível */
body.dark-mode {
    background: var(--offwhite);
}
body.dark-mode nav {
    background: rgba(36,26,22,.94);
    border-bottom-color: var(--border-medium);
}
body.dark-mode .svc-card,
body.dark-mode .ct-card,
body.dark-mode .val-card,
body.dark-mode .proc-card,
body.dark-mode .ct-caixa,
body.dark-mode .v-2 {
    background: var(--white);
    border-color: var(--border-medium);
}
body.dark-mode .svc-card:hover,
body.dark-mode .ct-card:hover,
body.dark-mode .val-card:hover,
body.dark-mode .proc-card:hover {
    background: var(--blush);
    border-color: var(--border-caramel);
}
body.dark-mode .process-section,
body.dark-mode .split-section,
body.dark-mode .page-intro,
body.dark-mode .cta-s {
    background: var(--dark2);
}
body.dark-mode footer {
    background: #1B1411;
}

/* Dourado editorial: apenas destaques, não todos os títulos */
body.dark-mode .s-h em,
body.dark-mode .hero-h em,
body.dark-mode .cta-h em,
body.dark-mode .page-intro .s-h em,
body.dark-mode .det-hero em,
body.dark-mode .proj-title em,
body.dark-mode .sp-h em {
    color: var(--gold);
}
body.dark-mode .s-eye,
body.dark-mode .eyebrow,
body.dark-mode .lang-tag,
body.dark-mode .proc-n,
body.dark-mode .ct-type,
body.dark-mode .sp-tag,
body.dark-mode .proj-cat,
body.dark-mode .modal-label {
    color: var(--gold-soft);
}
body.dark-mode .s-eye::after,
body.dark-mode .eyebrow::before,
body.dark-mode .lang-tag::before,
body.dark-mode .sp-tag::before,
body.dark-mode .proc-line {
    background-color: var(--gold);
}

/* Títulos principais claros; dourado apenas em palavras de destaque */
body.dark-mode .s-h,
body.dark-mode .hero-h,
body.dark-mode .svc-title,
body.dark-mode .ct-title,
body.dark-mode .val-title,
body.dark-mode .proc-title,
body.dark-mode .proj-title,
body.dark-mode .sp-h,
body.dark-mode .cta-h {
    color: var(--dark);
}

/* Texto secundário confortável */
body.dark-mode .s-sub,
body.dark-mode .hero-p,
body.dark-mode .svc-desc,
body.dark-mode .ct-desc,
body.dark-mode .val-desc,
body.dark-mode .proc-desc,
body.dark-mode .about-p,
body.dark-mode .proj-desc {
    color: var(--muted-ink);
}

/* Portefólio: cartões distintos mas integrados na nova paleta */
body.page-portfolio.dark-mode .proj-card.cor-0 { background: #3A2D27; }
body.page-portfolio.dark-mode .proj-card.cor-1 { background: #46352E; }
body.page-portfolio.dark-mode .proj-card.cor-2 { background: #58463B; }
body.page-portfolio.dark-mode .proj-card.cor-3 { background: var(--gold); }
body.page-portfolio.dark-mode .proj-card.cor-3 .proj-title,
body.page-portfolio.dark-mode .proj-card.cor-3 .proj-cat,
body.page-portfolio.dark-mode .proj-card.cor-3 .proj-desc {
    color: #2A201B;
}

/* Campos e filtros mais fáceis de distinguir */
body.dark-mode .ct-campo,
body.dark-mode .form-input,
body.dark-mode .form-textarea,
body.dark-mode select {
    background: #30241F;
    color: var(--dark);
    border-color: var(--border-medium);
}
body.dark-mode .ct-campo:focus,
body.dark-mode .form-input:focus,
body.dark-mode .form-textarea:focus,
body.dark-mode select:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(214,176,111,.16);
}

/* ══════════ AJUSTES V27 — dourado no modo claro + cards 3D + vídeo ══════════ */
:root {
    --gold: #B88946;
    --gold-soft: #D5B878;
    --gold-pale: #E9D8B8;
}

/* Dourado editorial também nas áreas escuras do modo claro */
body:not(.dark-mode) .page-intro .s-eye,
body:not(.dark-mode) .split-section .sp-tag,
body:not(.dark-mode) .cta-s .cta-over,
body:not(.dark-mode) footer .ft-social:hover,
body:not(.dark-mode) footer .ft-links a:hover,
body:not(.dark-mode) .mq-sep,
body:not(.dark-mode) .det-hero .s-eye,
body.page-briefing:not(.dark-mode) .bf-dark .s-eye,
body.page-portfolio:not(.dark-mode) .portfolio-hero .s-eye {
    color: var(--gold-soft);
}

body:not(.dark-mode) .page-intro .s-eye::after,
body:not(.dark-mode) .split-section .sp-tag::before,
body:not(.dark-mode) .cta-s .cta-over::before,
body:not(.dark-mode) .cta-s .cta-over::after,
body:not(.dark-mode) .det-hero .s-eye::after,
body.page-briefing:not(.dark-mode) .bf-dark .s-eye::after,
body.page-portfolio:not(.dark-mode) .portfolio-hero .s-eye::after {
    background: var(--gold);
}

body:not(.dark-mode) .page-intro .s-h em,
body:not(.dark-mode) .split-section .sp-h em,
body:not(.dark-mode) .cta-s .cta-h em,
body:not(.dark-mode) .det-hero h1 em,
body:not(.dark-mode) .det-hero h2 em,
body.page-briefing:not(.dark-mode) .bf-dark h1 em,
body.page-portfolio:not(.dark-mode) .portfolio-hero h1 em {
    color: var(--gold-soft);
}

body:not(.dark-mode) .split-section .proc-n,
body:not(.dark-mode) .split-section .sp-big,
body:not(.dark-mode) .cta-s .cta-over,
body:not(.dark-mode) footer .ft-icone,
body:not(.dark-mode) footer .wa-num {
    color: var(--gold-soft);
}

/* Efeito 3D: aplicado apenas em dispositivos com cursor preciso */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .tilt-card {
        --tilt-x: 0deg;
        --tilt-y: 0deg;
        --lift: 0px;
        --scale-card: 1;
        transform: perspective(950px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(var(--lift)) scale(var(--scale-card));
        transform-style: preserve-3d;
        will-change: transform, box-shadow;
        transition: transform .18s ease-out, box-shadow .25s ease, border-color .25s ease, background-color .25s ease;
        backface-visibility: hidden;
    }

    .tilt-card.is-tilting {
        --lift: -8px;
        --scale-card: 1.012;
        box-shadow: 0 20px 44px rgba(35, 24, 18, .20), 0 4px 14px rgba(35, 24, 18, .12);
        z-index: 4;
    }

    body.dark-mode .tilt-card.is-tilting {
        box-shadow: 0 24px 52px rgba(0, 0, 0, .42), 0 0 0 1px rgba(214, 176, 111, .18);
    }

    .tilt-card > * {
        transform: translateZ(0);
        transition: transform .22s ease-out;
    }

    .tilt-card.is-tilting > * {
        transform: translateZ(14px);
    }

    .tilt-card.is-resetting {
        transition: transform .55s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;
    }
}

/* Mobile/tablet: sem inclinação; mantém toque e leitura estáveis */
@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
    .tilt-card {
        transform: none !important;
        transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease !important;
    }
}

/* Componente reutilizável para vídeos adicionais */
.video-frame,
.project-video {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 4px;
    background: var(--dark2);
    border: 1px solid var(--border-soft);
    aspect-ratio: 16 / 9;
}

.video-frame video,
.project-video video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.video-frame.is-vertical,
.project-video.is-vertical {
    aspect-ratio: 4 / 5;
}

.video-frame::after,
.project-video::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: inherit;
}

.video-caption {
    margin-top: .8rem;
    font-size: .76rem;
    line-height: 1.55;
    color: var(--muted-ink);
    letter-spacing: .03em;
}

.video-caption strong {
    color: var(--gold);
    font-weight: 600;
}

/* ══════════ AJUSTES V28 — galerias editoriais, vídeo e microinterações ══════════ */

/* Footer: todos os contactos usam a mesma cor e o mesmo hover */
footer .ft-social,
footer .ft-icone,
footer .wa-num {
    color: rgba(216,210,197,.68) !important;
}
footer .ft-social svg,
footer .ft-icone svg { color: inherit; }
footer .ft-social:hover,
footer .ft-icone:hover,
footer .ft-icone:hover .wa-num {
    color: var(--gold-soft) !important;
    text-decoration: none;
}

/* Galeria fixa: 6 cards, 5 imagens + 1 vídeo */
body.page-detail .det-galeria {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    align-items: stretch;
}
body.page-detail .det-gal-item {
    position: relative;
    min-width: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid var(--border-medium);
    background: var(--white);
    box-shadow: 0 6px 20px rgba(48,34,27,.07);
    isolation: isolate;
}
body.page-detail .det-gal-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.025) translate3d(var(--media-x, 0px), var(--media-y, 0px), 0);
    transition: transform .4s cubic-bezier(.2,.75,.25,1), filter .35s ease;
    will-change: transform;
}
body.page-detail .det-gal-item:hover img {
    filter: saturate(1.03) contrast(1.02);
}
body.page-detail .det-gal-pendente {
    display: flex;
    align-items: center;
    justify-content: center;
    border-style: dashed;
    background:
      linear-gradient(135deg, transparent 0 48%, var(--border-soft) 49% 51%, transparent 52% 100%),
      var(--blush);
}
body.page-detail .det-gal-pendente .det-gal-ph {
    padding: 1rem;
    color: var(--muted-ink);
    font-size: .72rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-align: center;
}

/* Card de vídeo editorial */
body.page-detail .det-video-card {
    appearance: none;
    width: 100%;
    padding: 0;
    font: inherit;
    color: inherit;
    cursor: pointer;
    text-align: left;
    background: var(--dark2);
}
body.page-detail .det-video-poster {
    position: absolute;
    inset: 0;
    opacity: .48;
    filter: saturate(.72) contrast(1.05);
}
body.page-detail .det-video-card::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(145deg, rgba(25,17,13,.28), rgba(25,17,13,.82));
}
body.page-detail .det-video-card::after {
    content: '';
    position: absolute;
    inset: 10px;
    z-index: 2;
    border: 1px solid rgba(214,176,111,.42);
    border-radius: 3px;
    pointer-events: none;
    transition: border-color .3s ease, transform .3s ease;
}
body.page-detail .det-video-overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    color: #fff8f0;
    text-align: center;
    padding: 1.25rem;
}
body.page-detail .det-video-play {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    padding-left: 4px;
    border-radius: 50%;
    border: 1px solid var(--gold-soft);
    background: rgba(20,13,9,.36);
    color: var(--gold-soft);
    font-size: 1.1rem;
    box-shadow: 0 0 0 0 rgba(214,176,111,.20);
    transition: transform .3s ease, background .3s ease, box-shadow .3s ease;
}
body.page-detail .det-video-copy { display: grid; gap: .25rem; }
body.page-detail .det-video-copy small {
    color: var(--gold-soft);
    font-size: .62rem;
    letter-spacing: .18em;
    text-transform: uppercase;
}
body.page-detail .det-video-copy strong {
    font-family: var(--font-d);
    font-size: 1.15rem;
    font-weight: 500;
}
body.page-detail .det-video-card:hover::after { border-color: var(--gold); transform: scale(.975); }
body.page-detail .det-video-card:hover .det-video-play {
    transform: scale(1.1);
    background: rgba(184,137,70,.18);
    box-shadow: 0 0 0 10px rgba(214,176,111,.09);
}
body.page-detail .det-video-card:focus-visible {
    outline: 3px solid var(--gold);
    outline-offset: 4px;
}

/* Luz suave que acompanha o cursor */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
    body.page-detail .det-gal-item,
    body.page-portfolio .proj-card {
        --light-x: 50%;
        --light-y: 50%;
    }
    body.page-detail .det-gal-item::marker { display:none; }
    body.page-detail .det-gal-item:not(.det-video-card)::after,
    body.page-portfolio .proj-card::before {
        content: '';
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 5;
        opacity: 0;
        background: radial-gradient(circle at var(--light-x) var(--light-y), rgba(233,216,184,.22), transparent 34%);
        transition: opacity .25s ease;
    }
    body.page-detail .det-gal-item:hover::after,
    body.page-portfolio .proj-card:hover::before { opacity: 1; }

    body.page-detail .det-gal-item {
        transform: perspective(1050px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(var(--lift,0px));
        transform-style: preserve-3d;
        transition: transform .2s ease-out, box-shadow .3s ease, border-color .3s ease;
        will-change: transform;
    }
    body.page-detail .det-gal-item.is-tilting {
        --lift: -10px;
        border-color: rgba(184,137,70,.62);
        box-shadow: 0 24px 48px rgba(45,31,24,.20), 0 0 0 1px rgba(184,137,70,.10);
        z-index: 4;
    }
    body.page-detail .det-gal-item.is-resetting {
        transition: transform .58s cubic-bezier(.18,.8,.22,1), box-shadow .4s ease;
    }
    body.page-detail .det-gal-item.is-tilting .det-video-overlay,
    body.page-detail .det-gal-item.is-tilting .det-gal-ph { transform: translateZ(22px); }
}

/* Entrada progressiva das imagens */
.media-reveal {
    opacity: 0;
    transform: translateY(22px) scale(.985);
    transition: opacity .65s ease, transform .65s cubic-bezier(.2,.75,.25,1);
    transition-delay: calc(var(--media-order, 0) * 70ms);
}
.media-reveal.media-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Lightbox multimédia */
.lightbox .lightbox-video {
    display: none;
    width: min(1100px, 92vw);
    max-height: calc(100vh - 9rem);
    aspect-ratio: 16 / 9;
    background: #000;
    border-radius: 5px;
    box-shadow: 0 28px 80px rgba(0,0,0,.68);
}
.lightbox.modo-video img { display: none; }
.lightbox.modo-video .lightbox-video { display: block; }
.lightbox-video-estado {
    display: none;
    max-width: 520px;
    padding: 2rem;
    border: 1px solid rgba(214,176,111,.38);
    color: rgba(255,255,255,.82);
    text-align: center;
    line-height: 1.7;
}
.lightbox.video-indisponivel .lightbox-video { display:none; }
.lightbox.video-indisponivel .lightbox-video-estado { display:block; }

/* Transição discreta entre páginas */
body { opacity: 1; }
body.page-preparing { opacity: 0; }
body.page-ready { transition: opacity .35s ease; }
body.page-is-leaving { opacity: 0; transition: opacity .22s ease; }

@media (max-width: 900px) {
    body.page-detail .det-galeria { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 575px) {
    body.page-detail .det-galeria { grid-template-columns: 1fr; gap: 1rem; }
    body.page-detail .det-gal-item { aspect-ratio: 4 / 3; }
}
@media (prefers-reduced-motion: reduce) {
    .media-reveal { opacity:1; transform:none; transition:none; }
    body.page-detail .det-gal-item img { transform:none; transition:none; }
    body.page-preparing, body.page-is-leaving { opacity:1; }
}


/* ══════════ ANIMAÇÃO EDITORIAL — títulos, imagens e scroll ══════════ */
/* Títulos revelados carácter a carácter. A estrutura semântica permanece intacta. */
.motion-ready .editorial-title .title-char {
    display: inline-block;
    opacity: 0;
    transform: translateY(.75em) rotate(1.5deg);
    filter: blur(3px);
    transition:
        opacity .62s ease,
        transform .72s cubic-bezier(.2,.78,.22,1),
        filter .62s ease;
    transition-delay: calc(var(--char-order, 0) * 22ms);
    will-change: transform, opacity;
}
.motion-ready .editorial-title.title-visible .title-char {
    opacity: 1;
    transform: translateY(0) rotate(0);
    filter: blur(0);
}
.motion-ready .editorial-title em .title-char {
    color: inherit;
}

/* Imagens surgem através de uma máscara vertical, sem interferir com o parallax. */
.motion-ready .editorial-image {
    opacity: 0;
    clip-path: inset(0 0 100% 0 round 3px);
    filter: saturate(.86) contrast(.96);
    transition:
        clip-path .9s cubic-bezier(.2,.78,.22,1),
        opacity .38s ease,
        filter 1s ease;
    transition-delay: calc(var(--image-order, 0) * 65ms);
}
.motion-ready .editorial-image.image-visible {
    opacity: 1;
    clip-path: inset(0 0 0 0 round 3px);
    filter: saturate(1) contrast(1);
}

/* Linha dourada que acompanha a revelação dos pequenos títulos. */
.motion-ready .editorial-eye::after {
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .7s cubic-bezier(.2,.78,.22,1) .18s;
}
.motion-ready .editorial-eye.eye-visible::after { transform: scaleX(1); }

/* Movimento de profundidade muito discreto durante o scroll.
   `translate` não substitui transforms já usados nos componentes. */
@media (min-width: 992px) and (prefers-reduced-motion: no-preference) {
    .editorial-scroll-layer {
        translate: 0 var(--editorial-y, 0px);
        will-change: translate;
    }
}

/* Pequeno acabamento de entrada para secções completas. */
.motion-ready .editorial-section {
    --section-opacity: 0;
}
.motion-ready .editorial-section.section-visible {
    --section-opacity: 1;
}
.motion-ready .editorial-section > .wrap,
.motion-ready .editorial-section > .det-wrap {
    opacity: var(--section-opacity, 1);
    transition: opacity .65s ease;
}

/* Transição visual mais polida entre páginas, sem cobrir links ou formulários. */
.page-transition-veil {
    position: fixed;
    inset: 0;
    z-index: 10000;
    pointer-events: none;
    background: var(--offwhite);
    transform: scaleY(0);
    transform-origin: bottom;
    transition: transform .42s cubic-bezier(.72,0,.25,1);
}
body.dark-mode .page-transition-veil { background: var(--dark2); }
body.page-is-leaving .page-transition-veil {
    transform: scaleY(1);
    transform-origin: bottom;
}
body.page-arriving .page-transition-veil {
    transform: scaleY(0);
    transform-origin: top;
}

@media (prefers-reduced-motion: reduce) {
    .motion-ready .editorial-title .title-char,
    .motion-ready .editorial-image,
    .motion-ready .editorial-eye::after,
    .motion-ready .editorial-section > .wrap,
    .motion-ready .editorial-section > .det-wrap {
        opacity: 1;
        transform: none;
        translate: none;
        filter: none;
        clip-path: none;
        transition: none;
    }
    .page-transition-veil { display: none; }
}


/* ══════════ V30 — CINEMA EDITORIAL E VÍDEOS REAIS ══════════ */
.hero-cinema { position:absolute; inset:0; z-index:0; overflow:hidden; background:#17110e; }
.hero-cinema-clip { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.035); transition:opacity 1.2s ease, transform 8s linear; }
.hero-cinema-clip.is-active { opacity:1; transform:scale(1); }
.hero-video-veu { z-index:1; }
.hero-video-conteudo { z-index:2; }
.svc-img-wrap { position:relative; }
.svc-video { width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.8,.2,1), filter .5s ease; }
.svc-card:hover .svc-video { transform:scale(1.045); filter:saturate(1.05) contrast(1.03); }
.det-video-card.is-coming-soon { cursor:default; opacity:.72; }
.det-video-card.is-coming-soon .det-video-play { opacity:.55; }
.det-video-card.is-coming-soon:hover { transform:none !important; }
@media (prefers-reduced-motion: reduce) {
  .hero-cinema-clip { transition:none; transform:none; }
  .hero-cinema-clip:not(:first-child) { display:none; }
  .svc-video { transition:none; }
}


/* V31 — correções de enquadramento, hero e multimédia */
.hero-cinema { position:absolute; inset:0; z-index:0; overflow:hidden; background:#211a15; }
.hero-cinema-clip { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:1; }
.hero-video-conteudo .hero-h { text-wrap:balance; max-width:12ch; }
.svc-img-wrap { height:auto; aspect-ratio:16/9; background:var(--dark2); }
.svc-img-wrap img,.svc-img-wrap video { width:100%; height:100%; object-fit:cover; object-position:center; }
.val-img-wrap { height:auto; aspect-ratio:16/9; overflow:hidden; }
.value-video { width:100%; height:100%; object-fit:cover; object-position:center 28%; display:block; }
.det-hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.inspiration-return { width:100%; border:1px solid var(--border-medium); background:var(--white); color:var(--dark); text-align:left; cursor:pointer; font:inherit; }
.inspiration-return:hover { border-color:var(--gold); transform:translateY(-3px); }
.inspiration-modal { position:fixed; inset:0; z-index:12000; display:none; place-items:center; padding:1.5rem; background:rgba(18,12,9,.9); backdrop-filter:blur(10px); }
.inspiration-modal.aberto { display:grid; }
.inspiration-card { width:min(720px,100%); background:var(--white); border:1px solid var(--border-caramel); border-radius:8px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.45); }
.inspiration-card img { width:100%; max-height:54vh; object-fit:cover; display:block; background:var(--blush); }
.inspiration-copy { padding:1.5rem; }
.inspiration-copy blockquote { font-family:var(--font-d); font-size:1.45rem; line-height:1.35; color:var(--dark); margin-bottom:.65rem; }
.inspiration-copy cite { color:var(--gold); font-style:normal; font-size:.8rem; }
.inspiration-actions { display:flex; gap:.75rem; flex-wrap:wrap; padding:0 1.5rem 1.5rem; }
@media (max-width:991px){
  .hero-video-sec { display:flex; flex-direction:column; padding-top:68px; background:var(--offwhite); }
  .hero-cinema { position:relative; inset:auto; width:100%; height:56vh; min-height:340px; order:1; }
  .hero-video-sec .hero-video-veu { position:absolute; top:68px; left:0; right:0; height:56vh; min-height:340px; z-index:1; pointer-events:none; }
  .hero-video-sec .hero-video-conteudo { order:2; z-index:2; width:100%; padding:2rem var(--pad) 2.75rem; background:var(--offwhite); }
  .hero-video-sec .hero-h { max-width:15ch; }
}
@media (max-width:575px){
  .hero-cinema { height:52vh; min-height:300px; }
  .hero-video-sec .hero-video-veu { height:52vh; min-height:300px; }
  .hero-video-sec .hero-h { font-size:2.15rem; line-height:1.08; }
}


/* V32 — hero dupla, enquadramento dos projetos e imagens TRASSoponto */
.hero-cinema-clip { opacity:0; transform:scale(1.025); transition:opacity 1.15s ease, transform 8s linear; }
.hero-cinema-clip.is-active { opacity:1; transform:scale(1); }

/* Hero visual dos projetos com mais altura e enquadramento seguro */
body.page-detail .u-9 { padding:3.5rem 0; }
body.page-detail .det-img-ph {
    height:clamp(430px, 62vw, 680px);
    min-height:430px;
    position:relative;
}
body.page-detail .det-img-ph > img,
body.page-detail .det-img-ph .v-9 {
    width:100%; height:100%; object-fit:cover;
    object-position:center 18%;
}
body.page-detail .det-hero-video {
    object-fit:cover;
    object-position:center 28%;
}
body.page-detail .det-img-ph-symbol { z-index:2; }

/* As fotografias do TRASSoponto devem ficar visíveis mesmo sem JS/observer */
body.page-detail .det-galeria .trasso-photo {
    opacity:1 !important;
    clip-path:none !important;
    filter:none !important;
    visibility:visible !important;
}
body.page-detail .det-galeria .det-gal-item:has(.trasso-photo) {
    opacity:1;
}

/* Modal final apenas com frase e escolhas */
.inspiration-card.inspiration-phrase-only { max-width:620px; }
.inspiration-card.inspiration-phrase-only .inspiration-copy { padding:2.4rem 2rem 1.5rem; text-align:center; }
.inspiration-card.inspiration-phrase-only blockquote { font-size:clamp(1.5rem,3vw,2.2rem); }
.inspiration-card.inspiration-phrase-only .inspiration-actions { justify-content:center; padding:0 2rem 2rem; }

@media (max-width:991px){
  body.page-detail .det-img-ph { height:clamp(390px,72vw,560px); min-height:390px; }
  body.page-detail .det-img-ph > img,
  body.page-detail .det-img-ph .v-9 { object-position:center 14%; }
  body.page-detail .det-hero-video { object-position:center 25%; }
}
@media (max-width:575px){
  body.page-detail .u-9 { padding:2rem 0; }
  body.page-detail .det-img-ph { height:68vh; min-height:420px; max-height:620px; }
  body.page-detail .det-img-ph > img,
  body.page-detail .det-img-ph .v-9 { object-position:center 12%; }
  body.page-detail .det-hero-video { object-position:center 22%; }
}

/* ══ CORREÇÃO V33 — imagens sempre visíveis ══
   A animação editorial deixa de controlar a visibilidade das fotografias.
   Evita que imagens permaneçam ocultas quando o IntersectionObserver falha
   ou quando a página é aberta localmente. */
.motion-ready img.editorial-image,
img.editorial-image {
    opacity: 1 !important;
    clip-path: none !important;
    filter: none !important;
    visibility: visible !important;
}

/* Segurança adicional: o conteúdo das secções nunca fica invisível. */
.motion-ready .editorial-section {
    --section-opacity: 1;
}
.motion-ready .editorial-section > .wrap,
.motion-ready .editorial-section > .det-wrap {
    opacity: 1 !important;
}


/* ══ AJUSTES V34 — enquadramento, serviços e inspiração ══ */
/* Molduras de serviços maiores e imagens totalmente enquadradas */
.svc-img-wrap {
    height: clamp(220px, 25vw, 300px);
    background: var(--blush);
}
.svc-img-wrap img,
.svc-img-wrap .service-visual {
    width: 50%;
    height:50%;
    display:block;
    object-fit:cover;
    object-position:center center;
}
/* Imagens de pessoas: prioridade ao rosto e topo da cabeça */
.portrait-safe,
.about-frame .about-portrait,
.val-img-wrap img[src*="valor-"],
body.page-detail .det-img-ph img {
    object-position:center  !important;
}
.about-frame { overflow:hidden; }
.about-frame .about-portrait {
    width:100%; height:100%; object-fit:cover; display:block;
}
/* Heros fotográficas: nunca cortar o topo; vídeos preservam o enquadramento superior */
body.page-detail .det-img-ph > img,
body.page-detail .det-img-ph .v-9 {
    object-position:center top !important;
}
body.page-detail .det-hero-video {
    object-position:center 16% !important;
}

/* Pop-up de inspiração: rosa queimado suave, menos luminoso */
.inspiration-modal {
    background:rgba(36,26,22,.78);
    backdrop-filter:blur(12px) saturate(.8);
}
.inspiration-card.inspiration-phrase-only {
    background:#E4C8BE;
    border:1px solid rgba(110,74,50,.28);
    box-shadow:0 26px 70px rgba(31,20,16,.34);
}
.inspiration-card.inspiration-phrase-only .inspiration-copy blockquote {
    color:#403932;
}
.inspiration-card.inspiration-phrase-only .inspiration-copy cite {
    color:#7B5239;
}
.inspiration-refresh-row {
    display:flex;
    justify-content:center;
    margin:-.25rem 0 1.15rem;
}
.inspiration-refresh {
    width:42px; height:42px; border-radius:50%;
    border:1px solid rgba(64,57,50,.3);
    background:rgba(251,247,242,.34);
    color:#403932;
    display:inline-flex; align-items:center; justify-content:center;
    cursor:pointer;
    transition:transform .35s ease, background .25s ease, border-color .25s ease;
}
.inspiration-refresh:hover,
.inspiration-refresh:focus-visible {
    background:rgba(251,247,242,.62);
    border-color:#B88946;
    transform:rotate(35deg) scale(1.06);
    outline:none;
}
.inspiration-refresh svg { width:18px; height:18px; }
body.dark-mode .inspiration-card.inspiration-phrase-only {
    background:#4B3730;
    border-color:rgba(214,176,111,.36);
}
body.dark-mode .inspiration-card.inspiration-phrase-only .inspiration-copy blockquote { color:#F3E7DF; }
body.dark-mode .inspiration-card.inspiration-phrase-only .inspiration-copy cite { color:#E2C58F; }
body.dark-mode .inspiration-refresh { color:#F3E7DF; background:rgba(242,221,209,.08); border-color:rgba(242,221,209,.25); }

@media (max-width:575px){
  .svc-img-wrap { height:230px; }
  body.page-detail .det-img-ph { height:auto; min-height:0; }
  body.page-detail .det-img-ph > img,
  body.page-detail .det-img-ph .v-9 {
      height:auto; min-height:420px; object-fit:cover; object-position:center top !important;
  }
}


/* ══ V35 — cards estabilizados, sem travessões decorativos e miniaturas de contacto ══ */
/* Elimina linhas/travessões decorativos em todo o site. */
.s-eye::after,
.eyebrow::before,
.lang-tag::before,
.sp-tag::before,
.cta-over::before,
.cta-over::after,
.nav-links a::after,
body.page-portfolio .s-eye::after {
    content: none !important;
    display: none !important;
}

/* Mantém os títulos alinhados depois de retirar as linhas. */
.s-eye,
.eyebrow,
.lang-tag,
.sp-tag,
.cta-over {
    gap: 0 !important;
}

/* Cards de serviços: proporção consistente sem deformar o conteúdo. */
.svc-grid {
    align-items: stretch;
}
.svc-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
}
.svc-img-wrap {
    width: 100%;
    height: auto !important;
    aspect-ratio: 16 / 9;
    flex: 0 0 auto;
    overflow: hidden;
    margin-bottom: 1.4rem;
}
.svc-img-wrap img,
.svc-img-wrap video,
.svc-img-wrap .service-visual {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.svc-desc { flex: 0 0 auto; }
.svc-tags { margin-bottom: 1rem; }
.svc-arr { margin-top: auto !important; align-self: flex-start; }

/* Cards de contacto com miniaturas fotográficas circulares. */
.ct-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.ct-img-wrap {
    width: 78px;
    height: 78px;
    padding: 0 !important;
    border-radius: 50%;
    overflow: hidden;
    flex: 0 0 78px;
    border: 2px solid var(--border-caramel);
    background: var(--blush);
}
.ct-img-wrap img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    transition: transform .45s ease;
}
.ct-card:hover .ct-img-wrap img { transform: scale(1.06); }
.ct-cta { margin-top: auto; align-self: flex-start; }

/* A navegação já não apresenta sublinhado/travessão no item Contactos ou noutros itens. */
.nav-links a:hover,
.nav-links a.active { text-decoration: none; }

@media (max-width: 575px) {
    .svc-img-wrap { height: auto !important; aspect-ratio: 16 / 9; }
    .ct-img-wrap { width: 72px; height: 72px; flex-basis: 72px; }
}


/* ══ V36 — carrossel do portefólio e heros estáticas no mobile ══ */
body.page-portfolio .proj-img-wrap img {
    z-index: 1;
    pointer-events: none;
}
body.page-portfolio .proj-img-wrap img.ativa {
    position: absolute;
    inset: 0;
    opacity: 1 !important;
    visibility: visible !important;
}
body.page-portfolio .proj-ph { z-index: 0; }
body.page-portfolio .proj-dots { z-index: 3; }
body.page-portfolio .proj-img-wrap { cursor: pointer; touch-action: pan-y; }
.det-hero-mobile-poster { display: none; }

@media (max-width: 767px) {
    body.page-home .hero-cinema {
        display: block;
        background: url('../imagens/hero-aryaednyr-macedo.jpg') center 22% / cover no-repeat;
    }
    body.page-home .hero-cinema-clip { display: none !important; }

    body.page-detail .det-img-ph:has(.det-hero-video) .det-hero-video { display: none !important; }
    body.page-detail .det-img-ph:has(.det-hero-video) .det-hero-mobile-poster {
        display: block;
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
        background: var(--blush);
        z-index: 1;
    }
    body.page-detail .det-img-ph-symbol { z-index: 2; }

    .editorial-title .title-char {
        display: inline !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        transition: none !important;
    }
    h1, h2, .hero-h, .det-titulo, .s-h, .cta-h {
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }
    .hero-video-conteudo .hero-h { max-width: 100%; text-wrap: balance; }
}


/* ══ AJUSTES V37 — ritmo, contraste e navegação ══ */
/* Crossfade cinematográfico mais lento e suave */
.hero-cinema-clip {
    transition: opacity 2.8s cubic-bezier(.22,.61,.36,1), transform 11s linear !important;
}

/* CTA antes do footer: maior, mais compacto e sem quebra forçada no desktop */
.cta-s { padding: 6rem 0; }
.cta-h {
    font-size: clamp(2.35rem, 4vw, 3.35rem);
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
.cta-p {
    font-size: 1.05rem;
    line-height: 1.65;
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
    white-space: nowrap;
}

/* Números decorativos: dourados no escuro e cinzento mais presente no claro */
body.dark-mode .svc-num,
body.dark-mode .proc-n,
body.dark-mode .sp-big,
body.dark-mode .cat-n,
body.dark-mode .meta-n {
    color: var(--gold-soft) !important;
    opacity: .92;
}
body:not(.dark-mode) .svc-num,
body:not(.dark-mode) .proc-n,
body:not(.dark-mode) .sp-big,
body:not(.dark-mode) .cat-n {
    color: #625C57 !important;
    opacity: .72;
}

/* Navbar: ligeiramente maior no desktop */
.nav-links a { font-size: .79rem; }

/* Menu mobile: cerca de 30% menor, mantendo área de toque confortável */
@media (max-width: 991px) {
    .nav-links a {
        font-size: .68rem;
        letter-spacing: .11em;
        padding: .78rem .2rem;
    }
    .cta-p {
        white-space: normal;
        font-size: .98rem;
        max-width: 620px;
    }
    .cta-s { padding: 4.75rem 0; }
}
@media (max-width: 575px) {
    .nav-links a { font-size: .66rem; }
    .cta-h { font-size: 2rem; }
    .cta-p { font-size: .94rem; line-height: 1.6; }
}

/* ══════════ V38 — ENQUADRAMENTO FINAL DA HERO E NAVBAR ══════════ */
/* Cada vídeo recebe um ponto focal próprio para preservar cabelo e rosto. */
.hero-cinema-clip:nth-child(1) {
    object-position: center 18%;
}
.hero-cinema-clip:nth-child(2) {
    object-position: center 12%;
}
.hero-cinema-clip:nth-child(3) {
    object-position: center 24%;
}
.hero-cinema-clip {
    transform: scale(1.01);
}
.hero-cinema-clip.is-active {
    transform: scale(1);
}

/* Navegação desktop realmente maior e mais espaçada. */
@media (min-width: 992px) {
    .nav-links {
        gap: 2.8rem;
    }
    .nav-links a {
        font-size: 1.02rem;
        font-weight: 500;
        letter-spacing: .055em;
    }
    .nav-links a::after {
        bottom: -5px;
        transition: width .42s cubic-bezier(.22,.61,.36,1);
    }
}

/* O menu mobile mantém-se compacto e legível. */
@media (max-width: 991px) {
    .nav-links a {
        font-size: .68rem;
        font-weight: 500;
        letter-spacing: .10em;
    }
}

@media (max-width: 575px) {
    .nav-links a {
        font-size: .66rem;
    }
}


/* ============================================================
   VERSÃO 1.0 — REVISÃO FINAL DE INTERFACE
   Tipografia preservada: Bodoni Moda + Inter
   ============================================================ */

/* Hero: mostra o enquadramento completo, sem zoom excessivo. */
body.page-home .hero-video-sec {
    min-height: 100svh;
    height: 100svh;
    padding: 0;
    display: flex;
    align-items: center;
    background: #17110e;
}
body.page-home .hero-cinema {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background: #17110e;
}
body.page-home .hero-cinema-clip {
    display: block !important;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    background: #17110e;
    transform: none !important;
    transition: opacity 1s cubic-bezier(.22,.61,.36,1) !important;
}
body.page-home .hero-cinema-clip.is-active { transform: none !important; }
body.page-home .hero-video-veu {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, rgba(20,14,10,.72) 0%, rgba(20,14,10,.42) 47%, rgba(20,14,10,.18) 100%);
}
body.page-home .hero-video-conteudo {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: 8rem var(--pad) 4rem;
    background: transparent !important;
}

/* Navbar equilibrada: maior que a versão original, sem ficar excessiva. */
nav {
    background: rgba(246,231,223,.86);
    backdrop-filter: blur(18px) saturate(115%);
    border-bottom: 1px solid rgba(184,137,70,.20);
}
body.dark-mode nav { background: rgba(26,20,16,.88); }
@media (min-width: 992px) {
    .nav-links { gap: 2.25rem; }
    .nav-links a {
        font-size: .84rem;
        font-family: var(--font-b);
        font-weight: 500;
        letter-spacing: .075em;
    }
}

/* Footer com presença e legibilidade equivalentes à navbar. */
.ft-links a,
.ft-social,
.ft-icone,
.wa-num {
    font-size: .82rem;
    line-height: 1.55;
}
.ft-links { gap: 1rem; }
.ft-links a,
.ft-social,
.ft-icone,
.wa-num { transition: color .28s ease, opacity .28s ease; }
.ft-links a:hover,
.ft-social:hover,
.ft-icone:hover,
.ft-icone:hover .wa-num { color: var(--gold-soft, #D6B06F) !important; }

/* Cards: profundidade mais discreta e profissional. */
.svc-card,
.val-card,
.proc-card,
.ct-card,
.project-card,
.det-gallery-card,
.cat-btn {
    box-shadow: 0 8px 22px rgba(45,34,27,.08);
}
.svc-card:hover,
.val-card:hover,
.proc-card:hover,
.ct-card:hover,
.project-card:hover,
.det-gallery-card:hover,
.cat-btn:hover {
    box-shadow: 0 16px 36px rgba(45,34,27,.14);
}

/* Mobile: mesma experiência cinematográfica, sem esconder nem encolher o vídeo. */
@media (max-width: 767px) {
    body.page-home .hero-video-sec {
        min-height: 100svh;
        height: 100svh;
        display: flex;
        align-items: flex-end;
        padding: 0;
        background: #17110e;
    }
    body.page-home .hero-video-sec::before { content: none !important; }
    body.page-home .hero-cinema {
        display: block !important;
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        order: initial !important;
    }
    body.page-home .hero-cinema-clip {
        display: block !important;
        object-fit: cover;
        object-position: center 28%;
        background: #17110e;
    }
    body.page-home .hero-video-veu {
        display: block !important;
        position: absolute !important;
        inset: 0 !important;
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        background: linear-gradient(180deg, rgba(20,14,10,.18) 0%, rgba(20,14,10,.38) 52%, rgba(20,14,10,.86) 100%);
    }
    body.page-home .hero-video-conteudo {
        position: relative;
        order: initial !important;
        z-index: 2;
        padding: 7.5rem 1.35rem 2.2rem;
        background: transparent !important;
        color: var(--ink-on-dark);
    }
    body.page-home .hero-video-sec .hero-h,
    body.page-home .hero-video-sec .eyebrow,
    body.page-home .hero-video-sec .meta-n { color: var(--ink-on-dark) !important; }
    body.page-home .hero-video-sec .hero-h em { color: var(--caramel) !important; }
    body.page-home .hero-video-sec .hero-p,
    body.page-home .hero-video-sec .meta-l { color: rgba(242,221,209,.82) !important; }
    body.page-home .hero-video-sec .hero-meta { border-top-color: rgba(242,221,209,.24) !important; }
    body.page-home .hero-video-sec .btn-outline { color: var(--ink-on-dark); border-color: rgba(242,221,209,.55); }
    body.page-home .hero-h {
        max-width: 100% !important;
        font-size: clamp(2rem, 9.5vw, 2.8rem);
        line-height: 1.02;
        text-wrap: balance;
        word-break: normal;
        overflow-wrap: normal;
        hyphens: none;
    }
    .nav-links a { font-size: .69rem; }
    .ft-links a,
    .ft-social,
    .ft-icone,
    .wa-num { font-size: .78rem; }
}

@media (prefers-reduced-motion: reduce) {
    body.page-home .hero-cinema-clip { transition: none !important; }
}

/* ══════════ VERSÃO 1.1 — ajustes finais de identidade e processo ══════════ */
/* A logo da página de orçamento mantém a mesma escala das restantes páginas. */
body.page-briefing nav a > img {
    height: 58px;
    max-width: 210px;
    object-fit: contain;
}

/* Hero audiovisual da página de serviços. */
.service-hero {
    position: relative;
    min-height: clamp(540px, 74vh, 760px);
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    background: var(--dark2);
    padding: 8rem 0 5rem;
}
.service-hero-video,
.service-hero-overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.service-hero-video {
    object-fit: cover;
    object-position: center 42%;
}
.service-hero-overlay {
    background: linear-gradient(90deg, rgba(16,12,9,.88) 0%, rgba(16,12,9,.48) 52%, rgba(16,12,9,.20) 100%);
}
.service-hero-content {
    position: relative;
    z-index: 1;
    max-width: 760px;
}
.service-hero .s-eye,
.service-hero .s-h,
.service-hero .s-sub { color: #fff7f0; }
.service-hero .s-h em { color: var(--gold, #d6b06f); }
.service-hero .s-sub { color: rgba(255,247,240,.82); }

/* Processo de trabalho com fotografia e texto na mesma peça. */
.process-grid { gap: 1rem; }
.proc-card {
    overflow: hidden;
    border: 1px solid var(--border-soft);
    border-radius: 4px;
    padding: 0 0 1.6rem;
    background: var(--white);
}
.proc-media {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    margin-bottom: 1.35rem;
    background: var(--greige);
}
.proc-media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transition: transform .7s cubic-bezier(.2,.65,.2,1);
}
.proc-card:hover .proc-media img { transform: scale(1.035); }
.proc-card .proc-line,
.proc-card .proc-n,
.proc-card .proc-title,
.proc-card .proc-desc { margin-left: 1.5rem; margin-right: 1.5rem; }
.proc-card .proc-line { width: calc(100% - 3rem); }

body.dark-mode .proc-card { background: var(--white); }

@media (max-width: 575px) {
    body.page-briefing nav a > img { height: 50px; max-width: 175px; }
    .service-hero { min-height: 100svh; padding: 7rem 0 3rem; }
    .service-hero-video { object-position: center 38%; }
    .service-hero-overlay { background: linear-gradient(180deg, rgba(16,12,9,.18) 0%, rgba(16,12,9,.72) 63%, rgba(16,12,9,.94) 100%); }
    .process-grid { gap: 1.25rem; }
}


/* SERVICE DETAIL PROCESS GALLERIES */
.service-detail-page .det-hero{
  position:relative;
  min-height:clamp(540px,72vh,760px);
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  isolation:isolate;
  background:#241a16;
}
.service-detail-page .service-hero-media{
  position:absolute;
  inset:0;
  z-index:-2;
}
.service-detail-page .service-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(18,12,9,.16),rgba(18,12,9,.82));
}
.service-detail-page .service-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 42%;
  display:block;
}
.service-detail-page .det-hero .wrap{padding-top:8rem;padding-bottom:4rem}
.service-detail-page .det-hero :is(.det-back,.det-tipo,.det-titulo,.det-sub,.det-meta-label,.det-meta-valor){color:#fff7f0}
.service-detail-page .det-hero .det-titulo em{color:var(--gold-soft,#e2c58f)}
.service-process-gallery-wrap{margin:3.5rem 0 4.5rem}
.service-process-gallery-wrap>h2{margin-bottom:1.5rem}
.service-process-gallery{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.25rem;
  perspective:1200px;
}
.service-process-card{
  position:relative;
  padding:0;
  border:1px solid var(--border-medium);
  border-radius:14px;
  overflow:hidden;
  background:var(--white);
  aspect-ratio:4/3;
  cursor:pointer;
  box-shadow:0 12px 30px rgba(42,31,25,.10);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .35s;
  transform-style:preserve-3d;
}
.service-process-card img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .45s;
}
@media (hover:hover) and (pointer:fine){
 .service-process-card:hover{transform:translateY(-10px) rotateX(2deg) rotateY(-2deg);border-color:var(--gold,#b88946);box-shadow:0 22px 50px rgba(42,31,25,.18)}
 .service-process-card:hover img{transform:scale(1.045)}
}
body.dark-mode .service-process-card{background:#40322b;border-color:rgba(226,197,143,.28);box-shadow:0 14px 34px rgba(0,0,0,.22)}
@media(max-width:900px){
 .service-process-gallery{grid-template-columns:1fr 1fr}
 .service-detail-page .det-hero{min-height:620px}
 .service-detail-page .service-hero-media img{object-position:center top}
}
@media(max-width:575px){
 .service-process-gallery{grid-template-columns:1fr;gap:1rem}
 .service-process-card{aspect-ratio:4/3}
 .service-detail-page .det-hero{min-height:680px}
 .service-detail-page .det-hero .wrap{padding-top:7rem;padding-bottom:2.5rem}
}


/* =========================================================
   V1.3 — páginas de serviço: hero, galeria e CTA
========================================================= */
.service-detail-page .det-hero{
  min-height:clamp(420px,56vh,590px);
}
.service-detail-page .service-hero-media img{
  object-position:center 34%;
}
.service-detail-page .det-hero .wrap{
  padding-top:7rem;
  padding-bottom:3rem;
}

/* Texto do convite acima de “Falar comigo” com contraste real */
body:not(.dark-mode).service-detail-page .det-aside-card .u-6{
  color:#5f5047;
  opacity:1;
}
body.dark-mode.service-detail-page .det-aside-card .u-6{
  color:#d8c9c0;
  opacity:1;
}

/* Lightbox das fotografias do processo */
.service-process-card:focus-visible{
  outline:2px solid var(--gold,#b88946);
  outline-offset:4px;
}
.lightbox.aberto{
  display:flex;
}
.lightbox:not(.aberto){
  pointer-events:none;
}
.lightbox.aberto img{
  display:block;
  visibility:visible;
  opacity:1;
  max-width:min(92vw,1400px);
  max-height:calc(100vh - 9rem);
  object-fit:contain;
}

@media(max-width:900px){
  .service-detail-page .det-hero{min-height:500px}
  .service-detail-page .service-hero-media img{object-position:center 28%}
}
@media(max-width:575px){
  .service-detail-page .det-hero{min-height:520px}
  .service-detail-page .det-hero .wrap{padding-top:6.5rem;padding-bottom:2rem}
  .service-detail-page .service-hero-media img{object-position:center 24%}
}


/* =========================================================
   V1.4 — contraste global dos convites e lightbox de serviços
========================================================= */
body:not(.dark-mode) .det-aside-card .u-6,
body:not(.dark-mode) .det-aside-card:has(.btn-caramel) p,
body:not(.dark-mode) .det-aside-card:has(a[href*="briefing"]) p {
  color:#4f4038 !important;
  opacity:1 !important;
}
body.dark-mode .det-aside-card .u-6,
body.dark-mode .det-aside-card:has(.btn-caramel) p,
body.dark-mode .det-aside-card:has(a[href*="briefing"]) p {
  color:#eadfd8 !important;
  opacity:1 !important;
}
.service-process-card{display:block;width:100%}
.service-process-card img{pointer-events:none}

/* ══════════ V1.6 — lightbox navegável e logos uniformes ══════════ */
.lightbox { cursor: default; }
.lightbox-conteudo {
    width:min(1180px, 88vw);
    max-height:calc(100vh - 9.5rem);
    display:flex;
    align-items:center;
    justify-content:center;
}
.lightbox-conteudo > img {
    max-width:100%;
    max-height:calc(100vh - 10rem);
}
.lightbox-nav {
    position:fixed;
    top:50%;
    transform:translateY(-50%);
    z-index:2;
    width:52px;
    height:52px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:50%;
    background:rgba(28,20,16,.58);
    color:#fff;
    font-size:1.6rem;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    backdrop-filter:blur(8px);
    transition:background-color .2s, border-color .2s, transform .2s;
}
.lightbox-nav:hover,
.lightbox-nav:focus-visible {
    background:rgba(184,137,70,.82);
    border-color:rgba(226,197,143,.85);
    transform:translateY(-50%) scale(1.06);
}
.lightbox-anterior { left:clamp(14px, 3vw, 48px); }
.lightbox-seguinte { right:clamp(14px, 3vw, 48px); }
.lightbox-nav[hidden] { display:none !important; }
.lightbox-rodape {
    width:min(90%,900px);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:1rem;
    color:rgba(255,255,255,.78);
}
.lightbox-contador {
    flex:0 0 auto;
    font-size:.72rem;
    letter-spacing:.12em;
    color:var(--gold-soft, #e2c58f);
}
.lightbox.modo-video .lightbox-conteudo > img { display:none; }
.lightbox.modo-video .lightbox-video {
    display:block;
    width:100%;
    max-width:1100px;
    max-height:calc(100vh - 10rem);
}
.lightbox.video-indisponivel .lightbox-video { display:none; }
.lightbox.video-indisponivel .lightbox-video-estado { display:block; }

/* As páginas de Serviços e todas as páginas internas usam a mesma logo. */
body.page-servicos nav a > img,
body.service-detail-page nav a > img,
body.page-detail.service-detail-page nav a > img {
    height:58px !important;
    width:auto !important;
    max-width:210px !important;
    object-fit:contain !important;
}
@media (max-width:575px) {
    .lightbox { padding:4.5rem 3.75rem 1.4rem; }
    .lightbox-conteudo { width:100%; max-height:calc(100vh - 9rem); }
    .lightbox-conteudo > img,
    .lightbox.modo-video .lightbox-video { max-height:calc(100vh - 10rem); }
    .lightbox-nav { width:40px; height:40px; font-size:1.15rem; }
    .lightbox-anterior { left:8px; }
    .lightbox-seguinte { right:8px; }
    .lightbox-rodape { width:100%; flex-direction:column; gap:.35rem; }
    body.page-servicos nav a > img,
    body.service-detail-page nav a > img,
    body.page-detail.service-detail-page nav a > img {
        height:50px !important;
        max-width:175px !important;
    }
}


/* V1.7 — revisão de usabilidade */
.hero-cinema { background:#1a120e; }
.hero-cinema-clip { transition:opacity .85s ease-in-out; }
.hero-cinema-clip.hero-clip-primary { object-position:center 30%; }
.hero-cinema-clip.hero-clip-secondary {
  object-position:center 24%;
  transform:scale(.94);
  transform-origin:center top;
}
.hero-scroll-indicator {
  position:absolute; z-index:3; left:50%; bottom:1.35rem; transform:translateX(-50%);
  width:36px; height:36px; border:1px solid rgba(255,255,255,.45); border-radius:50%;
  color:#fff; display:grid; place-items:center; text-decoration:none; font-size:1.05rem;
  animation:heroScroll 1.8s ease-in-out infinite;
}
@keyframes heroScroll { 0%,100%{transform:translate(-50%,0)} 50%{transform:translate(-50%,7px)} }

/* Setas sempre visíveis nas galerias de serviços e projetos */
.lightbox { z-index:20000 !important; }
.lightbox-nav { z-index:20020 !important; opacity:1 !important; visibility:visible !important; }
.lightbox-conteudo { z-index:20005; }
.lightbox-fechar { z-index:20030 !important; }
.lightbox-rodape { z-index:20020; }

.project-quickfacts { display:flex; flex-wrap:wrap; gap:1px; margin:1.5rem 0 2.5rem; background:var(--border-soft); border:1px solid var(--border-soft); }
.project-quickfact { flex:1 1 180px; padding:1rem 1.15rem; background:var(--white); }
.project-quickfact span { display:block; font-size:.67rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-ink); margin-bottom:.35rem; }
.project-quickfact strong { font-size:.85rem; line-height:1.45; color:var(--dark); font-weight:500; }
.project-disclosure { margin:-1rem 0 2.4rem; padding:1rem 1.15rem; border-left:3px solid var(--gold); background:var(--blush); color:var(--dark); font-size:.85rem; line-height:1.65; }

/* Formulário mais confortável */
.page-contactos .ct-caixa { max-width:920px; }
.page-contactos .ct-campo { min-height:58px; font-size:1rem; }
.page-contactos textarea.ct-campo { min-height:190px; }
.page-contactos .ct-btn { min-height:54px; padding-inline:2rem; }

/* Retrato natural sem corte */
.page-sobremim .about-frame { min-height:580px; }
.page-sobremim .about-portrait { object-fit:cover; object-position:center 25%; }

/* Menos quebras estranhas */
.det-titulo, .s-h, .hero-h, .cta-h { overflow-wrap:normal; word-break:normal; }
@media (max-width:767px){
  .hero-cinema-clip.hero-clip-secondary { transform:scale(.9); object-position:center 18%; }
  .hero-scroll-indicator { bottom:1rem; }
  .project-quickfacts { display:grid; grid-template-columns:1fr; }
  .page-sobremim .about-frame { min-height:430px; }
}
@media (prefers-reduced-motion:reduce){ .hero-scroll-indicator{animation:none} }


/* ══ V1.8 — tema inicial claro e contactos compactos ══ */
.contact-info-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.8rem;
  margin-top:1.25rem;
}
.contact-info-card {
  min-width:0;
  padding:1rem 1.05rem;
  background:var(--white);
  border:1px solid var(--border-soft);
  border-radius:12px;
  transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.contact-info-card:hover {
  transform:translateY(-3px);
  border-color:var(--border-caramel);
}
.contact-info-card .v-3 { font-size:.68rem; letter-spacing:.1em; margin-bottom:.45rem; }
.contact-info-card .v-4 { font-size:.82rem; line-height:1.35; overflow-wrap:anywhere; }
.contact-info-card .v-5 { font-size:.68rem; line-height:1.45; margin-top:.45rem; }
@media (max-width:1100px){ .contact-info-grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:700px){ .contact-info-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:430px){ .contact-info-grid{grid-template-columns:1fr;} }

/* Footer social links — v1.9 */
footer .ft-social, footer .ft-icone {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
}
footer .ft-social svg, footer .ft-icone svg {
  flex: 0 0 auto;
}


/* V1.9.1 — imagem permanente sob os vídeos da hero (sem alterar outras imagens) */
body.page-home .hero-cinema-bg {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 24%;
  z-index:0;
}
body.page-home .hero-cinema-clip {
  z-index:1;
  opacity:0 !important;
}
body.page-home .hero-cinema-clip.is-active.is-ready {
  opacity:1 !important;
}
@media (max-width:767px) {
  body.page-home .hero-cinema-bg {
    object-position:center 22%;
  }
}

/* ══ V1.9.2 — hero: imagem maior, vídeos horizontais em primeiro plano ══ */
body.page-home .hero-cinema {
  position:absolute;
  inset:0;
  overflow:hidden;
  background:#1a120e;
}
body.page-home .hero-cinema-bg {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 28%;
  z-index:0;
  transform:scale(1.015);
}
body.page-home .hero-cinema-clip {
  position:absolute !important;
  top:13% !important;
  right:3.5% !important;
  bottom:auto !important;
  left:auto !important;
  width:min(64vw, 1040px) !important;
  height:74% !important;
  border-radius:6px;
  object-fit:cover !important;
  object-position:center center !important;
  box-shadow:0 24px 70px rgba(20,14,10,.28);
  z-index:1;
  opacity:0 !important;
  transform:none !important;
}
body.page-home .hero-cinema-clip.is-active.is-ready { opacity:1 !important; }
body.page-home .hero-video-veu {
  z-index:2;
  background:linear-gradient(90deg, rgba(26,20,16,.82) 0%, rgba(26,20,16,.60) 30%, rgba(26,20,16,.22) 53%, rgba(26,20,16,.04) 76%);
}
body.page-home .hero-video-conteudo { z-index:3; }
body.page-home .hero-scroll-indicator { z-index:4; }

@media (max-width:1100px) and (min-width:768px) {
  body.page-home .hero-cinema-clip {
    top:17% !important;
    right:2.5% !important;
    width:66vw !important;
    height:62% !important;
  }
}

/* Em telemóvel mantém-se a fotografia estática, evitando vídeo pequeno/cortado. */
@media (max-width:767px) {
  body.page-home .hero-video-sec {
    min-height:100svh !important;
    padding-top:68px !important;
    display:flex !important;
    align-items:flex-end !important;
  }
  body.page-home .hero-cinema { position:absolute !important; inset:0 !important; }
  body.page-home .hero-cinema-bg {
    object-position:center 24% !important;
    transform:none;
  }
  body.page-home .hero-video-veu {
    top:0 !important;
    height:100% !important;
    min-height:0 !important;
    background:linear-gradient(180deg, rgba(26,20,16,.12) 0%, rgba(26,20,16,.30) 48%, rgba(26,20,16,.82) 100%) !important;
  }
  body.page-home .hero-video-conteudo {
    background:transparent !important;
    padding:8rem var(--pad) 3.25rem !important;
  }
  body.page-home .hero-video-sec .hero-h,
  body.page-home .hero-video-sec .eyebrow,
  body.page-home .hero-video-sec .meta-n { color:var(--ink-on-dark) !important; }
  body.page-home .hero-video-sec .hero-p,
  body.page-home .hero-video-sec .meta-l { color:rgba(242,221,209,.84) !important; }
  body.page-home .hero-video-sec .hero-meta { border-top-color:rgba(242,221,209,.24) !important; }
  body.page-home .hero-video-sec .btn-outline { color:var(--ink-on-dark) !important; border-color:rgba(242,221,209,.55) !important; }
}

/* === HERO INTERNA CANÓNICA — todas as páginas excepto Home ===
   Única fonte de controlo de dimensão e ritmo das heroes internas. */
body:not(.page-home) .hero-main {
  position: relative;
  overflow: hidden;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 5.65rem 0 1.6rem;
  background: var(--dark2);
  color: var(--ink-on-dark);
  display: block;
}
body:not(.page-home).dark-mode .hero-main { background: #0D1217; }
body:not(.page-home) .hero-main::before,
body:not(.page-home) .hero-main::after { pointer-events: none; }
body:not(.page-home) .hero-main > .wrap,
body:not(.page-home) .hero-main > [style*="max-width"] {
  position: relative;
  z-index: 2;
  padding-top: 0;
  padding-bottom: 0;
}
body:not(.page-home) .hero-main .s-eye,
body:not(.page-home) .hero-main .det-tipo,
body:not(.page-home) .hero-main .det-back { margin-bottom: .65rem; }
body:not(.page-home) .hero-main .s-h,
body:not(.page-home) .hero-main .det-titulo {
  margin: 0;
  color: var(--ink-on-dark);
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: .98;
}
body:not(.page-home) .hero-main .s-sub,
body:not(.page-home) .hero-main .det-sub {
  max-width: 680px;
  margin: .85rem 0 0;
  color: rgba(242,221,209,.78);
  line-height: 1.55;
}
body:not(.page-home) .hero-main .det-meta-row {
  margin-top: 1.15rem;
  padding-top: .9rem;
  gap: .75rem 2rem;
}
body:not(.page-home) .hero-main .det-meta-item { min-width: 0; }
body:not(.page-home) .hero-main .det-meta-label { margin-bottom: .18rem; }

/* Media que antes ocupava a hero: agora fica abaixo e preserva o enquadramento. */
.hero-media-section {
  background: var(--offwhite);
  padding: 1.4rem 0 0;
}
.hero-media-frame {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 7;
  min-height: 260px;
  max-height: 560px;
  background: #17120f;
}
.hero-media-frame img,
.hero-media-frame video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hero-media-frame video { background: #17120f; }

@media (max-width: 767px) {
  body:not(.page-home) .hero-main {
    padding: 4.9rem 0 1.25rem;
  }
  body:not(.page-home) .hero-main .s-h,
  body:not(.page-home) .hero-main .det-titulo {
    font-size: clamp(1.85rem, 9vw, 2.45rem);
  }
  body:not(.page-home) .hero-main .s-sub,
  body:not(.page-home) .hero-main .det-sub { margin-top: .7rem; }
  body:not(.page-home) .hero-main .det-meta-row {
    margin-top: .9rem;
    padding-top: .75rem;
  }
  .hero-media-section { padding-top: .9rem; }
  .hero-media-frame {
    aspect-ratio: 4 / 3;
    min-height: 0;
    max-height: none;
  }
}
/* === FIM HERO INTERNA CANÓNICA === */



/* ADD ART — FINAL PROJECT REQUIREMENTS FIX */
body:not(.page-home) .hero-main .s-eye {
  font-family: var(--font-b, 'Inter', sans-serif);
  font-size: .67rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--caramel-ink);
  margin: 0 0 .65rem;
}
body:not(.page-home) .hero-main .s-eye::before {
  content: '';
  display: inline-block;
  width: 28px;
  height: 1px;
  margin-right: .75rem;
  vertical-align: middle;
  background: var(--caramel);
}
body.page-contactos .hero-main .s-eye,
body.page-briefing .hero-main .s-eye { font-style: normal; }

/* Every project gallery: 8 equal slots — 7 images + 1 video */
.det-galeria { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.det-gal-item { min-width: 0; aspect-ratio: 1 / 1; }
.det-gal-item img,
.det-gal-item video { width:100%; height:100%; object-fit:cover; }
@media (max-width: 900px) { .det-galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .det-galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); gap:.65rem; } }


/* ADD ART — ENTREGA FINAL 30 JULHO */
body:not(.page-home) .hero-main { padding-top:5.25rem; }
body:not(.page-home) .hero-main .s-eye { display:none !important; }
body.page-home .hero-cinema-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
body.page-home .hero-bg-mobile { display:none; }
body.page-home .hero-cinema-clip { z-index:1; }
.service-video-section .service-hero-video{pointer-events:none;}
.det-galeria{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
.det-gal-item{aspect-ratio:1/1;}
@media(max-width:760px){.det-galeria{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
body.page-portfolio .proj-coming-soon{min-height:100%;cursor:default;background:var(--greige);}
body.page-portfolio .proj-coming-visual{position:relative;min-height:280px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(135deg,var(--blush),var(--caramel));}
body.page-portfolio .proj-coming-visual::after{content:'';position:absolute;inset:0;background:rgba(64,57,50,.16);backdrop-filter:blur(1px);}
body.page-portfolio .proj-coming-visual span{position:relative;z-index:1;font-family:var(--font-d);font-size:clamp(2rem,3vw,3.2rem);line-height:.92;text-align:center;color:var(--dark);}
body.page-portfolio .proj-coming-visual em{color:var(--white);font-style:italic;}
body.page-portfolio .proj-coming-soon .proj-body{padding-top:1.25rem;}
.form-feedback{margin-top:1rem;font-size:.82rem;line-height:1.5;}

/* ADD ART — AJUSTES FINAIS DE HERO E CTA DOS SERVIÇOS */
/* A hero de Serviços segue exatamente o mesmo alinhamento horizontal das restantes heroes. */
body.page-servicos .service-hero-content,
body.page-servicos .hero-main > .wrap {
  width: min(100% - (2 * var(--pad)), var(--max));
  max-width: var(--max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
  text-align: left;
}

/* Não apresentar rótulos, categorias ou links textuais acima dos títulos das heroes internas. */
body:not(.page-home) .hero-main .s-eye,
body:not(.page-home) .hero-main .eyebrow,
body:not(.page-home) .hero-main .det-tipo,
body:not(.page-home) .hero-main .det-back {
  display: none !important;
}

/* O CTA dos cards de Serviços permanece visível no modo claro, escuro, touch e teclado. */
.svc-card .svc-arr {
  opacity: 1;
  visibility: visible;
  transform: none;
  color: var(--dark);
}
body.dark-mode .svc-card .svc-arr {
  color: var(--ink-on-dark);
}
.svc-card:hover .svc-arr,
.svc-card:focus-within .svc-arr {
  opacity: 1;
  visibility: visible;
  transform: translateX(4px);
}

/* ADD ART — CORREÇÃO DEFINITIVA DO ALINHAMENTO DA HERO DE SERVIÇOS
   Usa exatamente a mesma largura e recuo da hero de Orçamento/Briefing. */
body.page-servicos .hero-main > .wrap.service-hero-content {
  width: 100%;
  max-width: var(--wrap);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--pad);
  padding-right: var(--pad);
  text-align: left;
}

/* FINAL 30 JULHO — enquadramento e galerias */
.service-video-section .service-hero-video{object-fit:cover!important;object-position:center 18%!important;}
body.page-servicos .hero-main > .wrap.service-hero-content{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad);}
.det-gal-item.is-coming-soon{position:relative;overflow:hidden;}
.det-gal-item.is-coming-soon .img-cover{filter:brightness(.55);}
.det-gal-item.is-coming-soon .det-video-overlay{opacity:1;visibility:visible;background:linear-gradient(180deg,transparent 30%,rgba(13,18,23,.78));}
@media(max-width:760px){.service-video-section .service-hero-video{object-position:center 12%!important;}}

/* ═══════════════════════════════════════════════════════════════
   CORREÇÃO FINAL — alinhamento das páginas de projeto
   A galeria, ficha técnica e navegação passam a usar a mesma
   largura central do conteúdo superior em todas as páginas.
   ═══════════════════════════════════════════════════════════════ */
body.page-detail .det-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 3.25rem;
    width: 100%;
}

body.page-detail .det-main,
body.page-detail .det-aside,
body.page-detail .det-galeria,
body.page-detail .det-nav-proj {
    width: 100%;
    min-width: 0;
}

body.page-detail .det-aside {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: stretch;
}

body.page-detail .det-aside-card {
    margin-bottom: 0;
    height: 100%;
}

body.page-detail .det-galeria {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin-left: 0;
    margin-right: 0;
}

@media (max-width: 760px) {
    body.page-detail .det-aside {
        grid-template-columns: 1fr;
    }
    body.page-detail .det-galeria {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 480px) {
    body.page-detail .det-galeria {
        grid-template-columns: 1fr !important;
    }
}

/* ADD ART — vídeo geral da página Serviços: enquadramento sem corte da cabeça */
body.page-servicos .service-video-section .service-hero-video {
  object-fit: cover;
  object-position: center 28%;
}
@media (max-width: 767px) {
  body.page-servicos .service-video-section .service-hero-video {
    object-position: center 22%;
  }
}


/* ADD ART — AJUSTES FINAIS DE CONTEÚDO E INTERAÇÃO */
.about-story { display:grid; gap:1rem; max-height:34rem; overflow:auto; padding-right:.65rem; }
.about-story .about-p { margin:0; }
.process-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; margin-bottom:2rem; }
.process-heading .s-h { margin-bottom:0; }
.proc-card { display:flex; flex-direction:column; }
.proc-link { margin-top:auto; padding-top:1.25rem; display:inline-flex; font-size:.76rem; letter-spacing:.09em; text-transform:uppercase; font-weight:700; color:var(--caramel-ink); text-decoration:none; }
.proc-link:hover { text-decoration:underline; text-underline-offset:4px; }
.proj-arr { position:relative !important; z-index:20 !important; pointer-events:auto !important; }
.hero-main img, .hero-media-section img, .det-img-ph img, .hero-right img { cursor:default !important; }
.addart-coming-soon { min-height:320px; background:linear-gradient(135deg,var(--blush),var(--greige)); position:relative; }
.inspiration-card.inspiration-phrase-only { width:min(500px,100%); max-width:500px; }
.inspiration-card.inspiration-phrase-only .inspiration-copy { padding:1.7rem 1.5rem 1rem; }
.inspiration-card.inspiration-phrase-only blockquote { font-size:clamp(1.25rem,2.4vw,1.75rem); line-height:1.35; }
.inspiration-card.inspiration-phrase-only .inspiration-actions { padding:0 1.5rem 1.4rem; gap:.55rem; }
.inspiration-refresh-row { margin:.15rem 0 .8rem; }
.inspiration-refresh { width:42px; height:42px; padding:0; border-radius:50%; display:inline-grid; place-items:center; font-size:1.25rem; line-height:1; }
@media (max-width:767px) {
  .about-story { max-height:none; overflow:visible; padding-right:0; }
  .process-heading { align-items:flex-start; flex-direction:column; }
  .inspiration-card.inspiration-phrase-only .inspiration-actions { flex-direction:column; }
  .inspiration-card.inspiration-phrase-only .inspiration-actions > * { width:100%; justify-content:center; text-align:center; }
}


/* CORREÇÃO FINAL ADD ART — cartões uniformes e sem sobreposição */
body.page-detail .det-galeria .det-gal-item,
body.page-detail .det-galeria .addart-coming-soon {
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  align-self: stretch;
}
body.page-detail .det-galeria {
  grid-auto-rows: auto !important;
  align-items: stretch !important;
}


/* HOME · Processo criativo com o mesmo sistema visual dos cards de Serviços */
.process-section-home .svc-card { background: var(--white); }
.process-section-home .svc-card:hover { background: var(--blush); }
.process-section-home .svc-arr { opacity: 1; visibility: visible; transform: none; }
body.dark-mode .process-section-home .svc-card { background: var(--white); }
body.dark-mode .process-section-home .svc-card:hover { background: var(--blush); }
@media (min-width: 769px) {
  .process-svc-grid .svc-card:last-child { grid-column: auto; }
}


/* ADD ART — dark mode readability refinement */
body.dark-mode {
    --muted-ink: #E4D7CE;
    --caramel-ink: #E1BEA8;
    --ink-on-dark: #FFF4ED;
}
body.dark-mode .nav-links a { color: rgba(255,244,237,.82); }
body.dark-mode .s-sub,
body.dark-mode p,
body.dark-mode li,
body.dark-mode .proj-desc,
body.dark-mode .svc-desc,
body.dark-mode .ct-desc,
body.dark-mode .ct-note,
body.dark-mode .ft-copy,
body.dark-mode .ft-links a,
body.dark-mode .det-text,
body.dark-mode .det-meta,
body.dark-mode .form-label,
body.dark-mode .bf-sub,
body.dark-mode .bf-note {
    color: var(--muted-ink);
}
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
    color: #FFF4ED;
}
body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
    color: rgba(255,244,237,.66);
}
\n\n/* ADD ART — Team section */\n.team-section{padding:6rem 0;background:var(--white)}\n.team-intro{max-width:760px;margin-bottom:2.5rem}\n.team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}\n.team-card{background:var(--offwhite);border:1px solid rgba(64,57,50,.10);overflow:hidden;display:grid;grid-template-columns:minmax(180px,42%) 1fr;min-height:330px}\n.team-media{min-height:330px;overflow:hidden;background:var(--greige)}\n.team-media img{width:100%;height:100%;object-fit:cover;display:block}\n.team-media-initials{display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,var(--greige),var(--blush));color:var(--deep-brown)}\n.team-media-initials span{font-family:'Bodoni Moda',serif;font-size:4.5rem;font-style:italic;letter-spacing:.02em}\n.team-body{padding:2rem;align-self:center}\n.team-body h3{font-family:'Bodoni Moda',serif;font-size:1.65rem;font-weight:400;margin:0 0 .5rem;color:var(--deep-brown)}\n.team-role{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--caramel-ink);margin:0 0 1rem}\n.team-body p:last-child{line-height:1.75;color:var(--muted-ink)}\nbody.dark-mode .team-section{background:var(--deep-brown)}\nbody.dark-mode .team-card{background:#171B1E;border-color:rgba(255,244,237,.12)}\nbody.dark-mode .team-body h3{color:var(--ink-on-dark)}\nbody.dark-mode .team-media-initials{background:linear-gradient(145deg,#373F45,#403932);color:#F2DDD1}\n@media(max-width:900px){.team-grid{grid-template-columns:1fr}.team-card{grid-template-columns:220px 1fr}}\n@media(max-width:600px){.team-section{padding:4rem 0}.team-card{grid-template-columns:1fr}.team-media{min-height:300px;max-height:360px}.team-body{padding:1.5rem}}\n
/* V2.1 — retratos da equipa e fotografia Sobre */
.page-sobremim .about-portrait[src*="sobre-aryaednyr-studio"]{
  object-fit:cover !important;
  object-position:58% center !important;
}
.page-sobremim .team-card{
  grid-template-columns: minmax(190px, 40%) 1fr;
  min-height:320px;
}
.page-sobremim .team-media{min-height:320px;}
.page-sobremim .team-media img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.page-sobremim .team-card:first-child .team-media img{object-position:center 30%;}
.page-sobremim .team-card:nth-child(2) .team-media img{object-position:center 28%;}
@media(max-width:900px){
  .page-sobremim .team-card{grid-template-columns:220px 1fr;}
}
@media(max-width:600px){
  .page-sobremim .team-card{grid-template-columns:1fr;}
  .page-sobremim .team-media{min-height:0;aspect-ratio:4/5;}
}


/* V2.2 — Equipa no mesmo ritmo visual dos cards de Serviços */
.page-sobremim .team-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
}
.page-sobremim .team-card{
  display:block;
  min-height:0;
  padding:2.75rem 2.25rem;
  background:var(--white);
  border:0;
  transition:background .35s;
}
.page-sobremim .team-card:hover{background:var(--blush);}
.page-sobremim .team-media{
  width:100%;
  height:260px;
  min-height:0;
  margin-bottom:1.5rem;
  overflow:hidden;
  border-radius:4px;
  background:var(--greige);
}
.page-sobremim .team-media img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.page-sobremim .team-card:first-child .team-media img{object-position:center 27%;}
.page-sobremim .team-card:nth-child(2) .team-media img{object-position:center 25%;}
.page-sobremim .team-body{padding:0;align-self:auto;}
body.dark-mode .page-sobremim .team-card{background:var(--white);}
body.dark-mode .page-sobremim .team-card:hover{background:var(--blush);}
@media(max-width:700px){
  .page-sobremim .team-grid{grid-template-columns:1fr;}
  .page-sobremim .team-card{padding:2rem 1.5rem;}
  .page-sobremim .team-media{height:240px;aspect-ratio:auto;}
}


/* V2.3 — Equipa replica exatamente o layout dos cards de Serviços */
.page-sobremim .team-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1.5px;
  background:var(--border-soft);
  border-radius:6px;
  overflow:hidden;
  border:1px solid var(--border-soft);
}
.page-sobremim .team-card{
  position:relative;
  display:block;
  padding:2.75rem 2.25rem;
  min-height:0;
  background:var(--white);
  border:0;
  transition:background .35s;
  cursor:default;
}
.page-sobremim .team-card:hover{background:var(--blush);}
.page-sobremim .team-media{
  width:100%;
  height:160px;
  min-height:0;
  margin-bottom:1.5rem;
  overflow:hidden;
  border-radius:4px;
  border:1.5px solid var(--border-medium);
  background:var(--blush);
  transition:border-color var(--t);
}
.page-sobremim .team-card:hover .team-media{border-color:var(--caramel-ink);}
.page-sobremim .team-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.page-sobremim .team-card:first-child .team-media img{object-position:center 31%;}
.page-sobremim .team-card:nth-child(2) .team-media img{object-position:center 28%;}
.page-sobremim .team-num{
  font-family:var(--font-d);
  font-size:3rem;
  font-weight:700;
  color:rgba(64,57,50,.07);
  position:absolute;
  top:.5rem;
  right:1.25rem;
  line-height:1;
  pointer-events:none;
  user-select:none;
}
.page-sobremim .team-body{padding:0;align-self:auto;}
.page-sobremim .team-body h3{
  font-family:var(--font-d);
  font-size:1.25rem;
  font-weight:400;
  color:var(--dark);
  margin:0 0 .45rem;
}
.page-sobremim .team-role{
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--caramel-ink);
  margin:0 0 .7rem;
}
.page-sobremim .team-body p:not(.team-role){
  max-width:360px;
  font-size:.84rem;
  line-height:1.75;
  color:var(--muted-ink);
  margin:0;
}
.page-sobremim .team-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin-top:1.1rem;
}
.page-sobremim .team-tags span{
  font-size:.63rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  padding:.28rem .65rem;
  border:1px solid var(--border-caramel);
  color:var(--caramel-ink);
  border-radius:2px;
}
body.dark-mode .page-sobremim .team-card{background:var(--white);}
body.dark-mode .page-sobremim .team-card:hover{background:var(--blush);}
body.dark-mode .page-sobremim .team-body h3{color:var(--dark);}
body.dark-mode .page-sobremim .team-body p:not(.team-role){color:var(--muted-ink);}
@media(max-width:700px){
  .page-sobremim .team-grid{grid-template-columns:1fr;}
  .page-sobremim .team-card{padding:2rem 1.5rem;}
  .page-sobremim .team-media{height:160px;aspect-ratio:auto;}
}

/* V2.4 — Equipa: retratos completos, sem cortes */
.page-sobremim .team-media{
  height:auto;
  aspect-ratio:4 / 5;
  background:var(--blush);
}
.page-sobremim .team-media img,
.page-sobremim .team-card:first-child .team-media img,
.page-sobremim .team-card:nth-child(2) .team-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
}
@media(max-width:700px){
  .page-sobremim .team-media{
    height:auto;
    aspect-ratio:4 / 5;
  }
}

/* V2.5 — legibilidade global, equipa e Sobre sem scroll */
html { font-size: 17px; }
body { line-height: 1.7; }

/* Corpo de texto ligeiramente maior em todo o site, preservando labels/tags/nav */
.hero-p,
.s-sub,
.svc-desc,.ct-desc,.val-desc,.proc-desc,
.about-p,.sp-p,.cta-p,.ct-sub,.v-5,.v-15,
.proj-desc,.det-text,.det-meta,.bf-sub,.bf-note,
.form-feedback,.ct-note,.ft-copy {
  font-size: 1rem;
}

/* Sobre: conteúdo integral, sem barra de rolagem */
.about-story{
  display:grid;
  gap:1rem;
  max-height:none;
  overflow:visible;
  padding-right:0;
}
.about-story .about-p{font-size:1rem;line-height:1.72;}

/* Equipa: introdução usa a mesma largura visual do título */
.page-sobremim .team-intro{
  max-width: none;
  width: 100%;
  font-size:1rem;
  line-height:1.7;
  margin-top:.8rem;
  margin-bottom:2.5rem;
}
.page-sobremim .team-body p:not(.team-role){
  font-size:.95rem;
  line-height:1.7;
  max-width:none;
}

@media(max-width:767px){
  html{font-size:16px;}
}


/* ============================================================
   V2.7 — HERO HOME APENAS VÍDEO
   Um único vídeo ocupa toda a hero em desktop, tablet e mobile.
   ============================================================ */
body.page-home .hero-video-sec {
    position: relative !important;
    width: 100% !important;
    min-height: 100svh !important;
    height: 100svh !important;
    overflow: hidden !important;
    background: #17110e !important;
}
body.page-home .hero-cinema {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    background: #17110e !important;
}
body.page-home .hero-cinema-bg,
body.page-home .hero-bg-unified {
    display: none !important;
}
body.page-home .hero-cinema-clip,
body.page-home .hero-video {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    background: #17110e !important;
    transform: none !important;
}
body.page-home .hero-video-veu {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
}
body.page-home .hero-video-conteudo {
    position: relative !important;
    z-index: 2 !important;
}
/* V2.8 — Equipa: hierarquia CEO / equipa */
.page-sobremim .team-grid{
  grid-template-columns:1fr;
  gap:1.5px;
  max-width:100%;
}
.page-sobremim .team-card:first-child{
  display:grid;
  grid-template-columns:minmax(320px,.95fr) minmax(360px,1.05fr);
  gap:3rem;
  align-items:center;
  padding:3rem;
}
.page-sobremim .team-card:first-child .team-media{
  margin:0;
  aspect-ratio:4/5;
  max-height:620px;
}
.page-sobremim .team-card:first-child .team-body h3{font-size:1.65rem;}
.page-sobremim .team-card:first-child .team-role{font-size:.78rem;}
.page-sobremim .team-card:first-child .team-body p:not(.team-role){font-size:1rem;line-height:1.8;}
.page-sobremim .team-card:nth-child(2){
  display:grid;
  grid-template-columns:minmax(220px,320px) minmax(0,1fr);
  gap:2.25rem;
  align-items:center;
  padding:2.25rem 3rem;
}
.page-sobremim .team-card:nth-child(2) .team-media{
  margin:0;
  aspect-ratio:4/5;
  max-height:390px;
}
.page-sobremim .team-card:nth-child(2) .team-body{max-width:650px;}
@media(max-width:850px){
  .page-sobremim .team-card:first-child,
  .page-sobremim .team-card:nth-child(2){
    grid-template-columns:1fr;
    gap:1.5rem;
    padding:2rem 1.5rem;
  }
  .page-sobremim .team-card:first-child .team-media,
  .page-sobremim .team-card:nth-child(2) .team-media{
    width:100%;max-width:520px;max-height:none;margin:0 auto 1rem;
  }
}

/* ============================================================
   V3.0 — HERO HOME: texto acompanha o recuo do vídeo no mobile
   Mantém a personagem visível e evita sobreposição do conteúdo.
   ============================================================ */
@media (max-width: 991px) {
  body.page-home .hero-cinema-clip,
  body.page-home .hero-video {
    object-position: 62% center !important;
  }

  body.page-home .hero-video-conteudo {
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important;
    width: min(72vw, 470px) !important;
    max-width: 470px !important;
    padding: 0 0 2.5rem var(--pad) !important;
    background: transparent !important;
    z-index: 3 !important;
  }

  body.page-home .hero-video-veu {
    background:
      linear-gradient(90deg, rgba(24,18,14,.88) 0%, rgba(24,18,14,.66) 32%, rgba(24,18,14,.22) 58%, rgba(24,18,14,0) 78%),
      linear-gradient(0deg, rgba(24,18,14,.62) 0%, rgba(24,18,14,.08) 46%, rgba(24,18,14,0) 72%) !important;
  }

  body.page-home .hero-video-conteudo .hero-h {
    max-width: 10.5ch !important;
    font-size: clamp(2.25rem, 6.2vw, 3.7rem) !important;
    line-height: .98 !important;
  }

  body.page-home .hero-video-conteudo .hero-p {
    max-width: 34ch !important;
    font-size: clamp(.98rem, 1.8vw, 1.08rem) !important;
    line-height: 1.55 !important;
  }
}

@media (max-width: 767px) {
  body.page-home .hero-cinema-clip,
  body.page-home .hero-video {
    object-position: 66% center !important;
  }

  body.page-home .hero-video-conteudo {
    width: min(68vw, 330px) !important;
    max-width: 330px !important;
    padding: 0 0 1.75rem 1.15rem !important;
  }

  body.page-home .hero-video-conteudo .eyebrow {
    font-size: .62rem !important;
    letter-spacing: .12em !important;
    margin-bottom: .7rem !important;
  }

  body.page-home .hero-video-conteudo .hero-h {
    max-width: 9.5ch !important;
    font-size: clamp(1.95rem, 9.2vw, 2.7rem) !important;
    line-height: .98 !important;
  }

  body.page-home .hero-video-conteudo .hero-p {
    max-width: 29ch !important;
    font-size: .92rem !important;
    line-height: 1.48 !important;
    margin-top: .9rem !important;
  }

  body.page-home .hero-video-conteudo .btns {
    gap: .55rem !important;
    margin-top: 1.05rem !important;
  }

  body.page-home .hero-video-conteudo .btn-dark,
  body.page-home .hero-video-conteudo .btn-outline {
    padding: .72rem .88rem !important;
    font-size: .68rem !important;
  }

  body.page-home .hero-video-conteudo .hero-meta {
    margin-top: 1.2rem !important;
    padding-top: .85rem !important;
    gap: .65rem !important;
  }

  body.page-home .hero-video-conteudo .meta-n {
    font-size: 1.02rem !important;
  }

  body.page-home .hero-video-conteudo .meta-l {
    font-size: .58rem !important;
  }
}

@media (max-width: 430px) {
  body.page-home .hero-cinema-clip,
  body.page-home .hero-video {
    object-position: 69% center !important;
  }

  body.page-home .hero-video-conteudo {
    width: 64vw !important;
    max-width: 275px !important;
    padding-left: 1rem !important;
    padding-bottom: 1.35rem !important;
  }

  body.page-home .hero-video-conteudo .hero-h {
    font-size: clamp(1.75rem, 8.6vw, 2.35rem) !important;
  }

  body.page-home .hero-video-conteudo .hero-p {
    font-size: .84rem !important;
  }
}

/* V3.4 — Sobre / Qualidade & História: tema claro coerente */
body:not(.dark-mode).page-sobremim .split-section {
  background: var(--offwhite);
}
body:not(.dark-mode).page-sobremim .split-section .split-pair {
  background: var(--white);
  border-color: var(--border-soft);
}
body:not(.dark-mode).page-sobremim .split-section .sp-l {
  background: var(--white);
  border-right-color: var(--border-soft);
}
body:not(.dark-mode).page-sobremim .split-section .sp-r {
  background: rgba(242,221,209,.28);
}
body:not(.dark-mode).page-sobremim .split-section .s-eye,
body:not(.dark-mode).page-sobremim .split-section .sp-tag,
body:not(.dark-mode).page-sobremim .split-section .sp-link,
body:not(.dark-mode).page-sobremim .split-section .s-h em {
  color: var(--caramel-ink);
}
body:not(.dark-mode).page-sobremim .split-section .s-h,
body:not(.dark-mode).page-sobremim .split-section .sp-h {
  color: var(--dark);
}
body:not(.dark-mode).page-sobremim .split-section .sp-p {
  color: var(--muted-ink);
}
body:not(.dark-mode).page-sobremim .split-section .sp-big {
  color: rgba(202,169,148,.10);
}