/* ══════════════════════════════════════════════════════════════════════════════
   Class Act Charter Fishing — the rules unique to this client. Everything else is kit.css.
   Rebuilt 2026-09-24 night in HIS look: his royal blue header band, his aqua watercolor,
   his cream, his gold and teal, his logo, his three fonts. Light page mode.
   The first dark build is kept at scratchpad/site-dark-v1.css for reference only.
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── type: Oswald capitals for headings (his), Great Vibes for script (his), Hind to read (his) ── */
body{font-family:var(--sans);font-size:18px;line-height:1.7}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.012em;line-height:1.12}
body.light h2{color:var(--bay)}
body.light h3{color:var(--ink)}
h2{font-size:clamp(2rem,4vw,3rem)}
.kick{font-family:var(--script);font-size:clamp(1.95rem,3.2vw,2.6rem);line-height:1.1;color:var(--bay);margin:0 0 2px;text-transform:none;letter-spacing:0}
.shead.center{text-align:center;margin-inline:auto}
.shead.center .lede{margin-inline:auto}
.shead h2{margin:0}
.btn{font-family:var(--serif);font-weight:500;letter-spacing:.08em;font-size:15px}

/* the gold fish under every heading, the way his site does it */
.fishdiv{display:flex;align-items:center;justify-content:center;gap:12px;margin:14px auto 22px;color:var(--gold)}
.fishdiv::before,.fishdiv::after{content:'';width:48px;height:2px;border-radius:2px;background:currentColor}
.fishdiv svg{width:40px;height:25px;flex:0 0 40px}
.fishdiv.left{justify-content:flex-start;margin-left:0}
.fishdiv.left::before{display:none}

/* ── the header: his royal blue band with a gold rule under it, his logo, "Class Act" in his script.
      !important because the kit's light mode restyles the nav in five states at rising specificity. ── */
.nav,body.light .nav,body.light.dark-top:not(.scrolled):not(.menu-open) .nav,body.light.dark-top.scrolled .nav,
body.light.menu-open .nav,body.light.scrolled .nav{background:var(--bay)!important;border-bottom:3px solid var(--gold)!important;
  box-shadow:0 8px 24px -14px rgba(0,30,55,.55)}
