/* ============================================================
   CIABEV 2027 — Design system
   Paleta extraída da identidade oficial (proposta ABEV).
   ============================================================ */

:root{
  /* Cores de marca */
  --navy:        #003a5d;
  --navy-900:    #002741;
  --navy-700:    #0a4a70;
  --ink:         #0b2a42;
  --coral:       #ef5f3b;
  --coral-600:   #e04e2c;
  --coral-bright:#fc7830;
  --gold:        #f9b014;
  --gold-soft:   #ffc94d;
  --teal:        #2e8ca6;
  --crimson:     #d0234a;

  /* Neutros / fundo */
  --cream:       #fcf8f0;
  --cream-2:     #f6ecdd;
  --sand:        #f3e6d2;
  --card:        #ffffff;
  --line:        #e7dcc9;

  --muted:       #5c6b78;
  --muted-2:     #7b8793;

  /* Tipografia */
  --serif: "Fraunces", Georgia, "Times New Roman", serif;
  --sans:  "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Métrica */
  --wrap: 1140px;
  --radius: 20px;
  --radius-sm: 13px;
  --shadow: 0 18px 50px -24px rgba(0,40,65,.35);
  --shadow-sm: 0 8px 26px -16px rgba(0,40,65,.4);
  --sunset: linear-gradient(100deg, var(--coral) 0%, var(--coral-bright) 38%, var(--gold) 100%);
  --header-h: 68px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:var(--sans); font-size:clamp(15px,1.4vw,17px); line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}
.wrap{ width:min(100% - 40px, var(--wrap)); margin-inline:auto; }
img{ max-width:100%; display:block; }
a{ color:var(--coral-600); text-decoration:none; }
h1,h2,h3{ font-family:var(--serif); font-weight:600; line-height:1.08; letter-spacing:-.01em; color:var(--navy); margin:0; }
.ic{ width:1.15em; height:1.15em; display:inline-block; vertical-align:-.17em; fill:none; }

