:root{
  --navy:#031b3d;
  --blue:#0085ca;
  --blue-light:#00a8e8;
  --white:#fff;
  --ink:#031b3d;
  --muted:#46556b;
  --secondary:#6b7280;
  --tertiary:#8291a3;
  --soft:#f4f7fb;
  --footer:#01132b;
  --footer-border:#1f2937;
  --footer-muted:#9ca3af;
}

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

html{
  width:100%;
  scroll-behavior:smooth;
  overflow-x:clip;
}

body{
  width:100%;
  margin:0;
  overflow-x:clip;
  font-family:"Open Sans",Arial,sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.6;
}

img{
  max-width:100%;
}

.skip-link{
  position:absolute;
  left:-9999px;
}

.skip-link:focus{
  left:16px;
  top:16px;
  z-index:999;
  padding:10px;
  background:#fff;
}

/* Estrutura */
.wrap{
  width:min(1180px,calc(100% - 36px));
  margin-inline:auto;
}

.site-header{
  position:sticky;
  top:0;
  z-index:80;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:4px 16px;
  background:var(--navy);
  box-shadow:0 4px 18px #00142a33;
}

.brand img{
  display:block;
  width:124px;
  max-height:38px;
}

.menu-button{
  display:grid;
  gap:4px;
  padding:5px;
  border:0;
  background:none;
}

.menu-button span{
  display:block;
  width:22px;
  height:2px;
  background:#fff;
}

.nav{
  display:none;
  position:absolute;
  top:54px;
  left:0;
  right:0;
  padding:18px;
  background:var(--navy);
  border-top:1px solid #ffffff1f;
}

.nav.open{
  display:grid;
  gap:14px;
}

.nav a{
  color:#fff;
  font-family:Montserrat,Arial,sans-serif;
  font-weight:700;
  text-decoration:none;
}

h1,
h2,
h3{
  margin:0;
  color:inherit;
  font-family:Montserrat,Arial,sans-serif;
  line-height:1.08;
}

.kicker{
  margin:0 0 10px;
  color:var(--blue);
  font-family:Montserrat,Arial,sans-serif;
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin:8px auto 0;
  padding:10px 18px;
  border-radius:999px;
  background:var(--blue);
  color:#fff;
  font-family:Montserrat,Arial,sans-serif;
  font-weight:800;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  box-shadow:0 10px 30px rgba(0,133,202,.23);
}

/* Hero */
.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:calc(100svh - 54px);
  display:flex;
  align-items:stretch;
  padding:0;
  color:#fff;
  background-image:
    linear-gradient(180deg,rgba(0,14,30,.26),rgba(0,24,48,.40)),
    url("../images/hero-pesca-camping-palmas.webp");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}

.hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.08));
}

.hero-inner{
  position:relative;
  width:min(calc(100% - 34px),440px);
  min-height:calc(100svh - 54px);
  margin-inline:auto;
  padding:clamp(52px,7svh,70px) 0 22px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
}

.hero .kicker{
  margin:0 0 16px;
  color:var(--blue-light);
  font-size:11px;
  line-height:1.3;
  letter-spacing:.18em;
}

.hero h1{
  max-width:100%;
  margin:0 auto 22px;
  color:#fff;
  font-size:clamp(30px,8.7vw,42px);
  line-height:1.06;
  letter-spacing:-.018em;
  text-shadow:0 3px 20px rgba(0,0,0,.50);
}

.hero h1 .h1-line{
  display:block;
  white-space:nowrap;
}

.hero .lead{
  width:100%;
  max-width:100%;
  margin:0 auto;
  color:#fff;
  font-size:15px;
  line-height:1.58;
  letter-spacing:.004em;
  text-align:center;
  text-shadow:0 2px 12px rgba(0,0,0,.52);
}

.hero .lead p{
  margin:0 0 18px;
}

.hero .lead p:last-child{
  margin-bottom:0;
}

.hero-lead-primary,
.hero-lead-secondary{
  width:100%;
  margin-inline:auto;
  text-align:center;
}

