/* =========================================================
   PIERRE GLACE — Sistema visual · "Couleurs de la Maison"
   Bistrô parisiense · Superfície clara (Papier)
   Papier #FFF1D7 · Encre de Nuit #15132E · Noir Absolu #0B0509
   Rouge Signature #D9251E · Rouge Chaud #E15D58
   Or Antique #9B7143 · Bois Brûlé #534131 · Bleu Pétropolis #365799
   Tipos: Playfair Display (títulos) · Jost (texto/rótulos)
   ========================================================= */

:root{
  /* Paleta */
  --papier:    #FFF1D7;
  --papier-2:  #F8E7C9;  /* superfície alternada (sutil) */
  --encre:     #15132E;
  --encre-2:   #1B1836;  /* seção escura levemente elevada */
  --noir:      #0B0509;
  --rouge:     #D9251E;  /* assinatura · CTA */
  --rouge-deep:#B71D16;
  --chaud:     #E15D58;  /* acento secundário */
  --or:        #9B7143;  /* linhas decorativas */
  --bois:      #534131;  /* suporte quente */
  --bleu:      #365799;  /* acento raro */

  /* Contextual — CLARO (padrão) */
  --surface:  var(--papier);
  --tx:       #15132E;
  --tx-soft:  rgba(21,19,46,.72);
  --tx-mut:   rgba(83,65,49,.62);
  --line:     rgba(21,19,46,.14);
  --line-2:   rgba(83,65,49,.16);
  --hair:     var(--or);
  --eyebrow:  var(--rouge);
  --card:     #F7E8CC;
  --field:    #FFFBF3;
  --card-line:rgba(83,65,49,.18);
  --pslot1:   #EEDCB6;
  --pslot2:   #E2C99B;
  --pslot-ink:rgba(83,65,49,.6);
  --pslot-line:rgba(83,65,49,.4);
  --tric-mid: #ffffff;

  --maxw: 1240px;
  --gutter: clamp(20px, 5vw, 64px);
  --serif: "Playfair Display", "Times New Roman", serif;
  --sans:  "Jost", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease: cubic-bezier(.22,.61,.36,1);

  /* Aliases de compatibilidade (resolvem por contexto) */
  --red:        var(--rouge);
  --red-deep:   var(--rouge-deep);
  --navy:       var(--encre);
  --navy-deep:  var(--card);
  --navy-panel: var(--card);
  --navy-raise: var(--line);
  --navy-line:  var(--line);
  --navy-line-2:var(--line-2);
  --on-cream:   var(--tx);
}

/* Contextual — ESCURO */
.bg-deep, .bg-panel, .bg-noir, .footer, .is-dark{
  --surface:  var(--encre);
  --tx:       #F6EAD4;
  --tx-soft:  rgba(246,234,212,.70);
  --tx-mut:   rgba(246,234,212,.46);
  --line:     rgba(246,234,212,.15);
  --line-2:   rgba(246,234,212,.09);
  --hair:     var(--or);
  --eyebrow:  var(--chaud);
  --card:     #1B1836;
  --field:    #1B1836;
  --card-line:rgba(246,234,212,.11);
  --pslot1:   #272146;
  --pslot2:   #15132E;
  --pslot-ink:rgba(246,234,212,.55);
  --pslot-line:rgba(246,234,212,.42);
  --tric-mid: #ffffff;
  /* Re-resolver aliases no contexto escuro */
  --navy-deep:  var(--card);
  --navy-panel: var(--card);
  --navy-raise: var(--line);
  --navy-line:  var(--line);
  --navy-line-2:var(--line-2);
  --red:        var(--rouge);
  --red-deep:   var(--rouge-deep);
  --on-cream:   var(--tx);
  color:var(--tx);
}

*{box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--papier);
  color:var(--tx);
  font-family:var(--sans);
  font-weight:300;
  font-size:17px;
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;}
::selection{background:var(--rouge);color:var(--papier);}

/* ---------- Layout ---------- */
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gutter); }
.section{ padding-block: clamp(72px,11vw,150px); position:relative; }
.section--tight{ padding-block: clamp(54px,8vw,96px); position:relative; }
.bg-deep{ background:var(--encre); }
.bg-panel{ background:var(--encre-2); }
.bg-noir{ background:var(--noir); }
.bg-soft{ background:var(--papier-2); }
.bg-cream{ background:var(--papier); }

/* ---------- Type ---------- */
.eyebrow{
  font-family:var(--sans); font-weight:500; font-size:12px;
  letter-spacing:.34em; text-transform:uppercase; color:var(--eyebrow);
  display:inline-flex; align-items:center; gap:.85em; margin:0 0 22px;
}
.eyebrow::before{ content:""; width:30px; height:1px; background:currentColor; opacity:.85; }
.eyebrow.is-centered{ justify-content:center; }
.eyebrow.is-centered::after{ content:""; width:30px; height:1px; background:currentColor; opacity:.85; }

