/* ==========================================================================
   DUO CLASSIC BLEND — Home
   Tokens and layout taken from "Duo Classic Blend - Home.dc.html".
   ========================================================================== */

:root {
  --cream:      #FDF9F3;
  --ink:        #2B1710;
  --brown:      #4A2618;
  --brown-lift: #56301F;
  --darkest:    #1B0F0A;
  --amber:      #E0A45F;
  --terracotta: #B9713F;
  --light:      #F7EFE3;
  --panel:      rgba(243, 231, 215, .88);

  --muted-warm:  #CBB4A2;
  --muted-body:  #6A5347;
  --muted-card:  #DCC8B7;
  --muted-svc:   #D8C4B4;
  --muted-faint: #B6A091;
  --on-terra:    #F6DCC1;

  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans:  'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --gutter: clamp(16px, 4vw, 44px);
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; transition: color .3s ease; }
a:hover { color: #8A4F2D; }

img, video { display: block; max-width: 100%; }

h1, h2 { margin: 0; font-family: var(--serif); font-weight: 300; }
p { margin: 0; }

button { font: inherit; }

:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* --- shared atoms ------------------------------------------------------- */

.page { position: relative; isolation: isolate; width: 100%; overflow: hidden; }

.section       { padding: 68px var(--gutter); }
.section--duo  { padding: 66px var(--gutter); display: flex; flex-direction: column; gap: 30px; }
.section--dark { background: var(--brown); color: var(--light); position: relative; isolation: isolate; overflow: hidden; }
.section--ink  { background: var(--ink);   color: var(--light); position: relative; isolation: isolate; overflow: hidden; }

.section-head {
  display: flex; flex-wrap: wrap; align-items: baseline;
  justify-content: space-between; gap: 14px;
}

.section-head__split {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 18px 34px; align-items: start;
}
.section-head__split h2 { font-size: clamp(30px, 4.2vw, 52px); line-height: 1.06; }
.section-head__split p  { font-size: 16.5px; line-height: 1.8; color: var(--muted-body); }

.section-title { font-size: clamp(30px, 4.2vw, 52px); }

/* pill / eyebrow variants */
.pill {
  display: inline-flex; align-items: center; gap: 9px;
  border-radius: 999px; white-space: nowrap;
  font-size: 11px; letter-spacing: .2em; text-transform: uppercase;
}
.pill--tag    { padding: 10px 20px; border: 1px solid rgba(43, 23, 16, .22); color: var(--terracotta); }
.pill--onDark { padding: 10px 20px; border: 1px solid rgba(224, 164, 95, .45); color: var(--amber); }
.pill--hero   { padding: 9px 18px;  border: 1px solid rgba(224, 164, 95, .45); color: var(--amber); letter-spacing: .28em; }
.pill--amber  { padding: 7px 15px;  background: var(--amber); color: var(--ink); font-size: 10.5px; }
.pill--ink    { padding: 7px 15px;  background: var(--ink); color: var(--amber); font-size: 10.5px; }
.pill--terra  { padding: 7px 15px;  background: var(--terracotta); color: var(--cream); font-size: 10.5px; }
.pill--ghost  { padding: 8px 16px;  background: rgba(247, 239, 227, .08); color: var(--muted-warm); font-size: 11px; letter-spacing: .14em; }

.btn {
  display: inline-flex; align-items: center; gap: 10px;
  border-radius: 999px; border: 0; cursor: pointer;
  font-family: var(--sans); font-size: 12.5px;
  letter-spacing: .16em; text-transform: uppercase; font-weight: 500;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.btn--amber   { padding: 17px 30px; background: var(--amber); color: var(--ink); }
.btn--amber:hover  { background: var(--light); color: var(--ink); }
.btn--outline { padding: 17px 28px; border: 1px solid rgba(247, 239, 227, .35); color: var(--light); background: transparent; }
.btn--outline:hover { border-color: var(--amber); color: var(--light); }

/* --- ambient background decor ------------------------------------------ */

.decor { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.decor > * { position: absolute; }

.decor__glow      { border-radius: 50%; }
.decor__ring      { border-radius: 50%; border: 1px solid rgba(43, 23, 16, .1); }
.decor__arch      { border: 1px solid rgba(139, 86, 48, .22); border-radius: 160px 160px 0 0; }
.decor__hairline  { width: 1px; background: linear-gradient(180deg, rgba(43,23,16,0), rgba(43,23,16,.16), rgba(43,23,16,0)); }

.decor--page .g1   { top: -180px; left: -160px; width: 760px; height: 760px; background: radial-gradient(circle at 40% 40%, rgba(224,164,95,.24), rgba(224,164,95,0) 68%); filter: blur(10px); }
.decor--page .g2   { top: 620px; right: -220px; width: 900px; height: 900px; background: radial-gradient(circle at 55% 45%, rgba(185,113,63,.17), rgba(185,113,63,0) 66%); }
.decor--page .g3   { top: 1500px; left: -280px; width: 820px; height: 820px; background: radial-gradient(circle at 50% 50%, rgba(139,86,48,.14), rgba(139,86,48,0) 68%); }
.decor--page .g4   { top: 2400px; right: -180px; width: 700px; height: 700px; background: radial-gradient(circle at 50% 50%, rgba(224,164,95,.18), rgba(224,164,95,0) 66%); }
.decor--page .h1_  { top: 380px; left: 52%; height: 520px; }
.decor--page .r1   { top: 1180px; left: 14%; width: 300px; height: 300px; }
.decor--page .r2   { top: 2050px; right: 12%; width: 420px; height: 420px; border-color: rgba(43,23,16,.08); }
.decor--page .a1   { top: 240px; right: 6%; width: 320px; height: 470px; }
.decor--page .a2   { top: 1520px; left: 4%; width: 260px; height: 380px; border-color: rgba(139,86,48,.18); border-radius: 130px 130px 0 0; }
.decor--page .a3   { top: 2300px; left: 8%; width: 230px; height: 330px; border-color: rgba(139,86,48,.16); border-radius: 115px 115px 0 0; }
.decor--page .q1   { top: 1720px; right: 0; width: 150px; height: 150px; background: rgba(224,164,95,.38); border-radius: 75px 0 0 0; }

.decor--panel .a1 { top: 60px; right: 5%; width: 300px; height: 430px; border-color: rgba(224,164,95,.26); border-radius: 150px 150px 0 0; }
.decor--panel .q1 { bottom: -60px; left: -40px; width: 220px; height: 220px; background: rgba(224,164,95,.5); border-radius: 110px 110px 0 0; }
.decor--panel .g1 { top: 40%; left: 32%; width: 460px; height: 460px; border-radius: 50%; background: radial-gradient(circle, rgba(224,164,95,.13), rgba(224,164,95,0) 68%); }

.grain {
  position: absolute; inset: 0; opacity: .05;
  mix-blend-mode: multiply; background-repeat: repeat;
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27220%27%20height%3D%27220%27%3E%3Cfilter%20id%3D%27n%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.85%27%20numOctaves%3D%273%27%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%27220%27%20height%3D%27220%27%20filter%3D%27url%28%23n%29%27%20opacity%3D%270.5%27%2F%3E%3C%2Fsvg%3E");
}

/* --- nav ---------------------------------------------------------------- */

.nav {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: 14px;
  padding: 16px var(--gutter);
  background: rgba(253, 249, 243, .94);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(43, 23, 16, .10);
  position: sticky; top: 0; z-index: 60;
}

.nav__brand { display: flex; align-items: center; gap: 12px; }
.nav__logo  { height: 42px; width: auto; }
.nav__words { display: flex; flex-direction: column; gap: 2px; line-height: 1; }
.nav__name  { font-family: var(--serif); font-weight: 500; font-size: 19px; letter-spacing: .13em; white-space: nowrap; }
.nav__sub   { font-size: 9px; letter-spacing: .3em; color: var(--terracotta); text-transform: uppercase; }

.nav__burger {
  display: none; width: 46px; height: 46px; border-radius: 14px;
  border: 1px solid rgba(43, 23, 16, .2); background: transparent;
  color: var(--ink); align-items: center; justify-content: center; cursor: pointer;
}

.nav__menu {
  display: flex; flex-wrap: wrap; align-items: center; gap: 16px 22px;
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
  color: #4A2618; white-space: nowrap;
}

.nav__cta {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 12px 22px; background: var(--ink); color: var(--light);
  border-radius: 999px; letter-spacing: .14em;
  transition: background .3s ease, color .3s ease;
}
.nav__cta:hover { background: var(--terracotta); color: var(--light); }

/* --- hero --------------------------------------------------------------- */

.hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--ink);
  min-height: clamp(560px, 72vh, 780px);
  padding: clamp(64px, 9vw, 120px) var(--gutter) clamp(56px, 8vw, 96px);
  display: flex; align-items: center; color: var(--light);
}

.hero__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; background: var(--darkest); }
.hero__bg img,
.hero__bg .hero__wash,
.hero__bg .hero__scrim { position: absolute; inset: 0; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; }