.hero-lead-primary span,
.hero-lead-secondary span{
  display:block;
  width:max-content;
  max-width:100%;
  margin-inline:auto;
  white-space:nowrap;
}

.hero .hero-cta{
  width:max-content;
  min-width:0;
  max-width:calc(100% - 32px);
  margin-top:auto;
  margin-bottom:0;
  padding:11px 18px;
  gap:8px;
  border-radius:999px;
  background:var(--blue);
  color:#fff;
  font-size:14.5px;
  font-weight:800;
  line-height:1;
  letter-spacing:0;
  text-transform:none;
  box-shadow:0 7px 18px rgba(0,133,202,.22);
}

.hero-cta-whatsapp{
  width:20px;
  height:20px;
  flex:0 0 20px;
  color:#fff;
}

/* Brilho da lamparina */
.hero-lantern-glow{
  position:absolute;
  left:49.4%;
  top:72.2%;
  z-index:1;
  width:62px;
  height:62px;
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%,-50%);
  background:
    radial-gradient(circle,
      rgba(255,247,205,.72) 0 6%,
      rgba(255,211,113,.42) 10%,
      rgba(255,164,49,.22) 24%,
      rgba(255,126,20,.08) 44%,
      rgba(255,112,0,0) 70%);
  filter:blur(3px);
  mix-blend-mode:screen;
  opacity:.48;
  animation:
    lantern-breathe-soft 3.8s cubic-bezier(.45,0,.55,1) infinite,
    lantern-flicker-soft 1.55s steps(1,end) infinite;
  will-change:transform,opacity,filter;
}

.hero-lantern-glow::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:26%;
  height:34%;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:
    radial-gradient(ellipse at 50% 58%,
      rgba(255,255,232,.98) 0 15%,
      rgba(255,224,138,.86) 28%,
      rgba(255,151,44,.44) 54%,
      rgba(255,120,0,0) 76%);
  filter:blur(1px);
  opacity:.72;
  animation:lantern-core 1.58s ease-in-out infinite;
}

.hero-lantern-glow::after{
  content:"";
  position:absolute;
  inset:-18%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,175,61,.16),rgba(255,123,24,0) 68%);
  filter:blur(10px);
  opacity:.34;
  animation:lantern-halo 4.1s ease-in-out infinite;
}

@keyframes lantern-breathe-soft{
  0%,100%{
    opacity:.42;
    transform:translate(-50%,-50%) translate3d(0,1px,0) scale(.97);
    filter:blur(3px) brightness(.98);
  }
  36%{
    opacity:.57;
    transform:translate(-50%,-50%) translate3d(.5px,-.5px,0) scale(1.025);
    filter:blur(2.8px) brightness(1.03);
  }
  68%{
    opacity:.48;
    transform:translate(-50%,-50%) translate3d(-.5px,0,0) scale(1);
    filter:blur(3px) brightness(1);
  }
}

@keyframes lantern-flicker-soft{
  0%,22%,48%,72%,100%{opacity:.48}
  23%{opacity:.54}
  49%{opacity:.44}
  73%{opacity:.52}
  84%{opacity:.46}
}

@keyframes lantern-core{
  0%,100%{transform:translate(-50%,-50%) translateY(1px) scale(.90);opacity:.76}
  30%{transform:translate(-50%,-50%) translate(1px,-2px) scale(1.08);opacity:1}
  58%{transform:translate(-50%,-50%) translate(-1px,0) scale(.96);opacity:.82}
  81%{transform:translate(-50%,-50%) translate(1px,-1px) scale(1.02);opacity:.92}
}

@keyframes lantern-halo{
  0%,100%{opacity:.46;transform:scale(.94)}
  50%{opacity:.80;transform:scale(1.10)}
}

/* Dobras editoriais */
.section{
  min-height:calc(100svh - 54px);
  display:flex;
  align-items:center;
  padding:18px 0 22px;
}

.tone{
  background:var(--navy);
  color:#fff;
}

