/* Páginas das embarcações: hero, galeria, ficha técnica, destaques, cota. Gerado a partir das 3 páginas; edite aqui (uma vez) e rode deploy/deploy.sh. */
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  
  background:
    linear-gradient(90deg, rgba(0,36,79,.55) 0%, rgba(0,36,79,.25) 70%, rgba(0,36,79,.1) 100%),
    linear-gradient(180deg, rgba(0,36,79,.6) 0%, rgba(0,36,79,.5) 35%, rgba(0,36,79,.72) 65%, rgba(0,36,79,.95) 100%);
}
@media (min-width:768px){
  .hero::after{
    background:
      linear-gradient(90deg, rgba(0,36,79,.9) 0%, rgba(0,36,79,.72) 35%, rgba(0,36,79,.3) 70%, rgba(0,36,79,.1) 100%),
      linear-gradient(180deg, rgba(0,36,79,.45) 0%, rgba(0,36,79,.1) 35%, rgba(0,36,79,.25) 70%, rgba(0,36,79,.9) 100%);
  }
}
.inside{display:grid;gap:2.5rem}
.cut{position:relative}
.cut .media{aspect-ratio:1600/1074}
.pin{
  position:absolute;z-index:2;transform:translate(-50%,-50%);
  width:28px;height:28px;border-radius:50%;
  background:var(--azul-1);color:var(--off-white);border:1px solid var(--dourado);
  display:grid;place-items:center;font-size:.75rem;font-weight:600;
}
.cut .pin{display:none}
.cut:has(.media img) .pin{display:grid}
.callouts{display:grid;gap:.875rem;counter-reset:c}
.callouts li{display:flex;gap:.875rem;align-items:baseline;font-size:var(--fs-small);padding-bottom:.875rem;border-bottom:1px solid rgba(0,36,79,.08)}
.callouts li::before{
  counter-increment:c;content:counter(c);flex:none;
  width:24px;height:24px;border-radius:50%;border:1px solid var(--azul-1);
  display:inline-grid;place-items:center;font-size:.75rem;font-weight:600;transform:translateY(-1px)
}
.scale-media{width:100%;aspect-ratio:1600/1074;background:transparent}
.scale figcaption{font-size:var(--fs-lead);font-weight:300;max-width:34rem}
.scale figcaption strong{font-weight:600}
.ig-grid{
  display:grid;grid-auto-flow:column;grid-auto-columns:min(326px,86vw);gap:1rem;
  overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  margin-inline:calc(var(--gutter) * -1);padding:0 var(--gutter) 1rem;align-items:start;
  scroll-padding-inline:var(--gutter);
}
.ig-item{scroll-snap-align:start;min-width:0}
.ig-item .instagram-media{margin:0 !important;min-width:0 !important;width:100% !important;max-width:none !important}
.ig-item blockquote.instagram-media{
  min-height:610px;display:grid;place-items:center;padding:1.5rem;
  background:var(--branco);border:1px solid rgba(0,36,79,.1);border-radius:var(--radius);
}
.ig-item blockquote a{font-family:var(--font-ui);font-size:var(--fs-label);letter-spacing:.18em;text-transform:uppercase;font-weight:500;color:var(--azul-1)}
.scale figcaption strong,.price dd,.specs dd,.cmp-rows dd{font-weight:500}
@media (min-width:1024px){
  .inside{grid-template-columns:1.6fr 1fr;align-items:center;gap:3.5rem}
  .how{grid-template-columns:1.1fr .9fr;gap:5rem;align-items:start}
  
  .steps{grid-auto-flow:row;grid-auto-columns:auto;overflow:visible;margin:0;padding:0;gap:0}
  .step{padding:2rem 0;border-bottom:1px solid rgba(201,168,106,.3);cursor:pointer}
  .step:last-child{border-bottom:0}
  html.js .step{opacity:.45;transition:opacity .5s var(--ease)}
  html.js .step.is-active{opacity:1}
  .step-shot,.steps-hint{display:none}
  .how-stage{display:block;position:sticky;top:110px;justify-self:center;width:min(290px,100%);aspect-ratio:520/1068}
  .stage-shot{position:absolute;inset:0;opacity:0;transition:opacity .6s var(--ease)}
  .stage-shot.is-active{opacity:1}
  .marinas{grid-template-columns:1fr 1fr;gap:5rem}
  .ig-grid{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;margin-inline:0;padding:0}
}
.boat-hero{
  position:relative;overflow:hidden;min-height:92svh;display:flex;align-items:flex-end;
  padding:calc(64px + 2.5rem) 0 clamp(2.5rem,2rem + 3vw,4.5rem);background:var(--azul-1);
}
.boat-hero-bg{position:absolute;inset:0;margin:0}
.boat-hero-bg img{width:100%;height:100%;object-fit:cover;display:block}
.boat-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(0,36,79,.55) 0%, rgba(0,36,79,.35) 35%, rgba(0,36,79,.8) 70%, rgba(0,36,79,.96) 100%);
}
.boat-hero > .wrap{position:relative;z-index:2;width:100%}
.facts{background:rgba(0,21,48,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:0 1.25rem;border-radius:var(--radius)}
@media (min-width:768px){
  .boat-hero::after{
    background:
      linear-gradient(90deg, rgba(0,36,79,.9) 0%, rgba(0,36,79,.6) 40%, rgba(0,36,79,.15) 75%, rgba(0,36,79,.05) 100%),
      linear-gradient(180deg, rgba(0,36,79,.4) 0%, rgba(0,36,79,0) 35%, rgba(0,36,79,.2) 70%, rgba(0,36,79,.85) 100%);
  }
}
.back{display:inline-block;margin-bottom:2rem;font-family:var(--font-ui);font-size:var(--fs-label);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-decoration:none}
.back:hover{color:var(--off-white)}
.boat-hero-grid{display:grid;gap:2.5rem}
.boat-hero-text{display:grid;gap:1.25rem;min-width:0}
.boat-hero h1{font-size:var(--fs-h1);font-weight:400;line-height:1.05}
.boat-hero .cta-row{align-items:flex-start;margin-top:.5rem}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid rgba(201,168,106,.35)}
.facts > div:last-child{border-bottom:0}
.facts > div{padding:1.1rem 0;border-bottom:1px solid rgba(201,168,106,.2);display:grid;gap:.25rem}
.facts > div:nth-child(odd):not(.facts-wide){padding-right:1rem;border-right:1px solid rgba(201,168,106,.2)}
.facts > div:nth-child(even){padding-left:1rem}
.facts-wide{grid-column:1 / -1}
.facts dt{font-family:var(--font-ui);font-size:var(--fs-label);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.facts dd{font-family:var(--font-title);font-size:clamp(1.75rem,1.4rem + 1.4vw,2.5rem);color:var(--dourado);line-height:1.1}
.facts dd small{font-family:var(--font-body);font-size:.9rem;color:var(--muted);margin-left:.25rem}
.gallery-sec{padding-block:clamp(2.5rem,2rem + 2vw,4rem) clamp(1.5rem,1rem + 1vw,2.5rem)}
.gallery{
  display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  padding:0 var(--gutter) .75rem;scroll-padding-inline:var(--gutter);scrollbar-width:thin;
}
.g-item{flex:none;margin:0;height:clamp(260px,52vw,520px);scroll-snap-align:start;border-radius:var(--radius);overflow:hidden;position:relative;background:#E9E4DD}
.g-wide{aspect-ratio:4/3}
.g-16{aspect-ratio:16/9}
.g-tall{aspect-ratio:3/4}
.g-item img{width:100%;height:100%;object-fit:cover;display:block}
.g-plain{background:#F2F1EF}
.g-plain img{object-fit:contain}
.gallery-nav{display:flex;justify-content:space-between;align-items:center;margin-top:1rem}
.gallery-nav .steps-hint{margin:0}
.g-buttons{display:none;gap:.5rem}
.g-btn{width:44px;height:44px;border-radius:var(--radius);border:1px solid rgba(0,36,79,.25);background:transparent;color:var(--azul-1);cursor:pointer;font-size:1.1rem}
.g-btn:hover{border-color:var(--azul-1)}
.big-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 1.5rem}
.big-stats > div{display:grid;gap:.4rem;align-content:start;padding-top:1.25rem;border-top:1px solid rgba(201,168,106,.3)}
.big-stats dt{font-family:var(--font-ui);font-size:var(--fs-label);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.big-stats dd{font-family:var(--font-title);font-size:var(--fs-num);color:var(--dourado);line-height:1;font-variant-numeric:tabular-nums}
.big-stats dd.knots{font-size:clamp(1.75rem,1.3rem + 2vw,3rem)}
.big-stats dd.dd-text{font-size:clamp(1.125rem,1rem + .6vw,1.5rem);line-height:1.3}
.big-stats .knots .kmh{color:var(--muted);font-family:var(--font-body);font-size:.875rem;margin-top:.4rem}
.big-stats .unit{font-size:var(--fs-small);color:var(--muted)}
.dark .cmp-note{text-align:left;margin-left:0}
.features{display:grid;gap:2.5rem}
.feat-col h3{padding-bottom:1rem;border-bottom:var(--line-gold);margin-bottom:.5rem}
.feat-col li{padding:.85rem 0;border-bottom:1px solid rgba(0,36,79,.1);color:var(--cinza)}
.quota{max-width:40rem;margin-inline:auto;display:grid;gap:1.5rem;text-align:left}
.quota h2{font-size:var(--fs-h2)}
.quota-price{font-size:var(--fs-body)}
.quota-price dt{color:var(--muted)}
.quota .where{color:var(--off-white)}
.quota .cta-row{align-items:flex-start;margin-top:.5rem}
.link-light{color:var(--off-white)}
@media (min-width:768px){
  .big-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .features{grid-template-columns:repeat(3,minmax(0,1fr))}
  .g-buttons{display:flex}
}
@media (min-width:1024px){
  .boat-hero-grid{grid-template-columns:1.1fr .9fr;align-items:end;gap:4rem}
  .gallery{padding-inline:max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter)));scroll-padding-inline:max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter)))}
}
.scale{margin-top:clamp(3.5rem,2.5rem + 4vw,6rem);display:grid;gap:1.5rem;justify-items:center;text-align:center;margin-inline:0;grid-template-columns:minmax(0,1fr)}