.nav .w1,body.light .nav .w1,body.light.dark-top:not(.scrolled):not(.menu-open) .nav .w1,body.light.dark-top.scrolled .nav .w1,
body.light.menu-open .nav .w1{font-family:var(--script)!important;font-size:42px;font-weight:400;text-transform:none;letter-spacing:0;
  color:#fff!important;line-height:.95}
.nav .w2,body.light .nav .w2{font-family:var(--serif);font-size:12.5px;font-weight:500;letter-spacing:.26em;color:var(--logo)!important;
  text-transform:uppercase;margin-top:4px}
.nav .nlinks a,.nav .nphone,body.light .nav .nlinks a,body.light .nav .nphone,
body.light.dark-top:not(.scrolled):not(.menu-open) .nav .nlinks a,body.light.dark-top:not(.scrolled):not(.menu-open) .nav .nphone,
body.light.dark-top.scrolled .nav .nlinks a,body.light.dark-top.scrolled .nav .nphone,
body.light.menu-open .nav .nlinks a,body.light.menu-open .nav .nphone{color:#fff!important;font-family:var(--serif);text-transform:uppercase;
  letter-spacing:.06em;font-size:17px;font-weight:400}
.nav .nlinks a:hover,.nav .nlinks a[aria-current]{color:var(--logo)!important}
.nav .nlinks a::after,body.light .nav .nlinks a::after{background:var(--gold)!important}
.nav .btn-ink,body.light .nav .btn-ink,body.light.dark-top:not(.scrolled):not(.menu-open) .nav .btn-ink,body.light.dark-top.scrolled .nav .btn-ink,
body.light.menu-open .nav .btn-ink{background:var(--teal)!important;color:#062B45!important;border-color:transparent!important}
.nav .btn-ink:hover{background:#6ACFCF!important}
.nav .burger,body.light .nav .burger,body.light.dark-top:not(.scrolled):not(.menu-open) .nav .burger,body.light.dark-top.scrolled .nav .burger,
body.light.menu-open .nav .burger{border-color:rgba(255,255,255,.55)!important}
.nav .burger span,.nav .burger span::before,.nav .burger span::after,
body.light .nav .burger span,body.light .nav .burger span::before,body.light .nav .burger span::after,
body.light.dark-top.scrolled .nav .burger span,body.light.dark-top.scrolled .nav .burger span::before,body.light.dark-top.scrolled .nav .burger span::after,
body.light.dark-top:not(.scrolled):not(.menu-open) .nav .burger span,body.light.dark-top:not(.scrolled):not(.menu-open) .nav .burger span::before,
body.light.dark-top:not(.scrolled):not(.menu-open) .nav .burger span::after,
body.light.menu-open .nav .burger span::before,body.light.menu-open .nav .burger span::after{background:#fff!important}
body.menu-open .nav .burger span,body.light.menu-open .nav .burger span{background:transparent!important}
.brand{gap:12px}
.brand .mk{width:66px;height:66px;flex:0 0 66px;object-fit:contain}
@media(max-width:640px){.brand .mk{width:52px;height:52px;flex:0 0 52px}.nav .w1,body.light .nav .w1{font-size:34px}.nav .w2,body.light .nav .w2{font-size:11px;letter-spacing:.18em}}
@media(max-width:1320px){.nlinks,.nphone{display:none}.burger{display:flex}}
body.light .drawer a{font-family:var(--serif);text-transform:uppercase;letter-spacing:.05em;color:var(--bay)}

/* ── the hero: his slider. Slide one always shows; two and three fade in over it. ── */
.hero.slides .hero-img .slide{position:absolute;inset:0}
.hero.slides .hero-img .slide img{width:100%;height:100%;object-fit:cover;object-position:45% 55%}
.hero.slides .s2,.hero.slides .s3{opacity:0}
.hero-img::after{z-index:1;background:
  linear-gradient(180deg,rgba(0,40,66,.34) 0%,rgba(0,40,66,.06) 30%,rgba(0,40,66,.34) 64%,rgba(0,40,66,.86) 100%),
  linear-gradient(96deg,rgba(0,40,66,.74) 0%,rgba(0,40,66,.44) 38%,rgba(0,40,66,.04) 70%,rgba(0,40,66,0) 100%)}
.hero-in{z-index:2}
.hscript{display:grid;margin:0 0 6px;font-family:var(--script);font-size:clamp(3.4rem,7.4vw,6.8rem);line-height:1.02;color:#fff;
  text-shadow:0 4px 34px rgba(0,30,55,.6),0 1px 2px rgba(0,30,55,.4);text-transform:none;letter-spacing:0}
.hscript span{grid-area:1/1}
.hscript .t2,.hscript .t3{opacity:0}
.hero h1{font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.3rem);font-weight:500;letter-spacing:.04em;line-height:1.2;max-width:32ch;color:#fff;
  text-shadow:0 2px 18px rgba(0,30,55,.5)}
.hero .sub{max-width:54ch;color:rgba(255,255,255,.94);text-shadow:0 1px 12px rgba(0,30,55,.5)}
.hero-meta{font-size:15px;border-top-color:rgba(255,255,255,.28)}
.hero-meta .dot{background:var(--gold)}
@media (prefers-reduced-motion:no-preference){
  .hero.slides-on .s2,.hero.slides-on .hscript .t2{animation:ca-s2 21s ease-in-out infinite}
  .hero.slides-on .s3,.hero.slides-on .hscript .t3{animation:ca-s3 21s ease-in-out infinite}
  .hero.slides-on .hscript .t1{animation:ca-t1 21s ease-in-out infinite}
}
@keyframes ca-s2{0%,29%{opacity:0}34%,62%{opacity:1}67%,100%{opacity:0}}
@keyframes ca-s3{0%,62%{opacity:0}67%,95%{opacity:1}100%{opacity:0}}
@keyframes ca-t1{0%,29%{opacity:1}34%,95%{opacity:0}100%{opacity:1}}
@media(max-width:700px){
  .hero{margin-top:calc(-1 * var(--nav-h));background:var(--bay)}
  .hero-img{margin-top:0;height:calc(72vw + var(--nav-h));max-height:calc(440px + var(--nav-h));overflow:hidden}
  .hero-img::after{background:linear-gradient(180deg,rgba(0,40,66,.55) 0%,rgba(0,40,66,.06) 42%,rgba(0,40,66,.5) 100%)}
  .hscript{font-size:clamp(2.7rem,12vw,3.6rem)}
  .hero-meta>span{white-space:normal}.hero-meta .dot{display:none}.hero-meta{gap:8px 0;flex-direction:column;align-items:flex-start}
}
.hero-meta>span{white-space:nowrap}

/* ── page banners: the page name in big script, like his "Charter" / "About" banners ── */
.pbanner .bimg::after{background:
  linear-gradient(180deg,rgba(0,40,66,.50) 0%,rgba(0,40,66,.30) 44%,rgba(0,40,66,.82) 100%),
  linear-gradient(96deg,rgba(0,40,66,.74) 0%,rgba(0,40,66,.44) 40%,rgba(0,40,66,.08) 74%,rgba(0,40,66,0) 100%)}
.bscript{font-family:var(--script);font-size:clamp(3.6rem,8vw,6.6rem);line-height:1;color:#fff;margin:0 0 6px;
  text-shadow:0 4px 30px rgba(0,30,55,.6);text-transform:none;letter-spacing:0}
.pbanner h1{font-family:var(--serif);font-size:clamp(1.55rem,2.8vw,2.4rem);font-weight:500;letter-spacing:.03em;line-height:1.2;max-width:30ch}
.pbanner .crumbs{font-family:var(--serif);text-transform:uppercase;letter-spacing:.12em;font-size:15px}
@media(max-width:640px){.pbanner h1,.hero h1{overflow-wrap:break-word;hyphens:none}}

/* ── bands: paper, his cream, and his watercolor ── */
body.light .sec::before,body.light .sec-tight::before{background:
  radial-gradient(40% 48% at 6% 6%,rgba(66,184,185,.14),transparent 68%),
  radial-gradient(38% 46% at 94% 96%,rgba(247,167,3,.08),transparent 68%)}
body.light .sec-alt{background-color:var(--panel)}
body.light .sec-alt::before{background:
  radial-gradient(44% 52% at 14% 2%,rgba(247,167,3,.10),transparent 66%),
  radial-gradient(40% 48% at 92% 100%,rgba(66,184,185,.12),transparent 68%)}
.sec.wash{background:#E3F7F8 url(../img/wash.jpg) center/cover no-repeat}
body.light .sec.wash::before{background:none}
body.light .sec+.sec{border-top-color:rgba(0,93,144,.10)}

/* ── the four feature cards his home page leads with ── */
.feats{padding-block:clamp(56px,7vw,96px)}
.feats4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2.2vw,30px)}
.feat{display:flex;flex-direction:column;align-items:center;text-align:center;text-decoration:none;padding:0 0 10px}
.feat .ph{display:block;width:100%;aspect-ratio:4/3;overflow:hidden;border-radius:4px;border:5px solid #fff;
  box-shadow:0 18px 38px -22px rgba(0,50,85,.55);transition:transform .45s cubic-bezier(.2,.7,.3,1),box-shadow .3s}
.feat .ph img{width:100%;height:100%;object-fit:cover}
.feat:hover .ph{transform:translateY(-5px);box-shadow:0 26px 48px -22px rgba(0,50,85,.6)}
.feat .ft{font-family:var(--script);font-size:clamp(2rem,2.6vw,2.5rem);line-height:1.05;color:var(--bay);margin-top:16px}
.feat .fs{font-family:var(--serif);text-transform:uppercase;letter-spacing:.06em;font-size:15px;color:var(--ink-2);margin-top:6px;line-height:1.35}
@media(max-width:980px){.feats4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:460px){.feats4{grid-template-columns:minmax(0,1fr)}}

/* ── Charters / Guides / Catches: his three portrait columns ── */
.cgc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.6vw,34px)}
.cgc>*{min-width:0}
.cgc .ph{aspect-ratio:4/5;overflow:hidden;border-radius:4px;border:5px solid #fff;box-shadow:0 22px 44px -26px rgba(0,50,85,.55)}
.cgc .ph img{width:100%;height:100%;object-fit:cover}
.cgc h3{font-size:clamp(1.3rem,1.9vw,1.55rem);margin:20px 0 8px;color:var(--bay);line-height:1.2}
.cgc h3 span{color:#0A6E74}
.cgc p{font-size:17px}
.cgc .more,.more{font-family:var(--serif);text-transform:uppercase;letter-spacing:.09em;color:var(--accent);font-size:15px;
  display:inline-block;padding:12px 0;text-decoration:none;border-bottom:2px solid var(--gold)}
@media(max-width:900px){.cgc{grid-template-columns:minmax(0,1fr)}.cgc article{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 20px;align-items:start}
  .cgc .ph{grid-row:1/5}.cgc h3{margin-top:0}}
@media(max-width:520px){.cgc article{display:block}.cgc .ph{aspect-ratio:4/3}}

/* ── the seasons ── */
.seasons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.season{background:#fff;border-radius:6px;overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column;
  box-shadow:0 22px 44px -30px rgba(0,50,85,.5);transition:transform .4s cubic-bezier(.2,.7,.3,1),box-shadow .3s}
.season:hover{transform:translateY(-4px);box-shadow:0 30px 56px -30px rgba(0,50,85,.55)}
.season .ph{aspect-ratio:4/3;overflow:hidden}
.season .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.season .bd{padding:24px 24px 28px}
.season h3{font-size:clamp(1.55rem,2.4vw,1.9rem);color:var(--bay);margin-bottom:6px}
.season .fl{font-family:var(--script);font-size:2.2rem;line-height:1.05;color:var(--accent);margin:0 0 8px}
.season p{font-size:17px;line-height:1.62}
@media(max-width:900px){.seasons{grid-template-columns:minmax(0,1fr)}.season{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.season .ph{aspect-ratio:auto;min-height:100%}}
@media(max-width:560px){.season{display:flex}.season .ph{aspect-ratio:16/10;min-height:0}}

/* ── full-bleed photo bands with a script caption ── */
.bleed>figcaption{background:linear-gradient(180deg,transparent,rgba(0,40,66,.78));padding:60px 0 26px}
.bleed .cscript{font-family:var(--script);font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1.1;letter-spacing:0;text-transform:none;color:#fff;
  text-shadow:0 3px 24px rgba(0,30,55,.6)}

/* ── species, wall, reviews, numbers, lodging, lists ── */
.pills.sp{justify-content:center;margin-bottom:34px}
.pills.sp .pill{font-size:15px;min-height:44px;padding:11px 18px;display:inline-flex;align-items:center;font-family:var(--serif);
  text-transform:uppercase;letter-spacing:.05em;color:var(--bay);border-color:rgba(0,93,144,.25);background:#fff}
.species{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.species figure{margin:0;border-radius:6px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -30px rgba(0,50,85,.5)}
.species img{width:100%;aspect-ratio:4/5;object-fit:cover}
.species figcaption{padding:16px 18px 20px}
.species b{display:block;font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.03em;font-size:1.25rem;color:var(--bay);margin-bottom:4px}
.species span{font-size:15.5px;color:var(--muted);line-height:1.5}
@media(max-width:900px){.species{grid-template-columns:repeat(2,minmax(0,1fr))}}

.wall{columns:4 240px;column-gap:14px}
.wall figure{margin:0 0 14px;break-inside:avoid;border-radius:4px;overflow:hidden;border:4px solid #fff;background:#fff;box-shadow:0 18px 36px -26px rgba(0,50,85,.55)}
.wall img{width:100%;height:auto;display:block;transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.wall figure:hover img{transform:scale(1.04)}
@media(max-width:560px){.wall{columns:2 140px;column-gap:10px}.wall figure{margin-bottom:10px;border-width:3px}}

.stars.big{text-align:center;font-size:30px;letter-spacing:6px;color:var(--gold);margin:-6px 0 18px}
body.light .stars{color:#D98E00}
.pull blockquote{font-family:var(--script);font-size:clamp(2.2rem,4.2vw,3.4rem);line-height:1.15;text-transform:none;letter-spacing:0}
body.light .pull blockquote{color:var(--bay)}
.rgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px);margin-top:44px}
.rgrid .rvw{display:flex;flex-direction:column;height:100%;background:#fff}
.rgrid>*{min-width:0}
@media(max-width:980px){.rgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.rgrid .rvw:last-child:nth-child(odd){grid-column:1/-1}}
@media(max-width:620px){.rgrid{grid-template-columns:minmax(0,1fr)}}
.rvw q{font-family:var(--sans);font-size:1.06rem;line-height:1.62}
body.light .who .av{background:var(--bay);color:#fff}

.nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,30px);text-align:center}
.nums>div{padding:20px 10px}
.nums b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2.6rem,5vw,3.8rem);color:var(--bay);line-height:1;margin-bottom:10px}
.nums span{font-family:var(--serif);font-size:15px;color:var(--ink-2);letter-spacing:.08em;text-transform:uppercase}
@media(max-width:900px){.nums{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.nums{grid-template-columns:minmax(0,1fr)}}

.inns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.inn h3{font-size:clamp(1.4rem,2.2vw,1.7rem);color:var(--bay)}
.inn p{font-size:17px}
.inn .addr{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:16px}
.inn .addr a{color:var(--bay);display:inline-block;padding:12px 0;font-weight:500}
@media(max-width:760px){.inns{grid-template-columns:minmax(0,1fr)}}
body.light .pcard .sz{font-family:var(--serif);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#0A6E74}
body.light .pcard h3{color:var(--bay)}

.ticks{list-style:none;padding:0;margin:4px 0 22px;display:grid;gap:10px}
.ticks li{position:relative;padding-left:34px;font-size:18px;color:var(--ink);font-style:italic}
.ticks li::before{content:'';position:absolute;left:0;top:.3em;width:20px;height:20px;border-radius:50%;background:var(--gold)}
.ticks li::after{content:'';position:absolute;left:7px;top:calc(.3em + 4px);width:5px;height:10px;border:solid #fff;border-width:0 2.4px 2.4px 0;transform:rotate(42deg)}

.s-media img{aspect-ratio:4/5;object-fit:cover;width:100%;height:auto;border-radius:4px;border:6px solid #fff;box-shadow:0 30px 60px -34px rgba(0,50,85,.6)}
.sec-alt .split .s-media img{aspect-ratio:4/3}
.split.top{align-items:start}

/* price rows */
.mrow .mn,.mrow .md,.mrow .mp,.mrow .mt{display:block}
.mrow>div:last-child{text-align:right}
.mrow .md{margin-top:6px}
.mrow .mt{margin-top:4px}
.mrow{background:#fff}
.mrow .mn,.mrow .mp{font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.02em;color:var(--bay)}
.mrow .mp{color:var(--accent)}
.mrow::before{background:var(--gold)}

/* ── "BOOK YOUR CHARTER TODAY!" ── */
.book .bookgrid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(30px,5vw,72px);align-items:start}
.book .bookgrid>*{min-width:0}
.book h2{margin:0}
.booktel{display:inline-block;font-family:var(--serif);font-size:clamp(2.3rem,4.6vw,3.4rem);color:var(--bay);text-decoration:none;
  margin:6px 0 16px;padding:4px 0;white-space:nowrap;letter-spacing:.02em}
.booktel:hover{color:var(--accent)}
body.light .book .form{background:#fff;border-color:rgba(0,93,144,.14);box-shadow:0 30px 60px -36px rgba(0,50,85,.55)}
@media(max-width:900px){.book .bookgrid{grid-template-columns:minmax(0,1fr)}}

/* ── buttons: his gold, with a dark label (white on #F7A703 fails contrast) ── */
body.light .btn-accent,.bookbar .b1,.chatact .p,.msg.me,.chatform button{background:var(--gold);color:#062B45;
  box-shadow:0 12px 26px -14px rgba(200,130,0,.8)}
body.light .btn-accent:hover{background:#FFBB2E;color:#062B45}
body.light .btn-out{border-color:var(--bay);color:var(--bay)}
body.light .btn-out:hover{background:var(--bay);color:#fff}
body.light .fld label{color:#0A6E74}
body.light .fld input:focus,body.light .fld select:focus,body.light .fld textarea:focus{border-color:var(--bay);box-shadow:0 0 0 3px rgba(0,93,144,.14)}
body.light .note{border-left-color:var(--gold)}
body.light .eyebrow{color:#0A6E74}
body.light .faq summary{font-family:var(--serif);text-transform:uppercase;letter-spacing:.03em;font-weight:400;color:var(--bay)}
body.light .faq summary::after{border-color:var(--gold)}
main p a:not(.btn):not(.pill),.faq .ans a,.note a,.fnote a,.lede a{padding:15px 0;box-sizing:content-box;
  color:var(--bay);text-decoration:underline;text-decoration-color:rgba(247,167,3,.8);text-underline-offset:3px;text-decoration-thickness:2px}
.hero .sub a,.pbanner .lede a{color:#fff}
.faq .ans p{max-width:36em}
.note{max-width:62ch}

/* ── contact ── */
.bigtel{font-size:clamp(2.3rem,5vw,3.6rem);margin:0}
.bigtel a{color:var(--bay);text-decoration:none;display:inline-block;padding:4px 0}
.ilines{margin:22px 0 10px}
.iline a{margin:0;padding:9px 0;min-height:0}
.iline>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.iline{flex-wrap:wrap}
.iline a{overflow-wrap:anywhere}
.mapwrap{aspect-ratio:4/3}
.mapwrap iframe{width:100%;height:100%;border:0}
@media(max-width:600px){.mapwrap{aspect-ratio:3/2}}

/* ── footer: his blue band, his logo ── */
.foot,body.light .foot{background:var(--bay)!important;border-top:4px solid var(--gold);color:rgba(255,255,255,.9)}
.foot .flogo{width:112px;height:auto;margin:0 0 18px;display:block}
.foot a.fphone{white-space:nowrap;font-family:var(--serif);font-weight:500;font-size:clamp(2rem,3.6vw,2.8rem);color:#fff}
.foot a.fphone:hover{color:var(--logo)}
.foot .fclose{font-family:var(--sans);font-size:clamp(1.08rem,1.5vw,1.25rem);line-height:1.55;font-weight:400;color:#fff}
.foot h4{font-family:var(--serif);color:var(--logo)!important;letter-spacing:.16em}
.foot a:not(.btn){color:rgba(255,255,255,.92)}
.foot a.btn-accent,.foot a.btn-accent:hover{color:#062B45}
.foot .btn-out{border-color:rgba(255,255,255,.6);color:#fff}
.foot .btn-out:hover{background:#fff;color:var(--bay)}
.foot .fbot{border-top-color:rgba(255,255,255,.22);color:rgba(255,255,255,.82)}
.foot .fhours span{color:rgba(255,255,255,.8)}

/* ── the book bar (phones) and the chat, in his blue and gold ── */
.bookbar{background:rgba(0,93,144,.97);border-top:3px solid var(--gold);gap:8px;padding-left:12px;padding-right:12px}
.bookbar a{border-radius:var(--btn-r)}
.bookbar .b1{flex:1 1 auto;font-family:var(--serif);letter-spacing:.06em}
.bookbar .b2,.bookbar .b3{flex:0 0 68px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;padding:7px 4px;min-height:54px;border:1px solid rgba(255,255,255,.55);border-radius:var(--btn-r);
  background:transparent;color:#fff;font-family:var(--serif);font-size:13px;font-weight:500;
  letter-spacing:.06em;text-transform:uppercase;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
.bookbar .b2 svg,.bookbar .b3 svg{width:20px;height:20px;flex:0 0 20px}
.bookbar .b3[aria-expanded="true"]{border-color:var(--gold);color:var(--logo)}
.bookbar .b3{display:none}
body.chat-ready .bookbar .b3{display:flex}
@media(max-width:760px){body.menu-open .bookbar,body.menu-open .chatfab,body.menu-open .chattag{display:none}}

.chatpanel{color:rgba(255,255,255,.94);background:linear-gradient(168deg,#0B5A8A,#063A5E);border-color:rgba(247,167,3,.5);
  border-radius:14px;max-height:min(640px,calc(100dvh - 120px));
  visibility:hidden;transition:opacity .28s cubic-bezier(.2,.7,.3,1),transform .28s cubic-bezier(.2,.7,.3,1),visibility 0s linear .28s}
body.chat-open .chatpanel{visibility:visible;transition-delay:0s}
.chathead{background:rgba(255,255,255,.06);border-bottom-color:rgba(247,167,3,.3);padding:12px 12px 12px 16px}
.chathead .mk img{width:40px;height:40px;display:block}
.chathead .ct{flex:1;min-width:0}
.chathead .ct b{font-family:var(--serif);text-transform:uppercase;letter-spacing:.05em;font-weight:500}
.chathead .ct>span{font-size:13.5px;color:rgba(255,255,255,.8);margin-top:3px}
.chatx{flex:0 0 44px;width:44px;height:44px;display:grid;place-items:center;padding:0;cursor:pointer;
  border-radius:var(--btn-r);border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff}
.chatx:hover,.chatx:focus-visible{border-color:var(--gold);color:var(--logo);outline:none}
.msg{font-size:16px}
.msg.bot{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#fff}
.msg a{color:var(--logo)}
.chips{padding:2px 18px 14px}
.chips button{font-size:15px;color:#fff;background:rgba(255,255,255,.06);border-color:rgba(247,167,3,.55);border-radius:var(--btn-r);padding:10px 14px;min-height:44px}
.chips button:hover,.chips button:focus-visible{background:rgba(247,167,3,.2);border-color:var(--gold);outline:none}
.chatact a{border-radius:var(--btn-r);font-size:13px;letter-spacing:.06em;padding:12px 10px;white-space:nowrap;
  min-height:46px;display:flex;align-items:center;justify-content:center;gap:8px}
.chatact a svg{width:17px;height:17px;flex:0 0 17px}
.chatact .s{border-color:rgba(255,255,255,.5);color:#fff}
.chatform{border-top-color:rgba(255,255,255,.18);background:rgba(0,0,0,.14)}
.chatform input{font-size:16px;color:#fff;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3);border-radius:var(--btn-r)}
.chatform input::placeholder{color:rgba(255,255,255,.7)}
.chatform input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(247,167,3,.25)}
.chatform button{flex:0 0 48px;width:48px;height:48px;border-radius:var(--btn-r)}
body.light .chatpanel .chatnote{font-size:13px;color:rgba(255,255,255,.8);padding:2px 18px 14px;line-height:1.45}
.chatfab{background:var(--bay);border:2px solid var(--gold);color:#fff;box-shadow:0 18px 40px -16px rgba(0,40,70,.7)}
.chatfab:hover{background:#0B6AA2}
.chattag{background:var(--bay);border-color:var(--gold);color:#fff}
.chatscrim{display:none}
@media(max-width:760px){
  .chatfab,.chattag{display:none!important}
  .chatscrim{display:block;position:fixed;inset:0;z-index:80;background:rgba(0,40,66,.55);opacity:0;pointer-events:none;transition:opacity .25s ease}
  body.chat-open .chatscrim{opacity:1;pointer-events:auto}
  body.chat-open{overflow:hidden}
  body.chat-open .bookbar{display:none}
  .chatpanel{left:0;right:0;top:auto;bottom:0;width:auto;height:min(88dvh,720px);max-height:none;
    border-radius:18px 18px 0 0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom);transform:translateY(28px)}
  body.chat-open .chatpanel{transform:none}
  .chatbody{overscroll-behavior:contain;padding:16px}
  .chips{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:2px 16px 12px;
    -webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}
  .chips::-webkit-scrollbar{display:none}
  .chips button{flex:0 0 auto;white-space:nowrap}
  .chatact{padding:0 16px 12px}
  .chatform{padding:12px 14px}
}

/* ── grid columns must be allowed to shrink (form controls push a column past a 320px screen) ── */
.split{grid-template-columns:minmax(0,1.02fr) minmax(0,1fr)}
.split>*,.frow>*{min-width:0}
.frow{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media(max-width:900px){.split{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){.frow{grid-template-columns:minmax(0,1fr)}.pcard .bd p{font-size:15px}}
@media(max-width:640px){.ncta .btn{padding:12px 14px}}
@media(max-width:560px){.ncta .btn{display:none}}
.vcap{font-size:15px}

/* ── gentle motion: sections rise into place; every start state is readable ── */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .shead,.split>div,.feat,.cgc article,.season,.species figure,.nums>div,.inn,.rvw,.wall figure,.faq details,.bookgrid>*{
      animation:ca-rise linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
    @keyframes ca-rise{from{opacity:.55;transform:translateY(22px)}to{opacity:1;transform:none}}
    .bleed>img{animation:ca-settle linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
    @keyframes ca-settle{from{transform:scale(1.12) translateY(-3%)}to{transform:scale(1.02) translateY(3%)}}
  }
}

/* ══ THE REPORT (/report), on paper ══ */
.rep{max-width:860px}
.rep .score{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,24px);margin-bottom:48px}
.rep .score>div{padding:22px 0 0;border-top:3px solid var(--gold)}
.rep .score b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2.2rem,4vw,3.2rem);line-height:1;margin-bottom:10px;color:var(--bay)}
.rep .score span{font-size:15px;color:var(--muted);line-height:1.45}
@media(max-width:760px){.rep .score{grid-template-columns:repeat(2,minmax(0,1fr))}}
.rep .rh{font-size:clamp(1.6rem,3vw,2.2rem);margin:52px 0 18px}
.rep .finding{border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:6px;padding:24px 26px;margin-bottom:16px;background:#fff;
  box-shadow:0 18px 40px -32px rgba(0,50,85,.5)}
.rep .finding.good-f{border-left-color:#2E8B57}
.rep .finding h3{font-size:1.3rem;margin-bottom:8px;color:var(--bay)}
.rep .finding .k{font-family:var(--serif);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#0A6E74;display:block;margin-bottom:8px}
.rep .finding.good-f .k{color:#1E7A3A}
.rep .finding p{max-width:64ch;font-size:17px}
.rep table{width:100%;border-collapse:collapse;font-size:16px;margin:8px 0 4px;table-layout:fixed;background:#fff}
.rep td,.rep th{padding:13px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;overflow-wrap:anywhere}
.rep th{font-family:var(--serif);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#0A6E74;font-weight:500}
.rep td:first-child{color:var(--ink);width:34%}
.rep .bad,.rep .score b.bad{color:#B3361E}.rep .good{color:#1E7A3A}
.rsteps{list-style:none;padding:0;margin:0;counter-reset:s;display:grid;gap:14px}
.rsteps li{counter-increment:s;display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;align-items:start}
.rsteps li>div{min-width:0}
.rsteps li::before{content:counter(s);width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--serif);font-size:1.4rem;color:#062B45;background:var(--gold)}
.rsteps h3{font-size:1.2rem;margin-bottom:4px;color:var(--bay)}
.rsteps p{font-size:17px;max-width:60ch}
@media(max-width:640px){.rep td,.rep th{padding:11px 6px;font-size:15px}.rep td:first-child{width:30%}}

@media print{
  .nav,.drawer,.bookbar,.chatfab,.chattag,.chatpanel,.pbanner .bimg,.foot .btns,body::before,body::after,.sec::before,.sec::after{display:none!important}
  .pbanner,.hero,main{margin-top:0!important}
  .pbanner{min-height:0!important;padding:0!important;background:var(--bay)!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pbanner-in{padding:32px 0 22px!important}
  .sec{padding:16px 0!important}
  .rep .finding{break-inside:avoid;box-shadow:none}
  .fgrid>div:not(.fbrand){display:none!important}
}

/* small yellow type on the blue band: his logo yellow lifted a step (#E3D858 reads 4.8:1 on #005D90) */
.nav .w2,body.light .nav .w2,.foot h4,.nav .nlinks a:hover,.nav .nlinks a[aria-current]{color:#F7F2B8!important}
/* Oswald is condensed, so 17px reads small next to the kit's usual faces. One step up. */
.nav .nlinks a,.nav .nphone,body.light .nav .nlinks a,body.light .nav .nphone{font-size:18px!important}
body.light .drawer a{font-size:24px}
.cgc h3 span{display:inline-block}
.pbanner .crumbs a,main .pbanner p.crumbs a:not(.btn){color:#fff;text-decoration-color:rgba(247,167,3,.9)}