.tone .kicker{
  color:var(--blue-light);
}

.row{
  display:grid;
  gap:14px;
  align-content:center;
}

.media{
  width:100%;
  min-width:0;
  height:clamp(170px,27svh,220px);
  margin:0;
  overflow:hidden;
  border-radius:20px;
  background:#e9eef4;
  box-shadow:0 10px 26px rgba(0,21,47,.12);
}

.media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.copy{
  width:100%;
  max-width:360px;
  justify-self:center;
  align-self:center;
  text-align:center;
}

.copy .kicker{
  margin-bottom:7px;
}

.copy h2{
  width:100%;
  margin:0 auto 10px;
  color:var(--ink);
  font-size:28px;
  line-height:1.06;
  letter-spacing:-.015em;
  text-align:center;
}

.tone .copy h2{
  color:var(--white);
}

.mobile-two-lines span{
  display:block;
  width:max-content;
  max-width:100%;
  margin-inline:auto;
  white-space:nowrap;
  text-align:center;
}

.copy p:not(.kicker){
  max-width:34ch;
  margin:0 auto 7px;
  color:var(--muted);
  font-size:14px;
  line-height:1.45;
}

.tone .copy p:not(.kicker){
  color:#dbe7f4;
}

.copy-mobile{
  display:block;
}

.copy-desktop{
  display:none;
}

.copy .copy-mobile p{
  max-width:31ch;
  margin-bottom:8px;
  line-height:1.5;
}

#camping .cta{
  width:auto;
  max-width:none;
  min-width:0;
}

/* Fechamento */
.closing{
  min-height:auto;
  padding:54px 0 62px;
  text-align:center;
  background:#f5f8fc;
}

.closing .wrap{
  width:min(calc(100% - 32px),360px);
  max-width:360px;
  margin-inline:auto;
}

.closing .kicker{
  margin-bottom:9px;
  font-size:11px;
  line-height:1.25;
}

.closing h2{
  width:100%;
  max-width:100%;
  margin:0 auto 12px;
  color:var(--ink);
  font-size:25px;
  line-height:1.08;
  letter-spacing:-.012em;
}

.closing-copy{
  max-width:29ch;
  margin:0 auto 12px;
  color:var(--muted);
  font-size:13.5px;
  line-height:1.48;
}

.closing .cta{
  margin-top:2px;
}

/* Movimento */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:
    opacity .65s ease var(--reveal-delay,0ms),
    transform .65s cubic-bezier(.2,.8,.2,1) var(--reveal-delay,0ms);
  will-change:opacity,transform;
}

.reveal.is-visible{
  opacity:1;
  transform:none;
}

/* WhatsApp flutuante */
.wa-float{
  position:fixed;
  right:14px;
  bottom:calc(14px + env(safe-area-inset-bottom));
  z-index:120;
  width:54px;
  height:54px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#25d366;
  color:#fff;
  text-decoration:none;
  box-shadow:0 12px 34px rgba(0,0,0,.28);
  opacity:0;
  visibility:hidden;
  transform:translate3d(0,28px,0) scale(.82);
  pointer-events:none;
  transition:
    opacity .38s ease,
    transform .58s cubic-bezier(.16,1,.3,1),
    box-shadow .3s ease,
    visibility 0s linear .58s;
}

.wa-float.is-visible{
  opacity:1;
  visibility:visible;
  transform:translate3d(0,0,0) scale(1);
  pointer-events:auto;
  transition:
    opacity .38s ease,
    transform .58s cubic-bezier(.16,1,.3,1),
    box-shadow .3s ease,
    visibility 0s linear 0s;
}

.wa-float svg{
  width:28px;
  height:28px;
  display:block;
}

@media (hover:hover) and (pointer:fine){
  .wa-float.is-visible:hover{
    transform:translate3d(0,-3px,0) scale(1.04);
    box-shadow:0 16px 38px rgba(0,0,0,.32);
  }
}

