:root {
  --navy:       #0D1B2A;
  --navy-mid:   #1B263B;
  --navy-light: #243447;
  --fog:        #778DA9;
  --fog-light:  #9BAFC4;
  --sailcloth:  #E0E1DD;
  --sailcloth-dim: #B8BAB5;
  --teak:       #8B5E3C;
  --brass:      #B08D57;
  --brass-light:#C9A96E;
  --brass-dim:  #8A6D3E;
  --charcoal:   #495057;
  --black:      #07111C;
  --ocean:      #1A3A5C;
  --font-d: 'Cinzel', Georgia, serif;
  --font-b: 'Manrope', Helvetica, sans-serif;
  --font-s: 'Crimson Pro', Georgia, serif;
  --max: 1200px;
  --brass-border: 1px solid rgba(176,141,87,0.3);
  --fog-border:   1px solid rgba(119,141,169,0.2);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:#07111C;font-size:18px;scrollbar-gutter:stable;overflow-x:hidden}
body{background:transparent;color:var(--sailcloth);font-family:var(--font-b);font-size:18px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--font-d);font-weight:700;line-height:1.15;letter-spacing:.035em;color:var(--sailcloth)}
p{color:var(--sailcloth-dim);line-height:1.8}

/* LAYOUT */
.wrap{max-width:var(--max);margin:0 auto;padding:0 2rem}
.section{padding:6rem 2rem}
.section-dark{background:var(--black)}
.section-mid{background:var(--navy-mid)}
.hidden{display:none!important}

/* BUTTONS */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:.6rem;padding:.95rem 2.15rem;font-family:var(--font-b);font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;border:none;outline:none;transition:transform .25s ease,box-shadow .25s ease,background .25s ease,color .25s ease,border-color .25s ease;text-decoration:none}
.btn-primary{background:linear-gradient(180deg,var(--brass-light) 0%,var(--brass) 100%);color:var(--black);border:1px solid var(--brass-dim);box-shadow:inset 0 1px 0 rgba(255,244,222,.35),0 6px 18px -10px rgba(0,0,0,.7)}
.btn-primary:hover{background:linear-gradient(180deg,#d9bd87 0%,var(--brass-light) 100%);transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,244,222,.45),0 12px 26px -10px rgba(176,141,87,.55)}
.btn-outline{background:transparent;color:var(--sailcloth);border:1px solid rgba(224,225,221,.35)}
.btn-outline:hover{border-color:var(--brass);color:var(--brass);transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(176,141,87,.25),0 10px 24px -14px rgba(176,141,87,.5)}
.btn-brass{background:transparent;color:var(--brass);border:1px solid var(--brass)}
.btn-brass:hover{background:var(--brass);color:var(--black);transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(176,141,87,.6)}
.btn-group{display:flex;flex-wrap:wrap;gap:1rem}

/* LABEL */
.label{font-family:var(--font-b);font-size:.6875rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--brass)}
.label-lg{font-size:clamp(.85rem,1.7vw,.95rem)!important}

/* SCROLL HINT TEXT */
.scroll-hint-text{font-family:var(--font-b);font-size:.6875rem;letter-spacing:.22em;text-transform:uppercase;color:var(--fog);opacity:.55;white-space:nowrap}
.scroll-hint-flow{position:static!important;transform:none!important;bottom:auto!important;left:auto!important;margin-top:.25rem}
@media(max-width:480px){.scroll-hint-text{font-size:.5625rem;letter-spacing:.14em}}

/* DIVIDERS */
.divider{width:60px;height:1px;background:var(--brass);margin:1.5rem 0}
.divider-c{position:relative;width:22px;height:22px;background:url('/brand/shipshape-compass-star.png') center/contain no-repeat;margin:1.75rem auto;opacity:.92}
.divider-c::before,.divider-c::after{content:"";position:absolute;top:50%;width:54px;height:1px}
.divider-c::before{right:100%;margin-right:14px;background:linear-gradient(90deg,transparent,var(--brass))}
.divider-c::after{left:100%;margin-left:14px;background:linear-gradient(90deg,var(--brass),transparent)}
/* Section glyph: a brand mark set above a heading */
.section-mark{height:48px;width:auto;margin:0 auto 1.1rem;opacity:.9;display:block}
.section-mark.left{margin-left:auto}

/* NAV */
#navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:.75rem 1.25rem 0;transition:padding .3s}
#navbar.scrolled{padding-top:.5rem}
.nav-inner{max-width:var(--max);margin:0 auto;display:flex;align-items:center;height:110px;gap:2rem}
.nav-logo{display:flex;align-items:center;gap:.75rem;flex-shrink:0}
.nav-logo img{width:96px;height:96px;object-fit:contain}
.nav-logo-text{font-family:var(--font-d);font-size:.625rem;font-weight:700;letter-spacing:.2em;line-height:1.4;color:var(--sailcloth);text-transform:uppercase}
.nav-logo-text span{color:var(--brass)}
.nav-links{display:flex;align-items:center;justify-content:center;gap:.05rem;flex:1;margin-left:1rem;background:rgba(7,17,28,.18);backdrop-filter:blur(8px);border:none;border-radius:999px;padding:.4rem 1.25rem;box-shadow:0 8px 20px -14px rgba(0,0,0,.4);transition:background .3s}
#navbar.scrolled .nav-links{background:rgba(7,17,28,.7)}
.nav-link{font-size:.7rem;font-weight:500;letter-spacing:.02em;text-transform:uppercase;color:var(--sailcloth-dim);padding:.55rem .5rem;transition:color .2s;cursor:pointer;background:none;border:none;font-family:var(--font-b);display:flex;align-items:center;gap:.25rem;white-space:nowrap}
.nav-link:hover,.nav-link.active{color:var(--sailcloth)}
.nav-link svg{transition:transform .2s}
.nav-item{position:relative}
.nav-dropdown{display:none;position:absolute;top:100%;left:0;margin-top:0;padding-top:.75rem;background:transparent;border:none;min-width:220px;z-index:100}
.nav-dropdown-inner{background:rgba(7,17,28,.98);border:1px solid rgba(176,141,87,.2);border-radius:var(--r-card);padding:.5rem 0;backdrop-filter:blur(8px);overflow:hidden}
.nav-item:hover .nav-dropdown{display:block}
.nav-dd-item{display:block;padding:.875rem 1.5rem;font-size:.9375rem;font-weight:500;letter-spacing:.06em;color:var(--sailcloth-dim);transition:color .2s,background .2s;cursor:pointer}
.nav-dd-item:hover{color:var(--brass);background:rgba(176,141,87,.06)}
.nav-cta{margin-left:auto;flex-shrink:0;font-size:.6875rem;padding:.625rem 1.25rem;aspect-ratio:385/340}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.5rem;margin-left:auto}
.hamburger span{display:block;width:24px;height:1.5px;background:var(--sailcloth);transition:all .3s}
.hamburger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
#mobile-menu{display:none;background:rgba(7,17,28,.97);backdrop-filter:blur(14px);border:1px solid rgba(176,141,87,.2);border-radius:var(--r-card);margin:.75rem 1.25rem 0;padding:.75rem 1.5rem 1.25rem;flex-direction:column;max-height:calc(100vh - 140px);overflow-y:auto;box-shadow:0 12px 30px -14px rgba(0,0,0,.6)}
#mobile-menu.open{display:flex}
.mm-group-label{font-size:.6875rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);padding:.6rem 0 .25rem}
.mm-link{font-size:.9375rem;color:var(--sailcloth-dim);padding:.45rem .5rem;border-bottom:1px solid rgba(119,141,169,.1);cursor:pointer;display:block}
.mm-link:hover{color:var(--sailcloth)}