h1,h2,h3,h4{ font-family:var(--serif); font-weight:500; line-height:1.06; margin:0; color:var(--tx); }
.display{ font-size:clamp(44px,7.4vw,104px); font-weight:500; letter-spacing:-.012em; line-height:.99; }
.h-xl{ font-size:clamp(34px,4.6vw,64px); letter-spacing:-.01em; line-height:1.04; }
.h-lg{ font-size:clamp(28px,3.4vw,46px); letter-spacing:-.005em; }
.h-md{ font-size:clamp(22px,2.4vw,30px); }
.serif-it{ font-style:italic; }
.accent{ color:var(--rouge); }
.is-dark .accent, .bg-deep .accent, .bg-panel .accent, .bg-noir .accent{ color:var(--chaud); }

.lead{ font-size:clamp(17px,1.5vw,20px); line-height:1.74; color:var(--tx-soft); font-weight:300; max-width:60ch; }
p{ margin:0 0 1.1em; }
.muted{ color:var(--tx-mut); }

/* ---------- Devices ---------- */
.tricolore{ display:inline-flex; height:3px; width:74px; border-radius:2px; overflow:hidden;
  box-shadow:0 0 0 1px var(--line-2); }
.tricolore i{ flex:1; }
.tricolore i:nth-child(1){ background:var(--bleu); }
.tricolore i:nth-child(2){ background:var(--tric-mid); }
.tricolore i:nth-child(3){ background:var(--rouge); }
.tricolore--lg{ width:104px; height:4px; }

/* régua dourada decorativa */
.goldrule{ display:inline-flex; align-items:center; gap:12px; color:var(--or); }
.goldrule::before, .goldrule::after{ content:""; height:1px; width:54px; background:currentColor; opacity:.8; }
.goldrule span{ width:6px; height:6px; transform:rotate(45deg); border:1px solid currentColor; }

/* ---------- Buttons ---------- */
.btn{
  --bg:var(--rouge); --fg:#FFF1DD;
  display:inline-flex; align-items:center; gap:.7em;
  font-family:var(--sans); font-weight:500; font-size:13px; letter-spacing:.18em; text-transform:uppercase;
  padding:16px 30px; border:1px solid transparent; border-radius:0;
  background:var(--bg); color:var(--fg); cursor:pointer;
  transition:.4s var(--ease); position:relative; white-space:nowrap;
}
.btn:hover{ background:var(--rouge-deep); transform:translateY(-2px); }
.btn .arr{ transition:transform .4s var(--ease); }
.btn:hover .arr{ transform:translateX(4px); }
.btn--ghost{ background:transparent; color:var(--tx); border-color:var(--line); }
.btn--ghost:hover{ background:color-mix(in srgb, var(--tx) 7%, transparent); border-color:var(--tx); transform:translateY(-2px); }
.btn--ink{ background:var(--encre); color:var(--papier); }
.btn--ink:hover{ background:var(--noir); }

.tlink{
  display:inline-flex; align-items:center; gap:.6em;
  font-weight:500; font-size:12.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--tx); padding-bottom:5px; position:relative; width:fit-content;
}
.tlink::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:100%; background:var(--line); }
.tlink::before{ content:""; position:absolute; left:0; bottom:0; height:1px; width:0; background:var(--rouge); transition:width .45s var(--ease); z-index:1; }
.tlink:hover::before{ width:100%; }
.tlink .arr{ color:var(--rouge); transition:transform .4s var(--ease); }
.tlink:hover .arr{ transform:translateX(5px); }

/* ---------- Header / Nav ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:90;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--gutter); transition:.45s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:color-mix(in srgb, var(--papier) 86%, transparent);
  backdrop-filter:blur(16px) saturate(1.2); -webkit-backdrop-filter:blur(16px) saturate(1.2);
  border-bottom-color:var(--line-2); padding-block:13px;
}
.nav__brand{ display:flex; align-items:center; gap:13px; }
.nav__brand img{ height:42px; width:auto; transition:height .4s var(--ease); }
.nav.scrolled .nav__brand img{ height:36px; }
.nav__word{ display:flex; flex-direction:column; line-height:1; }
.nav__word b{ font-family:var(--serif); font-weight:600; font-size:20px; letter-spacing:.14em; color:var(--encre); }
.nav__word span{ font-family:var(--sans); font-weight:500; font-size:9px; letter-spacing:.4em; text-transform:uppercase; color:var(--or); margin-top:5px; }

.nav__links{ display:flex; align-items:center; gap:36px; }
.nav__links a{
  font-family:var(--sans); font-weight:400; font-size:13px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--tx-soft); position:relative; padding:6px 0; transition:color .3s var(--ease);
}
.nav__links a::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:0; background:var(--rouge); transition:width .4s var(--ease); }
.nav__links a:hover{ color:var(--encre); }
.nav__links a:hover::after, .nav__links a[aria-current="page"]::after{ width:100%; }
.nav__links a[aria-current="page"]{ color:var(--encre); }
.nav__cta{ margin-left:8px; padding:13px 22px; }

.nav__burger{ display:none; background:none; border:0; cursor:pointer; padding:8px; flex-direction:column; gap:5px; }
.nav__burger span{ width:24px; height:1.5px; background:var(--encre); transition:.3s; }

/* drawer */
.drawer{ position:fixed; inset:0; z-index:95; background:var(--encre);
  display:flex; flex-direction:column; justify-content:center; gap:8px; padding:var(--gutter);
  transform:translateY(-100%); transition:transform .5s var(--ease); opacity:0; visibility:hidden; }