/* ---------- Botões ---------- */
.btn{
  --bg:var(--navy); --fg:#fff;
  display:inline-flex; align-items:center; gap:.55em; justify-content:center;
  font:inherit; font-weight:700; font-size:.95rem; letter-spacing:.005em;
  padding:.72em 1.25em; border-radius:999px; border:0; cursor:pointer;
  background:var(--bg); color:var(--fg); text-decoration:none;
  transition:transform .18s ease, box-shadow .25s ease, background .2s ease, opacity .2s;
  will-change:transform;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn-lg{ padding:.95em 1.55em; font-size:1.02rem; }
.btn-primary{ background:var(--sunset); color:#fff; box-shadow:0 12px 26px -12px rgba(239,95,59,.75); }
.btn-primary:hover{ box-shadow:0 16px 34px -12px rgba(239,95,59,.85); }
.btn-gold{ background:linear-gradient(100deg,var(--gold),var(--gold-soft)); color:var(--navy-900); box-shadow:0 12px 26px -14px rgba(249,176,20,.9); }
.btn-ghost{ background:transparent; color:var(--navy); border:1.6px solid rgba(0,58,93,.28); }
.btn-ghost:hover{ border-color:var(--navy); background:rgba(0,58,93,.05); }
.btn[disabled]{ opacity:.55; cursor:default; transform:none !important; }
.btn.is-on{ background:var(--teal); box-shadow:none; }

/* ---------- Header ---------- */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:60; height:var(--header-h);
  display:flex; align-items:center;
  transition:background .3s ease, box-shadow .3s ease, backdrop-filter .3s;
}
.site-header.solid{
  background:rgba(252,248,240,.82); backdrop-filter:saturate(1.3) blur(14px);
  box-shadow:0 1px 0 var(--line), 0 10px 30px -24px rgba(0,40,65,.5);
}
.header-inner{ display:flex; align-items:center; gap:1.2rem; width:min(100% - 40px,var(--wrap)); }
.brand{ display:flex; align-items:center; gap:.55rem; color:var(--navy); font-weight:800; }
.brand-mark{ height:34px; width:auto; }
.brand-text{ font-size:1.05rem; letter-spacing:.02em; }
.brand-text b{ color:var(--coral); }
.nav{ display:flex; gap:.3rem; margin-left:auto; }
.nav a{
  color:var(--navy); font-weight:600; font-size:.92rem; padding:.5em .78em; border-radius:999px;
  opacity:.85; transition:opacity .2s, background .2s, color .2s;
}
.nav a:hover{ opacity:1; background:rgba(0,58,93,.07); }
.header-actions{ display:flex; align-items:center; gap:.5rem; margin-left:.3rem; }
.btn-bell{ background:rgba(0,58,93,.08); color:var(--navy); padding:.55em 1em; font-size:.9rem; }
.btn-bell:hover{ background:rgba(0,58,93,.14); }
.btn-bell.is-on{ background:var(--teal); color:#fff; }
.nav-toggle{ display:none; background:rgba(0,58,93,.08); color:var(--navy); border:0; border-radius:12px; width:42px; height:42px; cursor:pointer; align-items:center; justify-content:center; }
.nav-toggle .ic{ width:22px; height:22px; }

/* mobile menu */
.mobile-menu{
  position:fixed; inset:0; z-index:70; background:var(--cream);
  display:flex; flex-direction:column; padding:28px;
  transform:translateY(-100%); transition:transform .4s cubic-bezier(.65,0,.2,1); visibility:hidden;
}
.mobile-menu.open{ transform:translateY(0); visibility:visible; }
.mm-close{ align-self:flex-end; background:rgba(0,58,93,.08); border:0; border-radius:12px; width:46px; height:46px; color:var(--navy); cursor:pointer; }
.mm-close .ic{ width:24px; height:24px; }
.mobile-menu nav{ display:flex; flex-direction:column; gap:.4rem; margin-top:12vh; }
.mobile-menu nav a{ font-family:var(--serif); font-size:1.9rem; color:var(--navy); padding:.3em 0; border-bottom:1px solid var(--line); }
.mobile-menu nav a:hover{ color:var(--coral); }

/* ---------- HERO ---------- */
.hero{ position:relative; padding:calc(var(--header-h) + 2.8rem) 0 0; overflow:hidden; isolation:isolate; }
.hero-sky{
  position:absolute; inset:0; z-index:-3;
  background:
    radial-gradient(130% 70% at 82% 2%, rgba(249,176,20,.20), transparent 52%),
    radial-gradient(120% 70% at 12% 0%, rgba(46,140,166,.12), transparent 48%),
    linear-gradient(180deg, var(--cream) 0%, var(--cream) 100%);
}
.hero-inner{ position:relative; z-index:1; text-align:center; padding-bottom:2.6rem; }
.hero-logo{ width:min(440px,80%); margin:0 auto 1.3rem; }
.hero-title{ font-size:clamp(2rem,6.4vw,4rem); line-height:1.02; margin:.2rem auto .1rem; max-width:14ch; }
.hero-title .t1{ color:var(--navy); }
.hero-title .t2{ color:var(--coral); font-style:italic; font-weight:500; }
.hero-title .t3{ display:block; font-family:var(--sans); font-weight:700; font-size:.3em; letter-spacing:.18em; text-transform:uppercase; color:var(--navy-700); margin-top:1.1em; }

.pillars{ list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; padding:0; margin:1.5rem 0 1.7rem; }
.pillars li{
  font-size:.82rem; font-weight:700; letter-spacing:.04em; color:var(--navy);
  background:rgba(255,255,255,.7); border:1px solid var(--line); padding:.42em .95em; border-radius:999px;
  backdrop-filter:blur(4px);
}
.hero-meta{ display:flex; flex-wrap:wrap; gap:.6rem 1.6rem; justify-content:center; color:var(--ink); font-size:.98rem; margin-bottom:1.6rem; }
.hero-meta .ic{ color:var(--coral); }
.hero-meta b{ font-weight:700; }

.countdown{ display:inline-flex; gap:.5rem; margin:.2rem auto 1.9rem; }
.cd-item{
  background:rgba(255,255,255,.72); border:1px solid var(--line); border-radius:16px;
  padding:.65rem 1.05rem; min-width:72px; backdrop-filter:blur(6px); box-shadow:var(--shadow-sm);
}
.cd-item b{ display:block; font-family:var(--serif); font-size:1.85rem; line-height:1; color:var(--navy); font-variant-numeric:tabular-nums; }
.cd-item span{ font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; color:var(--muted); }

.hero-cta{ display:flex; flex-wrap:wrap; gap:.8rem; justify-content:center; }
.hero-note{ margin:1.1rem auto 0; max-width:40ch; color:var(--muted); font-size:.9rem; }

/* strip de foto (sunset) no rodapé do hero, entre duas ondas cor creme */
.hero-strip{
  position:relative; z-index:0; margin-top:-.5rem;
  height:clamp(190px,30vw,340px);
  background:url("../assets/hero.jpg") center 44% / cover no-repeat;
}
.hero-strip .wave-top{ position:absolute; top:-1px; left:0; right:0; line-height:0; }
.hero-strip .wave-top svg{ width:100%; height:clamp(44px,6vw,80px); display:block; }
.hero-strip .wave-top path{ fill:var(--cream); }

/* wave divider (fundo do hero -> próxima seção) */
.wave-divider{ position:absolute; left:0; right:0; bottom:-1px; line-height:0; z-index:1; pointer-events:none; }
.wave-divider svg{ width:100%; height:clamp(60px,8vw,110px); display:block; }
.wave-divider path{ fill:var(--cream); }

/* ---------- Eyebrow / section heads ---------- */
.eyebrow{ font-weight:800; font-size:.76rem; letter-spacing:.2em; text-transform:uppercase; color:var(--teal); margin:0 0 .5rem; }
.eyebrow.light{ color:var(--gold-soft); }
.sec-head{ max-width:62ch; margin:0 auto 2.6rem; text-align:center; }
.sec-head h2{ font-size:clamp(1.7rem,4.2vw,2.7rem); }
.sec-sub{ color:var(--muted); font-size:1.03rem; margin:.7rem auto 0; }
.section{ padding:clamp(3.4rem,7vw,6rem) 0; position:relative; }

/* ---------- Convite ---------- */
.invite{ padding:clamp(3rem,6vw,5rem) 0 clamp(2rem,4vw,3rem); }
.invite-inner{ max-width:52rem; margin-inline:auto; text-align:center; }
.invite-title{ font-size:clamp(1.7rem,4.3vw,2.7rem); max-width:18ch; margin:0 auto .9rem; }
.invite-body{ font-size:clamp(1.05rem,1.8vw,1.22rem); color:var(--ink); line-height:1.7; }
.invite-sign{ margin-top:1.6rem; }
.invite-sign b{ display:block; font-family:var(--serif); font-size:1.2rem; color:var(--navy); }
.invite-sign span{ color:var(--muted); font-size:.92rem; }

/* ---------- Números ---------- */
.section-congresso{ background:
   radial-gradient(90% 60% at 100% 0%, rgba(46,140,166,.07), transparent 60%),
   var(--cream); }
.numbers{ list-style:none; padding:0; margin:0; display:grid; gap:1rem; grid-template-columns:repeat(3,1fr); }
.numbers li{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem 1.4rem;
  box-shadow:var(--shadow-sm); position:relative; overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}
.numbers li:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.numbers li::before{ content:""; position:absolute; inset:0 auto 0 0; width:5px; background:var(--sunset); }
.numbers .n-val{ font-family:var(--serif); font-size:clamp(2.1rem,4.5vw,2.9rem); color:var(--navy); line-height:1; }
.numbers .n-lab{ font-weight:700; margin-top:.5rem; color:var(--ink); }
.numbers .n-sub{ color:var(--muted); font-size:.88rem; margin-top:.15rem; }

/* ---------- Palestrantes ---------- */
.speakers{ display:grid; gap:1.3rem; grid-template-columns:1fr 1fr; }
.sp-card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.7rem;
  box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:.2rem;
  transition:transform .25s, box-shadow .25s;
}
.sp-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.sp-top{ display:flex; align-items:center; gap:1rem; margin-bottom:.6rem; }
.sp-avatar{
  flex:0 0 auto; width:72px; height:72px; border-radius:50%; display:grid; place-items:center; overflow:hidden;
  font-family:var(--serif); font-size:1.6rem; font-weight:600; color:#fff; background:var(--navy);
}
.sp-card:nth-child(2) .sp-avatar{ background:var(--coral); }
.sp-avatar.has-photo{ background:none; }
.sp-avatar img{ width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }
.sp-tag{ font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--teal); }
.sp-name{ font-family:var(--serif); font-size:1.5rem; color:var(--navy); }
.sp-org{ font-weight:700; color:var(--ink); }
.sp-org span{ color:var(--coral); font-weight:700; }
.sp-bio{ color:var(--muted); font-size:.95rem; margin-top:.6rem; }
.speakers-note{ text-align:center; color:var(--muted); margin-top:1.8rem; font-size:.96rem; }