.hero__slide--1 { object-position: 60% 18%; filter: brightness(1.04) saturate(1.02); animation: heroFade 21s linear infinite; }
.hero__slide--2 { object-position: 30% 22%; filter: brightness(1.06) saturate(1.02); opacity: 0; animation: heroFade 21s linear 7s infinite; }
.hero__slide--3 { object-position: 62% 34%; filter: brightness(1.04) saturate(1.02); opacity: 0; animation: heroFade 21s linear 14s infinite; }

.hero__wash { mix-blend-mode: soft-light; }
/* Tom âmbar discreto: as fotos já vêm tratadas, só amarramos com a paleta. */
.hero__wash--1 { background: linear-gradient(115deg, rgba(70,40,22,.34), rgba(224,164,95,.14) 58%, rgba(43,23,16,.3)); animation: heroFade 21s linear infinite; }
.hero__wash--2 { background: linear-gradient(115deg, rgba(70,40,22,.3), rgba(224,164,95,.16) 60%, rgba(43,23,16,.28)); opacity: 0; animation: heroFade 21s linear 7s infinite; }
.hero__wash--3 { background: linear-gradient(115deg, rgba(70,40,22,.32), rgba(224,164,95,.13) 56%, rgba(43,23,16,.3)); opacity: 0; animation: heroFade 21s linear 14s infinite; }