.drawer.open{ transform:translateY(0); opacity:1; visibility:visible; }
.drawer a{ font-family:var(--serif); font-size:34px; padding:12px 0; color:var(--papier); border-bottom:1px solid rgba(246,234,212,.12); }
.drawer a .i{ font-family:var(--sans); font-size:12px; color:var(--chaud); letter-spacing:.2em; margin-right:14px; }
.drawer__close{ position:absolute; top:24px; right:var(--gutter); background:none; border:0; color:var(--papier); font-size:30px; cursor:pointer; font-family:var(--sans); font-weight:200; }

/* ---------- Footer ---------- */
.footer{ background:var(--noir); border-top:3px solid var(--rouge); padding:clamp(56px,8vw,96px) var(--gutter) 36px; position:relative; overflow:hidden; }
.footer__grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1.5fr 1fr 1fr 1.3fr; gap:48px; }
.footer__brand img{ height:64px; margin-bottom:20px; }
.footer__brand p{ color:var(--tx-mut); max-width:30ch; font-size:15px; }
.footer h5{ font-family:var(--sans); font-weight:500; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--or); margin:0 0 22px; }
.footer__col a, .footer__col p{ display:block; color:var(--tx-soft); font-size:15px; margin-bottom:13px; transition:color .3s; }
.footer__col a:hover{ color:var(--chaud); }
.footer__bar{ max-width:var(--maxw); margin:54px auto 0; padding-top:26px; border-top:1px solid var(--line-2); display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; }
.footer__bar small{ color:var(--tx-mut); font-size:12.5px; letter-spacing:.04em; }

/* ---------- Placeholder de foto ---------- */
.pslot{ position:relative; overflow:hidden; isolation:isolate;
  background:linear-gradient(150deg, var(--t1,var(--pslot1)), var(--t2,var(--pslot2)));
  border:1px solid var(--card-line); }
.pslot::after{ content:""; position:absolute; inset:0; z-index:1;
  background:radial-gradient(120% 90% at 25% 12%, rgba(255,255,255,.22), transparent 55%),
            radial-gradient(90% 80% at 90% 100%, rgba(83,65,49,.18), transparent 60%); }
.pslot__mark{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; }
.pslot__ring{ width:62px; height:62px; border:1px solid var(--pslot-line); border-radius:50%; display:grid; place-items:center; color:var(--pslot-ink); }
.pslot__ring svg{ width:26px; height:26px; }
.pslot__mono{ font-family:var(--serif); font-style:italic; font-size:26px; color:var(--pslot-ink); }
.pslot__tag{ position:absolute; left:14px; bottom:13px; z-index:3; display:inline-flex; align-items:center; gap:7px;
  font-family:var(--sans); font-weight:500; font-size:9.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--pslot-ink); }
.pslot__tag::before{ content:"+"; display:grid; place-items:center; width:15px; height:15px; border:1px solid var(--pslot-line); font-size:11px; line-height:1; }
.pslot__img{ position:absolute; inset:0; z-index:2; width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- Reveal ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.08s; }
.reveal[data-d="2"]{ transition-delay:.16s; }
.reveal[data-d="3"]{ transition-delay:.24s; }
.reveal[data-d="4"]{ transition-delay:.32s; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  html{ scroll-behavior:auto; }
}

/* ---------- Ratings ---------- */
.stars{ display:inline-flex; gap:3px; color:var(--rouge); }
.is-dark .stars, .bg-deep .stars, .bg-panel .stars{ color:var(--chaud); }
.stars svg{ width:15px; height:15px; }
.stars .empty{ color:var(--line); }

/* ---------- Utils ---------- */
.center{ text-align:center; }
.mx-auto{ margin-inline:auto; }
.flex{ display:flex; }
.between{ justify-content:space-between; }
.items-center{ align-items:center; }
.gap-s{ gap:14px; } .gap-m{ gap:28px; } .gap-l{ gap:48px; }
.mt-s{ margin-top:18px;} .mt-m{ margin-top:34px;} .mt-l{ margin-top:56px;}
.w-fit{ width:fit-content; }

@media (max-width: 980px){
  .nav__links{ display:none; }
  .nav__burger{ display:flex; }
  .footer__grid{ grid-template-columns:1fr 1fr; gap:36px; }
}
@media (max-width: 560px){
  body{ font-size:16px; }
  .footer__grid{ grid-template-columns:1fr; }
}