/* ---------- Natal ---------- */
.section-city{ background:
   radial-gradient(80% 70% at 0% 0%, rgba(249,176,20,.1), transparent 55%),
   var(--cream-2); }
.city-grid{ list-style:none; padding:0; margin:0; display:grid; gap:1rem; grid-template-columns:repeat(4,1fr); }
.city-grid li{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem 1.3rem;
  text-align:center; box-shadow:var(--shadow-sm); transition:transform .25s, box-shadow .25s;
}
.city-grid li:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.city-ic{ width:54px; height:54px; margin:0 auto .8rem; border-radius:16px; display:grid; place-items:center;
  background:linear-gradient(140deg, rgba(239,95,59,.14), rgba(249,176,20,.18)); color:var(--coral-600); }
.city-ic .ic{ width:28px; height:28px; }
.city-grid h3{ font-size:1.12rem; color:var(--navy); }
.city-grid p{ color:var(--muted); font-size:.9rem; margin:.35rem 0 0; }

/* ---------- Sede ---------- */
.venue-inner{ display:grid; grid-template-columns:1.05fr .95fr; gap:2.4rem; align-items:center; }
.venue-feats{ list-style:none; padding:0; margin:1.4rem 0 0; display:flex; flex-direction:column; gap:.85rem; }
.venue-feats li{ position:relative; padding-left:2rem; color:var(--ink); }
.venue-feats li::before{
  content:""; position:absolute; left:0; top:.1em; width:1.3rem; height:1.3rem; border-radius:50%;
  background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='m5 12.5 4.5 4.5L19 7'/%3E%3C/svg%3E") center/70% no-repeat;
}
.venue-media{
  min-height:340px; border-radius:var(--radius); box-shadow:var(--shadow);
  background:url("../assets/hero.jpg") center/cover no-repeat; position:relative; overflow:hidden;
}
.venue-media::after{ content:"Noite CIABEV · à beira-mar"; position:absolute; left:0; right:0; bottom:0;
  padding:1.3rem 1.2rem .9rem; color:#fff; font-weight:700; font-size:.92rem;
  background:linear-gradient(0deg, rgba(0,39,65,.82), transparent); }

