/* ==========================================================================
   Serra dos Tapes — estilo fiel ao site original
   Tokens do kit Elementor (post-6), tema nocodesigner (header, background-
   transitions, custom) e templates dos cards (238, 3679, 2913, 371, 185, 538).
   ========================================================================== */

:root{
  --green:#277A45; --green-700:#1f6538; --green-100:#e4efe8;
  --orange:#EF5027; --yellow:#F7AE17; --brown:#53351E; --brown-dk:#2E1A0B;
  --ink:#222527; --ink-0:#0a0a0a; --g92:#929292; --gCE:#CECECE; --gEF:#EFEFEF;
  --gF6:#F6F6F6; --gD0:#D0D0D0; --g84:#848484; --g54:#54595F; --g31:#313131;
  --bg:#f4f4f4; --wrap:1280px; --pad:24px;
  --ff:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --sh-card:0 0 4px 2px rgba(0,0,0,.05);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;font-family:var(--ff);font-size:16px;line-height:20px;font-weight:400;
  color:var(--ink-0);background-color:var(--bg);-webkit-font-smoothing:antialiased;
  transition:background-color 1s ease;           /* background-transitions.css */
}
body.color-brown{background-color:var(--brown-dk)}
body.color-light{background-color:var(--bg)}
body.color-yellow{background-color:var(--yellow)}
body.color-white{background-color:#fff}
[hidden]{display:none!important}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-weight:600;color:var(--ink)}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.wrap{width:min(100% - 2*var(--pad),var(--wrap));margin-inline:auto}
.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}
.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--green);color:#fff;padding:12px 16px}
.skip:focus{left:0}
.ico{width:16px;height:16px;flex:none}

/* Blur fade-in dos H1 (custom.css) */
@keyframes blurFadeIn{0%{opacity:0;filter:blur(10px)}100%{opacity:1;filter:blur(0)}}
h1{animation:blurFadeIn .8s ease-out forwards}

/* --------------------------------------------------------------------------
   Botões — com o "border beam" animado no hover (custom.css)
   -------------------------------------------------------------------------- */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 24px;border-radius:8px;border:1px solid transparent;background-clip:padding-box;
  font-size:15px;font-weight:400;line-height:1;text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background-color .3s,color .3s,border-color .3s;
}
.btn::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(45deg,#ff0080,#ff8c00,#40e0d0,#ff0080);background-size:300% 300%;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s ease;
}
.btn:hover{border-color:transparent}
.btn:hover::before{opacity:1;animation:borderBeam 2s linear infinite}
@keyframes borderBeam{0%{background-position:0% 0%}100%{background-position:400% 400%}}
.btn .ico{width:18px;height:18px}
.btn-green,.btn-primary{background-color:var(--green);color:#fff}
.btn-green:hover,.btn-primary:hover{background-color:var(--green-700)}
.btn-glass{background-color:rgba(39,122,69,.18);color:var(--gEF);border-color:#fff}
.btn-glass:hover{background-color:rgba(39,122,69,.4)}
.btn-orange,.btn-outline{background-color:var(--orange);color:#fff}
.btn-orange:hover,.btn-outline:hover{background-color:#d9431d}
.btn-light{background:#fff;color:var(--ink)}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--gCE)}
.btn-sm{padding:12px 20px;font-size:14px}
.btn-xs{padding:8px 12px;font-size:14px;gap:8px}
.btn-xs .ico{width:16px;height:16px}
.btn-block{display:flex;width:100%}
.btn-pill{
  display:inline-flex;align-items:center;gap:12px;padding:12px 24px;border-radius:100px;
  background:var(--green);color:#fff;font-size:14px;text-decoration:none;transition:background-color .3s;
}
.btn-pill:hover{background:var(--green-700)}
.link-btn{background:none;border:0;padding:0;cursor:pointer;color:var(--orange);font-size:14px;font-weight:600;text-decoration:underline}
.link-btn.done{color:var(--green);text-decoration:none}
.icon-btn{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:36px;background:none;cursor:pointer}
.icon-btn:hover{background:var(--gF6)}

/* --------------------------------------------------------------------------
   Navegação compartilhada
   -------------------------------------------------------------------------- */
.nav-list{display:flex;align-items:center;gap:4px}
.nav-list>li{position:relative}
.nav-list>li>a{
  display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:8px;
  font-size:14px;font-weight:600;line-height:1;color:var(--brown);text-decoration:none;
}
.nav-list>li>a .ico{width:16px;height:16px;color:var(--brown)}
.nav-list>li>a:hover span{text-decoration:underline}          /* header.css */
.caret{display:inline-block;width:6px;height:6px;margin-left:4px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.sub{
  position:absolute;top:100%;left:0;z-index:5;min-width:220px;padding:8px;
  background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.6);border-radius:16px;box-shadow:0 18px 40px rgba(0,0,0,.12);
  opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .2s,visibility .2s;
}
.has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub a{display:block;padding:10px 12px;border-radius:8px;font-size:14px;font-weight:500;color:var(--ink);text-decoration:none}
.sub a:hover,.sub a[aria-current]{background:var(--gF6);text-decoration:underline}
.act{
  position:relative;display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:40px;
  background:none;color:var(--ink);cursor:pointer;text-decoration:none;transition:background-color .2s;
}
.act:hover{background:rgba(255,255,255,.55)}
.act .ico{width:22px;height:22px}
.act--cart{color:var(--green)}
.act-badge{
  position:absolute;top:1px;right:-2px;min-width:17px;height:17px;padding:0 4px;border-radius:17px;
  background:var(--orange);color:#fff;font-size:10px;font-weight:700;line-height:17px;text-align:center;
}
.menu-toggle{
  display:none;place-items:center;width:40px;height:40px;border:1px solid rgba(0,0,0,.2);border-radius:7px;
  background:rgba(255,255,255,.35);color:var(--ink);cursor:pointer;
}
.menu-toggle .ico{width:20px;height:20px}

/* --------------------------------------------------------------------------
   Header da home: barra de vidro sticky dentro do hero
   -------------------------------------------------------------------------- */
.hero-home{
  position:relative;isolation:isolate;display:flex;flex-direction:column;gap:220px;
  padding:0 8px 40px;background-color:var(--brown-dk);background-image:var(--hero-img,url("/assets/img/hero-serra-wide.webp"));background-position:center bottom;background-size:cover;background-repeat:no-repeat;
}
.hero-home::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,0) 35%,var(--brown-dk) 100%);
}
.glass-bar{
  position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px 32px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.4);
  border-radius:0 0 24px 24px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  box-shadow:32px 32px 32px rgba(0,0,0,.01);
  transition:background .3s,border .3s,box-shadow .3s,transform .4s;
}
.gb-logo img{width:104px;height:auto}
.gb-actions,.sb-actions{display:flex;align-items:center;gap:6px}
/* versão fixa que reaparece ao rolar para cima (header.js) */
.glass-bar.is-float{
  position:fixed;left:8px;right:8px;top:0;z-index:90;transform:translateY(-120%);
  background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.75);box-shadow:0 10px 30px rgba(0,0,0,.08);
  transition:transform .3s ease-in-out,background .3s,border .3s,box-shadow .3s;
}
.glass-bar.is-float.show{transform:translateY(0)}
.glass-bar.is-float .gb-logo img{width:80px}
.glass-bar.is-float{padding-top:10px;padding-bottom:10px}