.hero__scrim--side { background: linear-gradient(100deg, rgba(27,15,10,.9) 0%, rgba(27,15,10,.66) 30%, rgba(27,15,10,.16) 58%, rgba(27,15,10,.06) 100%); }
.hero__scrim--spot { background: radial-gradient(closest-side at 72% 44%, rgba(224,164,95,.22), rgba(224,164,95,0) 72%); mix-blend-mode: screen; }
.hero__scrim--edge { background: linear-gradient(180deg, rgba(27,15,10,.4) 0%, rgba(27,15,10,0) 26%, rgba(27,15,10,0) 74%, rgba(27,15,10,.55) 100%); }

@keyframes heroFade {
  0%, 28%  { opacity: 1; }
  38%, 90% { opacity: 0; }
  100%     { opacity: 1; }
}

.hero__content { position: relative; display: flex; flex-direction: column; gap: 26px; max-width: 660px; }
.hero__content .pill--hero { align-self: flex-start; }

.hero__title {
  font-size: clamp(38px, 6.4vw, 80px); line-height: 1.02;
  letter-spacing: -.015em; text-wrap: pretty;
}
.hero__title em { font-style: italic; color: var(--amber); }

.hero__lede {
  max-width: 480px; font-size: clamp(15px, 1.3vw, 16.5px);
  line-height: 1.75; color: var(--muted-warm);
}

.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding-top: 6px; }
.hero__badges  { display: flex; gap: 10px; flex-wrap: wrap; padding-top: 16px; }

.hero__strip { display: none; }

/* --- amber ticker ------------------------------------------------------- */

.ticker {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 10px 18px; padding: 16px var(--gutter);
  background: var(--amber); color: var(--ink);
  font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; font-weight: 500;
}

/* --- o duo -------------------------------------------------------------- */

.duo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 22px; }

.duo-card {
  position: relative; aspect-ratio: 1 / 1; min-height: 380px;
  border-radius: 28px; overflow: hidden; background: var(--ink);
  transition: transform .45s ease, box-shadow .45s ease;
}
.duo-card:hover { transform: translateY(-8px); box-shadow: 0 28px 60px rgba(43, 23, 16, .32); }

.duo-card__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 50%;
  filter: saturate(.86) brightness(.9); transform: scale(1);
  transition: transform .7s cubic-bezier(.2, .7, .2, 1), filter .5s ease;
}
.duo-card:hover .duo-card__img { transform: scale(1.07); filter: saturate(1.05) brightness(1); }

.duo-card__veil {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(43,23,16,0) 38%, rgba(43,23,16,.6) 66%, rgba(43,23,16,.94) 100%);
}

.duo-card__body {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 30px;
  display: flex; flex-direction: column; gap: 10px; color: var(--light);
}
.duo-card__body .pill--amber { align-self: flex-start; letter-spacing: .2em; }
.duo-card__name { font-family: var(--serif); font-size: clamp(28px, 3vw, 40px); line-height: 1.04; }
.duo-card__body p { font-size: 14.5px; line-height: 1.7; color: var(--muted-card); max-width: 360px; }
.duo-card__handle { font-size: 12.5px; letter-spacing: .08em; color: var(--amber); }

/* --- serviços ----------------------------------------------------------- */

.svc-head { margin-bottom: 28px; }
.svc-head__tools { display: flex; align-items: center; gap: 12px; }
.svc-nav { display: flex; gap: 8px; }

.svc-nav button {
  width: 42px; height: 42px; border-radius: 999px;
  border: 1px solid rgba(224, 164, 95, .45);
  background: transparent; color: var(--amber);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  transition: background .3s ease, color .3s ease;
}
.svc-nav button:hover { background: var(--amber); color: var(--ink); }

