/*
Theme Name: Skipper
Theme URI: https://skipper.business
Author: Lamoureux Lane
Description: Skipper — He's The One. Australian men over 50, steering businesses anywhere. Hand-built, no page builder.
Version: 0.2.0
Text Domain: skipper
*/

:root{
	--paper:#FFFCF6; --ink:#0B2B2A; --sea:#0E4A46; --deep:#06302E;
	--soft:#5A716E; --rule:#DCEBE7;
	--signal:#FF4E2E;      /* hot coral — the vibrancy */
	--aqua:#12C2A0;        /* alive, not corporate */
	--sun:#FFC24B;
	--head:'Instrument Serif', Georgia, serif;
	--body:'Figtree', system-ui, -apple-system, sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
.w{max-width:1180px;margin:0 auto;padding:0 clamp(20px,5vw,56px)}
h1,h2,h3{font-family:var(--head);font-weight:400;letter-spacing:-.015em;text-wrap:balance;margin:0}
.eyebrow{font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--signal);font-weight:700;margin:0 0 16px}
.sk-skip{position:absolute;left:-9999px}
.sk-skip:focus{left:16px;top:16px;z-index:99;background:#fff;padding:10px 14px}

.sk-mark{display:flex;align-items:baseline;gap:12px;padding:24px 0 0;max-width:1180px;margin:0 auto;padding-left:clamp(20px,5vw,56px);padding-right:clamp(20px,5vw,56px)}
.sk-mark b{font-family:var(--head);font-size:1.6rem}
.sk-mark i{font-style:italic;font-family:var(--head);font-size:1rem;color:var(--signal)}

/* ── THE ENTRANCE ─────────────────────────────────────────────── */
.sk-open{padding:clamp(40px,7vw,90px) 0 clamp(40px,6vw,72px);
	background:
		radial-gradient(120% 90% at 88% 0%, rgba(18,194,160,.16) 0%, rgba(18,194,160,0) 58%),
		radial-gradient(90% 80% at 4% 12%, rgba(255,78,46,.12) 0%, rgba(255,78,46,0) 60%);
}
.sk-open h1{font-size:clamp(2.5rem,7.6vw,6rem);line-height:.98}
.sk-open h1 em{font-style:italic;color:var(--signal)}

.sk-ask{margin-top:clamp(34px,5vw,58px);padding-top:clamp(26px,3vw,34px);border-top:2px solid var(--ink)}
.sk-ask__q{font-family:var(--head);font-size:clamp(1.4rem,3vw,2.2rem);margin:0 0 18px}
.sk-pills{display:flex;flex-wrap:wrap;gap:10px}
.sk-pill{font-family:var(--body);font-size:clamp(.95rem,1.5vw,1.05rem);font-weight:600;
	background:transparent;color:var(--sea);border:2px solid var(--rule);
	border-radius:100px;padding:11px 20px;cursor:pointer;transition:.16s ease}
.sk-pill:hover,.sk-pill:focus-visible{border-color:var(--aqua);color:var(--deep)}
.sk-pill.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.sk-said{font-family:var(--head);font-size:clamp(1.15rem,2.4vw,1.8rem);line-height:1.25;
	color:var(--sea);max-width:44ch;margin:22px 0 0;min-height:2.6em}
.sk-said.is-in{animation:skIn .5s cubic-bezier(.2,.7,.3,1) both}
@keyframes skIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.sk-said.is-in{animation:none}}

/* ── THE STACK ────────────────────────────────────────────────── */
.sk-stack{padding:clamp(50px,8vw,100px) 0;border-top:1px solid var(--rule)}
.sk-huge{font-size:clamp(2.1rem,6vw,4.4rem);line-height:1.02}
.sk-huge span{color:var(--signal);font-style:italic}
.sk-lead{font-size:clamp(1.05rem,1.8vw,1.32rem);color:var(--soft);max-width:58ch;margin:26px 0 0}
.sk-lead strong{color:var(--ink);font-weight:600}

/* ── THREE DOORS ──────────────────────────────────────────────── */
.sk-doors .w{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr));gap:clamp(16px,2.4vw,26px)}
.sk-doors{padding:clamp(20px,4vw,44px) 0 clamp(50px,8vw,96px)}
.sk-door{padding:clamp(24px,3vw,34px);border-radius:4px;background:#fff;border:1px solid var(--rule)}
.sk-door--a{background:var(--ink);border-color:var(--ink)}
.sk-door--a .sk-kicker{color:var(--aqua)} .sk-door--a h3{color:#fff} .sk-door--a p{color:#B9D3CF}
.sk-door--a .sk-go{color:#fff;border-color:var(--aqua)}
.sk-door--b{background:var(--signal);border-color:var(--signal)}
.sk-door--b .sk-kicker{color:#FFE2D9} .sk-door--b h3{color:#fff} .sk-door--b p{color:#FFE0D6}
.sk-door--b .sk-go{color:#fff;border-color:#fff}
.sk-kicker{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--signal);margin:0 0 10px}
.sk-door h3{font-size:clamp(1.35rem,2.3vw,1.75rem);line-height:1.1;margin:0 0 10px}
.sk-door p{color:var(--soft);margin:0 0 20px;font-size:1rem}
.sk-go{display:inline-block;font-size:1rem;font-weight:700;color:var(--sea);text-decoration:none;
	border-bottom:2px solid var(--signal);padding-bottom:3px}

/* ── BANDS ────────────────────────────────────────────────────── */
.sk-band{padding:clamp(50px,8vw,100px) 0;border-top:1px solid var(--rule)}
.sk-band h2{font-size:clamp(1.8rem,4.2vw,3.2rem);line-height:1.06;max-width:21ch}
.sk-band p{font-size:clamp(1.05rem,1.8vw,1.28rem);color:var(--soft);max-width:57ch;margin:22px 0 0}
.sk-band p strong{color:var(--ink);font-weight:600}
.sk-aside{font-family:var(--head);font-style:italic;color:var(--sea)!important;font-size:clamp(1.1rem,2vw,1.4rem)!important}

/* ── THE ATELIER ──────────────────────────────────────────────── */
.sk-atelier{padding:clamp(50px,8vw,100px) 0;background:var(--deep);color:#DCF1ED}
.sk-atelier .eyebrow{color:var(--sun)}
.sk-atelier h2{color:#fff}
.sk-atelier .sk-huge span{color:var(--aqua)}
.sk-atelier .sk-lead{color:#A9CCC7}
.sk-atelier .sk-lead strong{color:#fff}
.sk-steps{list-style:none;margin:40px 0 0;padding:0;
	display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:2px;background:rgba(255,255,255,.10)}
.sk-steps li{background:var(--deep);padding:22px}
.sk-steps b{display:block;font-family:var(--head);font-size:1.5rem;color:var(--aqua);line-height:1}
.sk-steps span{display:block;font-weight:700;margin:8px 0 4px;color:#fff}
.sk-steps i{font-style:normal;color:#9BC2BD;font-size:.96rem}

/* ── CLOSE ────────────────────────────────────────────────────── */
.sk-close{background:var(--signal);color:#fff;padding:clamp(50px,8vw,100px) 0}
.sk-close h2{color:#fff;font-size:clamp(1.8rem,4.2vw,3rem);max-width:22ch}
.sk-close p{color:#FFE4DC;max-width:56ch;font-size:clamp(1.05rem,1.8vw,1.28rem);margin:20px 0 0}
.sk-close strong{color:#fff}
.sk-foot{padding:34px 0 60px;color:var(--soft);font-size:.9rem}