/* ---------- Novidades / timeline ---------- */
.section-news{ background:var(--cream); }
.timeline{ list-style:none; padding:0; margin:0 auto; max-width:46rem; position:relative; }
.timeline::before{ content:""; position:absolute; left:11px; top:6px; bottom:6px; width:2px; background:var(--line); }
.tl-item{ position:relative; padding:0 0 1.6rem 2.6rem; }
.tl-item:last-child{ padding-bottom:0; }
.tl-dot{ position:absolute; left:0; top:2px; width:24px; height:24px; border-radius:50%; background:var(--cream); border:2px solid var(--line); display:grid; place-items:center; }
.tl-dot .ic{ width:13px; height:13px; color:#fff; }
.tl-item.done .tl-dot{ background:var(--teal); border-color:var(--teal); }
.tl-item.next .tl-dot{ background:var(--coral); border-color:var(--coral); box-shadow:0 0 0 5px rgba(239,95,59,.16); }
.tl-date{ font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--teal); }
.tl-item.next .tl-date{ color:var(--coral); }
.tl-title{ font-family:var(--serif); font-size:1.25rem; color:var(--navy); margin:.1rem 0 .2rem; }
.tl-text{ color:var(--muted); font-size:.95rem; }
.news-cta{ text-align:center; margin-top:2.4rem; }