/* PAGES */
.page{display:none;padding-top:120px;min-height:100vh}
.page.active{display:block}

/* INTRO / GATE SCREEN
   Gate is HIDDEN by default (can never flash). It is only shown when <html> has
   .show-gate, which the home page adds before paint on a genuine fresh arrival. */
html.show-gate,html.show-gate body{overflow:hidden}
/* Navbar stays laid out underneath the (opaque) gate so revealing it causes NO reflow/jolt */
html.show-gate #vignette,html.show-gate #grain{display:none}
#intro-screen{position:fixed;inset:0;z-index:5000;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2.5rem;text-align:center;padding:1rem 2rem;background-color:#000;background-image:linear-gradient(rgba(0,0,0,.22),rgba(0,0,0,.22)),url('/brand/the shipshape entrance .jpg');background-size:contain;background-position:center;background-repeat:no-repeat;background-attachment:fixed;opacity:0;visibility:hidden;pointer-events:none;transition:none}
html.show-gate #intro-screen{opacity:1;visibility:visible;pointer-events:auto}
#intro-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}
#intro-screen .btn-gate{display:inline-flex;align-items:center;gap:1.25rem;background:var(--black);color:var(--brass);border:1px solid transparent;padding:1rem 2rem;font-size:.85rem;letter-spacing:.2em}
#intro-screen .btn-gate::before,#intro-screen .btn-gate::after{content:'';width:32px;height:1px;background:var(--brass)}
#intro-screen .btn-gate:hover{background:var(--brass);color:var(--black);transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(176,141,87,.6)}
#intro-screen .gate-text-short{display:none}

/* HERO BASE */
.hero{position:relative;min-height:90vh;display:flex;align-items:center;overflow:hidden;background:var(--black)}
.hero:not(.home-hero){padding-top:0;padding-bottom:1.5rem;min-height:auto;align-items:flex-start}
.hero:not(.home-hero) .hero-content{padding-top:1rem;padding-bottom:1rem}
.hero-bg{position:absolute;inset:0;background:transparent}
.hero-bg::after{display:none}
.hero-overlay{position:absolute;inset:0;background:transparent}
/* HOME HERO — cinematic ghost-ship seascape (already dark; light wash) */
.home-hero .hero-bg{background:transparent}
.home-hero .hero-bg::after{display:none}
.home-hero .hero-overlay{background:transparent}
/* ACT 1 — veiled ghost ship, fixed across hero → A Movement */
.home-act1{position:relative;background-image:linear-gradient(rgba(7,17,28,.16),rgba(7,17,28,.16)),url('/brand/society page .jpg');background-size:cover,cover;background-position:center center,center center;background-repeat:no-repeat,no-repeat;background-attachment:fixed,fixed}
.home-act1 .hero,.home-act1 .section,.home-act1 .section-dark{background-color:transparent!important;background-image:none!important}
.home-act1::after{display:none}
/* room emerges from darkness — fade-in at top of the first room section */
.home-act1 + section::before{display:none}
.hero-content{position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:4rem 2rem;width:100%;text-align:center}

/* HOME HERO */
.home-hero{min-height:90vh}
.home-headline{font-size:clamp(2.1rem,4.4vw,3.6rem);font-weight:900;line-height:1.08;max-width:18ch;margin:0 auto 1rem;text-shadow:0 2px 24px rgba(0,0,0,.55)}
.home-tagline{font-family:var(--font-s);font-style:italic;font-size:clamp(1.1rem,2vw,1.5rem);color:var(--brass-light);max-width:600px;margin:0 auto 1.75rem;letter-spacing:.01em}
.home-hero-sub{font-size:1.125rem;max-width:320px;text-align:center;margin-left:auto;margin-right:auto}
@media(min-width:701px){.home-hero-sub{font-size:clamp(.85rem,1.6vw,1.125rem);max-width:min(700px,90vw);white-space:nowrap}}
.hero-subs{margin-top:1.7rem}
.home-sub{font-size:clamp(.72rem,1vw,.85rem);color:var(--fog-light);max-width:780px;margin:0 auto .4rem;line-height:1.55;letter-spacing:.01em;text-shadow:0 1px 10px rgba(0,0,0,.6)}
.home-sub-2{color:var(--fog);margin-bottom:0}
/* Shrink descriptive hero copy site-wide (image-forward), excluding the home hero */
.hero:not(.home-hero) .hero-content>p{font-family:var(--font-s);font-size:clamp(.85rem,1.1vw,1rem)!important;max-width:680px!important;color:var(--sailcloth-dim);line-height:1.5;margin-top:.35rem;letter-spacing:.01em;text-shadow:0 1px 10px rgba(0,0,0,.6)}
.scroll-hint{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;z-index:2}
.scroll-hint span{font-size:.625rem;letter-spacing:.25em;text-transform:uppercase;color:var(--fog)}
.scroll-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--brass-dim),transparent);animation:scrollPulse 2s ease-in-out infinite}
@keyframes scrollPulse{0%,100%{opacity:.4}50%{opacity:1}}

/* PILLARS */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);border:var(--brass-border)}
.pillar{padding:2.5rem;border-right:var(--brass-border)}
.pillar:last-child{border-right:none}
.pillar-bar{width:28px;height:2px;background:var(--brass);margin-bottom:1.25rem}
.pillar h3{font-size:1rem;margin-bottom:.875rem;color:var(--sailcloth)}
.pillar p{font-size:.875rem;line-height:1.75;color:var(--sailcloth-dim)}

/* PROGRAM CARDS */
.program-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px;background:rgba(176,141,87,.12)}
.program-card{background:var(--navy);padding:3rem 2.5rem;display:flex;flex-direction:column;gap:1.25rem;transition:background .25s}
.program-card:hover{background:var(--navy-mid)}
.program-card.featured{background:var(--navy-mid)}
.program-tag{font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--black);background:var(--brass);padding:.25rem .625rem;display:inline-block;width:fit-content}
.tag-dark{background:var(--black);color:var(--sailcloth)}
.program-card h3{font-size:1.125rem;line-height:1.3}
.program-card p{font-size:.875rem;line-height:1.75;flex:1}
a.program-card{text-decoration:none;color:inherit}
a.program-card:hover h3{color:var(--brass-light)}
.program-card-link{display:inline-block;margin-top:.25rem;font-size:.8125rem;font-weight:600;letter-spacing:.04em;color:var(--brass)}

