/* Layout: containers, header, navigation, footer, cards, sections, drawer. */
.container{width:min(100% - 2*var(--gutter),var(--container));margin-inline:auto}
.container--narrow{width:min(100% - 2*var(--gutter),var(--container-narrow));margin-inline:auto}
.section{padding-block:var(--section)}
.section--tight{padding-block:calc(var(--section)*.6)}
.section--navy{background:var(--navy);color:#fff}
.section--deep{background:var(--navy-900);color:#fff}
.section--soft{background:var(--neutral-50)}
.section--rose{background:var(--rose-100)}
.section-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 2rem;margin-bottom:var(--s-6)}
.section-head h2{margin:0;max-width:24ch}
.section-head .lead{margin:.5rem 0 0}
.grid{display:grid;gap:var(--s-5)}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.grid--4{grid-template-columns:repeat(2,1fr)}.grid--3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}}
.rule{height:1px;background:var(--border)}
.on-dark .rule{background:var(--line-on-navy)}

/* ---------- technical texture: engineering grid + corrugation ---------- */
.tex-grid{background-image:linear-gradient(rgba(33,55,87,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(33,55,87,.06) 1px,transparent 1px);background-size:32px 32px}
.section--navy.tex-grid,.section--deep.tex-grid{background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px)}
.corrugate{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 18px,transparent 18px 36px)}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:var(--z-header);background:#fff;border-bottom:1px solid var(--border);transition:box-shadow var(--dur-2) var(--ease)}
.site-header.is-stuck{box-shadow:var(--shadow-1)}
.utility{background:var(--navy);color:var(--on-navy-2);font-size:var(--fs-xs);font-family:var(--font-mono);letter-spacing:.04em}
.utility .container{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:2.1rem}
.utility a{color:#fff;text-decoration:none}
.utility a:hover{color:var(--rose-200)}
.utility ul{display:flex;gap:1.5rem;list-style:none;margin:0;padding:0}
.utility .u-right{display:flex;gap:1.5rem}
@media (max-width:860px){.utility .u-left span.hours,.utility .u-right .u-email{display:none}}
@media (max-width:560px){.utility{display:none}}
/* Masthead: a wider container than the page grid so logo + eight nav items + utilities never collide. */
.masthead .container{display:flex;align-items:center;gap:1.25rem;min-height:4.5rem;width:min(100% - 2*var(--gutter),1480px);flex-wrap:nowrap}
.brand{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;flex:none}
.brand__img{height:2.85rem;width:auto;display:block}
.brand__markimg{width:2.75rem;height:2.75rem;display:block}
.brand--light{background:#fff;border-radius:var(--radius);padding:.55rem .8rem;display:inline-block}
.brand--light .brand__img{height:2.6rem}
.brand__mark{width:2.6rem;height:2.6rem}
.brand__word{display:flex;flex-direction:column;line-height:1}
.brand__aad{font-family:var(--font-display);font-weight:800;font-size:1.55rem;letter-spacing:.02em}
.brand__sub{font-family:var(--font-display);font-weight:600;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;margin-top:.2rem}
.nav-primary{flex:1 1 auto;min-width:0;display:flex;justify-content:center}
.nav-primary > ul{display:flex;flex-wrap:nowrap;list-style:none;margin:0;padding:0;gap:.05rem}
.nav-primary > ul > li{position:relative}
.nav-primary > ul > li > a,.nav-primary > ul > li > button{position:relative;display:inline-flex;align-items:center;gap:.3rem;min-height:2.6rem;padding:.6rem .55rem;font-family:var(--font-display);font-weight:600;font-size:.78rem;letter-spacing:.025em;text-transform:uppercase;color:var(--navy);text-decoration:none;background:none;border:0;border-radius:var(--radius);cursor:pointer;white-space:nowrap;transition:background var(--dur-1) var(--ease),color var(--dur-1) var(--ease)}
.nav-primary > ul > li > a::after,.nav-primary > ul > li > button::after{content:"";position:absolute;left:.55rem;right:.55rem;bottom:.3rem;height:2px;background:var(--rose);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-2) var(--ease-out)}
.nav-primary > ul > li > a:hover,.nav-primary > ul > li > button:hover,.nav-primary > ul > li > button[aria-expanded=true],.nav-primary > ul > li.is-current > a{background:var(--neutral-50);color:var(--navy)}
.nav-primary > ul > li > a:hover::after,.nav-primary > ul > li > button:hover::after,.nav-primary > ul > li > button[aria-expanded=true]::after,.nav-primary > ul > li.is-current > a::after{transform:scaleX(1)}
.nav-primary svg.caret{width:.8rem;height:.8rem;transition:transform var(--dur-1)}
.nav-primary li[aria-expanded=true] svg.caret,.nav-primary button[aria-expanded=true] svg.caret{transform:rotate(180deg)}
.mega{position:absolute;left:50%;top:100%;transform:translateX(-50%) translateY(6px);min-width:34rem;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-2);padding:1.25rem;display:none;grid-template-columns:repeat(var(--cols,3),1fr);gap:1.25rem;z-index:5}
.mega.is-open{display:grid}
.mega h4{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose);margin:0 0 .5rem}
.mega ul{list-style:none;margin:0;padding:0}
.mega li a{display:block;padding:.35rem .4rem;font-size:.9rem;color:var(--text);text-decoration:none;border-radius:4px}
.mega li a:hover{background:var(--neutral-50);color:var(--navy)}
.mega li a small{display:block;color:var(--text-3);font-size:.75rem}
.mega .mega-cta{grid-column:1/-1;border-top:1px solid var(--border);padding-top:.9rem;display:flex;gap:.6rem;flex-wrap:wrap}
.utils{display:flex;align-items:center;gap:.15rem;margin-left:auto;flex:none}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius);border:0;background:none;color:var(--navy);text-decoration:none;position:relative;cursor:pointer;transition:background var(--dur-1) var(--ease)}
.icon-btn:hover{background:var(--neutral-100)}
.icon-btn svg{width:1.3rem;height:1.3rem}
.cart-count{position:absolute;top:.2rem;right:.15rem;min-width:1.1rem;height:1.1rem;padding:0 .25rem;border-radius:999px;background:var(--rose);color:#fff;font-size:.65rem;font-weight:700;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);box-shadow:0 0 0 2px #fff}
.cart-count[data-count="0"]{display:none}
.utils .btn-quote{margin-left:.6rem;min-height:2.6rem;padding:.55rem 1.1rem;font-size:.88rem;box-shadow:0 6px 16px rgba(142,99,98,.28)}
.utils .btn-quote:hover{transform:translateY(-1px)}
.menu-toggle{display:none}
.nav-short{display:none}
/* Long labels need ~1,000px of nav; below 1,600px the short labels keep every item on one line. */
@media (max-width:1600px){.nav-long{display:none}.nav-short{display:inline}.masthead .container{gap:1rem}}
@media (max-width:1360px){.nav-primary > ul > li > a,.nav-primary > ul > li > button{padding-inline:.45rem;font-size:.75rem}.brand__img{height:2.6rem}}
@media (max-width:1200px){
  .nav-primary{display:none}
  .menu-toggle{display:inline-flex}
  .utils .btn-quote{display:none}
  .brand__img{height:2.4rem}
  .masthead .container{min-height:3.9rem}
}
/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:var(--z-drawer);display:none}
.drawer.is-open{display:block}
.drawer__scrim{position:absolute;inset:0;background:rgba(11,18,32,.55);backdrop-filter:blur(2px)}
.drawer__panel{position:absolute;top:0;right:0;bottom:0;width:min(92vw,26rem);background:#fff;box-shadow:var(--shadow-2);display:flex;flex-direction:column;transform:translateX(100%);transition:transform var(--dur-2) var(--ease-out)}
.drawer.is-open .drawer__panel{transform:none}
.drawer--left .drawer__panel{right:auto;left:0;transform:translateX(-100%)}
.drawer__head{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-bottom:1px solid var(--border);flex:none}
.drawer__head h2{margin:0;font-size:1.05rem}
.drawer__body{overflow:auto;padding:1.1rem;flex:1;-webkit-overflow-scrolling:touch}
.drawer__foot{padding:1rem 1.1rem;border-top:1px solid var(--border);flex:none;background:var(--neutral-50)}
.mnav{list-style:none;margin:0;padding:0}
.mnav > li{border-bottom:1px solid var(--border)}
.mnav > li > a,.mnav > li > button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.85rem .2rem;font-family:var(--font-display);font-weight:600;font-size:1rem;color:var(--navy);text-decoration:none;background:none;border:0;text-align:left;cursor:pointer}
.mnav ul{list-style:none;margin:0 0 .6rem;padding:0 0 0 .8rem;display:none}
.mnav li[aria-expanded=true] > ul,.mnav button[aria-expanded=true] + ul{display:block}
.mnav ul a{display:block;padding:.45rem .2rem;color:var(--text-2);text-decoration:none;font-size:.95rem}
.mnav ul a:hover{color:var(--navy)}
.mnav .caret{width:1rem;height:1rem;transition:transform var(--dur-1)}
.mnav button[aria-expanded=true] .caret{transform:rotate(180deg)}
.drawer .contact-list{list-style:none;margin:0;padding:0;font-size:var(--fs-sm)}
.drawer .contact-list li{margin:.35rem 0}

