/* Bay of Plenty AI — shared styles. Built from the KBMedia look: white header, angled navy hero, Open Sans, gold buttons, white cards, navy wave CTA. */
:root{--navy:#110f31;--navy2:#1c1950;--gold:#ffc700;--ink:#181832;--body:#565672;--alt:#f5f5fa;--line:#e6e5ef;--white:#ffffff;--green:#1f8f5a;
--f:"Open Sans",system-ui,sans-serif;color-scheme:light}
*{box-sizing:border-box}img{max-width:100%;height:auto}
body{margin:0;background:var(--white);color:var(--ink);font:400 17px/1.65 var(--f);overflow-x:hidden}
a{color:inherit}
h1,h2,h3{font-family:var(--f);color:var(--ink);margin:0;text-wrap:balance}
.wrap{max-width:1200px;margin:0 auto;padding-inline:24px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border-radius:6px;font:700 16px/1 var(--f);text-decoration:none;border:2px solid transparent;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px)}
.btn.gold{background:var(--gold);color:var(--navy)}
.btn.gold:hover{box-shadow:0 10px 24px -10px rgba(255,199,0,.9)}
.btn.navy{background:var(--navy);color:#fff}
.btn.outline{border-color:#fff;color:#fff}
.btn.outline-d{border-color:var(--navy);color:var(--navy)}
a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.eyebrow{font:700 13px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:#a07a00;margin:0 0 14px}
.h2{font-size:clamp(30px,3.6vw,44px);font-weight:800;line-height:1.12;letter-spacing:-.01em}
.lead{color:var(--body);font-size:18px;margin:14px 0 0;max-width:62ch}
section{padding-block:96px}
.alt{background:var(--alt)}

/* header — as on the current site */
.top{background:#fff;position:relative;z-index:3}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:18px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo .mark{width:46px;height:46px;border-radius:50%;padding:3px;background:conic-gradient(from 200deg,#ffc700,#ff7a59,#7c5cff,#2fa3ff,#ffc700);flex:none}
.logo .mark span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#fff}
.logo .mark svg{width:28px;height:20px}
.logo .name{display:grid;line-height:1.05}
.logo .name b{font-size:19px;font-weight:800;color:var(--navy);letter-spacing:-.01em}
.logo .name i{font-style:normal;font-size:12px;color:var(--body)}
.menu{display:flex;align-items:center;gap:26px}
.menu ul{display:flex;gap:24px;list-style:none;margin:0;padding:0;font-size:14px;font-weight:600}
.menu ul a{text-decoration:none;color:var(--ink)}.menu ul a:hover{color:#a07a00}
.phone{font-size:13px;font-weight:600;color:var(--body);text-decoration:none;white-space:nowrap}
.menu .btn{min-height:40px;padding:0 18px;border-radius:999px;font-size:14px}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:10px;background:#fff;align-items:center;justify-content:center}
.burger i,.burger i::before,.burger i::after{display:block;width:18px;height:2px;background:var(--navy);position:relative;content:""}
.burger i::before{position:absolute;top:-6px}.burger i::after{position:absolute;top:6px}
@media(max-width:1000px){.menu ul,.phone{display:none}.burger{display:inline-flex}}
@media(max-width:520px){.menu .btn{display:none}}

/* hero — angled navy band, now over the Mount */
.hero{position:relative;color:#fff;clip-path:polygon(0 8%,100% 0,100% 100%,0 100%);margin-top:-1px;background:var(--navy)}
.hero .bg{position:absolute;inset:0;background:url(../img/places/mount.webp) 30% 40%/cover no-repeat}
.hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,15,49,.15) 0%,rgba(17,15,49,.35) 30%,rgba(17,15,49,.86) 52%,rgba(17,15,49,.96) 70%,var(--navy) 100%)}
.hero .wrap{position:relative;display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:end;padding-top:90px}
.hero .wrap>*{min-width:0}
.hero .pic{align-self:end}
.hero .pic img{display:block;max-height:560px;width:auto;margin:0 auto;filter:drop-shadow(0 20px 40px rgba(0,0,0,.35))}
.hero .copy{align-self:center;padding-bottom:70px;display:grid;gap:22px}
.hero .place{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.hero .place svg{width:16px;height:16px}
.hero h1{color:#fff;font-size:clamp(36px,4.6vw,60px);font-weight:800;line-height:1.06;letter-spacing:-.015em}
.hero h1 span{color:var(--gold)}
.hero p{margin:0;color:#dcdaf2;font-size:clamp(17px,1.4vw,19px);max-width:52ch}
.hero .row{display:flex;flex-wrap:wrap;gap:12px}
.trust{display:flex;flex-wrap:wrap;gap:8px 20px;list-style:none;margin:0;padding:0;font-size:14px;font-weight:600;color:#fff}
.trust li{display:flex;align-items:center;gap:8px}
.trust svg{width:18px;height:18px;flex:none}
.credit{position:absolute;right:16px;bottom:10px;font-size:11px;color:rgba(255,255,255,.45)}
@media(max-width:900px){.hero{clip-path:polygon(0 3%,100% 0,100% 100%,0 100%)}.hero .wrap{grid-template-columns:1fr;padding-top:70px}.hero .copy{order:-1;padding-bottom:10px}.hero .pic img{max-height:360px}
 .hero .bg::after{background:linear-gradient(180deg,rgba(17,15,49,.92) 0%,rgba(17,15,49,.86) 60%,rgba(17,15,49,.6) 100%)}}



/* services with people */
.svc-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.svc{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;text-decoration:none;transition:transform .2s,box-shadow .2s;min-width:0}
.svc:hover{transform:translateY(-4px);box-shadow:0 20px 40px -26px rgba(17,15,49,.45)}
.svc .img{position:relative;aspect-ratio:4/3;max-width:100%;background:var(--navy);overflow:hidden}
.svc .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.svc .img.ph .shot{position:absolute;inset:10px;border:1.5px dashed rgba(255,255,255,.25);border-radius:8px;display:grid;place-items:center;text-align:center;padding:16px;color:#cfcdee;font-size:13px;background:linear-gradient(135deg,#221f58,#0e0c2a)}
.svc .img.ph .shot b{display:block;color:var(--gold);font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px}
.svc .txt{padding:22px;display:grid;gap:8px;align-content:start}
.svc h3{font-size:19px;font-weight:800}
.svc p{margin:0;color:var(--body);font-size:15.5px}
.svc .more{font-size:14px;font-weight:700;color:var(--navy);margin-top:4px}
@media(max-width:1000px){.svc-row{grid-template-columns:1fr 1fr}}@media(max-width:560px){.svc-row{grid-template-columns:1fr}}
.jobs-head{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.jobs-head>*{min-width:0}
.jobs-head figure{margin:0;border-radius:10px;overflow:hidden;aspect-ratio:4/3;max-width:100%;position:relative}
.jobs-head figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media(max-width:860px){.jobs-head{grid-template-columns:1fr}}

/* before & after */
.cmp-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end}
.cmp-head>*{min-width:0}
@media(max-width:860px){.cmp-head{grid-template-columns:1fr;gap:10px}}
.cmp{position:relative;margin-top:40px;border-radius:12px;overflow:hidden;--pos:50%;touch-action:pan-y;user-select:none;cursor:ew-resize;border:1px solid var(--line);box-shadow:0 30px 60px -40px rgba(17,15,49,.45)}
.side{padding:clamp(16px,3vw,30px);display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.before{background:#f4f1ee}
.after{position:absolute;inset:0;background:#eef0fb;clip-path:inset(0 0 0 var(--pos))}
.w{background:#fff;border-radius:10px;padding:18px;display:grid;gap:6px;align-content:start;min-width:0;border:1px solid var(--line);height:var(--h,165px);overflow:hidden}
@media(min-width:761px){.side>.w:nth-child(-n+3){--h:205px}}
.w small{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--body)}
.w .num{font-size:clamp(30px,4vw,52px);font-weight:800;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.before .num{color:#c94a3a}.after .num{color:var(--green)}
.w.wide{grid-column:span 2}
.w ul{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:15px}
.before .w li{background:#fff6b8;padding:7px 10px;border-radius:4px;font-weight:600;transform:rotate(var(--r,0deg))}
.after .w li{background:#eef7f1;padding:7px 10px;border-radius:6px;font-weight:600}
.after .w li::before{content:"✓ ";color:var(--green)}
.w .face{font-size:38px;line-height:1}
.w b{font-size:16px}
.tagl{position:absolute;top:12px;z-index:3;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:7px 11px;border-radius:999px;pointer-events:none}
.tagl.l{left:12px;background:#c94a3a;color:#fff}.tagl.r{right:12px;background:var(--navy);color:var(--gold)}
.handle{position:absolute;top:0;bottom:0;left:var(--pos);width:4px;margin-left:-2px;background:var(--gold);z-index:4;pointer-events:none}
.handle span{position:absolute;top:50%;left:50%;width:54px;height:54px;border-radius:50%;background:var(--navy);color:var(--gold);display:grid;place-items:center;transform:translate(-50%,-50%);font-weight:800;box-shadow:0 8px 24px -6px rgba(0,0,0,.45)}
.cmp input{position:absolute;left:0;bottom:0;width:1px;height:1px;opacity:0;margin:0}
.cmp:focus-within .handle span{outline:3px solid var(--gold);outline-offset:3px}
.cmp-note{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:12px;font-size:13px;color:var(--body)}
@media(max-width:760px){.side{grid-template-columns:1fr 1fr;padding-top:48px}.w{--h:150px}.w.wide{grid-column:1/-1;--h:135px}.w.wide.todo{--h:195px}}
@media(max-width:420px){.side{gap:10px;padding-inline:12px}.w{padding:12px;font-size:14px}.w .num{font-size:28px}}

/* the Bay */
.bay-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end}
.bay-head>*{min-width:0}
@media(max-width:860px){.bay-head{grid-template-columns:1fr;gap:10px}}
.places{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:260px 260px;gap:16px;margin-top:44px}
.place-card{position:relative;border-radius:10px;overflow:hidden;margin:0;background:var(--navy);min-width:0}
.place-card:first-child{grid-row:span 2}
.place-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.place-card:hover img{transform:scale(1.05)}
.place-card figcaption{position:absolute;inset:auto 0 0;padding:40px 20px 18px;background:linear-gradient(transparent,rgba(17,15,49,.9));color:#fff}
.place-card b{display:block;font-size:20px;font-weight:800}
.place-card span{font-size:14px;color:#dcdaf2}
.ph{background:linear-gradient(135deg,#221f58,#0e0c2a)}
.ph .shot{position:absolute;inset:12px;border:1.5px dashed rgba(255,255,255,.25);border-radius:8px;display:grid;place-items:center;text-align:center;padding:20px 20px 70px;color:#cfcdee;font-size:13px}
.ph .shot b{display:block;color:var(--gold);font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px}
@media(max-width:900px){.places{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:220px}.place-card:first-child{grid-row:auto;grid-column:1/-1}}
@media(max-width:520px){.places{grid-template-columns:1fr}}

/* better at their jobs */
.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.role{background:#fff;border:1px solid var(--line);border-radius:10px;padding:26px;display:grid;gap:12px;align-content:start;min-width:0;transition:transform .2s,box-shadow .2s}
.role:hover{transform:translateY(-3px);box-shadow:0 18px 36px -24px rgba(17,15,49,.4)}
.role .who{display:flex;align-items:center;gap:12px}
.role .ic{width:44px;height:44px;border-radius:10px;background:#fff4c7;display:grid;place-items:center;flex:none}
.role .ic svg{width:24px;height:24px;stroke:var(--navy);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.role h3{font-size:19px;font-weight:700}
.role p{margin:0;color:var(--body);font-size:15.5px}
.role .gain{font-size:14px;font-weight:700;color:var(--green);border-top:1px dashed var(--line);padding-top:12px}
@media(max-width:1000px){.roles{grid-template-columns:1fr 1fr}}@media(max-width:620px){.roles{grid-template-columns:1fr}}

/* safety */
.safe{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.safe>*{min-width:0}
.shield{display:grid;place-items:center;width:84px;height:84px;border-radius:20px;background:var(--navy);margin-bottom:22px}
.shield svg{width:44px;height:44px}
.promises{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.promises li{display:grid;grid-template-columns:40px 1fr;gap:14px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px}
.promises .n{width:40px;height:40px;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-weight:800}
.promises b{display:block;font-size:17px;margin-bottom:2px}
.promises span{color:var(--body);font-size:15.5px}
@media(max-width:900px){.safe{grid-template-columns:1fr;gap:30px}}

/* how + proof */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px;counter-reset:s;list-style:none;padding:0}
.steps li{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:10px;padding:26px;display:grid;gap:8px;align-content:start;min-width:0}
.steps li::before{content:"Step " counter(s);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#a07a00}
.steps b{font-size:19px}
.steps span{color:var(--body);font-size:15.5px}
@media(max-width:820px){.steps{grid-template-columns:1fr}}
.quote{text-align:center;max-width:860px;margin:0 auto}
.quote blockquote{margin:0;font-size:clamp(20px,2.4vw,28px);line-height:1.45;font-weight:600;color:var(--ink)}
.quote p{margin:18px 0 0;color:var(--body);font-size:16px}
.quote p strong{color:var(--ink)}

/* wave CTA + footer, as on the current site */
.cta{background:var(--navy);color:#fff;text-align:center;padding-block:90px 0;position:relative}
.cta h2{color:#fff;font-size:clamp(28px,3.4vw,40px);font-weight:800;max-width:22ch;margin:0 auto}
.cta p{color:#c9c7e6;max-width:56ch;margin:16px auto 28px}
.cta .row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.cta .wave{display:block;width:100%;height:90px;margin-top:70px;color:#f4f4f6}
footer{background:#f4f4f6;padding-block:30px 40px;color:var(--body);font-size:14px}
.foot{display:grid;grid-template-columns:repeat(3,1fr) 1.4fr;gap:30px}
.foot h4{margin:0 0 12px;font-size:15px;color:var(--ink)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{text-decoration:none}
.foot .call{font-size:20px;font-weight:800;color:var(--ink)}
.small{margin-top:34px;font-size:12px}
@media(max-width:820px){.foot{grid-template-columns:1fr 1fr}.foot>div:last-child{grid-column:1/-1}}
@media(max-width:600px){section{padding-block:70px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---------- full-site additions ---------- */

/* mobile menu */
.menu ul a[aria-current="page"]{color:#a07a00}
.m-only{display:none}
@media(max-width:1000px){
 .top.open .menu ul{display:grid;position:absolute;top:100%;left:0;right:0;background:#fff;padding:8px 24px 24px;gap:0;border-top:1px solid var(--line);box-shadow:0 24px 40px -24px rgba(17,15,49,.35);font-size:17px}
 .top.open .menu ul a{display:block;padding:13px 0;border-bottom:1px solid var(--line)}
 .top.open .m-only{display:block}
 .top.open .m-only a.btn{margin-top:16px;border:0;width:100%;color:var(--navy)}
 .top.open .burger i{background:transparent}.top.open .burger i::before{top:0;transform:rotate(45deg)}.top.open .burger i::after{top:0;transform:rotate(-45deg)}
}

/* inner page hero */
section.phero{position:relative;color:#fff;background:var(--navy);clip-path:polygon(0 9%,100% 0,100% 100%,0 100%);margin-top:-1px;padding:120px 0 84px;overflow:hidden}
.phero .bg{position:absolute;inset:0;background-size:cover;background-position:center 40%}
.phero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,15,49,.96) 0%,rgba(17,15,49,.88) 45%,rgba(17,15,49,.55) 100%)}
.phero .wrap{position:relative;display:grid;gap:18px}
.phero h1{color:#fff;font-size:clamp(34px,4.4vw,54px);font-weight:800;line-height:1.08;letter-spacing:-.015em;max-width:20ch}
.phero h1 span{color:var(--gold)}
.phero p.lede{margin:0;color:#dcdaf2;font-size:clamp(17px,1.4vw,19px);max-width:58ch}
.phero .row{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0;font-size:13px;font-weight:600;color:#bdbbe0}
.crumbs li+li::before{content:"/";margin-right:6px;color:#77759c}
.crumbs a{text-decoration:none;color:var(--gold)}
@media(max-width:900px){section.phero{clip-path:polygon(0 3%,100% 0,100% 100%,0 100%);padding:80px 0 64px}.phero .bg::after{background:rgba(17,15,49,.88)}}

/* two-column text + picture */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split>*{min-width:0}
.split.flip>figure{order:-1}
.split figure{margin:0;border-radius:10px;overflow:hidden;aspect-ratio:4/3;position:relative;background:var(--navy)}
.split figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split figure.ph .shot{position:absolute;inset:12px;border:1.5px dashed rgba(255,255,255,.25);border-radius:8px;display:grid;place-items:center;text-align:center;padding:20px;color:#cfcdee;font-size:14px}
@media(max-width:860px){.split{grid-template-columns:1fr;gap:30px}.split.flip>figure{order:0}}

/* tick list */
.ticks{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:12px}
.ticks li{position:relative;padding-left:34px;color:var(--body)}
.ticks li b{color:var(--ink)}
.ticks li::before{content:"";position:absolute;left:0;top:3px;width:22px;height:22px;border-radius:50%;background:#fff4c7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23110f31' stroke-width='3'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center/14px no-repeat}

/* generic cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.cards.four{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:26px;display:grid;gap:10px;align-content:start;min-width:0;text-decoration:none;transition:transform .2s,box-shadow .2s}
a.card:hover{transform:translateY(-3px);box-shadow:0 18px 36px -24px rgba(17,15,49,.4)}
.card h3{font-size:19px;font-weight:800}
.card p{margin:0;color:var(--body);font-size:15.5px}
.card .ic{width:44px;height:44px;border-radius:10px;background:#fff4c7;display:grid;place-items:center}
.card .ic svg{width:24px;height:24px;stroke:var(--navy);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.card .more{font-size:14px;font-weight:700;color:var(--navy)}
.card .gain{font-size:14px;font-weight:700;color:var(--green);border-top:1px dashed var(--line);padding-top:12px}
@media(max-width:1000px){.cards,.cards.four{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.cards,.cards.two,.cards.four{grid-template-columns:1fr}}

/* FAQ */
.faq{display:grid;gap:12px;margin-top:36px;max-width:860px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:10px;padding:0 22px}
.faq summary{cursor:pointer;list-style:none;padding:20px 30px 20px 0;font-weight:700;font-size:17px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:16px;font-size:24px;font-weight:600;color:#a07a00}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 20px;color:var(--body)}

/* plans */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px;align-items:stretch}
.plan{background:#fff;border:1px solid var(--line);border-radius:12px;padding:30px;display:grid;gap:14px;align-content:start;min-width:0;position:relative}
.plan.pick{border:2px solid var(--navy);box-shadow:0 30px 60px -40px rgba(17,15,49,.5)}
.plan .badge{position:absolute;top:-13px;left:30px;background:var(--gold);color:var(--navy);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
.plan h3{font-size:22px;font-weight:800}
.plan .price{font-size:34px;font-weight:800;line-height:1;color:var(--navy)}
.plan .price small{font-size:15px;font-weight:600;color:var(--body)}
.plan p{margin:0;color:var(--body);font-size:15.5px}
.plan .ticks{margin:0}
.plan .btn{margin-top:auto}
@media(max-width:900px){.plans{grid-template-columns:1fr}}

/* blog */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.post{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;text-decoration:none;min-width:0;transition:transform .2s,box-shadow .2s}
.post:hover{transform:translateY(-4px);box-shadow:0 20px 40px -26px rgba(17,15,49,.45)}
.post .img{position:relative;aspect-ratio:16/9;background:var(--navy);overflow:hidden}
.post .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.post .txt{padding:22px;display:grid;gap:8px;align-content:start}
.post .meta{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#a07a00}
.post h3{font-size:19px;font-weight:800;line-height:1.3}
.post p{margin:0;color:var(--body);font-size:15.5px}
@media(max-width:1000px){.posts{grid-template-columns:1fr 1fr}}@media(max-width:620px){.posts{grid-template-columns:1fr}}
.prose{max-width:720px;margin:0 auto;font-size:18px;line-height:1.75}
.prose>*+*{margin-top:1.1em}
.prose h2{font-size:clamp(24px,2.6vw,30px);font-weight:800;line-height:1.2;margin-top:1.8em}
.prose h3{font-size:21px;font-weight:800;margin-top:1.5em}
.prose p,.prose li{color:#3c3c58}
.prose ul,.prose ol{padding-left:1.3em;margin-bottom:0}
.prose li+li{margin-top:.4em}
.prose blockquote{margin-inline:0;border-left:4px solid var(--gold);padding:6px 0 6px 22px;font-size:20px;font-weight:600;color:var(--ink)}
.prose figure{margin:1.6em 0;border-radius:10px;overflow:hidden}
.prose figure img{display:block;width:100%}
.prose figcaption{font-size:13px;color:var(--body);padding-top:8px}
.prose .box{background:var(--alt);border-radius:10px;padding:22px 24px}
.byline{display:flex;align-items:center;gap:12px;font-size:14px;color:#dcdaf2}
.byline img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:top;background:#fff}

/* forms */
.form{display:grid;gap:16px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:30px}
.form label{display:grid;gap:6px;font-weight:700;font-size:15px}
.form input,.form select,.form textarea{font:400 16px/1.4 var(--f);padding:13px 14px;border:1.5px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(255,199,0,.45)}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form .hint{font-size:13px;color:var(--body);margin:0}
.form .done{display:none;background:#eef7f1;color:#155f3d;border-radius:8px;padding:16px;font-weight:600}
.form.sent .done{display:block}
@media(max-width:560px){.form{padding:20px}.form .two{grid-template-columns:1fr}}

/* placeholders Karl still needs to fill in — easy to spot, easy to delete */
.todo-note{border:1.5px dashed #d9a800;background:#fffbea;color:#6b5200;border-radius:8px;padding:12px 16px;font-size:14px}
.todo-note b{color:#4a3800}

/* little stat strip */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.facts div{border-top:3px solid var(--gold);padding-top:14px}
.facts b{display:block;font-size:20px;font-weight:800;color:var(--ink)}
.facts span{color:var(--body);font-size:15px}
@media(max-width:820px){.facts{grid-template-columns:1fr 1fr}}
.center{text-align:center}.center .lead{margin-inline:auto}
.split figure.ph .shot b,.cards .ph .shot b{display:block;color:var(--gold);font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px}
.split figure.ph{background:linear-gradient(135deg,#221f58,#0e0c2a)}
.plan .price small{font-size:15px;font-weight:600;color:var(--muted,#5b5a7a);letter-spacing:0}
.plan .hrs{font-size:14px;font-weight:600;color:var(--navy);margin-top:-4px}
.plan-note{text-align:center;margin:28px auto 0;max-width:620px;font-size:15px;color:var(--muted,#5b5a7a)}
.ticks .from{display:block;font-size:14px;font-weight:700;color:var(--navy);margin-top:2px}
.form .fail{background:#fdeeee;color:#8a1f1f;border-radius:8px;padding:16px;font-weight:600;margin:0}
@media(min-width:1101px){.svc-row.five{grid-template-columns:repeat(5,1fr)}}@media(min-width:561px) and (max-width:1100px){.svc-row.five{grid-template-columns:repeat(6,1fr)}.svc-row.five>*{grid-column:span 2}.svc-row.five>:nth-child(4){grid-column:2/span 2}.svc-row.five>:nth-child(5){grid-column:4/span 2}}