/* TESTIMONIALS */
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.t-card{background:rgba(27,38,59,.5);border:var(--fog-border);border-left:2px solid var(--brass);padding:2rem 2rem 2rem 2.5rem}
.t-quote{font-family:var(--font-s);font-size:1.125rem;font-style:italic;color:var(--sailcloth);line-height:1.7;margin-bottom:1.25rem}
.t-author{font-size:.8125rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--brass)}

/* TWO-COL LAYOUTS */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.two-col-wide{display:grid;grid-template-columns:1fr 400px;gap:5rem;align-items:start}
.two-col-reverse{display:grid;grid-template-columns:400px 1fr;gap:5rem;align-items:center}

/* FOUNDER IMG */
.founder-img-wrap{height:520px;overflow:hidden;position:relative}
.founder-img{width:100%;height:100%;object-fit:cover;object-position:top center}
.img-placeholder{width:100%;height:100%;min-height:400px;background:var(--navy-mid);border:var(--fog-border);display:flex;align-items:center;justify-content:center;font-size:.75rem;color:var(--fog);letter-spacing:.1em;text-transform:uppercase}

/* QUOTE BLOCK */
.quote-block{border-left:2px solid var(--brass);padding:2rem 2.5rem;background:rgba(176,141,87,.04)}
.quote-text{font-family:var(--font-s);font-size:1.5rem;font-style:italic;line-height:1.5;color:var(--sailcloth)}

/* CHECKLIST */
.checklist{list-style:none;display:flex;flex-direction:column;gap:.75rem}
.checklist li{display:flex;gap:.875rem;align-items:flex-start;color:var(--sailcloth-dim);font-size:.9375rem}
.checklist li::before{content:'—';color:var(--brass);font-weight:700;flex-shrink:0;margin-top:.15rem}

/* PROCESS STEPS */
.process{max-width:760px;margin-left:auto;margin-right:auto}
.step{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:2rem 0;border-bottom:var(--fog-border)}
.step:last-child{border-bottom:none}
.step-content{max-width:560px}
.step-n{font-family:var(--font-d);font-size:2.25rem;font-weight:900;color:rgba(176,141,87,.35);line-height:1;margin-bottom:.25rem}
.step-content h3{font-size:1.125rem;margin-bottom:.5rem}
.step-content p{font-size:.9375rem;line-height:1.75}

/* SECTION HEADER */
.sh{margin-bottom:3.5rem;text-align:center}
.sh h2{font-size:clamp(1.75rem,3.5vw,2.75rem);margin-bottom:1rem}
.sh p{font-size:1.0625rem;max-width:640px;margin-left:auto;margin-right:auto}
.sh.center{text-align:center}
.sh.center p{margin:0 auto}
/* centered alignment system */
.sh .divider,.hero-content .divider{margin-left:auto;margin-right:auto}
.hero-content .btn-group{justify-content:center}
.hero-content h1,.hero-content>p{margin-left:auto;margin-right:auto}
/* ── GLOBAL CENTERED LAYOUT ── */
.wrap{text-align:center}
.wrap div[style*="max-width"]{margin-left:auto!important;margin-right:auto!important}
.wrap .divider{margin-left:auto;margin-right:auto}
.wrap .btn-group{justify-content:center}
.two-col,.two-col-wide,.two-col-reverse,.included-grid{grid-template-columns:1fr;gap:2.5rem;max-width:760px;margin-left:auto;margin-right:auto}
.two-col p,.two-col-wide p,.two-col-reverse p{margin-left:auto;margin-right:auto}
.two-col img,.two-col-wide img,.two-col-reverse img{margin-left:auto;margin-right:auto}
.two-col>div,.two-col-wide>div,.two-col-reverse>div{min-width:0}
.pillar,.outcome{text-align:center}
.pillar-bar{margin-left:auto;margin-right:auto}
.outcome{flex-direction:column;align-items:center;gap:.5rem}
.checklist{align-items:flex-start;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto;text-align:left}
.checklist li{text-align:left}
.aside-block{text-align:center}
.std-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem;max-width:680px;margin:0 auto 2.5rem}
.std-chip{font-family:var(--font-b);font-size:.8125rem;font-weight:500;letter-spacing:.08em;color:var(--sailcloth-dim);border:1px solid rgba(176,141,87,.35);padding:.55rem 1.15rem;background:rgba(176,141,87,.04);transition:color .2s,border-color .2s,background .2s}
.std-chip:hover{color:var(--brass);border-color:var(--brass);background:rgba(176,141,87,.09)}

/* CTA BLOCK */
.cta-section{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--navy-mid) 0%,var(--ocean) 100%);border:var(--brass-border);padding:5rem 2rem;text-align:center}
.cta-section::after{content:"";position:absolute;right:-40px;bottom:-40px;width:240px;height:240px;background:url('/brand/shipshape-secondary-seal.png') no-repeat center/contain;opacity:.06;pointer-events:none;filter:sepia(1) saturate(2) hue-rotate(-10deg)}
.cta-section>*{position:relative;z-index:1}
.cta-section h2{font-size:clamp(1.5rem,3vw,2.25rem);margin-bottom:1rem;max-width:720px;margin-left:auto;margin-right:auto}
.cta-section p{max-width:560px;margin:0 auto 2.5rem}

/* OUTCOMES GRID */
.outcomes{display:grid;grid-template-columns:repeat(2,1fr);border:var(--fog-border)}
.outcome{display:flex;gap:1.25rem;align-items:flex-start;padding:1.75rem 2rem;border-bottom:var(--fog-border);border-right:var(--fog-border)}
.outcome:nth-child(even){border-right:none}
.outcome:nth-last-child(-n+2){border-bottom:none}
.outcome-dash{color:var(--brass);font-size:1.125rem;font-weight:700;flex-shrink:0}
.outcome p{font-size:.9375rem;line-height:1.7}

/* CARDS GRID */
.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px;background:rgba(176,141,87,.12)}
.cg-2{grid-template-columns:repeat(2,1fr)!important}
.pillars-2{grid-template-columns:repeat(2,1fr)!important}
.pillars-4{grid-template-columns:repeat(4,1fr)!important}
.c-card{background:var(--navy);padding:2.5rem;transition:background .25s}
.c-card:hover{background:var(--navy-mid)}
.c-card-bar{width:24px;height:2px;background:var(--brass);margin-bottom:1.25rem}
.c-card h3{font-size:1.125rem;margin-bottom:.875rem;line-height:1.3}
.c-card p{font-size:.875rem;line-height:1.75;flex:1}
a.c-card{display:block;text-decoration:none;color:inherit}
a.c-card h3,a.c-card p{color:var(--sailcloth-dim)}
a.c-card h3{color:var(--sailcloth)}
a.c-card:hover h3{color:var(--brass-light)}

