/* Dono 09/10: «le cambié el tipo de letra… me lo cambió solo en paseos». Cantos, formato da foto e espaçamento
   de «Personalizar o visual» (--shop-*) valem também aqui (Início, Blog, notas), não só no catálogo. */
/* Public editorial pages. Theme colors and editable content remain owned by the store. */
body{background:var(--bg);font-family:var(--font-body)}
/* Ritmo vertical ÚNICO (07/10): landing, catálogo e blog respiram o mesmo entre seções — antes
   cada página tinha o seu número (100, 80, 64, 48) e a loja mudava de compasso a cada clique. */
:root{--sec-gap:96px}
.lj-pg{--sec-y:var(--sec-gap)}
.lj-pg-lido,.lj-ld-cta h2,.lj-ld-cta-k,.lj-sh-k,.lj-ld-kick{overflow-wrap:anywhere;min-width:0}
.lj-pg .lj-ld-btn{max-width:100%;overflow-wrap:anywhere}
.lj-ld-wrap{max-width:1328px;padding:0 40px}
.lj-ld-hero{position:relative;margin:0 24px 0;padding:0;isolation:isolate;border-radius:var(--shop-radius,8px);overflow:hidden;background:#112f38;color:#fff}
.lj-ld-hero-in,.lj-ld-hero.solo .lj-ld-hero-in{display:flex;align-items:stretch;max-width:1440px;min-height:650px;padding:54px 56px;gap:0}
.lj-ld-hero-txt{display:flex;flex-direction:column;justify-content:flex-end;width:100%;position:relative;z-index:2}
.lj-ld-kick{color:#fff;margin:0 0 auto;padding-bottom:56px;font-size:11px;letter-spacing:.2em}
.lj-ld-kick .ln{background:#fff;width:30px}
.lj-ld-hero h1{font-family:var(--font-custom-head,var(--font-body));font-size:clamp(64px,8.5vw,128px);font-weight:650;line-height:.94;letter-spacing:-.07em;color:#fff;max-width:12ch;text-wrap:balance;margin:0 0 38px}
.lj-ld-hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;border-top:1px solid #ffffff50;padding-top:26px}
.lj-ld-sub{font-family:var(--font-body);font-size:16px;line-height:1.65;color:#fffffff0;max-width:48ch;margin:0}
.lj-ld-hero-cta{flex:none;align-items:center;gap:20px;margin:0}
.lj-ld-btn{border-radius:6px;padding:17px 24px;font-size:14px;font-weight:600;box-shadow:none;gap:24px}
.lj-ld-btn:hover{box-shadow:none;transform:translateY(-2px)}
.lj-ld-btn>span[aria-hidden]{font-size:23px;line-height:16px}
.lj-ld-hero .lj-ld-btn{background:#fff;color:#102d36}
.lj-ld-hero .lj-ld-btn.fantasma{background:transparent;color:#fff;border:0;border-radius:0;padding:12px 0;border-bottom:1px solid #ffffff80}
.lj-ld-hero-m{position:absolute;inset:0;z-index:0;aspect-ratio:auto;border-radius:0;background:#112f38}
.lj-ld-hero-m::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#071c2bf2 0%,#071c2b99 48%,#071c2b1a 100%);pointer-events:none}
.lj-ld-hero-m img{object-position:center 55%}
.lj-ld-selo{z-index:1;top:52px;bottom:auto;right:56px;left:auto;background:transparent;border:0;border-radius:0;color:#fff;padding:0;backdrop-filter:none}
.lj-ld-hero.solo{background:color-mix(in srgb,var(--cor) 35%,#10232b)}
.lj-ld-hero.solo .lj-ld-hero-in{min-height:510px}
.lj-ld-sec{border:0}
.lj-sh{margin-bottom:40px;align-items:flex-end}
.lj-sh-k{font-family:var(--font-body);font-size:11px;text-transform:uppercase;letter-spacing:.13em;margin-bottom:18px}
.lj-sh-k .n{border:1px solid var(--bord);width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:10px}
.lj-sh-t{font-family:var(--font-custom-head,var(--font-body));font-weight:500;font-size:clamp(34px,4.5vw,64px);letter-spacing:-.055em;line-height:1.05;max-width:19ch}
.lj-sh-a{font-size:13px;padding-bottom:9px}
.lj-home-posts{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:28px 36px;align-items:stretch}
.lj-home-posts>.lj-bl-capa{grid-row:span 2;margin:0;min-width:0}
.lj-home-posts>.lj-bl-capa>a{display:grid;min-height:100%;height:100%}
.lj-home-posts .lj-bl-capa .m{position:absolute;inset:0;aspect-ratio:auto}
.lj-home-posts .lj-bl-capa .b{position:relative;align-self:end;margin-top:160px;max-width:none;padding:32px}
.lj-home-posts .lj-bl-capa .t{font-size:clamp(30px,3.1vw,44px);line-height:1.12}
.lj-home-posts .lj-bl-capa .veu{background:linear-gradient(180deg,rgba(4,10,18,.08),rgba(4,10,18,.88))}
.lj-home-posts>.lj-bl-dest{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:20px;align-items:center;min-width:0;padding:12px 0}
.lj-home-posts>.lj-bl-dest .m{aspect-ratio:4/5}
.lj-home-posts>.lj-bl-dest .b{padding:0}
.lj-home-posts>.lj-bl-dest h3{font-size:clamp(21px,1.9vw,27px);line-height:1.2;margin:0}
.lj-home-posts>.lj-bl-dest .lj-bl-sub{font-size:14px;line-height:1.5;margin-top:10px}
.lj-home-posts>.lj-bl-dest .lj-bl-meta{margin-top:12px}
.lj-home-posts>.lj-bl-capa:only-child{grid-column:1/-1;grid-row:auto}
.lj-home-posts:has(>:nth-child(2):last-child)>.lj-bl-capa{grid-row:auto}
@media(max-width:1000px){
  .lj-home-posts{grid-template-columns:1fr 1fr;gap:28px}
  .lj-home-posts>.lj-bl-capa{grid-column:1/-1;grid-row:auto}
  .lj-home-posts>.lj-bl-dest{display:block}
  .lj-home-posts>.lj-bl-dest .m{aspect-ratio:16/10}
  .lj-home-posts>.lj-bl-dest .b{padding-top:18px}
  .lj-home-posts:has(>:nth-child(2):last-child)>.lj-bl-dest{grid-column:1/-1}
}
@media(max-width:600px){
  .lj-home-posts{grid-template-columns:1fr;gap:24px}
  .lj-home-posts .lj-bl-capa .b{padding:24px;margin-top:100px}
  .lj-home-posts .lj-bl-capa .t{font-size:30px}
  .lj-home-posts>.lj-bl-dest{display:grid;grid-template-columns:1fr 1.4fr;gap:16px}
  .lj-home-posts>.lj-bl-dest .m{aspect-ratio:4/5}
  .lj-home-posts>.lj-bl-dest .b{padding:0}
  .lj-home-posts>.lj-bl-dest h3{font-size:21px}
  .lj-home-posts>.lj-bl-dest .lj-bl-sub{display:none}
}
.lj-bl-dest .m{border-radius:var(--shop-radius,8px);aspect-ratio:5/4}
.lj-bl-dest .b{padding-top:22px}
.lj-bl-dest h3{font-family:var(--font-custom-head,var(--font-body));font-weight:550;letter-spacing:-.04em;font-size:clamp(25px,2.8vw,39px);line-height:1.12}
.lj-bl-dest .lj-bl-kick{font-size:10px;margin:0 0 10px}
.lj-bl-dest .lj-bl-sub{font-size:15px;line-height:1.6;max-width:48ch}
.lj-bl-meta{font-size:10px;letter-spacing:.06em;margin-top:20px}
.lj-ld-sobre{background:var(--surf);padding:var(--sec-gap) 0;--ink:var(--on-surf);--muted:color-mix(in srgb,var(--on-surf) 72%,var(--surf));--bord:color-mix(in srgb,var(--on-surf) 18%,var(--surf))}
.lj-ld-sobre .lj-ld-wrap{display:block;max-width:1040px}
.lj-ld-sobre .lj-sh{margin-bottom:28px}
.lj-ld-sobre .lj-sh-t{font-size:clamp(30px,3.2vw,46px)}
.lj-ld-sobre .lj-pg-lido{width:100%;max-width:none;margin:0;font-size:18px;--pg-out:0px}
.lj-ld-sobre .lj-pg-texto{max-width:76ch}
.lj-pg-texto a{text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}
.lj-pg-texto a:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.lj-ld-sobre .lj-pg-dest{margin:36px 0;padding:32px 48px;width:100%;border-top:1px solid var(--bord);border-bottom:1px solid var(--bord)}
.lj-ld-sobre .lj-pg-dest p{max-width:28ch;font-size:clamp(30px,3.8vw,48px);line-height:1.18}
.lj-ld-sobre .lj-pg-h2{font-family:var(--font-custom-head,var(--font-body));font-size:26px;font-weight:600;letter-spacing:-.03em;margin-top:32px}
.lj-pg-dest{border:0;padding-top:36px;padding-bottom:36px}
.lj-pg-dest p{font-family:var(--font-head);font-style:italic;font-weight:400;font-size:clamp(32px,4.5vw,62px)}
/* Início: o riel só dá a LARGURA de cada cartão. A cara do cartão é a mesma da aba Passeios (loja-chrome.css) —
   antes havia aqui um segundo desenho (sem borda, preço menor, botão quadrado) e o turista via duas lojas. */
.lj-ld-rail{gap:var(--shop-gap,20px);--tour-width:calc((100% - 2 * var(--shop-gap,20px))/3)}
.lj-ld-rail>.lj-vit-card{flex:0 0 var(--tour-width);min-width:0}
.lj-tour-placeholder{display:flex;width:100%;height:100%;align-items:center;justify-content:center;background:var(--surf);color:var(--on-surf,var(--muted))}
.lj-tour-placeholder svg{width:64px;height:64px;opacity:.55;flex:none}
.lj-ld-carrossel::before,.lj-ld-carrossel::after{display:none}
.lj-sh-actions{display:flex;align-items:center;gap:10px;max-width:100%;min-width:0}
.lj-sh-actions .lj-sh-a{display:inline-flex;align-items:center;gap:4px;min-height:42px;padding:0;margin-right:12px;white-space:normal;overflow-wrap:anywhere}
.lj-sh-actions .lj-ld-seta{position:static;box-shadow:none;width:42px;height:42px;flex:none}
.lj-ld-cta{padding:0 24px 24px}
.lj-ld-sobre + .lj-ld-cta{padding-top:24px}
.lj-ld-cta-in{max-width:1400px;border-radius:var(--shop-radius,8px);background:color-mix(in srgb,var(--cor) 22%,#10232b);padding:80px 56px;text-align:left;position:relative;overflow:hidden}
.lj-ld-cta-in::after{content:"↗";position:absolute;right:6%;top:30px;font-family:var(--font-body);font-size:240px;line-height:1;color:#ffffff12;pointer-events:none}
.lj-ld-cta h2{font-family:var(--font-custom-head,var(--font-body));font-weight:500;letter-spacing:-.065em;font-size:clamp(44px,6vw,82px);max-width:10ch}
.lj-ld-cta-s{margin:24px 0 0;font-size:16px}
.lj-ld-cta-bts{justify-content:flex-start;position:relative;z-index:1}
.lj-bl-topo{padding-top:64px}
.lj-bl-capa,.lj-nt-capa{border-radius:var(--shop-radius,8px)}
.lj-bl-capa .t,.lj-nt-cab h1{font-family:var(--font-custom-head,var(--font-body));font-weight:550;letter-spacing:-.055em}
/* Blog article: text and cover share the same width and alignment. */
.lj-nt .lj-pg-lido{width:100%;max-width:1200px;margin-inline:auto;--pg-out:0px}
.lj-nt .lj-nt-cab{padding:56px 0 24px}
.lj-nt .lj-nt-cab h1{font-size:clamp(36px,4.7vw,64px);line-height:1.08}
.lj-nt .lj-nt-sub{font-size:18px;line-height:1.7;margin-top:22px}
.lj-nt .lj-nt-capa{margin:20px auto 0}
.lj-nt .lj-nt-corpo{padding-top:52px;padding-bottom:64px}
.lj-nt-corpo .lj-pg-lido{display:flow-root;font-size:18px;line-height:1.85}
.lj-nt-corpo .lj-pg-texto.lead{font-size:21px;line-height:1.75}
.lj-nt-corpo .lj-pg-texto + .lj-pg-texto{margin-top:24px}
.lj-nt-corpo .lj-pg-texto p{margin-bottom:24px}
.lj-nt-corpo .lj-pg-texto p:last-child{margin-bottom:0}
.lj-nt-corpo .lj-pg-h2{font-family:var(--font-custom-head,var(--font-body));font-size:clamp(25px,2.6vw,32px);font-weight:550;line-height:1.25;letter-spacing:-.035em;margin:40px 0 16px;text-wrap:pretty}
.lj-nt-corpo .lj-pg-h2:first-child{margin-top:0}
.lj-nt-corpo .lj-nt-volta{margin-top:40px;padding-top:24px}
@media(max-width:600px){
  .lj-nt .lj-nt-cab{padding:32px 0 18px}
  .lj-nt .lj-nt-sub{font-size:16px;margin-top:18px}
  .lj-nt .lj-nt-corpo{padding-top:30px;padding-bottom:40px}
  .lj-nt-corpo .lj-pg-lido{font-size:16px;line-height:1.8}
  .lj-nt-corpo .lj-pg-texto.lead{font-size:18px;line-height:1.75}
  .lj-nt-corpo .lj-pg-h2{margin-top:32px;margin-bottom:14px}
}
.lj-bl-item h3{font-family:var(--font-custom-head,var(--font-body));font-weight:600;letter-spacing:-.025em}
.lj-bl-grid{margin-top:calc(var(--sec-gap) / 2)}
.lj-pg-bar{padding:8px 16px calc(8px + env(safe-area-inset-bottom));background:var(--card);box-shadow:none}
.lj-pg-bar-btn{border-radius:5px;font-size:13px;padding:12px}
/* Com JS, a barra espera a capa sair da tela (landing.php); sem JS fica como sempre. */
.lj-pg-bar[data-espera]{transition:transform .25s ease,opacity .25s ease}
.lj-pg-bar[data-espera]:not(.is-on){transform:translateY(100%);opacity:0;pointer-events:none}
/* Títulos numa família só: a capa do catálogo (hero.php) ainda saía na serif do tema enquanto
   tudo ao redor era a sans — a serif fica só de acento, na citação da landing (.lj-pg-dest). */
.lj-heroX .txt h1{font-family:var(--font-custom-head,var(--font-body));font-weight:650;letter-spacing:-.04em;line-height:1.05}
a:focus-visible{outline:2px solid var(--cor);outline-offset:5px}
.lj-ld-hero a:focus-visible{outline-color:#fff}
@media(max-width:1000px){
  .lj-ld-rail{--tour-width:calc((100% - var(--shop-gap,20px))/2)}
  .lj-ld-hero-in{min-height:620px;padding:40px}
  .lj-ld-hero-bottom{align-items:flex-start;flex-direction:column;gap:24px}
  .lj-ld-hero h1{font-size:clamp(60px,10vw,100px)}
  .lj-bl-mix{gap:32px}
  .lj-ld-sobre .lj-ld-wrap{grid-template-columns:1fr;gap:10px}
}
@media(max-width:760px){
  .lj-ld-rail{--tour-width:88%}
  .lj-ld-sobre .lj-pg-dest{padding:26px 28px;margin:28px 0}
  :root{--sec-gap:64px}
  .lj-ld-wrap{padding:0 22px}
  .lj-ld-hero{margin:0 10px;border-radius:var(--shop-radius,8px)}
  .lj-ld-hero-in,.lj-ld-hero.solo .lj-ld-hero-in{min-height:590px;padding:28px 24px}
  .lj-ld-kick{font-size:10px;padding-bottom:56px}
  .lj-ld-hero h1{font-size:clamp(48px,13vw,82px);letter-spacing:-.065em;margin-bottom:28px}
  .lj-ld-hero-bottom{padding-top:20px;gap:22px}
  .lj-ld-sub{font-size:14px;line-height:1.6;max-width:36ch}
  .lj-ld-hero-cta{width:100%;gap:20px;flex-wrap:wrap}
  .lj-ld-hero-cta .lj-ld-btn{flex:0 1 auto;font-size:13px;padding:15px 18px}
  .lj-ld-hero-cta .lj-ld-btn.fantasma{padding:12px 0}
  .lj-ld-selo{top:28px;right:24px;font-size:9px;max-width:45%;text-align:right}
  /* A 375 o selo da cidade encavalava no kicker (os dois no topo da capa). A cidade já mora na
     topbar, embaixo da marca: no celular o selo sai em vez de brigar por 20 px. */
  .lj-ld-hero-m .lj-ld-selo{display:none}
  .lj-ld-hero-m img{object-position:62% center}
  .lj-sh{gap:24px;margin-bottom:28px}
  .lj-sh-t{font-size:37px}
  .lj-bl-mix{grid-template-columns:1fr;gap:32px}
  .lj-bl-fila{padding-top:0;gap:32px}
  .lj-bl-dest .m,.lj-bl-fila .lj-bl-dest .m{aspect-ratio:5/4}
  .lj-bl-dest h3{font-size:28px}
  .lj-ld-sobre .lj-ld-wrap{gap:4px}
  .lj-ld-cta{padding:0 10px 12px}
  .lj-ld-cta-in{padding:44px 24px}
  .lj-ld-cta-in::after{font-size:150px;right:8px;top:22px}
  .lj-ld-cta-bts{align-items:stretch;gap:10px}
  .lj-ld-cta h2{font-size:48px}
  .lj-bl-topo{padding-top:40px}
}
@media(prefers-reduced-motion:reduce){.lj-ld-btn:hover{transform:none}.lj-pg-bar[data-espera]{transition:none}}

/* ── LISTAS DE FOTOS da landing (mig 354): Instagram, clientes e depoimentos ──────────────────────
   O riel é o mesmo dos passeios (largura por --tour-width); muda só o cartão. Cartões brancos como os
   demais da loja (dono 07/10: nada herda o durazno do tema). Instagram em 4 por linha: post é quadrado
   e mais estreito que a tarjeta de passeio. */
.lj-gl-rail{--tour-width:calc((100% - 3 * var(--shop-gap,20px))/4)}
.lj-gl-rail>*{flex:0 0 var(--tour-width);min-width:0;scroll-snap-align:start;margin:0}
.lj-ig-card{background:#fff;border:1px solid var(--bord,rgba(0,0,0,.1));border-radius:14px;overflow:hidden}
.lj-ig-a{display:flex;flex-direction:column;color:#262626;text-decoration:none;height:100%}
.lj-ig-top{display:flex;align-items:center;gap:10px;padding:10px 12px;min-width:0}
.lj-ig-av{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 2px #fff,0 0 0 3.5px #e1306c}
.lj-ig-av-txt{display:inline-flex;align-items:center;justify-content:center;background:#fafafa;font-weight:700;font-size:14px}
.lj-ig-user{font-weight:600;font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.lj-ig-dots{color:#8e8e8e;letter-spacing:1px}
.lj-ig-img{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:#f2f2f2}
.lj-ig-acts{display:flex;gap:14px;padding:10px 12px 4px;color:#262626}
.lj-ig-save{margin-left:auto}
.lj-ig-ver{padding:2px 12px 12px;font-size:12px;color:#8e8e8e}
.lj-ig-a:hover .lj-ig-ver,.lj-ig-a:focus-visible .lj-ig-ver{color:#262626;text-decoration:underline}
.lj-ig-seguir{text-align:center;margin:28px 0 0}
.lj-gl-foto img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:14px;background:#f2f2f2}
.lj-gl-foto figcaption{font-size:14px;color:var(--muted);margin-top:8px}
/* Depoimento com cara de avaliação (nome, estrelas, quando, texto, de onde veio). Estrelas no amarelo
   das avaliações; o texto corta em 7 linhas para os cartões do carrossel ficarem da mesma altura. */
.lj-rv{background:#fff;border:1px solid var(--bord,rgba(0,0,0,.1));border-radius:14px;padding:18px 18px 16px;display:flex;flex-direction:column;gap:10px;color:#202124}
.lj-rv-cab{display:flex;align-items:center;gap:12px;min-width:0}
.lj-rv-av{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:none}
.lj-rv-av-txt{display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:17px}
.lj-rv-quem{display:flex;flex-direction:column;min-width:0}
.lj-rv-quem strong{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lj-rv-qdo{font-size:12px;color:#70757a}
.lj-rv-est{margin:0;font-size:17px;letter-spacing:1px;line-height:1;color:#dadce0}
.lj-rv-est .on{color:#fbbc04}
.lj-rv-txt{margin:0;font-size:14.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
.lj-rv-ori{margin:auto 0 0;font-size:12px;color:#70757a}
.lj-rv-shot{display:block;width:100%;max-height:340px;object-fit:contain;background:#f5f5f5;border-radius:10px}
@media(max-width:1000px){.lj-gl-rail{--tour-width:calc((100% - 2 * var(--shop-gap,20px))/3)}}
@media(max-width:760px){.lj-gl-rail{--tour-width:calc((100% - var(--shop-gap,20px))/2)}}
@media(max-width:480px){.lj-gl-rail{--tour-width:78%}}