/* Rodapé oficial */
.footer{
  padding:64px 0 0;
  color:#fff;
  background:var(--footer);
  border-top:1px solid var(--footer-border);
  font:16px/1.5 "Open Sans",sans-serif;
  text-align:left;
}

.footer > .container{
  width:100%;
  max-width:1180px;
  margin-inline:auto;
  padding-inline:16px;
}

.footer-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:32px;
  margin-bottom:48px;
}

.footer-grid > div{
  min-width:0;
}

.footer-grid h2{
  margin:0 0 16px;
  color:#0085ca;
  font-family:"Open Sans",sans-serif;
  font-size:18px;
  font-weight:700;
  line-height:1.5;
}

.footer p{
  margin:0;
}

.footer-brand img{
  display:block;
  width:auto;
  max-width:100%;
  height:48px;
  margin:0 0 24px;
  object-fit:contain;
  opacity:.9;
}

.footer-brand p{
  margin-bottom:16px;
  color:var(--footer-muted);
  font-size:14px;
  line-height:1.625;
}

.footer-brand strong{
  display:block;
  color:var(--footer-muted);
  font-size:12px;
  line-height:1.5;
}

.footer .footer-social{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}

.footer .footer-social li{
  display:block;
}

.footer .footer-social a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 11px;
  border:1px solid rgba(255,255,255,.04);
  border-radius:999px;
  background:#172844;
  color:#dbe7f4;
  font-size:12px;
  font-weight:700;
  line-height:1;
  text-decoration:none;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}

.footer .footer-social a:hover,
.footer .footer-social a:focus-visible{
  background:#20395f;
  color:#fff;
  transform:translateY(-1px);
  outline:none;
}

.footer ul{
  display:grid;
  gap:8px;
  margin:0;
  padding:0;
  color:var(--footer-muted);
  font-size:14px;
  list-style:none;
}

.footer li{
  margin:0;
  padding:0;
}

.footer a{
  display:inline;
  color:inherit;
  text-decoration:none;
  overflow-wrap:anywhere;
}

.footer a:hover{
  color:#fff;
}

.footer address{
  display:grid;
  gap:8px;
  color:var(--footer-muted);
  font-size:14px;
  font-style:normal;
}

.footer address p{
  color:var(--footer-muted);
  font-size:14px;
  line-height:1.5;
}

.footer li span{
  color:#0085ca;
}

.hours{
  margin-top:24px;
}

.hours strong{
  display:block;
  margin-bottom:8px;
  color:#6b7280;
  font-size:12px;
}

.hours p{
  color:var(--footer-muted);
  font-size:14px;
  line-height:1.5;
}

.footer-bottom{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  width:100%;
  margin:0;
  padding:20px 0 14px;
  color:#6b7280;
  font-size:13px;
  border-top:1px solid var(--footer-border);
}

.footer-meta{
  width:100%;
  min-width:0;
}

.footer-meta p{
  white-space:nowrap;
  color:#6b7280;
  font-size:13px;
  line-height:1.6;
}

.footer-credit,
.footer-credit a{
  font-size:12px;
  line-height:1.6;
}

.footer-legal{
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  width:100%;
}

.footer-legal a{
  color:#6b7280;
  font-size:12px;
  line-height:1.5;
}