/* FLEET / BOAT PAGES */
.boat-specs{display:flex;flex-wrap:wrap;justify-content:center;gap:1px;background:rgba(176,141,87,.12);max-width:820px;margin:2.5rem auto 0}
.boat-spec{background:var(--navy);padding:1.1rem 1.6rem;text-align:center;flex:1 1 150px}
.boat-spec .bs-k{font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.boat-spec .bs-v{font-size:.95rem;color:var(--sailcloth);margin-top:.3rem;font-family:var(--font-d)}
.fleet-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;margin-top:2.5rem}
.fleet-gallery .shot{aspect-ratio:4/3;background:var(--navy-mid);border:1px solid rgba(176,141,87,.2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.fleet-gallery .shot img{width:100%;height:100%;object-fit:cover;display:block}
.fleet-gallery .shot span{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sailcloth-dim)}

/* MYTH BLOCKS */
.myth-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5px;background:rgba(176,141,87,.1)}
.myth-block{background:var(--navy);padding:2.5rem;transition:background .25s}
.myth-block:hover{background:var(--navy-mid)}
.myth-label{font-size:1rem;font-weight:700;letter-spacing:.08em;margin-bottom:1rem;color:var(--brass-light);font-family:var(--font-d)}
.myth-copy{font-size:.9375rem;line-height:1.8;color:var(--sailcloth-dim)}

/* STANDARD CARDS */
.standard-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:3rem}
.std-card{display:flex;align-items:center;gap:1rem;padding:1.5rem;border:var(--fog-border);transition:border-color .25s}
.std-card:hover{border-color:rgba(176,141,87,.4)}
.std-bar{width:3px;height:28px;background:var(--brass);flex-shrink:0}
.std-card span{font-family:var(--font-d);font-size:.875rem;font-weight:600;letter-spacing:.08em}

/* AUTHORITY CARDS */
.auth-cards{display:flex;flex-direction:column}
.auth-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:1.5rem 0;border-bottom:var(--fog-border)}
.auth-card:last-child{border-bottom:none}
.auth-card>div{max-width:420px}
.auth-dot{width:6px;height:6px;background:var(--brass);border-radius:50%;flex-shrink:0}
.auth-card h3{font-size:.9375rem;margin-bottom:.25rem}
.auth-card p{font-size:.8125rem;color:var(--sailcloth-dim);line-height:1.7}

/* ARTICLES */
.articles-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5px;background:rgba(176,141,87,.1)}
.article-card{display:flex;flex-direction:column;gap:1rem;padding:2.5rem;background:var(--navy);cursor:pointer;transition:background .25s}
.article-card:hover{background:var(--navy-mid)}
.article-bar{width:24px;height:2px;background:var(--brass)}
.article-card h3{font-size:1.125rem;line-height:1.35;transition:color .2s}
.article-card:hover h3{color:var(--brass-light)}
.article-excerpt{font-size:.875rem;color:var(--sailcloth-dim);line-height:1.75;flex:1}
.article-more{font-size:.75rem;font-weight:600;letter-spacing:.1em;color:var(--brass);text-transform:uppercase}

/* FUTURE TOPICS */
.topics{max-width:700px;margin-left:auto;margin-right:auto;border:var(--fog-border)}
.topic{display:flex;align-items:center;gap:1.25rem;padding:1.125rem 1.5rem;border-bottom:var(--fog-border)}
.topic:last-child{border-bottom:none}
.topic-dot{width:5px;height:5px;background:var(--brass);border-radius:50%;flex-shrink:0}
.topic span{font-size:.9375rem;color:var(--sailcloth-dim)}

/* ARTICLE PAGE */
.article-page{max-width:1100px;margin:0 auto;padding:3rem 2rem 6rem}
.article-back{font-size:.8125rem;font-weight:600;letter-spacing:.08em;color:var(--fog);text-transform:uppercase;cursor:pointer;transition:color .2s;background:none;border:none;font-family:var(--font-b)}
.article-back:hover{color:var(--brass)}
.article-title{font-size:clamp(1.75rem,3.5vw,2.75rem);margin:1.5rem 0 1.25rem;line-height:1.2}
.article-lede{font-family:var(--font-s);font-size:1.25rem;font-style:italic;color:var(--fog-light);line-height:1.7;margin-bottom:2rem}
.article-layout{display:grid;grid-template-columns:1fr 300px;gap:4rem;margin-top:3rem}
.article-body{display:flex;flex-direction:column;gap:1.5rem}
.article-body p{font-family:var(--font-s);font-size:1.125rem;line-height:1.9;color:var(--sailcloth-dim)}
.article-sidebar{position:sticky;top:100px}
.sidebar-cta{background:rgba(27,38,59,.6);border:var(--brass-border);padding:2rem;margin-bottom:1.5rem}
.sidebar-cta h3{font-size:1rem;margin-bottom:.75rem}
.sidebar-cta p{font-size:.875rem;line-height:1.7;margin-bottom:1.5rem}

/* JOIN FORM */
.join-layout{display:grid;grid-template-columns:1fr;gap:3rem;align-items:start;max-width:560px;margin-left:auto;margin-right:auto}
.join-values{display:flex;flex-direction:column;max-width:380px;margin-left:auto;margin-right:auto}
.join-value{display:flex;align-items:center;justify-content:center;gap:1rem;padding:.875rem 0;border-bottom:var(--fog-border)}
.join-val-line{width:20px;height:1px;background:var(--brass);flex-shrink:0}
.join-value span{font-size:.9375rem;color:var(--sailcloth-dim)}
.form-box{background:rgba(27,38,59,.5);border:var(--brass-border);padding:3rem;text-align:left}
.form-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}
.form-label{font-size:.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--fog)}
.form-input,.form-select,.form-textarea{background:rgba(27,38,59,.8);border:1px solid rgba(119,141,169,.3);color:var(--sailcloth);padding:.875rem 1rem;font-family:var(--font-b);font-size:.9375rem;outline:none;transition:border-color .2s;width:100%}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--brass)}
.form-select option{background:var(--navy-mid)}
.form-textarea{resize:vertical;min-height:120px}
.form-checks{display:flex;flex-direction:column;gap:.625rem;margin-top:.25rem}
.form-check{display:flex;align-items:center;gap:.625rem;font-size:.9375rem;color:var(--sailcloth-dim);cursor:pointer}
.form-check input{width:16px;height:16px;accent-color:var(--brass);flex-shrink:0;cursor:pointer;margin:0}
.form-submit{width:100%;justify-content:center;margin-top:.5rem}
.success-box{text-align:center;padding:2rem 0}
.success-icon{font-size:2.5rem;margin-bottom:1rem}
.success-box h2{font-size:2rem;margin-bottom:.5rem}
.success-line{font-family:var(--font-s);font-size:1.25rem;font-style:italic;color:var(--brass-light);margin-bottom:1rem}