/* Variante para seções claras (galeria). */
.svc-nav--ink button { border-color: rgba(43, 23, 16, .28); color: var(--ink); }
.svc-nav--ink button:hover { background: var(--ink); color: var(--amber); }

.svc-rail {
  display: flex; gap: 18px; overflow-x: auto;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; padding-bottom: 4px;
}
.svc-rail::-webkit-scrollbar { display: none; }
.svc-rail > .svc-card { flex: 0 0 320px; scroll-snap-align: start; }

.svc-card {
  position: relative; height: 340px; border-radius: 24px;
  overflow: hidden; background: var(--ink);
  transition: transform .4s ease, box-shadow .4s ease;
}
.svc-card:hover { transform: translateY(-6px); box-shadow: 0 26px 54px rgba(0, 0, 0, .4); }

.svc-card__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; filter: saturate(.85) brightness(.72);
  transition: transform .7s cubic-bezier(.2, .7, .2, 1), filter .5s ease;
}
.svc-card:hover .svc-card__img { transform: scale(1.07); filter: saturate(1) brightness(.86); }

.svc-card__veil {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(43,23,16,.1) 30%, rgba(43,23,16,.72) 66%, rgba(43,23,16,.95) 100%);
}
.svc-card__body {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 26px 28px;
  display: flex; flex-direction: column; gap: 9px; color: var(--light);
}
.svc-card__num   { font-size: 11px; letter-spacing: .22em; color: var(--amber); }
.svc-card__title { font-family: var(--serif); font-size: 27px; line-height: 1.1; }
.svc-card__body p { font-size: 14px; line-height: 1.65; color: var(--muted-svc); }

/* --- repertório --------------------------------------------------------- */

.rep { display: flex; flex-direction: column; gap: 28px; }
.rep-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); gap: 22px; }

.rep-card {
  background: var(--panel); border-radius: 24px; padding: 32px 28px;
  display: flex; flex-direction: column; gap: 14px;
  transition: transform .35s ease, box-shadow .35s ease;
}
.rep-card:hover { transform: translateY(-6px); box-shadow: 0 22px 46px rgba(43, 23, 16, .16); }

.rep-card__icon {
  width: 56px; height: 56px; border-radius: 16px; background: var(--ink);
  display: flex; align-items: center; justify-content: center; color: var(--amber);
}
.rep-card .pill--ink { align-self: flex-start; }
.rep-card__title { font-family: var(--serif); font-size: clamp(25px, 2.2vw, 31px); line-height: 1.12; }
.rep-card p { font-size: 14.5px; line-height: 1.75; color: var(--muted-body); }

.rep-note {
  display: flex; align-items: center; gap: 16px;
  padding: 20px 26px; border: 1px dashed rgba(43, 23, 16, .25); border-radius: 999px;
}
.rep-note span:last-child { font-size: 15.5px; color: var(--muted-body); }

/* --- ouça o duo (vídeos) ------------------------------------------------ */

.videos { display: flex; flex-direction: column; gap: 34px; }
.videos .section-title { font-size: clamp(32px, 4.6vw, 56px); }

.v-rail {
  display: flex; gap: 18px; overflow-x: auto;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; padding-bottom: 4px;
}
.v-rail::-webkit-scrollbar { display: none; }
.v-rail > .v-tile {
  flex: 0 0 clamp(258px, 28vw, 318px);
  height: clamp(240px, 28vw, 300px);
  scroll-snap-align: start;
}

.v-tile {
  position: relative; border-radius: 24px; overflow: hidden;
  background: var(--darkest); cursor: pointer; border: 0; padding: 0;
  width: 100%; text-align: left; color: inherit; font: inherit;
  transition: transform .4s ease, box-shadow .4s ease;
}
.v-tile:hover { transform: translateY(-5px); }

.v-tile--feature { border-radius: 28px; }
.v-rail > .v-tile--feature { flex: 0 0 clamp(300px, 40vw, 470px); }
.v-tile--feature:hover { transform: translateY(-6px); box-shadow: 0 26px 54px rgba(0, 0, 0, .45); }

.v-tile video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.v-tile:not(.v-tile--feature) video { opacity: .82; }

.v-tile__veil { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(27,15,10,.1) 40%, rgba(27,15,10,.85) 100%); }
.v-tile--feature .v-tile__veil { background: linear-gradient(180deg, rgba(27,15,10,.15) 0%, rgba(27,15,10,0) 40%, rgba(27,15,10,.88) 100%); }

.v-tile__body {
  position: absolute; left: 20px; right: 20px; bottom: 18px;
  display: flex; flex-direction: column; gap: 9px; pointer-events: none;
}
.v-tile--feature .v-tile__body { left: 26px; right: 26px; bottom: 26px; gap: 12px; }

