/* WholeVoyage — sun-soaked tropical travel-poster theme (bright, whimsical, high-contrast) */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&display=swap');
:root{
  --sea-deep:#063a4a; --sea:#0e7c8b; --lagoon:#15b3b3; --sky:#aee9e4;
  --sand:#fcf2db; --sand2:#f4e6c4; --cream:#fffaf0;
  --ink:#123230; --ink-dim:#4f6660;
  --coral:#f2683f; --coral-d:#cf4b27; --sun:#f6b73c; --sun-d:#a9730c; --palm:#2f9e6a; --palm-d:#1f7d52;
  --text:#fdf6e6; --dim:#c4e3de;
  --line-l:#e7d3a6; --line:#1d5a68; --link:#0b6b78;
  --disp:'Fraunces',Georgia,serif; --sans:'Hanken Grotesk',system-ui,sans-serif; --mono:'JetBrains Mono',monospace; --script:'Caveat',ui-rounded,cursive;
  --r:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:108px}
body{font-family:var(--sans);font-weight:400;background:var(--sand);color:var(--ink);line-height:1.7;font-size:17px;-webkit-font-smoothing:antialiased}
.wrap{max-width:1000px;margin:0 auto;padding:0 26px}
a{color:var(--link);text-decoration-color:rgba(11,107,120,.35);text-underline-offset:2px}
a:hover{text-decoration-color:var(--coral)}
h1,h2,h3{font-family:var(--disp);font-weight:500;line-height:1.06;letter-spacing:-.01em;color:var(--ink)}
a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--coral);outline-offset:2px;border-radius:5px}
.kick{font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--coral-d);font-weight:500}
.confbar{background:var(--sea-deep);color:var(--sun);font-family:var(--mono);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;text-align:center;padding:7px}

