/* ============================================================
   The Lake Norman Ice Cream Boat - "Decal & Lake Day" system
   One file, every page. Colors come from the actual boat:
   bubblegum hull, bimini blue, teal rubrail, vanilla, noon sky.
   Design language: die-cut boat decals. Callouts, cards, and
   badges read as stickers: white cut edge, tiny hard shadow,
   a degree or two of tilt. Everything else stays calm water.
   ============================================================ */

/* ---------- fonts: self-hosted, latin subsets, ~88KB total ---------- */
@font-face{font-family:'Fredoka';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../fonts/fredoka-var-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:400 900;font-display:swap;
  src:url(../fonts/nunito-var-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;}
@font-face{font-family:'Pacifico';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/pacifico-var-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;}

/* ---------- tokens ---------- */
:root{
  /* sky + water, 1:30pm on the lake */
  --sky1:#5FB2DE; --sky2:#8FCDEA; --sky3:#C6E9F8; --sky4:#E8F6FD;
  --page:#EAF6FC; --vanilla:#FFF8EC; --panel:#ffffff; --line:#CFE4F0;
  /* ink */
  --ink:#17334A; --soft:#44647D; --faint:#4F6F88; --deep:#0E2E47;
  /* the boat */
  --pink:#E85D8F; --pink-d:#B93365; --hull:#F27FA8;
  --mint:#1FA98F; --teal:#45C4B0; --bimini:#2F6FD0;
  --waffle:#8F5509; --sun:#FFD166;
  /* closing time (footer) */
  --navy:#12283A; --navy-line:#2C4A63;
  /* type */
  --display:'Fredoka',ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold","Avenir Next",-apple-system,sans-serif;
  --body:'Nunito',-apple-system,system-ui,"Segoe UI",Roboto,sans-serif;
  --script:'Pacifico',"Snell Roundhand","Segoe Script","Brush Script MT",cursive;
  color-scheme:light;
}

/* ---------- base ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
:focus-visible{outline:3px solid var(--bimini);outline-offset:3px;border-radius:6px}
body{background:var(--page);color:var(--ink);font-family:var(--body);font-weight:500;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.08;letter-spacing:0;text-wrap:balance}
p{max-width:58ch}
img{max-width:100%}
.wrap{max-width:1020px;margin:0 auto;padding:0 24px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.eyebrow{font-family:var(--display);font-size:.74rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--waffle);font-weight:600}
.script{font-family:var(--script);font-weight:400}

/* ---------- sticker language ---------- */
/* A decal: white die-cut edge, hairline of shadow behind the cut,
   a small hard drop like vinyl on a hull. */
.stk{position:relative;background:var(--panel);border-radius:18px;
  box-shadow:0 0 0 3.5px #fff,0 0 0 4.5px rgba(23,51,74,.10),0 12px 26px -14px rgba(23,51,74,.38)}
.tilt-l{transform:rotate(-1.3deg)}
.tilt-r{transform:rotate(1.1deg)}
a.stk,button.stk{transition:transform .18s ease,box-shadow .18s ease}
a.stk:hover,button.stk:hover{transform:rotate(0deg) translateY(-3px)}
.badge{display:inline-block;font-family:var(--display);font-weight:600;font-size:.8rem;padding:9px 16px;
  border-radius:14px;box-shadow:0 0 0 3.5px #fff,0 0 0 4.5px rgba(23,51,74,.10),0 10px 20px -10px rgba(23,51,74,.4)}

/* ---------- nav ---------- */
.nav{position:relative;z-index:6;display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;padding:18px 24px}
.nav-brand{display:flex;align-items:center;gap:9px;font-family:var(--script);
  font-size:clamp(1.02rem,2.9vw,1.35rem);line-height:1.4;color:var(--deep);text-decoration:none}
.nav-brand .ic{font-size:1.25rem}
.nav-links{display:flex;gap:8px;flex-wrap:wrap}
.nav-links a{display:inline-flex;align-items:center;min-height:44px;
  font-family:var(--display);font-weight:600;font-size:.82rem;color:var(--ink);text-decoration:none;
  background:rgba(255,255,255,.78);border:1px solid rgba(23,51,74,.16);backdrop-filter:blur(6px);
  border-radius:100px;padding:6px 16px;transition:transform .15s ease,background .15s ease}
.nav-links a:hover{transform:translateY(-2px);background:#fff}
.nav-links a[aria-current="page"]{background:var(--deep);color:#fff;border-color:var(--deep)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:1.02rem;
  text-decoration:none;padding:16px 28px;border-radius:100px;cursor:pointer;border:0;
  transition:transform .16s ease,box-shadow .16s ease}
/* raspberry, not bubblegum: white text needs 4.5:1 on the LIGHT stop too */
.btn.solid{background:linear-gradient(135deg,#CD4074,var(--pink-d));color:#fff;
  box-shadow:0 0 0 3px #fff,0 14px 30px -10px var(--pink-d)}
.btn.ghost{background:rgba(255,255,255,.8);color:var(--ink);border:1.5px solid rgba(23,51,74,.28);backdrop-filter:blur(6px)}
.btn.mint{background:linear-gradient(135deg,var(--teal),var(--mint));color:#04332A;
  box-shadow:0 0 0 3px #fff,0 14px 30px -10px rgba(31,169,143,.7)}
.btn:hover{transform:translateY(-2px)}

/* ---------- page hero (subpages) ---------- */
.page-hero{position:relative;background:linear-gradient(180deg,var(--sky1),var(--sky2) 55%,var(--sky3));
  padding-bottom:8px;overflow:hidden}
.page-hero .cloud{position:absolute;background:#fff;opacity:.5;border-radius:100px;filter:blur(2px)}
.page-hero .c1{width:150px;height:34px;top:24%;left:6%}
.page-hero .c2{width:90px;height:24px;top:14%;right:12%}
.ph-copy{position:relative;z-index:2;text-align:center;padding:42px 24px 74px}
.ph-copy .script{display:block;font-size:clamp(1.15rem,3vw,1.6rem);color:var(--deep);margin-bottom:10px}
.ph-copy h1{font-size:clamp(2.1rem,6vw,3.4rem);color:var(--ink);text-shadow:0 2px 22px rgba(255,255,255,.55)}
.ph-copy p{margin:12px auto 0;color:var(--deep);font-weight:600;max-width:46ch}
.ph-waves{display:block;width:100%;height:56px;margin-bottom:-1px}

/* ---------- sections ---------- */
main{display:block}
section.blk{padding:78px 0;position:relative}
.sec-head{text-align:center;margin-bottom:42px}
.sec-head .eyebrow{display:block;margin-bottom:12px}
.sec-head h2{font-size:clamp(1.9rem,4.8vw,2.9rem)}
.sec-head p{margin:14px auto 0;color:var(--soft)}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .7s cubic-bezier(.16,.8,.24,1),transform .7s cubic-bezier(.16,.8,.24,1)}
.reveal.in{opacity:1;transform:none}
.divider{display:block;width:100%;height:70px;margin-bottom:-1px}

/* ---------- menu cards (flip decals) ---------- */
.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.mcard{position:relative;perspective:1100px;min-height:340px;cursor:pointer;outline-offset:4px}
.mc-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.7,.25,1)}
.mcard.flipped .mc-inner{transform:rotateY(180deg)}
.mc-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  background:var(--panel);border-radius:20px;padding:20px;display:flex;flex-direction:column;
  box-shadow:0 0 0 3.5px #fff,0 0 0 4.5px rgba(23,51,74,.10),0 14px 28px -16px rgba(23,51,74,.4)}
.mc-front{transition:transform .18s ease}
.mcard:nth-child(3n+1) .mc-front{transform:rotate(-1deg)}
.mcard:nth-child(3n) .mc-front{transform:rotate(.9deg)}
.mcard:not(.flipped):hover .mc-front{transform:rotate(0deg) translateY(-4px)}
.mc-img{width:96px;height:96px;object-fit:contain;border-radius:14px;background:var(--vanilla);padding:8px}
.mcard h3{font-size:1.12rem;margin:12px 0 4px}
.mcard .mdesc{color:var(--soft);font-size:.92rem;flex:1}
.mc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
.mcard .mprice{font-family:var(--display);font-weight:600;font-size:1.1rem;color:var(--waffle)}
.flip-hint{font-family:var(--display);font-size:.68rem;font-weight:600;color:var(--faint);letter-spacing:.06em}
.mcard .flag{position:absolute;top:12px;right:12px;font-family:var(--display);font-size:.64rem;font-weight:600;
  letter-spacing:.1em;background:var(--pink-d);color:#fff;border-radius:100px;padding:5px 11px;
  transform:rotate(4deg);z-index:1;box-shadow:0 0 0 3px #fff}
/* back = the actual back of the wrapper: white label, rule lines */
.mc-back{transform:rotateY(180deg);overflow-y:auto;padding:18px 20px;background:#fff;border:1.5px solid var(--ink)}
.mc-back h3{font-size:.98rem;margin:0 0 10px;border-bottom:3px solid var(--ink);padding-bottom:6px}
.al-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.al-chip{font-family:var(--display);font-size:.7rem;font-weight:600;padding:4px 10px;border-radius:100px;
  background:#FCE4EE;border:1px solid var(--pink);color:#A02A56}
.al-chip.none{background:#E2F6F1;border-color:var(--mint);color:#0B6355}
.nf-row{display:flex;justify-content:space-between;border-bottom:1px solid #DDE9F1;padding:5px 0;font-size:.82rem}
.nf-row .k{color:var(--soft)}
.nf-row .v{font-family:var(--display);font-weight:600;color:var(--deep)}
.nf-may{color:var(--soft);font-size:.74rem;margin-top:10px;font-style:italic}
.nf-fine{color:var(--faint);font-size:.7rem;margin-top:8px;border-top:1px dashed var(--line);padding-top:8px}
.ing-btn{display:block;width:100%;min-height:44px;margin-top:10px;font-family:var(--display);font-weight:600;font-size:.74rem;
  background:#F1F8FC;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:9px 10px;cursor:pointer}
.ing-btn:hover{background:#E3F1FA}
.ing-txt{font-size:.72rem;color:var(--soft);margin-top:8px;line-height:1.55}
.ing-txt b{color:var(--deep)}
.menu-note{text-align:center;color:var(--faint);font-size:.85rem;margin-top:26px}
/* menu filters */
.filter-row{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.filter-btn{min-height:44px;font-family:var(--display);font-weight:600;font-size:.82rem;color:var(--ink);cursor:pointer;
  background:#fff;border:1.5px solid var(--line);border-radius:100px;padding:10px 18px;transition:all .15s ease}
.filter-btn:hover{border-color:var(--bimini)}
.filter-btn[aria-pressed="true"]{background:var(--deep);border-color:var(--deep);color:#fff}

/* ---------- steps / boxes / schedule ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:step}
.step{background:var(--panel);border-radius:20px;padding:28px 24px 24px;position:relative;
  box-shadow:0 0 0 3.5px #fff,0 0 0 4.5px rgba(23,51,74,.10),0 14px 28px -16px rgba(23,51,74,.4)}
.step::before{counter-increment:step;content:counter(step);position:absolute;top:-18px;left:20px;width:40px;height:40px;
  border-radius:50%;display:grid;place-content:center;font-family:var(--display);font-weight:600;font-size:1.05rem;
  background:var(--teal);color:#04332A;box-shadow:0 0 0 4px #fff,0 8px 18px -6px rgba(69,196,176,.55)}
.step h3{font-size:1.12rem;margin:8px 0}
.step p{color:var(--soft);font-size:.94rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.box{background:var(--panel);border-radius:20px;padding:28px;
  box-shadow:0 0 0 3.5px #fff,0 0 0 4.5px rgba(23,51,74,.10),0 14px 28px -16px rgba(23,51,74,.4)}
.box h3{font-size:1.3rem;margin-bottom:14px}
.box p{color:var(--soft);font-size:.95rem}
.box .btn{margin-top:18px}
.sched-row{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--line);
  padding:10px 2px;font-size:.98rem}
.sched-row:last-child{border-bottom:0}
.sched-row .d{color:var(--soft)}
.sched-row .h{font-family:var(--display);font-weight:600;color:var(--deep);text-align:right}
.confirm{color:var(--faint);font-size:.8rem;font-style:italic}

/* ---------- FAQ ---------- */
.faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:16px}
.faq-list details{background:var(--panel);border-radius:18px;
  box-shadow:0 0 0 3.5px #fff,0 0 0 4.5px rgba(23,51,74,.10),0 12px 24px -16px rgba(23,51,74,.35)}
.faq-list summary{font-family:var(--display);font-weight:600;font-size:1.05rem;padding:18px 52px 18px 22px;
  cursor:pointer;list-style:none;position:relative;border-radius:18px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);
  font-family:var(--display);font-weight:600;font-size:1.4rem;color:var(--pink-d);transition:transform .2s ease}
.faq-list details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq-list details p{padding:0 22px 20px;color:var(--soft)}
.faq-list details p a{color:var(--bimini);font-weight:700}

/* ---------- pricing (parties) ---------- */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch}
.price-card{background:var(--panel);border-radius:20px;padding:28px 24px;display:flex;flex-direction:column;gap:10px;
  box-shadow:0 0 0 3.5px #fff,0 0 0 4.5px rgba(23,51,74,.10),0 14px 28px -16px rgba(23,51,74,.4)}
.price-card .amt{font-family:var(--display);font-weight:600;font-size:2rem;color:var(--pink-d)}
.price-card .amt small{font-size:.9rem;color:var(--soft);font-weight:600}
.price-card h3{font-size:1.1rem}
.price-card p{color:var(--soft);font-size:.92rem;flex:1}
.price-card .tag-best{align-self:flex-start;font-family:var(--display);font-size:.64rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;background:var(--sun);color:#3a2503;border-radius:100px;padding:4px 11px}

/* ---------- about / photo ---------- */
.about-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}
.about-copy p{color:var(--soft);margin-bottom:14px}
.about-copy p b{color:var(--deep)}
.photo-stk{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 58%;border-radius:20px;display:block;
  box-shadow:0 0 0 5px #fff,0 0 0 6px rgba(23,51,74,.12),0 20px 44px -18px rgba(0,0,0,.5)}

/* ---------- footer ---------- */
footer{background:var(--navy);border-top:1px solid var(--navy-line);padding:54px 0 40px;margin-top:30px;
  color:#F4F9FC;--soft:#B8CCDD;--faint:#9DB4C8;--deep:#FFE9C9;--line:var(--navy-line);--waffle:#F7B267}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:26px;align-items:start}
.foot-brand{font-family:var(--script);font-size:1.25rem;line-height:1.5}
.foot-brand .ic{margin-right:8px}
footer p,footer a{color:var(--soft);font-size:.92rem;text-decoration:none}
footer a:hover{color:var(--deep)}
.foot-list{display:flex;flex-direction:column;gap:9px;margin-top:10px}
.credit{text-align:center;color:var(--faint);font-size:.78rem;margin-top:40px}
.credit a{color:var(--faint);text-decoration:underline}

/* ---------- responsive ---------- */
@media(max-width:860px){
  .split,.about-grid,.price-grid{grid-template-columns:1fr}
  .menu-grid,.steps{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .menu-grid,.steps{grid-template-columns:1fr}
  section.blk{padding:60px 0}
  .nav{padding:14px 16px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .mc-inner{transition:none}
  .btn,.nav-links a,a.stk,button.stk{transition:none}
}