.v-tile__cue {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 15px; border-radius: 999px;
  background: rgba(247, 239, 227, .16); color: var(--light);
  font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
}
.v-tile--feature .v-tile__cue {
  gap: 9px; padding: 9px 18px; background: var(--amber); color: var(--ink);
  font-size: 10.5px; letter-spacing: .2em;
}

.v-tile__title { font-family: var(--serif); font-size: clamp(18px, 1.7vw, 23px); line-height: 1.14; color: var(--light); }
.v-tile--feature .v-tile__title { font-size: clamp(24px, 2.6vw, 34px); line-height: 1.12; }

/* --- onde já tocamos ---------------------------------------------------- */

.where {
  background: rgba(243, 231, 215, .82); color: var(--ink);
  display: flex; flex-direction: column; gap: 40px;
}
.where-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); gap: 20px; }

.where-card {
  background: var(--brown); border-radius: 24px; padding: 34px 30px 32px;
  display: flex; flex-direction: column; gap: 14px; min-height: 230px;
  transition: transform .35s ease, background .35s ease;
}
.where-card:hover { transform: translateY(-6px); background: var(--brown-lift); }
.where-card__num   { font-family: var(--serif); font-size: 54px; line-height: 1; color: var(--amber); }
.where-card__title { font-family: var(--serif); font-size: 30px; color: var(--light); }
.where-card p { font-size: 14.5px; line-height: 1.7; color: var(--muted-warm); }

/* --- galeria ------------------------------------------------------------ */

.gallery { padding-bottom: 70px; display: flex; flex-direction: column; gap: 26px; }

.gallery-rail {
  display: flex; gap: 18px; overflow-x: auto;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; padding-bottom: 4px;
}
.gallery-rail::-webkit-scrollbar { display: none; }
.gallery-rail figure {
  margin: 0; flex: 0 0 clamp(240px, 26vw, 300px);
  height: clamp(250px, 30vw, 340px);
  border-radius: 24px; overflow: hidden; scroll-snap-align: start;
}
.gallery-rail img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .7s cubic-bezier(.2, .7, .2, 1);
}
.gallery-rail figure:hover img { transform: scale(1.06); }
.gal-shot {
  display: block; width: 100%; height: 100%;
  padding: 0; border: 0; background: none; border-radius: inherit;
  cursor: zoom-in; overflow: hidden;
}
.gal-shot:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }

.gallery__more { display: flex; justify-content: center; padding-top: 10px; }
.gallery__more a {
  display: inline-flex; align-items: center; gap: 12px; padding: 19px 40px;
  border: 1px solid rgba(43, 23, 16, .28); border-radius: 999px;
  font-size: 12.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink);
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.gallery__more a:hover { background: var(--ink); color: var(--amber); border-color: var(--ink); }

/* --- cta ---------------------------------------------------------------- */

.cta-wrap { padding: 40px var(--gutter) 56px; }
.cta {
  background: var(--terracotta); color: #FFF7EC; border-radius: 40px;
  padding: clamp(36px, 5vw, 66px) clamp(22px, 4vw, 56px);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 32px;
}
.cta__copy { display: flex; flex-direction: column; gap: 14px; }
.cta__eyebrow { font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--on-terra); }
.cta__title { font-size: clamp(31px, 4.4vw, 54px); line-height: 1.06; max-width: 600px; }
.cta__copy p { font-size: 15.5px; color: var(--on-terra); }
.cta__btn {
  display: inline-flex; align-items: center; gap: 12px; padding: 21px 36px;
  background: var(--ink); color: var(--amber); border-radius: 999px;
  font-size: 13px; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap;
  transition: background .3s ease, color .3s ease;
}
.cta__btn:hover { background: var(--cream); color: var(--ink); }

/* --- footer ------------------------------------------------------------- */