/* ---------- Patrocínio ---------- */
.section-sponsor{ background:
   radial-gradient(90% 120% at 100% 0%, var(--navy-700), var(--navy-900));
   color:#eaf3f8; }
.sponsor-inner{ max-width:56rem; margin-inline:auto; text-align:center; }
.section-sponsor h2{ color:#fff; font-size:clamp(1.8rem,4.4vw,2.8rem); }
.sponsor-text{ color:#c6dae7; font-size:1.06rem; margin:1rem auto 0; max-width:50ch; }
.sponsor-bullets{ list-style:none; padding:0; margin:1.8rem 0; display:flex; flex-direction:column; gap:.7rem; max-width:44rem; margin-inline:auto; text-align:left; }
.sponsor-bullets li{ position:relative; padding-left:2rem; color:#dfeaf1; }
.sponsor-bullets li::before{ content:""; position:absolute; left:0; top:.2em; width:1.25rem; height:1.25rem; border-radius:50%;
  background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23002741' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='m5 12.5 4.5 4.5L19 7'/%3E%3C/svg%3E") center/68% no-repeat; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--navy-900); color:#bcd2e0; padding:3rem 0 1.4rem; }
.footer-inner{ display:flex; flex-wrap:wrap; gap:2rem; justify-content:space-between; align-items:center; }
.foot-brand{ display:flex; align-items:center; gap:1rem; }
.foot-seal{ width:76px; height:76px; border-radius:50%; background:#fff; padding:5px; }
.foot-realiza{ font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-soft); margin:0 0 .25rem; }
.foot-abev{ font-family:var(--serif); color:#fff; font-size:1.2rem; line-height:1.15; margin:0; }
.foot-links{ display:flex; flex-wrap:wrap; gap:.6rem; }
.foot-links a{ display:inline-flex; align-items:center; gap:.45em; color:#d6e6f0; background:rgba(255,255,255,.08); padding:.55em 1em; border-radius:999px; font-size:.9rem; font-weight:600; transition:background .2s; }
.foot-links a:hover{ background:rgba(255,255,255,.16); }
.foot-bottom{ display:flex; flex-wrap:wrap; gap:.6rem 1.5rem; justify-content:space-between; margin-top:2.2rem; padding-top:1.3rem; border-top:1px solid rgba(255,255,255,.1); font-size:.82rem; color:#8fabbd; }
.foot-dev{ font-style:italic; }

/* ---------- FAB + toast ---------- */
.fab-bell{
  position:fixed; right:18px; bottom:18px; z-index:55; width:58px; height:58px; border-radius:50%;
  border:0; cursor:pointer; color:#fff; background:var(--sunset);
  box-shadow:0 14px 30px -10px rgba(239,95,59,.8); display:grid; place-items:center;
  animation:fab-in .4s ease both;
}
.fab-bell .ic{ width:26px; height:26px; }
.fab-bell.is-on{ background:var(--teal); box-shadow:0 10px 24px -12px rgba(46,140,166,.9); }
@keyframes fab-in{ from{ transform:scale(.6); opacity:0; } to{ transform:scale(1); opacity:1; } }
.fab-bell:hover{ transform:translateY(-3px); }

.toast{
  position:fixed; left:50%; bottom:26px; transform:translate(-50%,140%); z-index:90;
  background:var(--navy-900); color:#fff; padding:.85em 1.3em; border-radius:14px; font-weight:600; font-size:.92rem;
  box-shadow:var(--shadow); max-width:90vw; text-align:center; transition:transform .4s cubic-bezier(.65,0,.2,1); pointer-events:none;
}
.toast.show{ transform:translate(-50%,0); }

/* ---------- Reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }

/* ---------- Responsivo ---------- */
@media (max-width: 920px){
  .nav{ display:none; }
  .nav-toggle{ display:inline-flex; }
  .venue-inner{ grid-template-columns:1fr; }
  .venue-media{ min-height:260px; order:-1; }
  .numbers{ grid-template-columns:repeat(2,1fr); }
  .city-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 680px){
  .speakers{ grid-template-columns:1fr; }
  .header-actions .btn-bell span{ display:none; }
  .btn-bell{ padding:.55em; }
  .cd-item{ min-width:60px; padding:.55rem .7rem; }
  .cd-item b{ font-size:1.45rem; }
  .hero-meta{ flex-direction:column; gap:.4rem; }
}
@media (max-width: 420px){
  .numbers{ grid-template-columns:1fr; }
  .city-grid{ grid-template-columns:1fr; }
}