/* Cairnwise homepage styles (extends base.css) */
.pbanner{background:var(--li);color:var(--fd);font-size:13px;font-weight:500;text-align:center;padding:8px 16px}
.brand img{display:block;height:32px;width:auto}
.foot .brand img{height:28px}
.proof{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.proof span{font-size:13px;color:var(--sg);border:1px solid var(--line);border-radius:99px;padding:7px 13px;display:inline-flex;align-items:center;gap:8px}
.proof span:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--li)}
.prob{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.prob .lede{max-width:none}
.prob ul{list-style:none;border-top:1px solid var(--line)}
.prob li{padding:18px 0;border-bottom:1px solid var(--line);font-weight:300;color:var(--tx);display:grid;grid-template-columns:28px 1fr;gap:10px}
.prob li svg{width:16px;height:16px;margin-top:4px}
.uses{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.use{display:flex;flex-direction:column;min-height:260px}
.use .tag{align-self:flex-start;margin-bottom:40px}
.use.lead{border-color:rgba(205,234,126,.55);background:rgba(205,234,126,.05)}
.also{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;font-size:14px;color:var(--sg)}
.also b{color:var(--cr);font-weight:500}
.also .chip{border:1px solid var(--line);border-radius:99px;padding:6px 12px}
.also .chip.on{border-color:rgba(205,234,126,.55);color:var(--li)}
.hyp{display:inline-block;margin-top:auto;padding-top:18px;font-size:12px;color:var(--sg);letter-spacing:.02em}
.decide{display:grid;grid-template-columns:.95fr 1.05fr;gap:40px;align-items:start}
.dcard{border:1px solid rgba(205,234,126,.5);border-radius:20px;background:rgba(15,31,23,.6);overflow:hidden}
.dcard .dh{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.dcard .dh b{font-weight:500}
.dsec{padding:18px 22px;border-bottom:1px solid var(--soft)}
.dsec:last-of-type{border-bottom:0}
.dk{display:block;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--sg);margin-bottom:10px}
.pts{list-style:none;display:grid;gap:7px}
.pts li{font-size:14px;color:var(--tx);font-weight:300;display:flex;gap:10px}
.pts li:before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:var(--sg);margin-top:8px}
.ok li:before{background:var(--li)}
.opts{display:grid;gap:8px}
.opt{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;font-size:14px;color:var(--tx);font-weight:300;border:1px solid var(--soft);border-radius:10px;padding:10px 12px}
.opt.pick{border-color:var(--li);color:var(--cr);background:rgba(205,234,126,.07)}
.opt small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--sg)}
.opt.pick small{color:var(--li)}
.dec{background:rgba(205,234,126,.08)}
.dec p{color:var(--cr);font-size:16px;font-weight:400;line-height:1.5}
.illus{display:block;padding:12px 22px;font-size:12px;color:var(--sg);border-top:1px dashed var(--line)}
.rights5{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.ba{list-style:none;border-top:1px solid var(--line)}
.ba li{display:grid;grid-template-columns:1fr 40px 1fr;gap:16px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.ba .was{color:var(--sg);font-weight:300;font-size:16px}
.ba .now{color:var(--cr);font-size:17px}
.ba .ar{color:var(--li);font-size:20px;text-align:center}
.ph{border:1.5px dashed rgba(205,234,126,.6);border-radius:16px;padding:22px 24px;background:repeating-linear-gradient(135deg,rgba(205,234,126,.035) 0 10px,transparent 10px 20px);color:var(--li)}
.ph b{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;margin-bottom:6px}
.ph span{display:block;font-size:14px;color:var(--tx);font-weight:300}
.phs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.need{margin-top:22px;font-size:15px}
.need b{color:var(--cr);font-weight:500}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:20px 0}
.faq summary{cursor:pointer;list-style:none;font-size:19px;letter-spacing:-.01em;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";color:var(--li);font-size:22px;line-height:1}
.faq details[open] summary:after{content:"–"}
.faq p{margin-top:12px;max-width:760px;font-size:15.5px;line-height:1.65}
.next{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;margin:22px 0 4px;font-size:14px;color:var(--sg)}
.next b{color:var(--li);font-family:'Instrument Serif',serif;font-style:italic;font-size:18px;font-weight:400;margin-right:6px}
.rulesgrid{display:grid;grid-template-columns:1fr 1.3fr;gap:20px}
.coll{margin-top:14px;border-left:2px solid var(--ol);padding:8px 0 8px 18px;font-size:14.5px;color:var(--tx);font-weight:300}
.coll b{color:var(--cr);font-weight:500}
@media (max-width:1140px){
 .uses{grid-template-columns:1fr 1fr}
 .rights5{grid-template-columns:repeat(2,1fr)}.rights5 .persona{grid-column:span 2}
 .phs{grid-template-columns:1fr}
}
@media (max-width:860px){
 .prob,.decide,.rulesgrid{grid-template-columns:1fr;gap:26px}
 .uses{grid-template-columns:1fr}.use{min-height:auto}.use .tag{margin-bottom:22px}
 .rights5{grid-template-columns:1fr}.rights5 .persona{grid-column:auto}
 .ba li{grid-template-columns:1fr;gap:4px}.ba .ar{text-align:left;transform:rotate(90deg);width:20px}
 .proof span{font-size:12.5px}
}
.pilot{align-items:start}.gate{justify-content:flex-start}.gate .big{margin-top:6px}
/* v0.3: horizontal page, focus tiles, mobile nav */
.why{margin-top:30px;font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:22px;line-height:1.3;color:var(--li);max-width:520px}
.use p{margin-bottom:8px}.use p b{color:var(--cr);font-weight:500}
.use h3{min-height:2.5em}
.navr{display:flex;align-items:center;gap:12px}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:6px;padding:9px 12px;font-size:14px;color:var(--cr)}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary:focus-visible{outline:2px solid var(--li);outline-offset:3px}
.bars{display:inline-flex;flex-direction:column;gap:3px;width:16px}.bars i{display:block;height:1.5px;background:var(--cr);border-radius:2px}
.mnav[open] summary{border-color:var(--li);color:var(--li)}.mnav[open] .bars i{background:var(--li)}
.mpanel{position:absolute;right:0;top:calc(100% + 10px);width:min(300px,calc(100vw - 32px));display:flex;flex-direction:column;background:var(--fo);border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:0 18px 40px rgba(0,0,0,.35);z-index:30}
.mpanel a{padding:12px 12px;font-size:15px;color:var(--cr);border-radius:8px}.mpanel a:hover{background:rgba(205,234,126,.08);color:var(--li)}
.mpanel .btn{margin-top:8px;justify-content:center;color:var(--fd)}.mpanel .btn:hover{color:var(--fd);background:#DDF39A}
@media (max-width:960px){.mnav{display:block}}
@media (max-width:860px){.use h3{min-height:0}.why{font-size:20px}}
@media (max-width:420px){.navr .btn.sm{display:none}.mlabel{display:inline}}
.mpanel .btn.ghost{margin-top:6px;color:var(--cr)}.mpanel .btn.ghost:hover{background:transparent;color:var(--li)}
.nav .mnav .mpanel{display:flex}
.nav .mnav .mpanel{gap:0}
.opt small{text-align:right}
@media (max-width:600px){.hvis .lbs.arc{font-size:11px;letter-spacing:.08em}}
.hero h1{font-size:clamp(44px,5.4vw,78px);line-height:1.02;margin:24px 0 18px;max-width:640px}
.tagline{font-size:22px;font-weight:400;color:var(--cr);letter-spacing:-.01em;margin-bottom:22px}
.tagline em{font-size:1.1em}
@media (max-width:860px){.hero h1{margin:18px 0 14px}.tagline{font-size:20px}}