.footer {
  padding: 46px var(--gutter); background: var(--ink); color: var(--muted-warm);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 20px; font-size: 12.5px; letter-spacing: .08em;
}
.footer__brand { display: flex; align-items: center; gap: 14px; }
.footer__logo { height: 34px; width: auto; filter: brightness(0) invert(1); }
.footer__domain { color: var(--amber); }
.footer__links { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.footer__links a {
  display: inline-flex; align-items: center; gap: 9px; padding: 11px 20px;
  border: 1px solid rgba(247, 239, 227, .22); border-radius: 999px;
  color: var(--muted-warm); font-size: 12px; letter-spacing: .06em; white-space: nowrap;
  transition: border-color .3s ease, color .3s ease, background .3s ease;
}
.footer__links a:hover { border-color: var(--amber); color: var(--amber); }
.footer__links a.is-wa { background: var(--amber); color: var(--ink); border-color: var(--amber); }
.footer__links a.is-wa:hover { background: var(--light); color: var(--ink); border-color: var(--light); }

/* --- floating whatsapp -------------------------------------------------- */

.wa-float {
  position: fixed; right: 22px; bottom: 22px; z-index: 150;
  display: inline-flex; align-items: center; gap: 11px; padding: 15px 22px;
  border-radius: 999px; background: var(--amber); color: var(--ink);
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
  box-shadow: 0 16px 38px rgba(43, 23, 16, .34);
  transition: background .3s ease, color .3s ease;
}
.wa-float:hover { background: var(--light); color: var(--ink); }

/* --- video modal -------------------------------------------------------- */

.modal {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(27, 15, 10, .94);
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  padding: clamp(14px, 2.4vw, 32px); overflow: auto;
}
.modal[hidden] { display: none; }

.modal__inner { display: flex; flex-direction: column; align-items: center; gap: 14px; margin: auto; }

/* Duplicava o título do painel no desktop; reaparece <=900px, onde o painel some. */
.modal__label {
  display: none;
  padding: 11px 22px; border-radius: 999px;
  background: rgba(247, 239, 227, .12); color: var(--light);
  font-family: var(--serif); font-size: 22px;
}

.modal__shell {
  display: flex; align-items: stretch; justify-content: center; gap: 24px;
  width: min(1180px, 94vw); max-height: min(560px, calc(100vh - 200px));
}

.modal__frame {
  position: relative; flex: 0 0 auto; align-self: stretch;
  width: min(430px, 40vw); min-height: 320px;
  border-radius: 26px; overflow: hidden;
  background: #120A06; box-shadow: 0 40px 90px rgba(0, 0, 0, .6);
}
.modal__video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 24%;
}

.modal__panel {
  flex: 1 1 auto; max-width: 360px; min-height: 0;
  display: flex; flex-direction: column; justify-content: flex-start; gap: 11px;
}
.modal__eyebrow { font-size: 11px; letter-spacing: .32em; text-transform: uppercase; color: var(--amber); }
.modal__title   { font-family: var(--serif); font-weight: 300; font-size: clamp(22px, 2vw, 28px); line-height: 1.06; color: var(--light); }
.modal__desc    { font-size: 13.5px; line-height: 1.65; color: var(--muted-warm); }
.modal__listlabel { font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted-faint); padding-top: 2px; }

.modal__list {
  display: flex; flex-direction: column; gap: 7px;
  flex: 1 1 auto; min-height: 0; overflow-y: auto;
  padding-right: 6px; overscroll-behavior: contain;
  scrollbar-width: thin; scrollbar-color: rgba(247, 239, 227, .28) transparent;
}
.modal__list::-webkit-scrollbar { width: 6px; }
.modal__list::-webkit-scrollbar-track { background: transparent; }
.modal__list::-webkit-scrollbar-thumb { background: rgba(247, 239, 227, .28); border-radius: 999px; }

.modal__item {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 9px 14px; border: 1px solid rgba(247, 239, 227, .16); border-radius: 14px;
  background: transparent; color: var(--light);
  font-family: var(--sans); text-align: left; cursor: pointer;
  transition: border-color .3s ease, background .3s ease, color .3s ease;
}
.modal__item:hover { border-color: var(--amber); }
.modal__item span { display: flex; flex-direction: column; gap: 2px; }
.modal__item-name { font-family: var(--serif); font-size: 16.5px; line-height: 1.18; }
.modal__item-tag  { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted-faint); }
.modal__item svg  { flex: 0 0 auto; fill: currentColor; }

.modal__item.is-active {
  background: var(--amber); border-color: var(--amber); color: var(--ink);
}
.modal__item.is-active .modal__item-tag { color: rgba(43, 23, 16, .68); }

.modal__controls { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; }