/* CONTACT */
.contact-layout{display:grid;grid-template-columns:1fr;gap:3rem;align-items:start;max-width:560px;margin-left:auto;margin-right:auto}
.contact-option{padding:2.5rem 0;border-bottom:var(--fog-border)}
.contact-option:last-child{border-bottom:none}
.contact-option p{font-size:.9375rem;color:var(--sailcloth-dim);line-height:1.75;max-width:440px;margin:.75rem 0 1.5rem}
.contact-info-row{display:flex;gap:1.5rem;align-items:baseline;justify-content:center;margin:.875rem 0}
.ci-label{font-size:.6875rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--brass);width:90px;flex-shrink:0}
.ci-val{font-size:.9rem;color:var(--sailcloth-dim)}
.socials{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.social-pill{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--fog);border:1px solid rgba(119,141,169,.2);padding:.375rem .75rem;transition:all .2s}
.social-pill:hover{color:var(--brass);border-color:var(--brass)}

/* FOOTER */
footer{background:var(--black);border-top:1px solid rgba(176,141,87,.15);padding-top:2.5rem;position:relative;z-index:10;text-align:center}
.footer-inner{max-width:var(--max);margin:0 auto;padding:0 2rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1.75rem}
.footer-brand{display:flex;flex-direction:column;align-items:center;gap:.75rem}
.footer-logo img{width:56px;height:56px;object-fit:contain}
.footer-tagline{font-size:.75rem;line-height:1.7;color:var(--fog);max-width:420px;margin:0 auto}
.footer-social{display:flex;gap:.625rem;justify-content:center}
.f-social-link{font-size:.625rem;font-weight:700;letter-spacing:.15em;color:var(--fog);border:1px solid rgba(119,141,169,.25);padding:.35rem .6rem;transition:all .2s}
.f-social-link:hover{color:var(--brass);border-color:var(--brass)}
.footer-links{display:grid;grid-template-columns:repeat(5,1fr);gap:2rem;width:100%;max-width:1040px}
.f-group-label{font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin-bottom:.875rem}
.f-link{display:block;font-size:.75rem;color:var(--sailcloth-dim);padding:.25rem 0;cursor:pointer;transition:color .2s}
.f-link:hover{color:var(--sailcloth)}
.footer-bottom{border-top:1px solid rgba(119,141,169,.12);padding:1.25rem 2rem}
.footer-bottom-inner{max-width:var(--max);margin:0 auto;display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap}
.footer-pacific{font-family:var(--font-d);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-dim)}
.footer-copy{font-size:.6875rem;color:var(--charcoal)}
.footer-legal{font-size:.6875rem;display:flex;gap:.75rem;align-items:center}
.footer-legal a{color:var(--charcoal);transition:color .2s}
.footer-legal a:hover{color:var(--brass)}
/* ── Accessibility: visible keyboard focus ── */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,.btn:focus-visible,.nav-link:focus-visible,.nav-dd-item:focus-visible,.mm-link:focus-visible,[tabindex]:focus-visible,[onclick]:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:2px}
.form-note{font-size:.72rem;line-height:1.6;color:var(--fog);margin:1.25rem auto 0;max-width:520px;text-align:center}
.form-note a{color:var(--brass);text-decoration:underline}
.coming-soon-badge{display:inline-block;font-size:.625rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);border:1px solid rgba(176,141,87,.4);border-radius:20px;padding:.25rem .7rem;background:rgba(176,141,87,.08)}
/* ── Resource Library ── */
.lib-list{max-width:780px;margin:2.25rem auto 0;border:var(--fog-border);border-radius:var(--r-card);overflow:hidden}
.lib-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.05rem 1.6rem;border-bottom:var(--fog-border);text-align:left;text-decoration:none}
.lib-item:last-child{border-bottom:none}
.lib-title{font-size:.95rem;line-height:1.4;color:var(--sailcloth-dim)}
a.lib-item{transition:background .2s}
a.lib-item:hover{background:rgba(176,141,87,.07)}
a.lib-item .lib-title{color:var(--sailcloth)}
a.lib-item:hover .lib-title{color:var(--brass-light)}
.lib-read{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--brass);white-space:nowrap}
.lib-soon{font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fog);border:1px solid rgba(119,141,169,.3);border-radius:20px;padding:.2rem .6rem;white-space:nowrap}
.cat-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;max-width:820px;margin:2rem auto 0}
.cat-pill{font-family:var(--font-b);font-size:.75rem;font-weight:500;letter-spacing:.05em;color:var(--sailcloth-dim);border:1px solid rgba(176,141,87,.35);border-radius:var(--r-tag);padding:.45rem .95rem;background:rgba(176,141,87,.04);text-decoration:none;white-space:nowrap;transition:color .2s,border-color .2s,background .2s}
.cat-pill:hover{color:var(--brass);border-color:var(--brass);background:rgba(176,141,87,.1)}
.spotlight{max-width:780px;margin:2.5rem auto 0;border:1px solid rgba(176,141,87,.3);border-radius:var(--r-card);background:linear-gradient(135deg,var(--navy) 0%,var(--navy-mid) 100%);padding:clamp(2rem,4vw,3rem);text-align:center}

/* ABOUT HUB */
.hub-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.5px;background:rgba(176,141,87,.12)}
.hub-card{background:var(--navy);padding:3.5rem 3rem;display:flex;flex-direction:column;gap:1rem;cursor:pointer;transition:background .25s}
.hub-card:hover{background:var(--navy-mid)}
.hub-card-label{font-size:.6875rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.hub-card h2{font-size:1.5rem}
.hub-card p{font-size:.9375rem;color:var(--sailcloth-dim);flex:1}
.hub-card-cta{font-size:.8125rem;font-weight:600;letter-spacing:.08em;color:var(--brass);margin-top:.5rem}

/* COURSES HUB */
.courses-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px;background:rgba(176,141,87,.1)}
.course-card{background:var(--navy);padding:3rem 2.5rem;display:flex;flex-direction:column;gap:1rem;min-height:360px;cursor:pointer;transition:background .25s}
.course-card:hover{background:var(--navy-mid)}
.course-bar{width:32px;height:2px;background:var(--brass)}