/* NAV */
nav{position:sticky;top:0;z-index:50;background:rgba(6,58,74,.96);backdrop-filter:blur(10px);border-bottom:2px solid var(--lagoon)}
nav .in{max-width:1000px;margin:0 auto;padding:11px 26px;display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap}
nav .b{font-family:var(--disp);font-weight:600;color:#fff;font-size:1.15rem;text-decoration:none}
nav .b span{color:var(--sun)}
nav .lk{display:flex;gap:16px;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;flex-wrap:wrap}
nav .lk a{color:var(--sky);text-decoration:none;padding:3px 2px}
nav .lk a:hover,nav .lk a.here{color:var(--sun)}

/* COVER — sunset sun over a turquoise sea */
.cover{position:relative;color:var(--text);padding:104px 0 86px;overflow:hidden;
  background:
   radial-gradient(circle at 50% 20%, #ffd874 0 6%, rgba(246,183,60,.92) 6% 9.5%, rgba(246,183,60,0) 34%),
   linear-gradient(180deg,#ffc98a 0%, #f2914f 13%, #1f93a0 40%, #0e7c8b 60%, #063a4a 100%);}
.cover::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.55;
  background:repeating-conic-gradient(from 0deg at 50% 20%, rgba(255,243,205,.22) 0deg 5deg, transparent 5deg 15deg);
  -webkit-mask:radial-gradient(circle at 50% 20%, #000 0 26%, transparent 60%);mask:radial-gradient(circle at 50% 20%, #000 0 26%, transparent 60%)}
.cover::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:54px;background-repeat:no-repeat;background-size:cover;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 54' preserveAspectRatio='none'%3E%3Cpath fill='%23fcf2db' d='M0 30 C120 8 260 8 420 24 C600 42 760 50 940 30 C1060 16 1140 16 1200 26 L1200 54 L0 54 Z'/%3E%3C/svg%3E");}
.cover .wrap{position:relative;z-index:2}
.cover .eyebrow{font-family:var(--mono);font-size:.76rem;letter-spacing:.26em;text-transform:uppercase;color:#fff2cf;font-weight:500}
.cover h1{font-size:clamp(2.5rem,7.5vw,4.8rem);color:#fff;margin:.12em 0;text-shadow:0 3px 26px rgba(6,40,52,.55)}
.cover h1 em{font-style:italic;color:var(--sun)}
.cover .deck{font-size:1.18rem;color:#f4fbf9;max-width:60ch;margin-top:10px;text-shadow:0 1px 12px rgba(6,40,52,.4)}
.target{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.tcard{background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.4);border-radius:var(--r);padding:16px 20px;min-width:140px;backdrop-filter:blur(4px)}
.tcard b{display:block;font-family:var(--disp);font-size:2rem;color:#fff;line-height:1}
.tcard span{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:#eafff9;margin-top:5px;display:block}

/* SECTIONS + whimsical wave dividers on the sea (dark) sections */
section{padding:58px 0;border-bottom:0}
section:not(.dark)+section:not(.dark){border-top:1px solid var(--line-l)}
section.dark{position:relative;background:linear-gradient(180deg,#0a525f,#04303a);color:var(--text);padding:92px 0;margin:0}
section.dark::before{content:"";position:absolute;top:-1px;left:0;right:0;height:46px;background-size:cover;background-repeat:no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 46' preserveAspectRatio='none'%3E%3Cpath fill='%23fcf2db' d='M0 0 L1200 0 L1200 18 C1040 40 920 40 760 24 C580 6 420 4 240 20 C140 29 60 30 0 22 Z'/%3E%3C/svg%3E");}
section.dark::after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:46px;background-size:cover;background-repeat:no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 46' preserveAspectRatio='none'%3E%3Cpath fill='%23fcf2db' d='M0 46 L1200 46 L1200 24 C1040 4 900 6 740 22 C560 40 400 42 220 26 C130 17 60 16 0 24 Z'/%3E%3C/svg%3E");}
section.dark h2,section.dark h3{color:#fff}section.dark p{color:var(--dim)}section.dark a{color:var(--sun)}
section.dark .wrap{position:relative;z-index:1}
h2{font-size:clamp(1.7rem,4.2vw,2.7rem);margin-bottom:10px;position:relative}
h2::after{content:"";display:block;width:62px;height:9px;margin-top:10px;background-repeat:repeat-x;background-size:22px 9px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='9'%3E%3Cpath d='M0 6 Q5.5 0 11 6 T22 6' fill='none' stroke='%23f2683f' stroke-width='2.4'/%3E%3C/svg%3E");}
section.dark h2::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='9'%3E%3Cpath d='M0 6 Q5.5 0 11 6 T22 6' fill='none' stroke='%23f6b73c' stroke-width='2.4'/%3E%3C/svg%3E");}
h3{font-size:1.22rem;margin:16px 0 6px}
.lead{font-family:var(--script);font-weight:700;font-size:clamp(1.8rem,4.4vw,2.7rem);line-height:1.12;color:var(--coral-d);max-width:24ch;transform:rotate(-1.2deg)}
section.dark .lead{color:var(--sun)}
p{margin:12px 0}p strong{font-weight:600;color:var(--ink)}section.dark p strong{color:#fff}
.two{display:grid;grid-template-columns:1fr 1fr;gap:30px}@media(max-width:760px){.two{grid-template-columns:1fr}}

/* playful principle / playbook cards */
.play{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:24px}@media(max-width:720px){.play{grid-template-columns:1fr}}
.pc{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:var(--r);padding:18px 20px;transition:transform .2s}
.pc:hover{transform:translateY(-3px)}
.pc .yr{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;color:var(--sun)}
.pc h3{margin:3px 0 6px;color:#fff}.pc .then{font-size:.95rem;color:var(--dim)}
.pc .now{font-size:.96rem;color:#eafff9;margin-top:8px}.pc .now b{color:var(--sun);font-weight:600}

/* tables */
table{width:100%;border-collapse:collapse;margin:18px 0;font-size:.94rem}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line-l)}
section.dark th,section.dark td{border-bottom:1px solid rgba(255,255,255,.16)}
section.dark td{color:#eafff9}
th{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim)}
section.dark th{color:var(--sky)}
td.n{font-family:var(--mono);text-align:right;white-space:nowrap}
tr.tot td{font-weight:700;border-top:2.5px solid var(--coral);color:var(--ink)}section.dark tr.tot td{color:#fff;border-top-color:var(--sun)}
.note{font-size:.88rem;color:var(--ink-dim)}section.dark .note{color:var(--dim)}
.tag{display:inline-block;font-family:var(--mono);font-size:.6rem;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:999px;font-weight:500}
.ok{background:rgba(47,158,106,.18);color:var(--palm-d);border:1px solid rgba(47,158,106,.5)}
.av{background:rgba(246,183,60,.22);color:var(--sun-d);border:1px solid rgba(246,183,60,.55)}
.no{background:rgba(207,75,39,.12);color:var(--coral-d);border:1px solid rgba(207,75,39,.35)}

/* chart */
.chart{background:#fff;border:1px solid var(--line-l);border-radius:var(--r);padding:22px;margin-top:20px;box-shadow:0 14px 36px -26px rgba(6,58,74,.5)}
section.dark .chart{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2);box-shadow:none}
.chart svg{width:100%;height:auto;display:block}
.legend{display:flex;gap:18px;flex-wrap:wrap;font-family:var(--mono);font-size:.66rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-dim);margin-top:12px}
section.dark .legend{color:var(--dim)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:6px;vertical-align:middle}

/* roadmap */
.road{list-style:none;margin-top:22px;border-left:3px solid var(--sun);padding-left:24px}
.road li{position:relative;padding:0 0 28px 8px}
.road li::before{content:"";position:absolute;left:-32px;top:3px;width:15px;height:15px;border-radius:50%;background:var(--coral);border:3px solid #fff;box-shadow:0 0 0 2px var(--coral)}
.road .when{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--sun)}
.road h3{margin:2px 0 4px;color:#fff}
.road ul{margin:8px 0 0 0;padding-left:18px}.road ul li{padding:2px 0;list-style:none;color:var(--dim);position:relative}
.road ul li::before{content:"\2192";position:absolute;left:-16px;top:2px;color:var(--lagoon);font-size:.9em;border:0;background:none;width:auto;height:auto;box-shadow:none}
.road .tgt{font-family:var(--mono);font-size:.72rem;color:var(--sky);margin-top:6px}

/* videos */
.vgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:22px}@media(max-width:720px){.vgrid{grid-template-columns:1fr}}
.v .vf{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;border:2px solid rgba(255,255,255,.25);background:#000;box-shadow:0 16px 40px -24px rgba(0,0,0,.7)}
.v .vf iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.v figcaption{font-family:var(--mono);font-size:.72rem;letter-spacing:.03em;color:var(--ink-dim);margin-top:9px}
section.dark .v figcaption{color:var(--dim)}

/* daily log */
.log{border-left:3px solid var(--lagoon);padding-left:20px;margin-top:18px}.log .e{margin-bottom:18px}.log .d{font-family:var(--mono);font-size:.72rem;color:var(--sun);letter-spacing:.06em}
footer{background:var(--sea-deep);color:var(--dim);padding:42px 0 72px;font-size:.88rem}footer b{color:var(--sun)}
.split{display:inline-flex;gap:8px;align-items:center;background:rgba(246,183,60,.16);border:1px solid var(--sun);border-radius:999px;padding:6px 14px;font-family:var(--mono);font-size:.72rem;color:var(--sun);margin-top:10px}

/* references — postcard cards */
.refgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}@media(max-width:760px){.refgrid{grid-template-columns:1fr}}
.ref{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:var(--r);padding:17px 19px;text-decoration:none;display:block;color:var(--text);transition:transform .2s,border-color .2s}
.ref:hover{border-color:var(--sun);transform:translateY(-3px)}
.ref b{font-family:var(--disp);font-weight:600;font-size:1.1rem;color:#fff;display:block}
.ref .u{font-family:var(--mono);font-size:.66rem;color:var(--sun);letter-spacing:.03em}
.ref p{font-size:.92rem;color:#eafff9;margin:6px 0 0}

/* strategy / checklist — bright postcards on sand, dark readable text */
.prog{position:sticky;top:108px;z-index:10;background:linear-gradient(120deg,var(--sea),var(--sea-deep));border:0;border-radius:var(--r);padding:15px 20px;margin-bottom:24px;color:#fff;box-shadow:0 16px 38px -24px rgba(6,58,74,.6)}
.prog .pct{font-family:var(--mono);font-size:.84rem;color:var(--sun);font-weight:500}
.prog .bar{height:12px;border-radius:8px;background:rgba(255,255,255,.16);overflow:hidden;margin-top:9px}
.prog .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--lagoon),var(--sun),var(--coral));width:0;transition:width .35s}
.ws{background:var(--cream);border:1px solid var(--line-l);border-top:6px solid var(--coral);border-radius:18px;padding:18px 22px 8px;margin-top:20px;box-shadow:0 14px 34px -26px rgba(6,58,74,.45)}
.ws:nth-of-type(7n+1){border-top-color:var(--coral)}
.ws:nth-of-type(7n+2){border-top-color:var(--lagoon)}
.ws:nth-of-type(7n+3){border-top-color:var(--sun)}
.ws:nth-of-type(7n+4){border-top-color:var(--palm)}
.ws:nth-of-type(7n+5){border-top-color:var(--sea)}
.ws:nth-of-type(7n+6){border-top-color:var(--coral-d)}
.ws:nth-of-type(7n+7){border-top-color:var(--sun-d)}
.ws h3{color:var(--ink);margin:0 0 2px;font-size:1.3rem}
.ws .owner{font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--palm-d);font-weight:500}
.task{display:flex;gap:13px;align-items:flex-start;padding:12px 0;border-bottom:1px dashed var(--line-l)}
.task:last-child{border-bottom:0}
.task input{margin-top:4px;width:20px;height:20px;flex:none;accent-color:var(--coral);cursor:pointer}
.task .t{color:var(--ink);font-size:.99rem;font-weight:400}
.task .meta{font-family:var(--mono);font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-dim);margin-top:3px}
.task.done .t{text-decoration:line-through;color:var(--ink-dim)}
.pri{display:inline-block;font-family:var(--mono);font-size:.58rem;padding:2px 7px;border-radius:999px;margin-right:7px;font-weight:600;vertical-align:1px}
.p1{background:rgba(242,104,63,.18);color:var(--coral-d)}.p2{background:rgba(47,158,106,.18);color:var(--palm-d)}

/* vintage grain overlay */
body::after{content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.045;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
/* orchestrated page-load reveal */
@keyframes wvrise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.cover .eyebrow,.cover h1,.cover .deck,.cover .target{opacity:0;animation:wvrise .85s cubic-bezier(.2,.8,.2,1) forwards}
.cover .eyebrow{animation-delay:.06s}.cover h1{animation-delay:.2s}.cover .deck{animation-delay:.38s}.cover .target{animation-delay:.56s}
.target .tcard{opacity:0;animation:wvrise .7s cubic-bezier(.2,.8,.2,1) forwards}
.target .tcard:nth-child(1){animation-delay:.58s}.target .tcard:nth-child(2){animation-delay:.68s}.target .tcard:nth-child(3){animation-delay:.78s}.target .tcard:nth-child(4){animation-delay:.88s}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .cover .eyebrow,.cover h1,.cover .deck,.cover .target,.target .tcard{opacity:1!important;transform:none!important}}