.modal__btn {
  display: inline-flex; align-items: center; gap: 9px; padding: 13px 22px;
  border: 0; border-radius: 999px; cursor: pointer;
  font-family: var(--sans); font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.modal__btn--play  { background: var(--light); color: var(--ink); }
.modal__btn--play:hover { background: var(--amber); }
.modal__btn--ig    { background: var(--amber); color: var(--ink); letter-spacing: .14em; }
.modal__btn--ig:hover { background: var(--light); color: var(--ink); }
.modal__btn--close { background: transparent; color: var(--light); border: 1px solid rgba(247, 239, 227, .35); }
.modal__btn--close:hover { border-color: var(--amber); color: var(--amber); }

/* --- release ------------------------------------------------------------ */

.release { display: flex; flex-direction: column; gap: 30px; }

.release-duo {
  display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(20px, 3vw, 40px);
  align-items: stretch;
  background: var(--panel); border-radius: 28px; overflow: hidden;
  border: 1px solid rgba(43, 23, 16, .08);
}
.release-duo__media { position: relative; min-height: 340px; }
.release-duo__media img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; filter: saturate(.96);
}
.release-duo__body {
  padding: clamp(26px, 3vw, 44px); display: flex; flex-direction: column;
  gap: 14px; justify-content: center;
}
.release-duo__body .pill,
.release-duo__body .release-person__handle { align-self: flex-start; }
.release-duo__title { font-family: var(--serif); font-size: clamp(30px, 3.4vw, 46px); line-height: 1.05; }
.release-duo__body p { font-size: 15px; line-height: 1.8; color: var(--muted-body); }
/* linha de abertura do release e assinatura antes do slogan */
.release-duo__body .release-duo__lede {
  font-family: var(--serif); font-size: clamp(17px, 1.7vw, 21px);
  line-height: 1.4; color: var(--brown);
}
.release-signoff {
  font-family: var(--sans); font-size: 11px; letter-spacing: .22em;
  text-transform: uppercase; color: var(--brown); font-weight: 500; padding-top: 8px;
}
.release-duo__body strong { color: var(--brown); font-weight: 500; }
.release-slogan {
  font-family: var(--serif); font-style: italic;
  font-size: clamp(19px, 2vw, 25px) !important; color: var(--terracotta) !important;
  line-height: 1.3 !important; padding-top: 4px;
}

.release-grid { display: flex; flex-direction: column; gap: 22px; }

/* Release individual: mesmo desenho do bloco do grupo, alternando o lado da imagem. */
.release-person { grid-template-columns: 0.85fr 1.15fr; }
.release-person--flip { grid-template-columns: 1.15fr 0.85fr; }
.release-person--flip .release-duo__media { order: 2; }        /* imagem vai para a direita */
.release-person .release-duo__media { min-height: clamp(320px, 32vw, 440px); }
.release-person .release-duo__body { gap: 10px; }
.release-person .release-duo__body p { font-size: 13px; line-height: 1.72; }
.release-person__name { font-family: var(--serif); font-size: clamp(24px, 2.4vw, 33px); line-height: 1.06; }
.release-person__role { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--terracotta); }
.release-person__sub {
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--brown); font-weight: 500; padding-top: 4px;
}
.release-person__handle { font-size: 11.5px; letter-spacing: .08em; color: var(--terracotta); padding-top: 4px; }


/* --- agenda ------------------------------------------------------------- */

.agenda { display: flex; flex-direction: column; gap: 30px; }

.agenda-event {
  display: grid; grid-template-columns: 0.72fr 1fr; gap: clamp(20px, 3vw, 40px);
  background: var(--brown); color: var(--light); border-radius: 28px; overflow: hidden;
}
.agenda-event__poster { position: relative; min-height: 360px; display: block; background: var(--darkest); }
.agenda-event__poster img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 30%;
  transition: transform .7s cubic-bezier(.2, .7, .2, 1);
}
.agenda-event__poster:hover img { transform: scale(1.04); }

.agenda-event__body {
  position: relative; padding: clamp(28px, 3.2vw, 48px);
  display: flex; flex-direction: column; gap: 15px; justify-content: center;
}
.agenda-event__date {
  position: absolute; top: clamp(20px, 3vw, 34px); right: clamp(20px, 3vw, 40px);
  display: flex; flex-direction: column; align-items: center; line-height: 1;
  padding: 12px 16px; border: 1px solid rgba(224, 164, 95, .4); border-radius: 16px;
  color: var(--amber);
}
.agenda-event__day { font-family: var(--serif); font-size: 34px; }
.agenda-event__month { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; }
.agenda-event__body .pill--terra { align-self: flex-start; }
.agenda-event__title { font-family: var(--serif); font-size: clamp(26px, 3vw, 40px); line-height: 1.08; color: var(--light); max-width: 460px; }
.agenda-event__body > p { font-size: 15px; line-height: 1.75; color: var(--muted-card); max-width: 480px; }
.agenda-event__body strong { color: var(--amber); font-weight: 500; }
.agenda-event__meta { display: flex; flex-wrap: wrap; gap: 10px 20px; padding: 4px 0 6px; }
.agenda-event__meta span {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px; letter-spacing: .06em; color: var(--muted-warm);
}
.agenda-event__meta svg { color: var(--amber); flex: 0 0 auto; }
.agenda-event__body .btn--amber { align-self: flex-start; margin-top: 6px; }

/* --- galeria: foto ampliada ---------------------------------------------- */

.lightbox {
  position: fixed; inset: 0; z-index: 240;
  background: rgba(27, 15, 10, .95);
  display: flex; align-items: center; justify-content: center;
  padding: clamp(58px, 7vw, 80px) clamp(14px, 6vw, 84px);
}
.lightbox[hidden] { display: none; }