/* MISC */
.aside-block{border:var(--brass-border);padding:2.5rem;background:rgba(176,141,87,.03)}
.story-body{display:flex;flex-direction:column;gap:1.25rem;margin-top:1.5rem}
.story-body p{font-family:var(--font-s);font-size:1.125rem;line-height:1.85;color:var(--sailcloth-dim)}
.story-closer{font-family:var(--font-d)!important;font-size:1.25rem!important;color:var(--sailcloth)!important;letter-spacing:.05em}
.stat-block{border:var(--brass-border);padding:2.5rem;background:rgba(176,141,87,.03)}
.stat-line{font-family:var(--font-d);font-size:1.375rem;font-weight:700;color:var(--sailcloth);line-height:1.4;margin-bottom:.375rem}
.included-grid{display:grid;grid-template-columns:1fr;gap:2.25rem;align-items:center;max-width:680px;margin-left:auto;margin-right:auto}
.offer-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5px;background:rgba(176,141,87,.12);margin-top:3rem}
.note-box{border-left:2px solid var(--brass);padding:1rem 1.25rem;background:rgba(176,141,87,.04);font-size:.875rem;line-height:1.7}
.fine-print{font-size:.8125rem;color:var(--fog);text-align:center;max-width:680px;margin:3rem auto 0;line-height:1.7}

/* PROGRAM PAGE HERO — name big, tagline small */
.hero:not(.home-hero) .hero-content .label{font-family:var(--font-d);font-size:clamp(1.5rem,2.8vw,2.25rem);letter-spacing:.12em;color:var(--sailcloth);text-transform:uppercase;font-weight:700}
.hero:not(.home-hero) .hero-content h1{font-family:var(--font-s);font-size:clamp(.95rem,1.4vw,1.2rem)!important;font-weight:400;font-style:italic;color:var(--brass-light);letter-spacing:.03em;line-height:1.6;max-width:620px}

/* HERO SIZES */
.hero-65{min-height:42vh}
.hero-70{min-height:48vh}
.hero-80{min-height:54vh}

/* RESPONSIVE */
@media(max-width:1000px){
  .nav-links,.nav-cta{display:none}
  .hamburger{display:flex}
  /* Frosted-glass mobile bar: content behind is blurred, not sharply showing through */
  #navbar{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;padding:.55rem 0;border-bottom:none}
  #navbar.scrolled{background:rgba(7,17,28,.3);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:.55rem 0}
  .nav-inner{height:78px;padding:0 1.25rem}
  .nav-logo img{width:60px;height:60px}
  /* Stop fixed background images from rescaling/zooming as the mobile URL bar hides/shows */
  [id^="page-"]::before{inset:auto!important;top:0!important;left:0!important;width:100vw!important;height:100lvh!important}
  .two-col,.two-col-wide,.two-col-reverse,.join-layout,.contact-layout{grid-template-columns:1fr}
  .pillars,.pillars-2,.pillars-4{grid-template-columns:1fr!important}
  .pillar{border-right:none;border-bottom:var(--brass-border)}
  .pillar:last-child{border-bottom:none}
  .program-cards,.testimonial-grid,.cards-grid,.cg-2,.courses-cards,.offer-cards{grid-template-columns:1fr!important}
  .standard-cards{grid-template-columns:repeat(2,1fr)}
  .articles-grid{grid-template-columns:1fr}
  .hub-cards{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr}
  .footer-links{grid-template-columns:repeat(2,1fr);justify-items:center;text-align:center}
  .footer-links>div:last-child{grid-column:1/-1}
  .article-layout{grid-template-columns:1fr}
  .outcomes{grid-template-columns:1fr}
  .outcome{border-right:none}
  .outcome:nth-last-child(-n+2){border-bottom:var(--fog-border)}
  .outcome:last-child{border-bottom:none}
  .included-grid{grid-template-columns:1fr}
  .myth-grid{grid-template-columns:1fr}
  .home-hero-content{padding-top:5.5rem!important}
  .hero-logo-img{width:95vw!important;max-height:34vh!important;margin-top:0!important}
  .hero-tagline-wrap{margin-top:1rem!important}
  .hero-tagline{white-space:normal!important;text-align:center;max-width:90vw}
  .home-hero{min-height:60vh}
}
@media(max-width:600px){
  .section{padding:4rem 1.25rem}
  .hero-content{padding:5rem 1.25rem 3rem}
  .wrap{padding:0 1.25rem}
  .form-box{padding:2rem 1.5rem}
  .standard-cards{grid-template-columns:1fr}
  .footer-links{grid-template-columns:1fr 1fr;justify-items:center;text-align:center}
  .footer-links>div:last-child{grid-column:1/-1}
  .home-headline{font-size:2.75rem}
  .program-card{padding:2rem 1.5rem}
}
@media(max-width:768px){
  #intro-screen{background-attachment:scroll!important;background-size:cover!important;justify-content:flex-end!important;padding-bottom:1.25rem!important}
  #intro-screen .btn-gate{-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;background-color:#000!important;color:var(--brass)!important}
  #intro-screen .gate-text-full{display:none}
  #intro-screen .gate-text-short{display:inline}
  .home-act1{background:none!important}
  #page-home::after{background:linear-gradient(180deg,rgba(7,17,28,.22) 0%,rgba(7,17,28,.3) 100%)!important}
  .home-hero-content{bottom:1.75rem!important}
  .home-hero{min-height:78vh!important}
}
/* ── BRAND LOGO UPGRADE STATES ── */
.nav-logo.has-logo .nav-logo-text{display:none}
.nav-logo.has-logo img{width:auto;height:80px;aspect-ratio:580/350}
.footer-logo.has-seal img{width:120px;height:120px;object-fit:contain;margin-bottom:1.25rem}
/* ── ABOUT / THE SOCIETY — cinematic room background ── */
#page-about-society{position:relative;isolation:isolate}
#page-about-society::before{content:'';position:fixed;inset:0;background:url('/brand/shipshape-society-room.jpg') center center/cover no-repeat;z-index:-2}
#page-about-society::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.4) 0%,rgba(7,17,28,.52) 100%);z-index:-1}
#page-about-society .section,#page-about-society .section-dark,#page-about-society>section{background-color:transparent!important;background-image:none!important}
#page-about-society .hero-bg{background:transparent!important}
#page-about-society .hero-bg::after{display:none}
#page-about-society .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
/* Smaller section headings on About — match the founder page's h2 scale */
#page-about-society .sh h2{font-size:clamp(1.4rem,3vw,1.65rem)}
#page-about-society .cta-section h2{font-size:clamp(1.5rem,3.2vw,1.9rem)}
/* Uniform section-heading size across the whole home page */
#page-home .sh h2{font-size:clamp(1.5rem,3vw,2.25rem)}
/* BBCP testimonial cards: centered content */
#page-bbcp .t-card{text-align:center;padding:2rem;border-left:var(--fog-border)}
#page-vop .t-card{text-align:center;padding:2rem;border-left:var(--fog-border)}
#page-courses .t-card{text-align:center;padding:2rem;border-left:var(--fog-border)}
#page-proof .t-card{text-align:center;padding:2rem;border-left:var(--fog-border)}
#page-ppi .t-card{text-align:center;padding:2rem;border-left:var(--fog-border)}
/* Hero feature chips: one line on desktop, wrap gracefully on mobile */
.hero-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:.55rem}
/* BBCP What You Gain: 4 across desktop, 2x2 tablet, 1 col mobile */
.gain-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;max-width:1040px;margin:2.75rem auto 0}
@media(max-width:900px){.gain-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.gain-grid{grid-template-columns:1fr}}
/* Hero fills the screen so the page lands on a clean intro; next section sits below the fold.
   Content stays pinned near the nav (top-aligned) like the other pages. */