/* Desktop */
@media (min-width:760px){
  .site-header{
    height:94px;
    padding:14px max(18px,calc((100% - 1180px)/2));
  }

  .brand img{
    width:150px;
    max-height:50px;
  }

  .menu-button{
    display:none;
  }

  .nav{
    display:flex;
    position:static;
    gap:24px;
    padding:0;
    background:none;
    border:0;
  }

  .nav a{
    font-size:14px;
  }

  .hero{
    min-height:auto;
    padding:92px 0;
    align-items:center;
    background-image:
      linear-gradient(135deg,rgba(2,21,47,.84),rgba(3,54,109,.76)),
      url("../images/hero-pesca-camping-palmas.webp");
  }

  .hero::after{
    background:linear-gradient(180deg,rgba(0,15,35,.10),rgba(0,15,35,.20));
  }

  .hero-inner{
    width:min(1180px,calc(100% - 36px));
    max-width:880px;
    min-height:0;
    padding:0;
  }

  .hero .kicker{
    margin-bottom:10px;
    font-size:12px;
    letter-spacing:.14em;
  }

  .hero h1{
    max-width:850px;
    margin-bottom:0;
    font-size:clamp(36px,6vw,70px);
    line-height:1.08;
  }

  .hero h1 .h1-line{
    white-space:normal;
  }

  .hero .lead{
    max-width:820px;
    margin:24px auto;
    font-size:16px;
    line-height:1.6;
  }

  .hero-lead-primary span,
  .hero-lead-secondary span{
    display:inline;
    width:auto;
    white-space:normal;
  }

  .hero .hero-cta{
    margin-top:12px;
    padding:12px 20px;
    gap:9px;
    font-size:14px;
    box-shadow:0 8px 22px rgba(0,133,202,.24);
  }

  .hero-cta-whatsapp{
    width:21px;
    height:21px;
    flex-basis:21px;
  }

  .hero-lantern-glow{
    display:none;
  }

  .section{
    min-height:0;
    display:block;
    padding:78px 0;
  }

  .row{
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    gap:58px;
    align-items:center;
  }

  .row.reverse .media{
    order:2;
  }

  .row.reverse .copy{
    order:1;
  }

  .media{
    min-height:420px;
    height:420px;
    border-radius:16px;
    box-shadow:0 18px 45px #00152f1f;
  }

  .copy{
    max-width:640px;
  }

  .copy h2{
    margin-bottom:18px;
    font-size:42px;
    line-height:1.08;
  }

  .mobile-two-lines span{
    display:inline;
    width:auto;
    white-space:normal;
  }

  .copy p:not(.kicker){
    max-width:620px;
    margin-bottom:14px;
    font-size:16px;
    line-height:1.6;
  }

  .copy-mobile{
    display:none;
  }

  .copy-desktop{
    display:block;
  }

  .cta{
    min-height:48px;
    margin-top:12px;
    padding:12px 22px;
  }

  .closing{
    padding:62px 0;
  }

  .closing .wrap{
    width:min(1180px,calc(100% - 36px));
    max-width:780px;
  }

  .closing .kicker{
    margin-bottom:10px;
    font-size:12px;
  }

  .closing h2{
    max-width:none;
    margin-bottom:18px;
    font-size:42px;
  }

  .closing .mobile-two-lines span{
    display:inline;
    white-space:normal;
  }

  .closing-copy{
    max-width:620px;
    margin:0 auto 8px;
    font-size:16px;
    line-height:1.6;
  }

  .footer > .container{
    padding-inline:clamp(16px,2.5vw,32px);
  }
}

@media (min-width:768px){
  .footer{
    padding:64px 0 32px;
  }

  .footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .footer-bottom{
    flex-direction:row;
    flex-wrap:wrap;
    align-items:baseline;
    justify-content:space-between;
    gap:16px 24px;
    padding:32px 0 40px;
    font-size:13px;
  }

  .footer-meta{
    flex:1 1 32rem;
    width:auto;
  }

  .footer-meta p{
    font-size:13px;
    line-height:1.5;
  }

  .footer-credit,
  .footer-credit a,
  .footer-legal a{
    font-size:12px;
    line-height:1.5;
  }

  .footer-legal{
    flex:0 1 auto;
    width:auto;
  }
}

@media (min-width:1024px){
  .footer-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media (prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto;
  }

  .reveal{
    opacity:1;
    transform:none;
    transition:none;
    will-change:auto;
  }

  .wa-float{
    transition:none;
    transform:none;
  }

  .hero-lantern-glow,
  .hero-lantern-glow::before,
  .hero-lantern-glow::after{
    animation:none;
  }

  .hero-lantern-glow{
    opacity:.48;
  }
}

@supports not (overflow:clip){
  html,
  body{
    overflow-x:hidden;
  }
}