.lightbox__figure {
  margin: 0; display: flex; flex-direction: column; align-items: center; gap: 14px;
  max-width: 100%; min-width: 0;
}
.lightbox__img {
  display: block; max-width: 100%; max-height: calc(100vh - 190px);
  width: auto; height: auto; object-fit: contain;
  border-radius: 18px; box-shadow: 0 34px 80px rgba(0, 0, 0, .6);
  background: var(--darkest);
}
.lightbox__caption {
  font-size: 13px; line-height: 1.5; letter-spacing: .03em;
  color: var(--muted-warm); text-align: center; max-width: 56ch;
}

.lightbox__btn {
  position: absolute; display: flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 999px;
  border: 1px solid rgba(224, 164, 95, .45);
  background: rgba(27, 15, 10, .55); color: var(--amber); cursor: pointer;
  transition: background .3s ease, color .3s ease;
}
.lightbox__btn:hover { background: var(--amber); color: var(--ink); }
.lightbox__close { top: clamp(14px, 2.6vw, 28px); right: clamp(14px, 2.6vw, 28px); }
.lightbox__nav { top: 50%; transform: translateY(-50%); }
.lightbox__nav--prev { left: clamp(10px, 1.8vw, 26px); }
.lightbox__nav--next { right: clamp(10px, 1.8vw, 26px); }

.lightbox__count {
  position: absolute; bottom: clamp(16px, 2.6vw, 26px); left: 50%; transform: translateX(-50%);
  font-size: 11px; letter-spacing: .2em; color: var(--muted-faint);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-height: 760px) { .modal__desc { display: none; } }
@media (max-height: 640px) { .modal__eyebrow, .modal__listlabel { display: none; } }

@media (max-width: 900px) {
  .modal__shell { flex-direction: column; align-items: center; width: auto; height: auto; max-height: none; }
  .modal__frame { height: min(62vh, 560px); width: min(420px, 92vw); flex: 0 0 auto; }
  .modal__panel { display: none; }
  .modal__label { display: block; max-width: 92vw; text-align: center; font-size: clamp(17px, 4.6vw, 22px); }

  .v-rail > .v-tile { flex-basis: clamp(230px, 64vw, 300px); height: clamp(230px, 60vw, 300px); }
  .v-rail > .v-tile--feature { flex-basis: clamp(260px, 78vw, 340px); }

  .gallery-rail figure { flex-basis: clamp(230px, 66vw, 300px); height: clamp(250px, 64vw, 330px); }

  .release-duo { grid-template-columns: 1fr; }
  .release-duo__media { min-height: clamp(260px, 60vw, 380px); }
  .release-person--flip .release-duo__media { order: 0; }   /* empilhado: imagem sempre primeiro */

  .agenda-event { grid-template-columns: 1fr; }
  .agenda-event__poster { min-height: clamp(300px, 78vw, 460px); }
  .agenda-event__date { top: 16px; right: 16px; }
}

@media (max-width: 760px) {
  .nav__burger { display: flex; }
  .nav__menu { display: none; }
  .nav__menu.is-open {
    display: flex; flex-direction: column; align-items: flex-start;
    width: 100%; gap: 14px; padding: 6px 0 10px;
  }

  .hero { min-height: 0; flex-direction: column; align-items: stretch; padding: 34px 18px 30px; }
  .hero__bg { display: none; }

  .hero__strip {
    display: flex; gap: 12px; overflow-x: auto;
    scroll-snap-type: x mandatory; scrollbar-width: none; margin-top: 24px;
  }
  .hero__strip::-webkit-scrollbar { display: none; }
  .hero__strip img {
    flex: 0 0 82%; scroll-snap-align: center;
    height: 380px; object-fit: cover; border-radius: 22px;
  }

  .duo-card { width: 100%; aspect-ratio: 4 / 5; }

  .footer { flex-direction: column; align-items: center; text-align: center; gap: 22px; }
  .footer > div { justify-content: center; }
}

@media (max-width: 700px) {
  .lightbox { padding: 62px 10px 74px; }
  .lightbox__img { max-height: calc(100vh - 175px); border-radius: 14px; }
  .lightbox__btn { width: 40px; height: 40px; }
  .lightbox__nav--prev { left: 6px; }
  .lightbox__nav--next { right: 6px; }
  .lightbox__caption { font-size: 12px; }

  .svc-rail { flex-direction: column; overflow-x: visible; scroll-snap-type: none; }
  .svc-rail > .svc-card { flex: 0 0 auto; width: 100%; }
  .svc-nav { display: none; }
}

@media (max-width: 540px) {
  .rep-note { border-radius: 24px; align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}