#page-about-society .hero{min-height:calc(100svh - 40px);align-items:flex-end}
#page-about-society .hero .hero-content{padding-top:0;padding-bottom:1.5rem}
#page-about-society .hero-content>p{font-family:var(--font-s)!important;color:var(--sailcloth-dim)!important;text-shadow:none!important;font-size:1.125rem!important;line-height:1.4!important;max-width:600px;margin:0 auto}
/* Offering items separated by a short centered brass divider (no left dashes) */
#page-about-society .offering-item{padding:0 .5rem}
#page-about-society .offering-sep{width:48px;height:1px;background:var(--brass);opacity:.45;margin:1.85rem auto}
/* ── BBCP — fixed navigation desk background ── */
#page-bbcp{position:relative;isolation:isolate}
#page-bbcp::before{content:'';position:fixed;inset:0;background:#07111C url('/brand/bbcp-bg-v2.png') center center/cover no-repeat;z-index:-2;filter:brightness(.6)}
#page-vop{position:relative;isolation:isolate}
#page-vop::before{content:'';position:fixed;inset:0;background:url('/brand/shipshape-bbcp-bg.jpg') center center/cover no-repeat;z-index:-2;filter:saturate(.85) contrast(1.05)}
#page-vop::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.45) 0%,rgba(7,17,28,.58) 100%);z-index:-1}
#page-vop .section,#page-vop .section-dark,#page-vop>section,#page-vop .hero{background-color:transparent!important;background-image:none!important}
#page-vop .hero-bg{background:transparent!important;filter:none!important}
#page-vop .hero-bg::after{display:none!important}
#page-vop .hero-overlay{background:linear-gradient(180deg,rgba(7,17,28,.18) 0%,rgba(7,17,28,.08) 45%,rgba(7,17,28,.32) 100%)!important}
#page-vop .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
#page-courses{position:relative;isolation:isolate}
#page-courses::before{content:'';position:fixed;inset:0;background:url('/brand/shipshape library .jpg') center center/cover no-repeat;z-index:-2;filter:saturate(.85) brightness(1.2) contrast(1.05)}
#page-courses::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.45) 0%,rgba(7,17,28,.58) 100%);z-index:-1}
#page-courses .section,#page-courses .section-dark,#page-courses>section,#page-courses .hero{background-color:transparent!important;background-image:none!important}
#page-courses .hero-bg{background:transparent!important;filter:none!important}
#page-courses .hero-bg::after{display:none!important}
#page-courses .hero-overlay{background:linear-gradient(180deg,rgba(7,17,28,.18) 0%,rgba(7,17,28,.08) 45%,rgba(7,17,28,.32) 100%)!important}
#page-courses .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
#page-resources{position:relative;isolation:isolate}
#page-resources::before{content:'';position:fixed;inset:0;background:url('/brand/re bg.jpg') center center/cover no-repeat;z-index:-2;filter:saturate(.85) brightness(1.2) contrast(1.05)}
#page-resources::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.45) 0%,rgba(7,17,28,.58) 100%);z-index:-1}
#page-resources .section,#page-resources .section-dark,#page-resources>section,#page-resources .hero{background-color:transparent!important;background-image:none!important}
#page-resources .hero-bg{background:transparent!important;filter:none!important}
#page-resources .hero-bg::after{display:none!important}
#page-resources .hero-overlay{background:linear-gradient(180deg,rgba(7,17,28,.18) 0%,rgba(7,17,28,.08) 45%,rgba(7,17,28,.32) 100%)!important}
#page-resources .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
#page-resources .hero{min-height:calc(100svh - 40px);align-items:flex-end}
#page-resources .hero .hero-content{padding-top:0;padding-bottom:1.5rem}
#page-bbcp::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.45) 0%,rgba(7,17,28,.58) 100%);z-index:-1}
#page-bbcp .section,#page-bbcp .section-dark,#page-bbcp>section,#page-bbcp .hero{background-color:transparent!important;background-image:none!important}
#page-bbcp .hero-bg{background:transparent!important;filter:none!important}
#page-bbcp .hero-bg::after{display:none!important}
#page-bbcp .hero-overlay{background:linear-gradient(180deg,rgba(7,17,28,.18) 0%,rgba(7,17,28,.08) 45%,rgba(7,17,28,.32) 100%)!important}
#page-bbcp .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
/* PPI page: full-page inspection-chart background (same treatment as BBCP) */
#page-ppi{position:relative;isolation:isolate}
#page-ppi::before{content:'';position:fixed;inset:0;background:#07111C url('/brand/ppi-bg.png') center center/cover no-repeat;z-index:-2;filter:brightness(.55)}
#page-ppi .section,#page-ppi .section-dark,#page-ppi>section,#page-ppi .hero{background-color:transparent!important;background-image:none!important}
#page-ppi .hero-bg{background:transparent!important;filter:none!important}
#page-ppi .hero-bg::after{display:none!important}
#page-ppi .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
/* ── VESSEL REVIEW — fixed logbook background ── */
#page-listing-inspection .t-card{text-align:center;padding:2rem;border-left:var(--fog-border)}
#page-listing-inspection{position:relative;isolation:isolate}
#page-listing-inspection::before{content:'';position:fixed;inset:0;background:#07111C url('/brand/vessel-review-bg.png') center center/cover no-repeat;z-index:-2;filter:brightness(.55)}
#page-listing-inspection .section,#page-listing-inspection .section-dark,#page-listing-inspection>section,#page-listing-inspection .hero{background-color:transparent!important;background-image:none!important}
#page-listing-inspection .hero-bg{background:transparent!important;filter:none!important}
#page-listing-inspection .hero-bg::after{display:none!important}
#page-listing-inspection .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
/* ── SHIPSHAPE SUPPLY — fixed ship-store background ── */
#page-merch{position:relative;isolation:isolate}
#page-merch::before{content:'';position:fixed;inset:0;background:#07111C url('/brand/supply-bg-v3.png') center center/cover no-repeat;z-index:-2;filter:brightness(.55)}
#page-merch .section,#page-merch .section-dark,#page-merch>section,#page-merch .hero{background-color:transparent!important;background-image:none!important}
#page-merch .hero-bg{background:transparent!important;filter:none!important}
#page-merch .hero-bg::after{display:none!important}
#page-merch .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
#page-merch .hero{min-height:calc(100svh - 40px);align-items:flex-end}
#page-merch .hero .hero-content{padding-top:0;padding-bottom:1.5rem}
/* ── ABOUT / FOUNDER — fixed storm-sailor background ── */
#page-about-founder{position:relative;isolation:isolate}
#page-about-founder::before{content:'';position:fixed;inset:0;background:url('/brand/shipshape-dustin-sailor.jpg') center center/cover no-repeat;z-index:-2;filter:saturate(.85) contrast(1.05)}
#page-about-founder::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.42) 0%,rgba(7,17,28,.55) 100%);z-index:-1}
#page-about-founder .section,#page-about-founder .section-dark,#page-about-founder>section,#page-about-founder .hero{background-color:transparent!important;background-image:none!important}
#page-about-founder .hero-bg{background:transparent!important;filter:none!important}
#page-about-founder .hero-bg::after{display:none!important}
#page-about-founder .hero-overlay{background:linear-gradient(180deg,rgba(7,17,28,.18) 0%,rgba(7,17,28,.08) 45%,rgba(7,17,28,.32) 100%)!important}
#page-about-founder .cta-section{background:rgba(7,17,28,.45)!important;backdrop-filter:blur(2px)}
#page-about-founder .hero{min-height:calc(100svh - 40px);align-items:flex-end}
#page-about-founder .hero .hero-content{padding-top:0;padding-bottom:1.5rem}
#page-about-founder .hero-content>p{font-family:var(--font-s)!important;color:var(--sailcloth-dim)!important;text-shadow:none!important;font-size:1.125rem!important;line-height:1.4!important;max-width:600px;margin:0 auto}
/* ── HOME — fixed ghost-ship hero, yacht-club room reveals on scroll ── */
#page-home{position:relative;isolation:isolate}
#page-home::before{content:'';position:fixed;inset:0;background:url('/brand/society page .jpg') center center/cover no-repeat;z-index:-2}
#page-home::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.35) 0%,rgba(7,17,28,.45) 100%);z-index:-1}
#page-home .section,#page-home .section-dark,#page-home>section:not(.home-hero){background-color:transparent!important;background-image:none!important}
#page-home .cta-section{background:rgba(7,17,28,.42)!important;backdrop-filter:blur(2px)}
/* ── JOIN PAGE — fixed background ── */
#page-join{position:relative;isolation:isolate}
#page-join::before{content:'';position:fixed;inset:0;background:url('/brand/Join the society background .jpg') center center/cover no-repeat;z-index:-2;filter:saturate(.9) brightness(.85) contrast(1.0)}
#page-join::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.25) 0%,rgba(7,17,28,.35) 100%);z-index:-1}
#page-join .section,#page-join .section-dark,#page-join>section,#page-join .hero{background-color:transparent!important;background-image:none!important}
#page-join .hero-bg{background:transparent!important}
#page-join .hero-bg::after{display:none}