/* ---------- search overlay ---------- */
.search-bar{border-top:1px solid var(--border);background:#fff;display:none}
.search-bar.is-open{display:block}
.search-bar form{display:flex;gap:.5rem;padding:.75rem 0}
.search-bar input{flex:1}
.search-hints{display:flex;gap:.4rem;flex-wrap:wrap;padding-bottom:.75rem;font-size:var(--fs-sm)}

/* ---------- page hero (light technical) ---------- */
.page-hero{background:var(--navy);color:#fff;position:relative;overflow:hidden;padding-block:clamp(2.5rem,2rem+3vw,4.5rem)}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,18,32,.35),transparent 60%)}
.page-hero > .container{position:relative;z-index:1}
.page-hero h1{color:#fff;margin-bottom:.4rem}
.page-hero .lead{color:var(--on-navy-2)}
.page-hero--light{background:var(--neutral-50);color:var(--text)}
.page-hero--light::after{display:none}
.page-hero--light h1{color:var(--navy)}
.page-hero--light .lead{color:var(--text-2)}
.crumbs{font-size:var(--fs-xs);font-family:var(--font-mono);letter-spacing:.04em;margin-bottom:1rem}
.crumbs ol{display:flex;flex-wrap:wrap;gap:.3rem .5rem;list-style:none;margin:0;padding:0}
.crumbs li+li::before{content:"/";opacity:.5;margin-right:.5rem}
.crumbs a{color:inherit;opacity:.8;text-decoration:none}
.crumbs a:hover{opacity:1;text-decoration:underline}
.crumbs [aria-current]{opacity:.7}
.page-hero .crumbs{color:var(--on-navy-2)}

/* ---------- product card ---------- */
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;color:inherit;transition:transform var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease);position:relative}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-2);border-color:var(--border-strong)}
.card__media{aspect-ratio:4/3;background:var(--neutral-50);overflow:hidden;position:relative}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-3) var(--ease)}
.card:hover .card__media img{transform:scale(1.035)}
.card__badges{position:absolute;top:.7rem;left:.7rem;display:flex;gap:.35rem;z-index:1}
.card__body{padding:1rem 1.1rem 1.1rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.card__cat{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
.card__title{font-family:var(--font-display);font-weight:700;font-size:1.05rem;line-height:1.25;color:var(--navy);margin:0}
.card__title a{text-decoration:none;color:inherit}
.card__title a::after{content:"";position:absolute;inset:0}
.card__specs{display:flex;flex-wrap:wrap;gap:.3rem .8rem;font-size:var(--fs-xs);color:var(--text-2);font-family:var(--font-mono)}
.card__specs span::before{content:"▪";color:var(--rose);margin-right:.35rem}
.card__foot{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem;padding-top:.5rem}
.price{font-family:var(--font-display);font-weight:800;font-size:1.25rem;color:var(--navy);line-height:1}
.price small{display:block;font-family:var(--font-mono);font-weight:500;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);margin-top:.3rem}
.price--poa{font-size:1rem}
.swatches{display:flex;gap:.25rem;align-items:center}
.swatches .more{font-family:var(--font-mono);font-size:.65rem;color:var(--text-3)}
.card__quote{position:relative;z-index:2}

/* ---------- category tile ---------- */
.tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:15rem;border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;color:#fff;background:var(--navy);border:1px solid rgba(255,255,255,.06)}
.tile__media{position:absolute;inset:0}
.tile__media img{width:100%;height:100%;object-fit:cover;opacity:.55;transition:transform var(--dur-3) var(--ease),opacity var(--dur-3) var(--ease)}
.tile:hover .tile__media img{transform:scale(1.04);opacity:.7}
.tile__body{position:relative;padding:1.2rem;background:linear-gradient(to top,rgba(11,18,32,.92),rgba(11,18,32,.2) 70%,transparent)}
.tile__body h3{color:#fff;margin:0 0 .2rem;font-size:1.2rem}
.tile__body p{color:var(--on-navy-2);font-size:var(--fs-sm);margin:0}
.tile__count{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--rose-200);margin-bottom:.4rem;display:block}
.tile--glyph .tile__glyph{position:absolute;right:1rem;top:1rem;width:5.5rem;opacity:.9}

/* ---------- feature list / steps ---------- */
.features{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.feature{display:flex;gap:.9rem;align-items:flex-start}
.feature__icon{flex:none;width:2.6rem;height:2.6rem;border-radius:var(--radius);background:var(--rose-100);color:var(--rose);display:grid;place-items:center}
.on-dark .feature__icon{background:rgba(255,255,255,.08);color:var(--rose-200)}
.feature__icon svg{width:1.35rem;height:1.35rem}
.feature h3{font-size:1.02rem;margin:0 0 .25rem}
.feature p{font-size:var(--fs-sm);margin:0;color:var(--text-2)}
.on-dark .feature p{color:var(--on-navy-2)}
.steps{counter-reset:step;list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))}
.steps li{counter-increment:step;padding:1.1rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff;position:relative}
.steps li::before{content:counter(step,decimal-leading-zero);font-family:var(--font-mono);font-size:.75rem;letter-spacing:.1em;color:var(--rose);font-weight:700;display:block;margin-bottom:.5rem}
.steps li strong{display:block;font-family:var(--font-display);color:var(--navy);margin-bottom:.25rem}
.steps li span{font-size:var(--fs-sm);color:var(--text-2)}
.on-dark .steps li{background:rgba(255,255,255,.04);border-color:var(--line-on-navy)}
.on-dark .steps li strong{color:#fff}
.on-dark .steps li span{color:var(--on-navy-2)}

/* ---------- facts strip ---------- */
.facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.facts li{background:#fff;padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.2rem}
.facts strong{font-family:var(--font-display);font-weight:800;font-size:1.5rem;color:var(--navy);line-height:1}
.facts span{font-size:var(--fs-xs);font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.on-dark .facts{background:var(--line-on-navy);border-color:var(--line-on-navy)}
.on-dark .facts li{background:var(--navy-700)}
.on-dark .facts strong{color:#fff}
.on-dark .facts span{color:var(--on-navy-2)}

/* ---------- FAQ ---------- */
details.faq{border-bottom:1px solid var(--border);padding:.2rem 0}
details.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;padding:.9rem 0;font-family:var(--font-display);font-weight:600;color:var(--navy);font-size:1.02rem}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";font-weight:400;color:var(--rose);flex:none;font-size:1.3rem;line-height:1}
details.faq[open] summary::after{content:"–"}
details.faq p{color:var(--text-2);padding-bottom:.9rem;max-width:70ch}

/* ---------- callout ---------- */
.callout{border-left:4px solid var(--rose);background:var(--rose-100);padding:1rem 1.2rem;border-radius:0 var(--radius) var(--radius) 0;margin:1.5rem 0}
.callout p{margin:0;color:var(--text)}

/* ---------- CTA band ---------- */
.cta-band{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.cta-band .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:clamp(2rem,1.5rem+2vw,3.5rem)}
.cta-band h2{color:#fff;margin:0 0 .3rem}
.cta-band p{color:var(--on-navy-2);margin:0;max-width:52ch}
.cta-band .actions{display:flex;gap:.7rem;flex-wrap:wrap}

/* ---------- footer ---------- */
.site-footer{background:var(--navy-900);color:var(--on-navy-2);font-size:var(--fs-sm)}
.footer-top{padding-block:var(--s-8) var(--s-7);border-bottom:1px solid var(--line-on-navy)}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(5,1fr);gap:1.75rem}
@media (max-width:1024px){.footer-grid{grid-template-columns:1fr 1fr 1fr}.footer-grid > :first-child{grid-column:1/-1}}
@media (max-width:640px){.footer-grid{grid-template-columns:1fr 1fr}}
.site-footer h3{color:#fff;font-size:.8rem;font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;margin:0 0 1rem;font-weight:700}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin:.5rem 0}
.site-footer a{color:var(--on-navy-2);text-decoration:none;transition:color var(--dur-1) var(--ease)}
.site-footer a:hover{color:#fff}
/* Inventory / support link hover: bold white text slides right behind a rose marker with a soft glow. */
.footer-grid li a{position:relative;display:inline-block;padding:.15rem .25rem .15rem 0;border-radius:3px;transition:color var(--dur-1) var(--ease),transform var(--dur-2) var(--ease-out),text-shadow var(--dur-2) var(--ease),padding var(--dur-2) var(--ease-out)}
.footer-grid li a::before{content:"";position:absolute;left:0;top:50%;width:0;height:2px;background:var(--rose-200);border-radius:2px;transform:translateY(-50%);transition:width var(--dur-2) var(--ease-out),background var(--dur-1)}
.footer-grid li a:hover,.footer-grid li a:focus-visible{color:#fff;font-weight:700;padding-left:1.15rem;text-shadow:0 0 14px rgba(227,206,205,.75);transform:translateX(2px)}
.footer-grid li a:hover::before,.footer-grid li a:focus-visible::before{width:.8rem;background:var(--rose)}
.footer-grid li a:focus-visible{outline:2px solid var(--rose-200);outline-offset:2px}
.footer-about p{max-width:38ch;margin:1rem 0}
.footer-contact li{display:flex;gap:.6rem;align-items:flex-start}
.footer-contact svg{width:1rem;height:1rem;flex:none;margin-top:.2rem;color:var(--rose-200)}
.footer-bottom{padding-block:1.25rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem 2rem;font-size:var(--fs-xs);font-family:var(--font-mono);letter-spacing:.03em}
.footer-bottom ul{display:flex;flex-wrap:wrap;gap:1rem}
.payment-note{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--line-on-navy);padding:.4rem .7rem;border-radius:var(--radius);font-size:var(--fs-xs)}
.payment-note svg{width:1.1rem;height:1.1rem;flex:none;color:var(--rose-200)}

/* ---------- footer sea: night horizon, layered swell, a loaded container ship on passage, sparkles. Reduced motion = static. ---------- */
.site-footer{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--navy-900) 0%,#0D1526 55%,#101B31 100%)}
.site-footer > .container{position:relative;z-index:1}
.sea{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.sea__glow{position:absolute;left:0;right:0;bottom:0;height:min(46%,300px);background:radial-gradient(60% 90% at 62% 100%,rgba(227,206,205,.16) 0%,rgba(142,99,98,.08) 40%,transparent 72%)}
.sea__moon{position:absolute;right:11%;bottom:calc(min(46%,300px) - 26px);width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#FFF6EC,#E9DCCF 55%,#C9BBAE);box-shadow:0 0 30px 8px rgba(255,240,224,.28),0 0 90px 30px rgba(227,206,205,.14);opacity:.85}
.sea__wave{position:absolute;left:0;bottom:0;width:200%;height:clamp(120px,17vw,240px)}
.sea__wave--1{fill:rgba(255,255,255,.05)}
.sea__wave--2{fill:rgba(96,120,158,.28);height:clamp(92px,13vw,180px)}
.sea__wave--3{fill:rgba(33,55,87,.92);height:clamp(64px,10vw,124px)}
.sea__wave--4{fill:rgba(17,30,53,.98);height:clamp(40px,6.5vw,80px)}
.sea__foam{position:absolute;left:0;bottom:calc(clamp(64px,10vw,124px) - 6px);width:200%;height:14px;fill:none;stroke:rgba(255,255,255,.28);stroke-width:1.5;stroke-linecap:round}
.js .sea__wave--1{animation:sea-drift 34s linear infinite}
.js .sea__wave--2{animation:sea-drift 24s linear infinite reverse}
.js .sea__wave--3,.js .sea__foam{animation:sea-drift 16s linear infinite}
.js .sea__wave--4{animation:sea-drift 11s linear infinite reverse}
@keyframes sea-drift{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* ship: sits between the second and third swell so the near waves cross the hull; crosses the footer on a 90 s passage */
.sea__ship{position:absolute;bottom:calc(clamp(64px,10vw,124px) - 22px);left:0;width:clamp(300px,34vw,560px);height:auto;transform:translateX(120vw);will-change:transform;filter:drop-shadow(0 8px 14px rgba(0,0,0,.35))}
.js .sea__ship{animation:ship-passage 90s linear infinite}
.sea__ship-body{transform-origin:50% 100%}
.js .sea__ship-body{animation:ship-roll 7s ease-in-out infinite}
.sea__ship-wake{opacity:.55}
.js .sea__ship-wake path{stroke-dasharray:6 8;animation:wake-flow 1.6s linear infinite}
.js .sea__smoke circle{animation:smoke 5s ease-out infinite}
.js .sea__smoke circle:nth-child(2){animation-delay:1.6s}.js .sea__smoke circle:nth-child(3){animation-delay:3.2s}
@keyframes ship-passage{from{transform:translateX(120vw)}to{transform:translateX(-110%)}}
@keyframes ship-roll{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(5px) rotate(.7deg)}}
@keyframes wake-flow{to{stroke-dashoffset:-28}}
@keyframes smoke{0%{opacity:.55;transform:translate(0,0) scale(.5)}100%{opacity:0;transform:translate(26px,-38px) scale(1.9)}}
.sea__spark{position:absolute;bottom:14%;width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.75);box-shadow:0 0 10px 2px rgba(255,255,255,.3);opacity:0}
.sea__spark:nth-of-type(1){left:6%;bottom:12%}.sea__spark:nth-of-type(2){left:18%;bottom:19%;width:3px;height:3px;animation-delay:2.2s}.sea__spark:nth-of-type(3){left:29%;bottom:9%;animation-delay:4.1s}.sea__spark:nth-of-type(4){left:41%;bottom:22%;width:4px;height:4px;animation-delay:1.3s}.sea__spark:nth-of-type(5){left:53%;bottom:15%;animation-delay:3.4s}.sea__spark:nth-of-type(6){left:64%;bottom:26%;width:3px;height:3px;animation-delay:5.2s}.sea__spark:nth-of-type(7){left:72%;bottom:11%;animation-delay:.8s}.sea__spark:nth-of-type(8){left:81%;bottom:20%;width:6px;height:6px;animation-delay:2.9s}.sea__spark:nth-of-type(9){left:90%;bottom:14%;animation-delay:4.6s}.sea__spark:nth-of-type(10){left:96%;bottom:24%;width:3px;height:3px;animation-delay:1.9s}.sea__spark:nth-of-type(11){left:36%;bottom:31%;width:3px;height:3px;animation-delay:6s}.sea__spark:nth-of-type(12){left:58%;bottom:34%;width:2px;height:2px;animation-delay:3.7s}
.js .sea__spark{animation:sea-spark 6.5s ease-in-out infinite}
@keyframes sea-spark{0%,100%{opacity:0;transform:translateY(0) scale(.6)}40%{opacity:.95;transform:translateY(-14px) scale(1)}70%{opacity:.3;transform:translateY(-26px) scale(.8)}}
@media (max-width:640px){.sea__ship{width:min(78vw,340px)}.sea__moon{width:24px;height:24px}}
@media (prefers-reduced-motion:reduce){.sea__wave,.sea__spark,.sea__ship,.sea__ship-body,.sea__foam,.sea__smoke circle,.sea__ship-wake path{animation:none!important}.sea__spark{opacity:.5}.sea__ship{transform:translateX(18vw)}}
/* ---------- payment badges ---------- */
.footer-pay{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;padding-block:1.25rem;border-bottom:1px solid var(--line-on-navy)}
.footer-pay__label{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-200)}
.pay-badges{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.pay-badge{display:flex;align-items:center;gap:.7rem;background:#fff;color:var(--navy);border-radius:var(--radius);padding:.5rem .8rem;min-width:11rem}
.pay-badge svg{width:1.9rem;height:1.9rem;flex:none;color:var(--rose)}
.pay-badge strong{display:block;font-family:var(--font-display);font-size:.82rem;line-height:1.15;color:var(--navy)}
.pay-badge small{display:block;font-size:.66rem;color:var(--text-3);line-height:1.2;margin-top:.15rem}

/* ---------- sticky mobile actions (product) ---------- */
.sticky-actions{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--border);padding:.6rem var(--gutter);display:none;gap:.5rem;box-shadow:0 -6px 20px rgba(17,24,39,.08)}
.sticky-actions .btn{flex:1}
@media (max-width:900px){.sticky-actions.is-visible{display:flex}body.has-sticky{padding-bottom:4.4rem}}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%) translateY(20px);background:var(--navy);color:#fff;padding:.8rem 1.1rem;border-radius:var(--radius);box-shadow:var(--shadow-2);opacity:0;transition:opacity var(--dur-2),transform var(--dur-2);z-index:var(--z-toast);font-size:var(--fs-sm);max-width:min(92vw,28rem)}
.toast.is-visible{opacity:1;transform:translateX(-50%)}