.hero-home__content{display:flex;flex-direction:column;align-items:center;gap:16px;padding:0 16px;text-align:center}
.hero-title{font-size:64px;font-weight:200;line-height:1;letter-spacing:-1px;color:#fff;text-shadow:5px 5px 10px rgba(0,0,0,.46)}
.hero-title .t-black{font-weight:900}
.hero-sub{max-width:560px;font-size:16px;line-height:1.2em;color:#fff}
.hero-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:8px}

/* --------------------------------------------------------------------------
   Header das páginas internas (post-167): branco 80%, sublinhado amarelo
   -------------------------------------------------------------------------- */
.site-bar{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.8);box-shadow:0 0 4px rgba(0,0,0,.1)}
.sb-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px;padding:0 24px}
.sb-logo img{width:84px;height:auto}
.sb-nav .nav-list{gap:0}
.sb-nav .nav-list>li>a{padding:20px 16px;border-radius:0;border-bottom:2px solid transparent;font-size:16px;color:var(--g31)}
.sb-nav .nav-list>li>a .ico{width:20px;height:14px;color:var(--g84)}
.sb-nav .nav-list>li>a:hover{color:var(--ink)}
.sb-nav .nav-list>li>a[aria-current]{border-bottom-color:var(--yellow);color:var(--ink)}
.sb-nav .nav-list>li>a[aria-current] .ico{color:var(--green)}
.sb-nav .sub{top:calc(100% - 2px);background:#fff}
.site-bar .act{color:var(--g84)}
.site-bar .act--cart{color:var(--green)}
.site-bar .act:hover{background:var(--gF6)}

/* Menu mobile em vidro */
.menu-drawer{position:fixed;inset:0;z-index:120;background:rgba(10,10,10,.35);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.md-panel{
  position:absolute;top:8px;left:8px;right:8px;max-height:calc(100vh - 16px);overflow:auto;padding:20px;
  background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.7);border-radius:0 0 24px 24px;box-shadow:0 20px 50px rgba(0,0,0,.18);
  animation:mdIn .3s ease;
}
@keyframes mdIn{from{opacity:0;transform:translateY(-12px)}}
.md-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.md-head img{width:88px}
.md-close{display:grid;place-items:center;width:40px;height:40px;border:1px solid rgba(0,0,0,.15);border-radius:7px;background:#fff;cursor:pointer}
.md-close .ico{width:20px;height:20px}
.md-list>li>a{display:flex;align-items:center;gap:10px;padding:14px 6px;border-bottom:1px solid rgba(0,0,0,.06);font-size:16px;font-weight:600;color:var(--brown);text-decoration:none}
.md-list a[aria-current]{color:var(--green)}
.md-sub a{display:block;padding:10px 6px 10px 32px;font-size:15px;font-weight:500;color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(0,0,0,.04)}
.md-extra{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.md-extra a{padding:8px 12px;border-radius:100px;background:var(--gF6);font-size:14px;color:var(--ink);text-decoration:none}

/* Barra inferior fixa das internas no mobile/tablet (post-167) */
.bottom-bar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;height:50px;padding:0 20px;background:#fff;border-top:1px solid var(--gEF);align-items:center;justify-content:space-around}
.bottom-bar a,.bottom-bar button{position:relative;display:grid;place-items:center;width:44px;height:44px;border:0;background:none;color:var(--g84);cursor:pointer}
.bottom-bar .ico{width:22px;height:22px}
.bottom-bar [aria-current]{color:var(--green)}

/* --------------------------------------------------------------------------
   Seções e títulos (post-794)
   -------------------------------------------------------------------------- */
.sec{position:relative;padding:56px 0}
.sec--tight{padding:40px 0}
.sec--brown,.sec-dark{background:var(--brown-dk);color:#fff}
/* 85%: em repouso fica igual ao original (#F8F5F2 sobre #f4f4f4); na transição do body vira só uma tonalidade legível */
.sec--light,.sec-tint,.sec-photo{background:rgba(248,245,242,.85)}
.sec--yellow{background:var(--yellow)}
.sec--white{background:#fff}
.sec-tight{padding-top:24px}
.sec-head{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:32px}
.sec-head.center{align-items:center;text-align:center}
.h-sec,.sec-head h2{font-size:32px;font-weight:600;line-height:1;letter-spacing:-1px;color:var(--ink)}
.h700{font-weight:700!important}
.w400{font-weight:400}
.sub-sec,.sec-head .lead{max-width:760px;font-size:16px;line-height:1.2em;color:var(--orange)}
.sub-sec a{color:var(--green);text-decoration:underline}
.sec-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--green);text-decoration:underline;text-underline-offset:3px}
.kicker{margin:0 0 8px;font-size:14px;font-weight:600;color:var(--orange)}
.sec-head .kicker{display:none}
.sec-dark .sec-head h2,.sec-dark h2{color:#fff}
.sec-dark .lead,.sec-dark p{color:rgba(255,255,255,.85)}
.sec-dark .kicker{color:var(--yellow)}

/* faixa marrom "Encontre lugares pra fora" */
.center-col{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.h-brown{font-size:36px;font-weight:600;line-height:1;color:#fff}
.h-brown em{font-style:italic}
.sec--brown .sub-sec{max-width:320px}
.brown-search{display:grid;gap:12px;width:min(100%,380px);margin-top:28px}
.field-dark{position:relative;display:flex;align-items:center;background:#fff;border:1px solid var(--gEF);border-radius:8px}
.field-dark .ico{position:absolute;left:12px;color:var(--g84)}
.field-dark input,.field-dark select{width:100%;padding:12px 12px 12px 38px;border:0;border-radius:8px;background:transparent;font-size:14px;color:var(--ink);outline:none}
.field-dark select{padding-left:12px}

/* carrossel com setas amarelas (post-feed-nav) */
.car{position:relative}
.car-track{
  display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/3);gap:24px;
  overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;
  margin:-6px -4px 0;padding:6px 4px 18px;
}
.car-track::-webkit-scrollbar{display:none}
.car-track>*{scroll-snap-align:start}
.car-track.car-5{grid-auto-columns:calc((100% - 96px)/5)}
.car-btn{
  position:absolute;top:50%;z-index:5;display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:40px;
  background:var(--yellow);color:var(--brown);box-shadow:0 2px 8px rgba(0,0,0,.12);cursor:pointer;
  transform:translateY(-50%);transition:opacity .2s,transform .2s;
}
.car-btn:hover{transform:translateY(-50%) scale(1.07)}
.car-btn:disabled{opacity:0;pointer-events:none}
.car-btn .ico{width:18px;height:18px}
.car-prev{left:-18px}.car-next{right:-18px}
.car.no-nav .car-btn{display:none}
.sec--yellow .car-btn{background:#fff}

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */
.c-stretch{position:absolute;inset:0;z-index:1}

/* lugar (post-238) */
.c-lugar{position:relative;isolation:isolate;height:420px;overflow:hidden;border-radius:16px;background:var(--ink);color:#fff}
.c-lugar .ph{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.c-lugar:hover .ph{transform:scale(1.05)}
.c-lugar__chip{position:absolute;top:24px;left:24px;padding:6px 12px;border-radius:100px;background:rgba(37,146,123,.8);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-size:13px;font-weight:600;line-height:1;color:#fff}
.c-lugar__foot{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:12px;padding:80px 24px 24px;border-radius:0 0 16px 16px;background:linear-gradient(180deg,rgba(34,37,39,0) 0%,rgba(0,0,0,.92) 100%)}
.c-lugar__title{font-size:1.17em;font-weight:600;line-height:1.05;color:#fff}
.c-lugar__title a{position:relative;z-index:2;color:#fff;text-decoration:none}
.c-lugar__title a:hover{text-decoration:underline}
.c-lugar__loc{display:flex;align-items:center;gap:6px;font-size:13px;color:rgba(255,255,255,.82)}
.c-lugar__row{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px}
.c-lugar__eco{font-size:14px;font-weight:600;line-height:1.15;color:var(--orange)}
.c-lugar__eco a{color:var(--orange)}
.pill-visit{display:inline-flex;flex:none;align-items:center;gap:6px;padding:8px 12px;border:0;border-radius:8px;background:#fff;color:var(--g54);font-size:14px;cursor:pointer;transition:background .2s,color .2s}
.pill-visit:hover{background:var(--gF6)}
.pill-visit.done{background:var(--green);color:#fff;cursor:default}
.pill-visit .ico{width:18px;height:18px}

/* o que fazer (post-2913) */
.grid-fazer{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,320px));gap:24px}
.c-fazer{position:relative;display:flex;flex-direction:column;gap:8px}
.c-fazer__img{display:block;aspect-ratio:1/1;margin-bottom:8px;overflow:hidden;border-radius:8px;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.c-fazer__img .ph{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.c-fazer:hover .c-fazer__img .ph{transform:scale(1.04)}
.c-fazer__title{font-size:1.17em;font-weight:600;line-height:1.05}
.c-fazer__title a{text-decoration:none}
.c-fazer__title a:hover{text-decoration:underline}
.c-fazer__place{font-size:12px;font-weight:600;color:var(--orange)}
.pill-action{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:8px;padding:8px 12px;border:0;border-radius:8px;background:rgba(206,206,206,.2);color:var(--g54);font-size:14px;cursor:pointer;transition:background .2s}
.pill-action:hover{background:rgba(206,206,206,.45)}
.pill-action.done{background:var(--green-100);color:var(--green);cursor:default}
.pill-action .ico{width:18px;height:18px}

/* experiência / roteiro (post-3679) */
.c-exp{position:relative;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--gF6);border-radius:40px;box-shadow:var(--sh-card);transition:box-shadow .3s}
.c-exp:hover{box-shadow:0 12px 30px rgba(0,0,0,.08)}
.c-exp__img{position:relative;display:block;height:220px;overflow:hidden;border-radius:24px 24px 0 0}
.c-exp__img .ph{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.c-exp:hover .c-exp__img .ph{transform:scale(1.04)}
.c-exp__chip{position:absolute;top:16px;left:16px;display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:8px;background:linear-gradient(163deg,#fff 85%,rgba(255,255,255,.2) 100%);font-size:13px;font-weight:600;color:var(--ink)}
.c-exp__body{display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:8px;padding:24px;border-radius:0 0 24px 24px}
.c-exp__title{font-size:1.17em;font-weight:600;line-height:1.1;color:var(--ink)}
.c-exp__title a{text-decoration:none}
.c-exp__title a:hover{text-decoration:underline}
.c-exp__price{font-size:16px;line-height:20px;color:var(--orange)}
.c-exp__eco{font-size:14px;color:var(--brown)}
.c-exp__host{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:8px}
.c-exp__host img{width:40px;height:40px;border-radius:100px;object-fit:cover}
.c-exp__host a{display:block;font-size:14px;font-weight:600;color:var(--orange)}
.c-exp__host span{display:block;font-size:12px;color:var(--ink)}
.c-rota__resumo{font-size:14px;line-height:1.35;color:var(--g54)}
.c-rota__stats{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;width:100%;margin-top:8px}
.c-rota__stats li{display:flex;flex-direction:column;gap:2px}
.c-rota__stats span{font-size:12px;color:var(--g84)}
.c-rota__stats strong{font-size:18px;font-weight:700;color:var(--ink)}

/* produto (post-538) */
.c-prod{position:relative;display:flex;flex-direction:column;background:#fff;border:3px solid var(--gF6);box-shadow:var(--sh-card)}
.c-prod__tag{position:absolute;top:16px;left:16px;z-index:2;padding:4px 8px;background:#fff;font-size:16px;font-weight:600;line-height:1;color:var(--green)}
.c-prod__img{display:block;aspect-ratio:1/1;overflow:hidden;background:#fff}
.c-prod__img .ph{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.c-prod:hover .c-prod__img .ph{transform:scale(1.04)}
.c-prod__body{display:flex;flex:1;flex-direction:column;gap:12px;padding:24px}
.c-prod__title{font-size:16px;font-weight:600;line-height:1.2}
.c-prod__title a{text-decoration:none}
.c-prod__title a:hover{text-decoration:underline}
.c-prod__price{font-size:16px;font-weight:800;color:var(--green)}
.c-prod__qlabel{margin-top:auto;font-size:12px;color:var(--g84)}
.qty{display:flex;align-items:center;gap:8px}
.qty button{width:28px;height:28px;border:1px solid var(--gCE);border-radius:28px;background:#fff;color:var(--g54);line-height:1;cursor:pointer}
.qty button:hover{border-color:var(--green);color:var(--green)}
.qty input{width:44px;border:0;background:transparent;text-align:center;font-size:15px;-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* blog (post-185) */
.c-blog{position:relative;display:flex;flex-direction:column;gap:10px}
.c-blog__img{display:block;margin-bottom:10px}
.c-blog__img .ph{width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:10px;transition:opacity .2s}
.c-blog:hover .c-blog__img .ph{opacity:.8}
.c-blog__title{font-size:1.17em;font-weight:600;line-height:1.1}
.c-blog__title a{text-decoration:none}
.c-blog__title a:hover{text-decoration:underline}
.c-blog__meta{display:flex;align-items:center;gap:6px;font-size:15px;color:var(--green)}

/* evento (post-371) */
.grid-eventos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,325px));gap:24px}
.c-evento{position:relative;display:flex;flex-direction:column;gap:5px;background:#fff;border:1px solid var(--gCE);border-radius:8px;transition:border-color .3s}
.c-evento:hover{border-color:var(--green)}
.c-evento__img{position:relative;height:120px;border-radius:8px 8px 0 0;background:rgba(0,0,0,.2)}
.c-evento__img .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:8px 8px 0 0;transition:opacity .3s}
.c-evento:hover .c-evento__img .ph{opacity:0}
.c-evento__badge{
  position:absolute;left:50%;bottom:-22px;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:56px;min-height:45px;padding:4px 10px;transform:translateX(-50%);background:var(--green);
  border:1.5px solid rgba(255,255,255,.39);border-radius:8px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
  box-shadow:21px 22px 59px rgba(39,122,69,.5);color:#fff;text-transform:uppercase;letter-spacing:1px;line-height:1;
}
.c-evento__badge strong{font-size:24px;font-weight:900}
.c-evento__badge span{font-size:11px}
.c-evento__body{display:flex;flex-direction:column;align-items:center;gap:10px;padding:36px 30px 30px;text-align:center}
.c-evento__title{font-size:1.17em;font-weight:600;line-height:1.1}
.c-evento__title a{text-decoration:none}
.c-evento__by{font-size:16px;color:var(--orange)}

/* explore a região */
.c-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;min-height:221px;padding:32px 24px;background:#fff;border:1px solid var(--gCE);border-radius:16px;text-decoration:none;transition:border-color .3s,box-shadow .3s}
.c-tile:hover{border-color:var(--green);box-shadow:var(--sh-card)}
.c-tile img{width:auto;height:100px;object-fit:contain}
.c-tile span{font-size:20px;font-weight:600;line-height:1;color:var(--orange);text-decoration:underline}

/* sem internet */
.offline{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.offline__art img{display:block;width:150px;height:auto;border:0}
.offline__try{margin-top:12px;color:var(--orange)}
.dots{display:grid;gap:6px;margin-bottom:12px}
.dots li{position:relative;padding-left:14px;color:var(--ink)}
.dots li::before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:6px;background:var(--ink)}

/* cicloturismo: degradê branco sobre a foto */
.sec--ciclo{padding:40px 0 220px;overflow:hidden;background-color:#fff;background-image:var(--ciclo-img,url("/assets/img/evento-circuito.jpeg"));background-position:right bottom;background-size:contain;background-repeat:no-repeat}
.sec--ciclo::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#fff 48%,rgba(0,0,0,0) 91%)}
.sec--ciclo .wrap{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.ciclo-text{max-width:460px}
.h-ciclo{margin-top:8px;font-size:32px;font-weight:600;line-height:1;letter-spacing:-1px;color:var(--ink)}

/* faixa amarela de produtos */
.sub-yellow{max-width:900px;font-size:16px;line-height:1.2em;color:#fff}
.sub-yellow strong{font-weight:700}
.sec--yellow .h-sec{font-weight:700}

/* previsão do tempo */
.weather{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.wx{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px;background:#fff;border:1px solid var(--gEF);border-radius:16px;text-align:center}
.wx__d{font-size:14px;font-weight:600;color:var(--ink);text-transform:capitalize}
.wx__date{font-size:12px;color:var(--g84)}
.wx__i{font-size:30px;line-height:1}
.wx__t{font-size:16px;font-weight:700;color:var(--ink)}
.wx__t small{font-size:14px;font-weight:400;color:var(--g84)}
.wx__r{font-size:12px;color:var(--green)}
.weather-loading{grid-column:1/-1;text-align:center;font-size:14px;color:var(--g84)}

/* --------------------------------------------------------------------------
   Rodapé claro (post-168)
   -------------------------------------------------------------------------- */
.foot{position:relative;padding:40px 0 100px;border-top:1px solid var(--gD0)}
.foot-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px;width:min(100% - 48px,1200px);margin:0 auto;padding-bottom:24px;border-bottom:1px solid #E9E9E9}
.foot-nav a{font-size:16px;line-height:20px;color:var(--g84);text-decoration:none;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.foot-nav a:hover{color:var(--ink);border-color:var(--green)}
.foot-nav--sub{padding:16px 0 0;border-bottom:0}
.foot-nav--sub a{font-size:14px}
.foot-logo{display:block;width:164px;margin:40px auto}
.foot-logo img{width:164px;height:64px;object-fit:contain}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:40px 50px;border-top:1px solid var(--gF6)}
.foot-top{display:inline-flex;align-items:center;gap:8px;font-size:16px;color:var(--green);text-decoration:none}
.foot-top:hover{text-decoration:underline}
.foot-row p{color:var(--ink)}
.foot-made{text-align:center;color:var(--ink)}

/* --------------------------------------------------------------------------
   Páginas internas
   -------------------------------------------------------------------------- */
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

.crumbs{font-size:13px;color:var(--g92)}
.crumbs ul{display:flex;flex-wrap:wrap;gap:6px;padding-top:16px}
.crumbs li+li::before{content:"›";margin-right:6px;color:var(--gCE)}
.crumbs a{color:var(--g84);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs li[aria-current]{color:var(--ink)}

.page-head{display:flex;flex-direction:column;padding:32px 0 24px}
.page-head h1{margin:0 0 12px;font-size:36px;font-weight:600;line-height:1.1;color:var(--green)}
.page-head .lead{max-width:800px;font-size:20px;line-height:28px;color:var(--ink)}
.page-head--narrow .wrap{max-width:800px}
.page-head-media img{order:2;width:min(100% - 2*var(--pad),800px);margin:28px auto 0;aspect-ratio:16/7;object-fit:cover;border-radius:16px}
.page-head--wide.page-head-media img{width:min(100% - 2*var(--pad),var(--wrap))}

.prose{max-width:800px}
.prose p{margin:0 0 20px;font-size:20px;line-height:28px;color:var(--ink)}
.prose .intro{font-weight:600}
.prose h2{margin:36px 0 12px;font-size:24px;line-height:1.15;color:var(--green)}
.prose strong{font-weight:700}
.prose ul.ticks{margin-bottom:20px}
.project-logo{max-width:240px;height:auto;margin:0 0 24px}

.single-hero{position:relative;isolation:isolate;display:grid;place-items:center;min-height:340px;padding:48px 0;overflow:hidden;text-align:center;background:linear-gradient(180deg,#6f6f6f,#3b3b3b)}
.single-hero-media{position:absolute;inset:0;z-index:-2}
.single-hero-media .ph{width:100%;height:100%;object-fit:cover}
.single-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.28) 0%,rgba(0,0,0,.6) 100%)}
.single-hero-inner{display:flex;flex-direction:column;align-items:center;gap:12px;color:#fff}
.single-hero-inner h1{font-size:40px;font-weight:600;line-height:1.05;color:#fff}
.single-loc{display:inline-flex;align-items:center;gap:6px;font-size:16px;color:#fff}
.tag{margin:0;font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--orange)}
.tag-light{padding:6px 12px;border-radius:100px;background:rgba(37,146,123,.8);font-size:13px;color:#fff}
.photo-credit{position:absolute;right:12px;bottom:10px;z-index:2;font-size:11px;color:rgba(255,255,255,.75)}
.photo-credit a{color:inherit}
.photo-credit--inline{position:static;font-size:12px;color:var(--g84)}

.single-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:48px;padding:48px 0}
.single-main>h2{margin:32px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--gD0);font-size:16px;font-weight:600;color:var(--ink)}
.single-main>h2:first-child{margin-top:0}
.single-main>p{max-width:720px;margin-bottom:12px;font-size:16px;line-height:24px;color:var(--ink)}
.single-main .intro{font-size:18px;line-height:26px;font-weight:500}
.single-side{position:relative}
.side-card{position:sticky;top:110px;display:grid;gap:12px;padding:20px;background:#fff;border:1px solid var(--gEF);border-radius:8px}
.side-card h3{font-size:18px}
.side-note{font-size:13px;line-height:18px;color:var(--g84)}
.eco-big{display:block;margin:0;padding:14px 16px;border-radius:8px;background:var(--green);color:#fff;font-size:14px;line-height:1.35}
.eco-big .ico{display:inline-block;margin-right:6px;vertical-align:-3px}
.eco-big strong{font-weight:700}
.addr{display:flex;align-items:center;gap:8px;padding:14px 16px;background:#fff;border:1px solid var(--gEF);border-radius:8px;font-size:15px;max-width:none!important}
.price-big{display:flex;align-items:baseline;gap:8px;margin:0 0 8px;font-size:32px;font-weight:800;line-height:1;color:var(--green)}
.price-big span{font-size:14px;font-weight:400;color:var(--g84)}
.date-big{padding:12px;border-radius:8px;background:var(--green);color:#fff;text-align:center;text-transform:uppercase;letter-spacing:1px}
.date-big strong{display:block;font-size:40px;font-weight:900;line-height:1}
.date-big span{font-size:12px}
.countdown{text-align:center;font-size:14px;color:var(--orange)}

.ticks{display:grid;gap:8px}
.ticks li{position:relative;padding-left:22px;line-height:1.35;color:var(--ink)}
.ticks li::before{content:"";position:absolute;left:0;top:.35em;width:11px;height:6px;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}
.sec-dark .ticks li{color:rgba(255,255,255,.88)}
.sec-dark .ticks li::before{border-color:var(--yellow)}
.ticks-cols{grid-template-columns:repeat(2,1fr);gap:10px 32px}

.stats{display:flex;flex-wrap:wrap;gap:24px}
.stats li{display:flex;flex-direction:column;gap:2px}
.stats strong{font-size:20px;font-weight:700;color:var(--ink)}
.stats span{font-size:12px;color:var(--g84)}
.stats-big{position:relative;z-index:3;justify-content:space-between;margin-top:-32px;padding:20px 28px;background:#fff;border:1px solid var(--gEF);border-radius:16px;box-shadow:var(--sh-card)}
.stats-big strong{font-size:24px}

.stops{display:grid;gap:12px}
.stop{display:flex;gap:16px;padding:16px;background:#fff;border:1px solid var(--gEF);border-radius:16px}
.stop-img{flex:none;width:96px;height:96px;overflow:hidden;border-radius:12px}
.stop-img .ph{width:100%;height:100%;object-fit:cover}
.stop-num{display:grid;flex:none;place-items:center;width:32px;height:32px;border-radius:32px;background:var(--yellow);color:var(--brown);font-weight:700}
.stop h3{margin:2px 0 4px;font-size:17px}
.stop h3 a{text-decoration:none}
.stop h3 a:hover{text-decoration:underline}
.stop-note{font-size:12px;font-weight:600;color:var(--orange)}
.stop .meta{font-size:13px;color:var(--g84)}

.card{position:relative;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--gF6);border-radius:24px;box-shadow:var(--sh-card)}
.card-media{display:block;aspect-ratio:16/10;overflow:hidden}
.card-media .ph{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .card-media .ph{transform:scale(1.04)}
.card-body{display:flex;flex:1;flex-direction:column;gap:8px;padding:20px 24px 24px}
.card-body h3{font-size:1.17em;line-height:1.1}
.card-body h3 a{text-decoration:none}
.card-body h3 a:hover{text-decoration:underline}
.card-plain{border-color:var(--gCE);box-shadow:none;border-radius:16px}
.meta{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--g84)}
.excerpt{font-size:14px;line-height:1.35;color:var(--g54)}

.feature,.pillar,.person,.stat{background:#fff;border:1px solid var(--gCE);border-radius:16px;padding:24px}
.feature{display:grid;align-content:start;gap:8px}
.feature-ico{display:grid;place-items:center;width:44px;height:44px;margin-bottom:4px;border-radius:44px;background:var(--yellow);color:var(--brown)}
.feature-ico .ico{width:22px;height:22px}
.feature h3,.pillar h3{font-size:18px}
.feature p,.pillar p,.person p{font-size:14px;line-height:1.4;color:var(--g54)}
.pillar-num{display:block;margin-bottom:8px;font-size:14px;font-weight:700;color:var(--orange)}
.person h3{margin-bottom:4px}
.person .tag{margin-bottom:10px}
.stat{text-align:center}
.stat strong{display:block;font-size:36px;font-weight:800;letter-spacing:-1px;color:var(--green)}
.stat span{font-size:13px;color:var(--g84)}

.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:12px;margin-bottom:16px;padding:12px;background:#fff;border:1px solid var(--gEF);border-radius:16px}
.field{position:relative;display:flex}
.field-search .search-ico{position:absolute;top:50%;left:12px;transform:translateY(-50%);color:var(--g84);pointer-events:none}
.filters input,.filters select{width:100%;padding:12px;border:1px solid var(--gEF);border-radius:8px;background:#fff;font-size:15px}
.filters .field-search input{padding-left:38px}
.filters input:focus,.filters select:focus{border-color:var(--green);outline:none}
.results-count{margin:0 0 20px;font-size:14px;color:var(--g84)}
.empty{padding:48px 16px;text-align:center;color:var(--g84)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.chips-center{justify-content:center}
.chip{display:inline-block;padding:8px 16px;border:1px solid var(--gCE);border-radius:100px;background:#fff;font-size:14px;color:var(--ink);text-decoration:none;transition:border-color .3s,color .3s}
.chip:hover{border-color:var(--green);color:var(--green)}
.anchor-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.data-list{display:grid;gap:4px;margin:20px 0}
.data-list li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--gD0);font-size:16px}
.data-list span{color:var(--g84)}

.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.split-media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:24px}
.split h2{margin-bottom:12px;font-size:32px;letter-spacing:-1px}
.split .ticks{margin:16px 0 24px}

.post-head{max-width:800px;padding:32px 0 24px}
.post-head h1{margin-bottom:12px;font-size:40px;line-height:1.1;letter-spacing:-1px;color:var(--ink)}
.post-head .lead{font-size:20px;line-height:28px;color:var(--orange)}
.post-head .kicker{color:var(--g84)}
.post-media .ph{width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:10px}
.single-post .prose{padding:40px 0}

.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;padding:40px 0}
.product-media{overflow:hidden;background:#fff;border:3px solid var(--gF6);box-shadow:var(--sh-card)}
.product-media .ph{width:100%;aspect-ratio:1/1;object-fit:cover}
.product-info{display:flex;flex-direction:column;gap:12px}
.product-info h1{font-size:40px;line-height:1.05;letter-spacing:-1px}
.product-info>p{font-size:16px;line-height:24px}
.badge-line{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--g84)}
.badge-org{padding:4px 8px;background:var(--green-100);font-size:14px;font-weight:600;color:var(--green)}
.qty-row{display:flex;align-items:center;gap:12px}
.qty-row input{width:80px;padding:12px;border:1px solid var(--gCE);border-radius:8px}
.produced-by{font-size:14px;color:var(--g84)}
.produced-by a{color:var(--orange);font-weight:600}

.cta-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding:36px 40px;border-radius:24px;background:var(--brown-dk);color:#fff}
.cta-box h2{margin-bottom:6px;font-size:28px;letter-spacing:-1px;color:#fff}
.cta-box p{max-width:60ch;color:rgba(255,255,255,.85)}
.wallet-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;margin-bottom:40px;padding:32px;background:#fff;border:1px solid var(--gEF);border-radius:24px}
.wallet-value{font-size:56px;font-weight:800;line-height:1;letter-spacing:-2px;color:var(--green)}
.wallet-value small{font-size:16px;font-weight:500;letter-spacing:0;color:var(--g84)}
.notfound{padding:96px 0;text-align:center}
.notfound h1{margin-bottom:12px;font-size:40px}
.notfound .lead{max-width:52ch;margin:0 auto 28px;font-size:18px;line-height:26px}
.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}

/* créditos das fotos */
.credits{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.credit{display:flex;gap:12px;padding:12px;background:#fff;border:1px solid var(--gEF);border-radius:12px;font-size:13px;line-height:1.35}
.credit img{flex:none;width:72px;height:72px;border-radius:8px;object-fit:cover}
.credit strong{display:block;font-size:14px;color:var(--ink)}
.credit a{color:var(--green)}

/* carrinho e toast */
.cart-drawer{position:fixed;inset:0;z-index:150}
.cart-backdrop{position:absolute;inset:0;background:rgba(10,10,10,.4);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:fade .2s ease}
.cart-panel{position:absolute;top:0;right:0;display:flex;flex-direction:column;width:min(400px,100%);height:100%;background:#fff;box-shadow:-10px 0 40px rgba(0,0,0,.15);animation:slide .25s ease}
@keyframes fade{from{opacity:0}}
@keyframes slide{from{transform:translateX(100%)}}
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--gEF)}
.cart-head h2{font-size:18px}
.cart-body{display:grid;flex:1;align-content:start;gap:14px;overflow:auto;padding:16px 20px}
.cart-empty{padding:32px 0;text-align:center;font-size:14px;color:var(--g84)}
.cart-item{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding-bottom:14px;border-bottom:1px solid var(--gEF)}
.cart-item h3{font-size:15px}
.cart-item .meta{font-size:13px}
.cart-qty{display:flex;align-items:center;gap:8px}
.cart-qty button{width:26px;height:26px;border:1px solid var(--gCE);border-radius:26px;background:#fff;cursor:pointer}
.cart-foot{display:grid;gap:12px;padding:18px 20px;border-top:1px solid var(--gEF)}
.cart-total{display:flex;justify-content:space-between;font-size:17px}
.cart-note{margin:0;text-align:center;font-size:12px;color:var(--g84)}
.toast{position:fixed;left:50%;bottom:70px;z-index:200;padding:12px 18px;border-radius:100px;background:var(--brown-dk);color:#fff;font-size:14px;opacity:0;pointer-events:none;transform:translateX(-50%) translateY(10px);transition:opacity .25s,transform .25s}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* --------------------------------------------------------------------------
   Responsivo — mesmos breakpoints e tamanhos do original (1024 / 767)
   -------------------------------------------------------------------------- */
@media (max-width:1180px){
  .nav-list>li>a{padding:10px 8px;font-size:13px}
  .sb-nav .nav-list>li>a{padding:20px 10px;font-size:15px}
}
@media (max-width:1024px){
  .hero-home{padding:15px}
  .glass-bar{min-height:68px}
  .gb-nav,.sb-nav{display:none}
  .menu-toggle{display:grid}
  .hero-title{font-size:58px}
  .h-sec,.sec-head h2,.h-ciclo{font-size:58px}
  .car-track{grid-auto-columns:calc((100% - 24px)/2)}
  .car-track.car-5{grid-auto-columns:calc((100% - 48px)/3)}
  .grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}
  .single-grid,.product-grid,.split{grid-template-columns:1fr}
  .side-card{position:static}
  .bottom-bar{display:flex}
  body.has-bottom-bar{padding-bottom:50px}
  .weather{grid-template-columns:repeat(4,1fr)}
  .filters{grid-template-columns:1fr 1fr}
  .field-search{grid-column:1/-1}
  .foot-row{padding:30px 25px}
}
@media (max-width:767px){
  :root{--pad:16px}
  .sb-logo img{width:72px}
  .hero-home{background-image:var(--hero-img-m,var(--hero-img,url("/assets/img/hero-serra.webp")))}
  .hero-home{min-height:60vh;gap:140px;padding:8px}
  .glass-bar{gap:0;padding:24px 20px}
  .glass-bar.is-float{padding:12px 16px}
  .gb-logo img{width:81px}
  .hero-title{font-size:40px}
  .hero-btns{flex-direction:column;align-self:stretch}
  .hero-btns .btn{width:100%}
  .h-sec,.sec-head h2{font-size:24px}
  .h-ciclo{font-size:18px}
  .sec{padding:40px 0}
  .car-track,.car-track.car-5{grid-auto-columns:85%}
  .car-prev{left:-10px}.car-next{right:-10px}
  .grid-2,.grid-3,.grid-4,.ticks-cols{grid-template-columns:1fr}
  .c-lugar{height:340px}
  .c-exp{border-radius:16px}
  .c-exp__img{border-radius:16px 16px 0 0}
  .c-prod{overflow:hidden;border-width:1px;border-radius:16px}
  .c-prod__tag{border-radius:8px;font-size:12px}
  .c-prod__body{gap:8px;padding:12px}
  .c-fazer__title{font-size:14px}
  .c-fazer__place{font-size:10px}
  .c-evento__by{font-size:14px}
  .sec--ciclo{padding:24px 0 180px;background-size:90% auto}
  .weather{grid-template-columns:repeat(7,minmax(92px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
  .wx{scroll-snap-align:start}
  .single-hero{min-height:280px}
  .single-hero-inner h1,.post-head h1,.product-info h1{font-size:32px}
  .page-head .lead,.prose p{font-size:18px;line-height:26px}
  .filters{grid-template-columns:1fr}
  .foot-row{flex-direction:column;padding:24px}
  .cta-box,.wallet-box{flex-direction:column;align-items:flex-start;padding:24px}
  .stats-big{margin-top:16px}
  .stop-img{width:72px;height:72px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ==========================================================================
   Refino visual — ritmo das seções, cartões e blocos novos
   Mantém os tokens, as cores e os tamanhos de título do original.
   ========================================================================== */
:root{
  --sh-s:0 1px 2px rgba(46,26,11,.06);
  --sh-m:0 8px 24px rgba(46,26,11,.09);
  --sh-l:0 18px 44px rgba(46,26,11,.16);
  --r:16px;
  --linha:rgba(46,26,11,.10);
}

/* ritmo e cabeçalho das seções */
.sec{padding:clamp(56px,6.5vw,92px) 0}
.sec--tight{padding:clamp(36px,4vw,56px) 0}
.sec-head{gap:10px;margin-bottom:clamp(24px,3vw,36px)}
.sub-sec,.sec-head .lead{line-height:1.45;max-width:62ch}
.sec-head .kicker{display:block;margin:0;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.sec-link{padding:9px 16px;border:1px solid var(--linha);border-radius:100px;background:rgba(255,255,255,.75);text-decoration:none;transition:background .2s,border-color .2s,transform .2s}
.sec-link:hover{background:#fff;border-color:var(--green);transform:translateX(2px);text-decoration:none}
.sec-link .ico{width:14px;height:14px}
.sec--yellow .sec-link{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.9);color:var(--brown)}
@media (min-width:768px){
  .sec-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;column-gap:28px}
  .sec-head>.kicker,.sec-head>.h-sec,.sec-head>.sub-sec{grid-column:1}
  .sec-head>.sec-link{grid-column:2;grid-row:1/span 3;align-self:center}
  .sec-head.center{display:flex}
}

/* faixa marrom da busca */
.h-brown{font-size:clamp(28px,4vw,40px)}
.sec--brown .sub-sec{max-width:54ch;color:#f1d9c9}
.brown-search{width:min(100%,980px);grid-template-columns:2fr 1fr 1fr auto;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:100px;background:rgba(255,255,255,.08)}
.brown-search .btn{padding:14px 26px;border-radius:100px}
.field-dark{border:0;border-radius:100px}
.field-dark input,.field-dark select{padding:13px 14px 13px 40px;font-size:15px}
.field-dark select{padding-left:16px}
@media (max-width:900px){
  .brown-search{grid-template-columns:1fr;border-radius:20px}
  .field-dark,.brown-search .btn{border-radius:12px}
}

/* cartão de lugar */
.c-lugar{height:clamp(320px,33vw,420px);box-shadow:var(--sh-s);transition:transform .3s,box-shadow .3s}
.c-lugar:hover{transform:translateY(-4px);box-shadow:var(--sh-l)}
.c-lugar__chip{top:16px;left:16px;padding:6px 12px;background:rgba(39,122,69,.92);font-size:12px}
.c-lugar__foot{gap:8px;padding:96px 20px 18px;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.5) 45%,rgba(0,0,0,.92) 100%)}
.c-lugar__title{font-size:20px;line-height:1.2}
.c-lugar__row{margin-top:4px}
.c-lugar__eco{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--yellow)}
.c-lugar__eco .ico{width:15px;height:15px}
.pill-visit{padding:8px 13px;border-radius:100px;background:rgba(255,255,255,.94);font-size:13px;font-weight:600;color:var(--brown-dk)}
.pill-visit:hover{background:#fff}

/* o que fazer: vira cartão */
.grid-fazer{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.c-fazer{gap:0;padding:12px;background:#fff;border:1px solid var(--linha);border-radius:var(--r);box-shadow:var(--sh-s);transition:transform .3s,box-shadow .3s}
.c-fazer:hover{transform:translateY(-3px);box-shadow:var(--sh-m)}
.c-fazer__img{aspect-ratio:4/3;margin-bottom:12px;border-radius:12px;box-shadow:none}
.c-fazer__title{padding:0 4px;font-size:18px;line-height:1.2}
.c-fazer__place{display:inline-flex;align-items:center;gap:5px;padding:6px 4px 0;font-size:12.5px;text-decoration:none}
.c-fazer__place .ico{width:14px;height:14px}
.c-fazer__place:hover{text-decoration:underline}
.pill-action{margin-top:14px;border-radius:100px;font-weight:600}

/* experiência e roteiro */
.c-exp{border-radius:20px;border-color:var(--linha);box-shadow:var(--sh-s);transition:transform .3s,box-shadow .3s}
.c-exp:hover{transform:translateY(-4px);box-shadow:var(--sh-m)}
.c-exp__img{height:210px;border-radius:20px 20px 0 0}
.c-exp__chip{top:12px;left:12px;padding:7px 12px;border-radius:100px;background:rgba(255,255,255,.95);font-size:12px;box-shadow:var(--sh-s)}
.c-exp__body{gap:10px;padding:20px;border-radius:0 0 20px 20px}
.c-exp__title{font-size:19px;line-height:1.2}
.c-exp__resumo{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;line-height:1.45;color:var(--g54)}
.c-exp__price{display:flex;align-items:baseline;gap:6px;margin-top:auto;font-size:26px;font-weight:700;line-height:1;color:var(--ink)}
.c-exp__price span{font-size:15px;font-weight:600;color:var(--g84)}
.c-exp__price small{font-size:12px;font-weight:400;color:var(--g84)}
.c-exp__eco{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:100px;background:var(--green-100);font-size:12px;font-weight:600;color:var(--green-700)}
.c-exp__eco .ico{width:14px;height:14px}
.c-exp__host{width:100%;margin-top:14px;padding-top:14px;border-top:1px solid var(--linha)}
.c-exp__host a{text-decoration:none}
.c-exp__host a:hover{text-decoration:underline}
.c-rota__resumo{line-height:1.45}
.c-rota__stats{gap:12px 20px;margin-top:auto;padding-top:14px;border-top:1px solid var(--linha)}
.c-rota__stats strong{font-size:17px}

/* produto */
.c-prod{overflow:hidden;border:1px solid var(--linha);border-radius:var(--r);box-shadow:var(--sh-s);transition:transform .3s,box-shadow .3s}
.c-prod:hover{transform:translateY(-4px);box-shadow:var(--sh-m)}
.c-prod__img{background:#faf7f3}
.c-prod__tag{top:12px;left:12px;padding:5px 11px;border-radius:100px;background:rgba(255,255,255,.95);font-size:12px;box-shadow:var(--sh-s)}
.c-prod__body{gap:6px;padding:18px}
.c-prod__title{font-size:17px;line-height:1.25}
.c-prod__by{font-size:12.5px;color:var(--g84)}
.c-prod__price{display:flex;align-items:baseline;gap:8px;margin:6px 0 2px;font-size:24px;font-weight:800;line-height:1;color:var(--ink)}
.c-prod__price small{font-size:12px;font-weight:400;color:var(--g84)}
.c-prod__qlabel{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0)}
.c-prod__buy{display:grid;gap:10px;margin-top:auto;padding-top:12px}
.c-prod .qty{justify-self:start;padding:3px;border:1px solid var(--linha);border-radius:100px}
.c-prod .qty button{border:0;background:transparent}

/* blog */
.c-blog{gap:0;padding:12px;background:#fff;border:1px solid var(--linha);border-radius:var(--r);box-shadow:var(--sh-s);transition:transform .3s,box-shadow .3s}
.c-blog:hover{transform:translateY(-3px);box-shadow:var(--sh-m)}
.c-blog__img{margin-bottom:12px;overflow:hidden;border-radius:12px}
.c-blog__img .ph{aspect-ratio:16/9;border-radius:0;transition:transform .5s}
.c-blog:hover .c-blog__img .ph{opacity:1;transform:scale(1.03)}
.c-blog__title{padding:0 4px;font-size:19px;line-height:1.25}
.c-blog__resumo{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;padding:8px 4px 0;font-size:14px;line-height:1.5;color:var(--g54)}
.c-blog__meta{padding:12px 4px 2px;font-size:13px;color:var(--g84)}
.c-blog__meta .ico{width:14px;height:14px;color:var(--green)}

/* evento */
.grid-eventos{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.c-evento{gap:0;overflow:hidden;border:1px solid var(--linha);border-radius:var(--r);box-shadow:var(--sh-s);transition:transform .3s,box-shadow .3s,border-color .3s}
.c-evento:hover{transform:translateY(-4px);box-shadow:var(--sh-m)}
.c-evento__img{height:170px;border-radius:0}
.c-evento__img .ph{border-radius:0;transition:transform .5s}
.c-evento:hover .c-evento__img .ph{opacity:1;transform:scale(1.04)}
.c-evento__badge{top:14px;bottom:auto;left:14px;transform:none;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.28)}
.c-evento__body{align-items:flex-start;gap:7px;padding:18px;text-align:left}
.c-evento__title{font-size:19px;line-height:1.2}
.c-evento__meta{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--green)}
.c-evento__meta .ico{width:14px;height:14px}
.c-evento__by{font-size:13px;color:var(--g84)}

/* explore a região */
.c-tile{gap:16px;min-height:0;padding:20px;border-color:var(--linha);border-radius:var(--r);box-shadow:var(--sh-s);transition:transform .3s,box-shadow .3s,border-color .3s}
.c-tile:hover{transform:translateY(-4px);box-shadow:var(--sh-m)}
.c-tile img{width:100%;height:104px;padding:14px;border-radius:12px;background:#faf7f3;object-fit:contain}
.c-tile span{display:inline-flex;align-items:center;gap:8px;font-size:17px;color:var(--ink);text-decoration:none}
.c-tile span::after{content:"→";color:var(--green)}
.c-tile:hover span{color:var(--green)}

/* previsão do tempo */
.weather{grid-template-columns:repeat(auto-fit,minmax(104px,1fr))}
.wx{gap:4px;padding:14px 10px;border-color:var(--linha);border-radius:14px;box-shadow:var(--sh-s)}
.wx:first-child{border-color:rgba(39,122,69,.35);background:linear-gradient(180deg,#fff,var(--green-100))}
.wx__t{font-size:18px}

/* sem internet */
.sec .offline{align-items:center;gap:14px;width:min(100% - 2*var(--pad),620px);padding:clamp(24px,4vw,40px);border:1px dashed var(--gCE);border-radius:24px;background:#fff;text-align:center}
.offline .sub-sec{max-width:46ch}
.offline__art img{margin:0 auto}
.offline .dots{display:inline-grid;margin:4px 0 8px;text-align:left}
.offline__try{margin-top:0;font-weight:600}

/* parceiro em destaque (ex.: Aventureza) */
.parceiro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:stretch;gap:0;overflow:hidden;background:#fff;border:1px solid var(--linha);border-radius:24px;box-shadow:var(--sh-m)}
.parceiro__media{position:relative;min-height:280px}
.parceiro__media img{width:100%;height:100%;object-fit:cover}
.parceiro__selo{position:absolute;top:16px;left:16px;padding:7px 14px;border-radius:100px;background:rgba(255,255,255,.94);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brown-dk);box-shadow:var(--sh-s)}
.parceiro__body{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:clamp(24px,3.5vw,40px)}
.parceiro__logo{width:auto;max-width:190px;height:52px;object-fit:contain;object-position:left center}
.parceiro__body .kicker{margin:0}
.parceiro__body .h-sec{font-size:clamp(24px,2.6vw,32px)}
.parceiro__body .sub-sec{color:var(--ink)}
.parceiro__itens{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0}
.parceiro__itens li{padding:6px 12px;border-radius:100px;background:var(--green-100);font-size:13px;font-weight:600;color:var(--green-700)}
.parceiro__acoes{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
@media (max-width:860px){
  .parceiro{grid-template-columns:1fr}
  .parceiro__media{min-height:200px;max-height:260px}
}

/* ficha do lugar */
.ficha{display:grid;gap:0;margin:-4px 0 4px}
.ficha li{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--linha)}
.ficha li:last-child{border-bottom:0}
.ficha span{font-size:13px;color:var(--g84)}
.ficha strong{font-size:14px;font-weight:600;text-align:right;color:var(--ink)}
.side-card{gap:10px;padding:22px;border-color:var(--linha);border-radius:var(--r);box-shadow:var(--sh-s)}
.side-note{margin-top:4px;font-size:13px;line-height:1.5;color:var(--g84)}
.pill-visit--card{justify-content:center;width:100%;padding:12px;border:1px solid var(--linha);background:#fff;color:var(--brown-dk)}
.pill-visit--card:hover{border-color:var(--green);background:var(--green-100)}

/* páginas internas: respiro e hierarquia */
.page-head{padding:clamp(28px,4vw,44px) 0 clamp(20px,2.5vw,28px)}
.page-head .lead{max-width:68ch;line-height:1.45}
.single-grid{gap:clamp(28px,4vw,56px);padding:clamp(32px,4vw,56px) 0}
.single-main>h2{margin:36px 0 14px;font-size:17px;letter-spacing:.01em}
.single-main>p,.single-main .prose p{line-height:1.6}
.addr{border-color:var(--linha);border-radius:12px}
.eco-big{border-radius:12px}

/* rodapé em colunas */
.foot{padding:clamp(40px,5vw,64px) 0 100px}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(2,minmax(0,1fr));gap:32px;padding-bottom:32px;border-bottom:1px solid var(--linha)}
.foot-brand{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.foot-grid .foot-logo{width:164px;margin:0}
.foot-claim{max-width:34ch;font-size:15px;line-height:1.5;color:var(--g54)}
.foot-contato{display:flex;flex-wrap:wrap;gap:8px 16px}
.foot-contato a{font-size:14px;color:var(--green);text-decoration:none}
.foot-contato a:hover{text-decoration:underline}
.foot-col h2{margin-bottom:12px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brown)}
.foot-col ul{display:grid;gap:8px}
.foot-col a{font-size:15px;color:var(--g54);text-decoration:none}
.foot-col a:hover{color:var(--ink);text-decoration:underline}
.foot-row{width:min(100% - 2*var(--pad),var(--wrap));margin:0 auto;padding:22px 0;border-top:0}
.foot-made{margin-top:4px;font-size:14px;color:var(--g84)}
@media (max-width:767px){
  .foot-grid{grid-template-columns:1fr;gap:24px}
  .foot-row{flex-direction:column;align-items:flex-start;gap:10px;padding:18px 0}
}

/* ciclo: texto à esquerda, foto na metade direita */
.sec--ciclo{padding:clamp(40px,5vw,72px) 0 clamp(170px,20vw,250px);background-size:min(52%,700px) auto}
.sec--ciclo::before{background:linear-gradient(180deg,#fff 42%,rgba(255,255,255,0) 88%)}
.sec--ciclo .wrap{gap:14px}
.sec--ciclo .wrap>*{max-width:min(100%,620px)}
.ciclo-text{max-width:56ch}
.h-ciclo{margin-top:10px}
/* grades que não devem esticar com poucos itens */
.grid-fazer{grid-template-columns:repeat(auto-fill,minmax(250px,320px))}
@media (max-width:767px){
  .grid-fazer{grid-template-columns:1fr}
  .sec--ciclo{padding-bottom:clamp(150px,45vw,200px);background-size:92% auto}
}

/* perto de mim e mapa */
.perto-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 16px}
.perto-msg{flex:1 1 240px;margin:0;font-size:13px;line-height:1.4;color:var(--g84)}
.perto-msg--erro{color:#c0392b}
.perto-msg--alerta{color:#8a5a00}
.mapa-box{margin:0 0 20px;overflow:hidden;border:1px solid var(--linha);border-radius:var(--r);box-shadow:var(--sh-s);background:#eee8e1}
.mapa{height:min(62vh,480px)}
.mapboxgl-popup-content{padding:12px 14px;border-radius:12px;font-family:var(--ff);font-size:13px;line-height:1.5}
.mapboxgl-popup-content strong{font-size:14px}
.mapboxgl-popup-content a{color:var(--green);font-weight:600}
.c-lugar__dist{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:100px;background:rgba(39,122,69,.92);font-size:12.5px;font-weight:600;color:#fff}
.ficha li.ficha--coord strong{font-variant-numeric:tabular-nums;font-size:13px;color:var(--g54)}
@media (max-width:767px){.mapa{height:58vh}}
.page-head + .sec-tight{padding-top:8px}
.perto-bar .btn[data-perto].is-ativo{background:#fff;border-color:var(--linha);color:var(--ink)}

/* ====================================================================
   Abertura: o logo brota e o título do hero sobe palavra a palavra.
   Tudo em CSS — se o JS não carregar, a página abre animada do mesmo
   jeito; com "reduzir movimento" ligado, abre parada.
   ==================================================================== */
.logo-anim{display:grid;line-height:0}
.logo-anim>span{grid-area:1/1;display:block}

@keyframes logo-brota{
  from{opacity:0;transform:scale(.32) rotate(-18deg)}
  to{opacity:1;transform:none}
}
@keyframes logo-palavra{
  from{opacity:0;clip-path:inset(0 100% 0 0)}
  to{opacity:1;clip-path:inset(0 -4% 0 0)}
}
/* o centro do giro é o cacho de brotos, não o meio do arquivo */
.logo-anim .logo-marca{animation:logo-brota .8s cubic-bezier(.34,1.56,.64,1) both;transform-origin:70% 34%}
.logo-anim .logo-palavra{animation:logo-palavra .75s .3s cubic-bezier(.22,.8,.26,1) both}
/* o hover mora na imagem, e a entrada no span: um não corta o outro */
.logo-anim .logo-marca img{transition:transform .45s cubic-bezier(.34,1.56,.64,1);transform-origin:70% 34%}
.logo-anim:hover .logo-marca img,.logo-anim:focus-visible .logo-marca img{transform:scale(1.09) rotate(7deg)}
/* a cópia fixa da barra entra ao rolar: ali a abertura já passou */
.glass-bar.is-float .logo-anim .logo-marca,
.glass-bar.is-float .logo-anim .logo-palavra{animation:none}

@keyframes palavra-sobe{
  from{opacity:0;transform:translateY(115%) rotate(1.5deg)}
  to{opacity:1;transform:none}
}
@keyframes hero-entra{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:none}
}
/* a máscara precisa de folga embaixo, senão corta a perna do "g" e do "p" */
.hero-title .tw{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.08em .05em .16em;margin:-.08em -.05em -.16em}
.hero-title .tw-i{display:inline-block;animation:palavra-sobe .85s cubic-bezier(.22,.8,.26,1) both;animation-delay:calc(var(--i,0)*.08s + .12s)}
/* subtítulo e botões entram logo depois da última palavra (--n = quantas são) */
.hero-home__content .hero-sub{animation:hero-entra .8s cubic-bezier(.22,.8,.26,1) both;animation-delay:calc(var(--n,6)*.08s + .3s)}
.hero-home__content .hero-btns{animation:hero-entra .8s cubic-bezier(.22,.8,.26,1) both;animation-delay:calc(var(--n,6)*.08s + .42s)}

@media (prefers-reduced-motion:reduce){
  .logo-anim .logo-marca,.logo-anim .logo-palavra,
  .hero-title .tw-i,.hero-home__content .hero-sub,.hero-home__content .hero-btns{animation:none}
  .logo-anim .logo-marca img{transition:none}
}

/* ====================================================================
   Tipografia dos títulos: uma serifa de bloco (slab), de ar rural, no
   lugar da Inter. A Bitter tem a família inteira de pesos, então o
   contraste fino/preto do hero continua de pé.
   ==================================================================== */
:root{--ff-titulo:"Fraunces",Georgia,"Times New Roman",serif}
h1,h2,.hero-title,.h-sec,.sec-head h2,.h-brown,.h-ciclo,.single-hero h1{
  font-family:var(--ff-titulo);
  /* eixos da Fraunces: SOFT arredonda as pontas, WONK solta as curvas — é daí que vem o ar artesanal */
  font-variation-settings:"opsz" 96,"SOFT" 40,"WONK" 1
}
/* a serifa é mais larga que a Inter: o aperto de -1px virava letra colada */
.hero-title,.h-sec,.sec-head h2{letter-spacing:-.015em}
.h-brown{letter-spacing:-.01em}

/* ====================================================================
   Páginas internas: ritmo mais curto e cabeçalho alinhado.
   O respiro largo (92px em cima e embaixo de cada seção) é da home, onde
   cada seção é uma cena com foto. Numa interna de duas ou três seções
   curtas, aquilo vira 180px de vazio entre blocos.
   ==================================================================== */
body:not(.is-home) .sec{padding:clamp(40px,4.2vw,60px) 0}
body:not(.is-home) .page-head + .sec{padding-top:clamp(10px,1.6vw,22px)}
/* seções vizinhas com o mesmo fundo não precisam de dois respiros inteiros */
body:not(.is-home) .sec:not(.sec-tint):not(.sec-dark):not(.sec--brown):not(.sec--yellow):not(.sec--ciclo)
  + .sec:not(.sec-tint):not(.sec-dark):not(.sec--brown):not(.sec--yellow):not(.sec--ciclo){padding-top:clamp(10px,1.4vw,20px)}
/* a última antes do rodapé já tem o respiro do rodapé */
body:not(.is-home) main > .sec:last-child{padding-bottom:clamp(40px,4.5vw,56px)}

/* o cabeçalho estreito ficava centralizado enquanto as seções abaixo
   começavam na margem: duas réguas na mesma página. Agora o bloco ocupa
   a mesma largura e só o texto é estreito. */
.page-head--narrow .wrap{max-width:none}
.page-head--narrow h1,.page-head--narrow .lead,.page-head--narrow .kicker{max-width:64ch}

/* cabeçalho com foto vira duas colunas no desktop: texto à esquerda, foto à direita */
@media (min-width:900px){
  .page-head-media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:center;
    column-gap:clamp(28px,4vw,52px);width:min(100% - 2*var(--pad),var(--wrap));margin-inline:auto}
  /* a foto vem antes no HTML (por causa do carregamento); no desktop ela vai para a direita */
  .page-head-media .wrap{grid-area:1/1;width:auto;max-width:none;margin:0}
  .page-head-media img{grid-area:1/2;width:100%;max-height:320px;margin:0;aspect-ratio:4/3}
}

/* texto corrido: a caixa acompanha a margem das outras seções e só as linhas
   ficam curtas — antes o bloco inteiro era estreito e centralizado, o que dava
   duas réguas diferentes na mesma página */
body:not(.is-home) .sec > .wrap.prose{max-width:min(100% - 2*var(--pad),var(--wrap))}
body:not(.is-home) .sec > .wrap.prose > *{max-width:72ch}

/* grade de poucos itens: centraliza em vez de deixar o buraco à direita */
.grid-fazer{justify-content:center}

/* diretório em partes: o botão que abre mais um punhado de lugares */
.lista-mais{display:flex;justify-content:center;margin-top:clamp(20px,2.5vw,28px)}
.lista-mais .btn{min-width:min(100%,320px);justify-content:center}

/* ====================================================================
   Carrossel sem beirada: a trilha estoura a coluna de 1280px e vai até a
   borda da tela, então o cartão entra e sai pela borda em vez de ser
   cortado no meio da página. O primeiro cartão continua alinhado com o
   título da seção — a sangria vira padding, e o scroll-padding mantém o
   encaixe do snap na mesma régua.
   ==================================================================== */
.car{--sangria:max(var(--pad),calc((100vw - var(--wrap))/2))}
.car-track{
  margin-inline:calc(var(--sangria)*-1);
  padding-inline:var(--sangria);
  scroll-padding-inline:var(--sangria);
}
/* a sangria usa 100vw (que conta a barra de rolagem): o corte aqui evita
   que a página ganhe rolagem horizontal por causa disso */
.sec:has(.car){overflow-x:clip}

/* ====================================================================
   Barra pendurada (a cópia fixa que reaparece ao rolar para cima):
   vidro escuro com logo e links em branco. A barra do topo da página
   continua clara — são dois momentos diferentes da leitura.
   ==================================================================== */
.glass-bar.is-float{
  background:rgba(35,20,8,.72);border-color:rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(14px) saturate(125%);backdrop-filter:blur(14px) saturate(125%);
  box-shadow:0 12px 32px rgba(20,10,0,.25);
}
/* a palavra do logo é marrom no arquivo; aqui vira branca — a marca segue colorida */
.glass-bar.is-float .logo-palavra img{filter:brightness(0) invert(1)}
.glass-bar.is-float .nav-list>li>a,
.glass-bar.is-float .nav-list>li>a .ico,
.glass-bar.is-float .act,
.glass-bar.is-float .menu-toggle{color:#fff}
.glass-bar.is-float .nav-list>li>a:hover{background:rgba(255,255,255,.12)}
.glass-bar.is-float .nav-list>li>a[aria-current]{background:rgba(255,255,255,.16)}
.glass-bar.is-float .act:hover,.glass-bar.is-float .menu-toggle:hover{background:rgba(255,255,255,.16)}
.glass-bar.is-float .menu-toggle{border-color:rgba(255,255,255,.35)}

/* ====================================================================
   Header do topo da home: sem painel de vidro e sem grudar na rolagem.
   Ele existe só no primeiro olhar, por cima da foto; quem acompanha a
   leitura depois é a barra pendurada, que já aparece ao subir.
   ==================================================================== */
.glass-bar:not(.is-float){
  /* relative (não sticky): rola junto com a foto, mas continua empilhado acima
     do conteúdo do hero — com static o submenu de "Lugares" ia parar embaixo */
  position:relative;z-index:50;background:none;border:0;border-radius:0;box-shadow:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;
}
/* sem o vidro por trás, o texto apoia na foto: uma sombra fina segura a leitura */
.glass-bar:not(.is-float) .nav-list>li>a,
.glass-bar:not(.is-float) .act,
.glass-bar:not(.is-float) .menu-toggle{text-shadow:0 1px 10px rgba(255,255,255,.55)}
.glass-bar:not(.is-float) .act:hover,
.glass-bar:not(.is-float) .menu-toggle:hover{background:rgba(255,255,255,.45)}

/* ====================================================================
   Rodapé: a página fecha no marrom da marca, como o fim do hero.
   Quatro colunas — quem somos, o guia, mais do guia e contato —, uma
   faixa com os municípios do território e a linha de direitos.
   ==================================================================== */
.foot{
  /* sem folga antes: a última seção já traz o respiro dela, e na home ela é a faixa
     escura do cicloturismo — o rodapé encosta e os dois viram um bloco só */
  margin-top:0;
  /* a barra de baixo só existe no celular: no desktop o rodapé não precisa da folga dela */
  padding:clamp(40px,5vw,72px) 0 clamp(28px,3vw,40px);
  background:var(--brown-dk);color:rgba(255,255,255,.78);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
@media (max-width:767px){.foot{padding-bottom:84px}}
.foot a{color:inherit;text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}

.foot-grid{
  /* a coluna "mais do guia" tem duas listas: precisa de mais largura que as outras */
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr) minmax(0,1.25fr) minmax(0,1.05fr);
  gap:clamp(24px,3vw,44px);padding-bottom:clamp(26px,3vw,36px);border-bottom:1px solid rgba(255,255,255,.14);
}
.foot-brand{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.foot-logo{width:180px}
.foot-logo .logo-palavra img{filter:brightness(0) invert(1)}
/* o logo do rodapé não precisa da abertura: ela acontece lá em cima */
.foot-logo .logo-marca,.foot-logo .logo-palavra{animation:none}
.foot-claim{max-width:30ch;font-size:15px;line-height:1.5;color:rgba(255,255,255,.72)}
.foot-realiza{font-size:14px;color:rgba(255,255,255,.6)}
.foot-realiza b{color:var(--yellow);font-weight:700}

.foot-col h2{margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow)}
.foot-col ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.foot-col a{font-size:15px;color:rgba(255,255,255,.8)}
.foot-duas{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
.foot-fale a{display:inline-flex;align-items:center;gap:10px;word-break:break-word}
.foot-fale .ico{width:18px;height:18px;flex:none;color:var(--yellow)}

.foot-cidades{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 16px;padding:clamp(20px,2.4vw,28px) 0;border-bottom:1px solid rgba(255,255,255,.14)}
.foot-cidades h2{margin:0;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.foot-cidades ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.foot-cidades a{display:inline-block;padding:5px 12px;border:1px solid rgba(255,255,255,.18);border-radius:100px;font-size:13px}
.foot-cidades a:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4);text-decoration:none}

.foot-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;width:min(100% - 2*var(--pad),var(--wrap));margin:0 auto;padding:clamp(18px,2vw,24px) 0 0;border-top:0}
/* .foot-row p{color:var(--ink)} lá de cima ganhava desta por ser mais específica */
.foot-row p.foot-direitos{margin:0;font-size:14px;color:rgba(255,255,255,.72)}
.foot-top{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border:1px solid rgba(255,255,255,.22);border-radius:100px;font-size:14px;font-weight:600;color:#fff}
.foot-top:hover{background:rgba(255,255,255,.12);text-decoration:none}
.foot-top .ico{width:16px;height:16px}

@media (max-width:900px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
}
@media (max-width:560px){
  .foot-grid{grid-template-columns:1fr;gap:28px}
  .foot-cidades{gap:10px}
}

/* ====================================================================
   "Sem internet": a seção ocupa a largura inteira e as fotos encostam na
   borda da tela, como uma janela para fora. O texto segue na margem do
   resto da página; no celular a cena empilha.
   ==================================================================== */
.sec--offline{padding:0;background:linear-gradient(180deg,#fff 0%,rgba(244,241,236,.9) 100%)}
.offline-cena{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(24px,4vw,56px)}
.sec--offline .offline{
  width:auto;max-width:54ch;margin:0;align-items:flex-start;text-align:left;
  padding:clamp(40px,5vw,72px) clamp(16px,2vw,24px) clamp(40px,5vw,72px) max(var(--pad),calc((100vw - var(--wrap))/2));
  border:0;background:none;border-radius:0;
}
.sec--offline .offline .sub-sec{max-width:42ch}
.sec--offline .offline__art img{margin:0}
.sec--offline .offline .dots{text-align:left}

.offline-fotos{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:clamp(10px,1.1vw,16px);height:min(60vh,420px)}
.offline-fotos img{width:100%;height:100%;object-fit:cover;border-radius:20px;background:#e8e2da}
.offline-fotos img:first-child{grid-row:span 2}
/* as da direita encostam na borda: canto reto desse lado, senão sobra uma falha */
.offline-fotos img:not(:first-child){border-top-right-radius:0;border-bottom-right-radius:0}

@media (max-width:900px){
  .offline-cena{grid-template-columns:1fr;gap:0}
  .sec--offline .offline{max-width:none;padding:clamp(32px,6vw,48px) var(--pad) clamp(24px,4vw,32px)}
  .offline-fotos{grid-template-columns:repeat(3,1fr);grid-auto-rows:auto;height:min(34vh,200px);gap:8px;padding-bottom:clamp(32px,6vw,48px)}
  .offline-fotos img:first-child{grid-row:auto}
  /* a fileira encosta nas duas bordas: canto reto só do lado que toca a tela */
  .offline-fotos img{border-radius:14px}
  .offline-fotos img:first-child{border-radius:0 14px 14px 0}
  .offline-fotos img:last-child{border-radius:14px 0 0 14px}
}

/* ====================================================================
   Cicloturismo: a foto vira o fundo inteiro da faixa, com um véu escuro
   do lado do texto. Antes a imagem ficava encolhida no canto e sobrava
   meia tela de branco.
   ==================================================================== */
.sec--ciclo{
  display:flex;align-items:center;min-height:clamp(360px,40vw,520px);
  padding:clamp(48px,6vw,96px) 0;overflow:hidden;color:#fff;
  background-color:var(--brown-dk);background-image:var(--ciclo-img,url("/assets/img/evento-circuito.jpeg"));
  background-position:center;background-size:cover;background-repeat:no-repeat;
}
/* véu mais forte onde o texto se apoia e quase transparente onde a foto conta a história */
.sec--ciclo::before{
  background:linear-gradient(90deg,rgba(25,13,5,.9) 0%,rgba(25,13,5,.76) 38%,rgba(25,13,5,.3) 72%,rgba(25,13,5,.1) 100%);
}
.sec--ciclo .wrap{position:relative;gap:14px}
.sec--ciclo .wrap>*{max-width:min(100%,640px)}
.sec--ciclo h2,.sec--ciclo .h-ciclo{color:#fff}
.sec--ciclo .ciclo-text{color:rgba(255,255,255,.88)}
.sec--ciclo .btn-pill{background:#fff;color:var(--brown-dk)}
.sec--ciclo .btn-pill:hover{background:var(--yellow);color:var(--brown-dk)}
@media (max-width:767px){
  .sec--ciclo{min-height:clamp(320px,78vw,440px);padding:clamp(40px,10vw,64px) 0;background-position:62% center}
  .sec--ciclo::before{background:linear-gradient(180deg,rgba(25,13,5,.88) 0%,rgba(25,13,5,.72) 55%,rgba(25,13,5,.55) 100%)}
}

/* perguntas frequentes (páginas de entrada) */
.faq{display:grid;gap:10px;max-width:72ch}
.faq-item{border:1px solid var(--linha);border-radius:14px;background:#fff;overflow:hidden}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;font-weight:700;font-size:16px;cursor:pointer;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";width:9px;height:9px;flex:none;border-right:2px solid var(--green);border-bottom:2px solid var(--green);transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.faq-item[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.faq-item summary:hover{background:var(--gF6)}
.faq-resposta{padding:0 18px 16px;font-size:15px;line-height:1.6;color:var(--g54)}
@media (prefers-reduced-motion:reduce){.faq-item summary::after{transition:none}}


/* ====================================================================
   Lugares da home presos: a seção segura a tela e o trilho de cartões
   anda para o lado. O HTML é o mesmo do carrossel — quem liga é o JS,
   com a classe .pin-ativo, então sem script nada muda.
   ==================================================================== */
.pin-ativo .pin-alto{height:calc(100vh + var(--pin-sobra,0px))}
.pin-ativo .pin-grude{
  position:sticky;top:0;min-height:100vh;display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;padding:clamp(24px,4vw,56px) 0;
}
.pin-ativo .car-track{overflow:visible;scroll-snap-type:none;will-change:transform}
.pin-ativo .car-btn{display:none}
@media (prefers-reduced-motion:reduce){
  .pin-ativo .pin-alto{height:auto}
  .pin-ativo .pin-grude{position:static;min-height:0;overflow:visible}
}


/* ====================================================================
   Tamanho dos títulos de seção: maiores e numa escala fluida só.
   Antes eram três degraus que não conversavam — 24px no celular, 58px
   na faixa de tablet e 32px no desktop, herdados dos breakpoints do
   Elementor. Agora o tamanho acompanha a largura da tela.
   ==================================================================== */
.h-sec,.sec-head h2{font-size:clamp(30px,3.6vw,50px);line-height:1.05}
.h-brown{font-size:clamp(32px,4.6vw,56px);line-height:1.05}
.h-ciclo{font-size:clamp(24px,2.6vw,36px);line-height:1.1}
/* h2 no meio do texto corrido continua menor que o de seção, mas cresce junto */
.prose h2{font-size:clamp(22px,2vw,30px);line-height:1.2}
/* o título do parceiro mora numa caixa estreita: sobe menos */
.parceiro__body .h-sec{font-size:clamp(24px,2.8vw,36px)}

/* o h1 da página interna acompanha: com a seção em 50px, 36px fixos deixavam
   o título da página menor que os títulos de dentro dela */
.page-head h1{font-size:clamp(34px,4.4vw,58px);line-height:1.05}
.single-hero h1{font-size:clamp(32px,4.2vw,56px);line-height:1.05}


/* ====================================================================
   Página do pedido: itens à esquerda, entrega e formulário à direita.
   ==================================================================== */
.checkout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(24px,3vw,44px);align-items:start}
.checkout-itens{display:grid;gap:4px}
.checkout-item{display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--linha)}
.checkout-item b{display:block;font-size:16px}
.checkout-item span{font-size:13px;color:var(--g84)}
.checkout-item strong{min-width:88px;text-align:right;font-size:16px}
.checkout-total{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:16px;padding:16px;border-radius:14px;background:var(--green-100)}
.checkout-total strong{font-size:22px}
.checkout-lado{display:grid;gap:16px;position:sticky;top:96px}
.bloco-entrega,.bloco-form{display:grid;gap:12px;padding:clamp(18px,2.4vw,26px);border:1px solid var(--linha);border-radius:var(--r);background:#fff}
.bloco-entrega h2,.bloco-form h2{font-size:17px;line-height:1.2}
.entrega-ciclo{padding:12px 14px;border-radius:12px;background:var(--green-100);font-size:14px;line-height:1.5;color:var(--ink)}
.entrega-texto p{font-size:15px;line-height:1.55;color:var(--g54)}
.entrega-nota{font-size:13px;color:var(--g84)}
.bloco-form .campo{display:grid;gap:6px}
.bloco-form label{font-size:13px;font-weight:600}
.bloco-form input,.bloco-form select{min-height:44px;padding:10px 12px;border:1px solid var(--linha);border-radius:10px;background:#fff;font:inherit;width:100%}
.bloco-form input:focus,.bloco-form select:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(39,122,69,.15)}
.bloco-form .dupla{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.campo-dica{font-size:12px;line-height:1.4;color:var(--g84)}
.aviso-fora{margin:0;padding:12px 14px;border-radius:12px;background:#fff4d6;border:1px solid #f0d58a;font-size:14px;line-height:1.5;color:#6b4d00}
.checkout-aviso{font-size:13px;line-height:1.5;color:var(--g84)}
.checkout .vazio{padding:28px 0;color:var(--g84)}
@media (max-width:900px){
  .checkout{grid-template-columns:1fr}
  .checkout-lado{position:static}
  .bloco-form .dupla{grid-template-columns:1fr}
}


/* ====================================================================
   O cartão de produto no celular: dois por linha, foto 4/3, tipografia
   menor e sombra suave no lugar da borda. Antes ia um por linha com foto
   quadrada de 356px — cada produto ocupava a tela inteira.
   ==================================================================== */
@media (max-width:767px){
  /* a grade de produtos foge do "1 coluna" das outras grades */
  .grid-3:has(.c-prod),.grid-4:has(.c-prod){grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .c-prod{border:0;border-radius:14px;box-shadow:0 2px 10px rgba(46,26,11,.07),0 1px 2px rgba(46,26,11,.04)}
  .c-prod:hover{transform:none;box-shadow:0 2px 10px rgba(46,26,11,.07)}
  .c-prod__img{aspect-ratio:4/3}
  .c-prod__tag{top:6px;left:6px;padding:2px 7px;font-size:10px}
  .c-prod__body{gap:3px;padding:8px 9px 10px}
  .c-prod__title{font-size:13px;line-height:1.2}
  .c-prod__by{font-size:10.5px}
  .c-prod__price{gap:5px;margin:1px 0 0;font-size:15px}
  .c-prod__price small{font-size:10px}
  .c-prod__buy{gap:6px;padding-top:6px}
  /* num cartão de 170px o seletor de quantidade espreme o botão; ele fica no
     carrinho, onde dá para ajustar com calma (o "adicionar" manda 1) */
  .c-prod .qty{display:none}
  .c-prod__buy .btn{min-height:32px;padding:0 8px;font-size:12px;gap:5px;border-radius:9px}
  .c-prod__buy .rotulo-largo{display:none}
  .c-prod__buy .rotulo-curto{display:inline}
  .c-prod__buy .btn .ico{width:14px;height:14px}
  /* o carrossel da home acompanha: dá para ver que tem mais ao lado */
  .car-track.car-5{grid-auto-columns:58%}
}

/* o rótulo curto do botão só aparece no cartão estreito do celular */
.rotulo-curto{display:none}