/* ── CONTACT PAGE — fixed background ── */
#page-contact{position:relative;isolation:isolate}
#page-contact::before{content:'';position:fixed;inset:0;background:url('/brand/Contact Page Background.jpg') center center/cover no-repeat;z-index:-2;filter:saturate(.8) brightness(.65) contrast(1.05)}
#page-contact::after{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(7,17,28,.45) 0%,rgba(7,17,28,.55) 100%);z-index:-1}
#page-contact .section,#page-contact .section-dark,#page-contact>section,#page-contact .hero{background-color:transparent!important;background-image:none!important}
#page-contact .hero-bg{background:transparent!important}
#page-contact .hero-bg::after{display:none}

/* ── ATMOSPHERE: grain + vignette overlays (weathered, cinematic) ── */
#grain{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
#vignette{position:fixed;inset:0;z-index:9997;pointer-events:none;background:radial-gradient(120% 90% at 50% 35%,transparent 55%,rgba(5,11,18,.55) 100%)}

/* ══ ROUNDED-CORNER SYSTEM (subtle, premium — not bubbly) ══ */
:root{--r-btn:11px;--r-card:16px;--r-tag:8px;--r-img:14px}
/* Buttons & form inputs ~11px */
.btn,.form-input,.form-select,.form-textarea{border-radius:var(--r-btn)}
/* Cards & content boxes 14–18px (clip internal dividers for clean rounded edge) */
.program-card,.t-card,.c-card,.std-card,.article-card,.hub-card,.course-card,
.form-box,.success-box,.aside-block,.sidebar-cta,.topics,.outcomes,.cards-grid,
.pillars,.auth-cards,.included-grid,.standard-cards,.article-sidebar,.cta-section,.offer-cards{border-radius:var(--r-card)}
.program-card,.t-card,.c-card,.std-card,.article-card,.hub-card,.course-card,
.topics,.outcomes,.cards-grid,.pillars,.standard-cards,.offer-cards{overflow:hidden}
/* Image containers */
.two-col img,.two-col-wide img,.two-col-reverse img{border-radius:var(--r-img)}
/* Small tags / badges — selective pill is OK here */
.std-chip{border-radius:var(--r-tag)}

/* ══ FAQ ACCORDION ══ */
.faq-list{max-width:760px;margin:2.5rem auto 0;display:flex;flex-direction:column;gap:.75rem}
.faq-item{background:rgba(27,38,59,.5);border:var(--fog-border);border-left:2px solid var(--brass);border-radius:var(--r-card);padding:0 1.75rem}
.faq-item summary{list-style:none;cursor:pointer;padding:1.25rem 0;font-family:var(--font-b);font-weight:600;font-size:1rem;color:var(--sailcloth);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';font-family:var(--font-d);font-size:1.3rem;color:var(--brass);flex-shrink:0;transition:transform .2s ease}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{font-size:.9375rem;line-height:1.75;color:var(--sailcloth-dim);padding:0 0 1.5rem}
.program-tag{border-radius:999px}

/* ══ COMPARISON TABLE ══ */
.compare-wrap{max-width:740px;margin:2.5rem auto 0;overflow-x:auto}
.compare{width:100%;border-collapse:collapse;min-width:540px}
.compare th,.compare td{padding:.85rem 1.1rem;text-align:center;border-bottom:1px solid rgba(119,141,169,.16);font-size:.9rem;vertical-align:middle}
.compare th:first-child,.compare td:first-child{text-align:left;color:var(--sailcloth-dim);font-size:.85rem}
.compare thead th{font-family:var(--font-d);font-weight:700;color:var(--sailcloth);border-bottom:2px solid var(--brass);font-size:1.05rem;padding-bottom:.5rem}
.compare thead th small{display:block;font-family:var(--font-b);font-weight:500;font-size:.72rem;letter-spacing:.05em;color:var(--brass-light);margin-top:.3rem}
.compare .plus-col{background:rgba(176,141,87,.06)}
.compare .yes{color:var(--brass);font-weight:700;font-size:1.05rem}
.compare .no{color:var(--fog);opacity:.45}
.compare .price-row td{font-family:var(--font-d);color:var(--brass);font-size:1rem;padding-top:1.1rem}
.compare .price-row td:first-child{font-family:var(--font-b)}