/* ============================================================
   dop · Service — Beta  ·  stylesheet
   Desktop = sticky side index + expanded catalog (Work Page B)
   Mobile  = accordion spoilers (Mobile Service Selector A)
   Packages = homepage matrix + size picker (packages-v2 style)
   ============================================================ */
:root{
  --green:#15634A; --green-700:#0F4536; --signal:#1F8A63; --signal-tint:#E4EFE9;
  --paper:#F6F1E8; --paper-2:#FBF8F2; --sand:#EADFCB; --stone:#D6C7AC; --clay:#B6A584;
  --ink:#1C1A14; --ink-soft:#5C574C; --ink-faint:#928B7C;
  --line:rgba(28,26,20,.13); --line-2:rgba(28,26,20,.08);
  --ui:"Quicksand", system-ui, sans-serif;
  --serif:"Playfair Display", Georgia, serif;
  --edit:"Cormorant Garamond", Georgia, serif;
  --hand:"Caveat", cursive;
  --ease:cubic-bezier(.22,.84,.24,1);
}
*{box-sizing:border-box;}
html,body{margin:0;}
button{font-family:inherit; cursor:pointer;}
input{font-family:inherit;}
body{
  font-family:var(--ui); color:var(--ink);
  background:
    radial-gradient(130% 70% at 50% -6%, var(--paper-2), transparent 54%),
    linear-gradient(180deg, var(--paper) 0%, var(--sand) 230%);
  min-height:100vh;
}

/* ============ stage ============ */
.sb-stage{max-width:1560px; margin:0 auto; padding:clamp(28px,4vw,64px) clamp(18px,4vw,56px) 90px;}
.sb-stage-head{max-width:760px; margin:0 0 clamp(30px,4vw,52px);}
.sb-eyebrow{display:inline-flex; align-items:center; gap:11px; margin:0 0 14px;
  font:600 12px/1 var(--ui); letter-spacing:.24em; text-transform:uppercase; color:var(--green);}
.sb-eyebrow::before{content:""; width:28px; height:1.5px; background:var(--green);}
.sb-stage-head h1{margin:0; font-family:var(--serif); font-weight:500; letter-spacing:-.015em;
  font-size:clamp(30px,4.4vw,52px); line-height:1.04;}
.sb-stage-head h1 em{font-style:italic; color:var(--green);}
.sb-stage-head p{margin:16px 0 0; font:500 18px/1.5 var(--edit); color:var(--ink-soft); max-width:62ch;}

.sb-versions{display:flex; gap:clamp(26px,2.6vw,44px); align-items:flex-start; flex-wrap:wrap;}
.sb-version.h{flex:1 1 720px; min-width:600px;}
.sb-version.v{flex:0 0 392px;}
.sb-vcap{display:flex; flex-direction:column; gap:3px; margin:0 0 14px; padding-left:4px;}
.sb-vcap b{font:700 12.5px/1.2 var(--ui); letter-spacing:.06em; color:var(--ink);}
.sb-vcap span{font:500 14px/1.35 var(--edit); font-style:italic; color:var(--ink-soft);}

/* ============================================================
   DESKTOP PAGE  (sk-*)
   ============================================================ */
.sk-page{background:var(--paper-2); border:1px solid var(--line); border-radius:20px;
  color:var(--ink); box-shadow:0 40px 90px -56px rgba(28,26,20,.55);}
.sk-head-bar{display:flex; align-items:center; justify-content:space-between; gap:20px; border-radius:20px 20px 0 0;
  padding:0 34px; height:62px; border-bottom:1px solid var(--line); background:rgba(246,241,232,.7);}
.sk-logo{color:var(--ink); display:flex;}
.sk-topnav{display:flex; gap:24px; font:600 11px/1 var(--ui); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft);}
.sk-topnav span:first-child{color:var(--green);}
.sk-cta{font:700 10.5px/1 var(--ui); letter-spacing:.1em; text-transform:uppercase; color:var(--paper);
  background:var(--green); border:0; cursor:pointer; border-radius:999px; padding:11px 18px; white-space:nowrap; transition:background .25s;}
.sk-cta:hover{background:var(--green-700);}
.sk-cta.block{display:block; width:100%; text-align:center; margin-top:16px; padding:13px;}

.sk-hero{padding:30px 34px 24px; border-bottom:1px solid var(--line);}
.sk-eyebrow{font:600 11px/1 var(--ui); letter-spacing:.22em; text-transform:uppercase; color:var(--green);}
.sk-hero-title{margin:12px 0 0; font-family:var(--serif); font-weight:500; letter-spacing:-.015em; font-size:42px; line-height:1.04;}
.sk-hero-title em{font-style:italic; color:var(--green);}
.sk-hero-sub{margin:12px 0 0; font:italic 500 17px/1.45 var(--edit); color:var(--ink-soft); max-width:50ch;}

.sk-split{display:grid; grid-template-columns:222px 1fr; gap:30px; padding:8px 34px 36px;}
.sk-rail-index{position:sticky; top:18px; align-self:start; padding-top:26px; display:flex; flex-direction:column; gap:2px;}
.sk-rail-label{font:700 10px/1 var(--ui); letter-spacing:.2em; text-transform:uppercase; color:var(--clay); margin-bottom:12px;}
.sk-rail-item{display:flex; gap:11px; align-items:baseline; padding:10px 12px; border-radius:9px; text-decoration:none;
  font-family:var(--ui); transition:background .2s, color .2s;}
.sk-rail-item b{font:700 10px/1 var(--ui); color:var(--clay); width:18px; flex:0 0 auto;}
.sk-rail-item span{font:600 13.5px/1.15 var(--ui); color:var(--ink-soft);}
.sk-rail-item:hover{background:rgba(28,26,20,.04);}
.sk-rail-item.on{background:var(--sand);}
.sk-rail-item.on span{color:var(--ink);}
.sk-rail-item.on b{color:var(--green);}
.sk-rail-progress{margin:14px 12px 0; height:3px; border-radius:3px; background:var(--line); position:relative; overflow:hidden;}
.sk-rail-progress i{position:absolute; left:0; top:0; bottom:0; background:var(--green); border-radius:3px; transition:width .35s var(--ease);}

.sk-body{min-width:0; container-type:inline-size; container-name:body;}
.sk-block{padding:34px 0 6px; scroll-margin-top:18px;}
.sk-block:first-child{padding-top:20px;}
.sk-sec-head{display:flex; align-items:baseline; gap:14px; margin-bottom:18px;}
.sk-sec-no{font:700 11px/1 var(--ui); letter-spacing:.2em; color:var(--clay);}
.sk-sec-title{margin:0; font-family:var(--serif); font-weight:500; font-size:26px; letter-spacing:-.01em;}
.sk-sec-count{font:600 10px/1 var(--ui); letter-spacing:.06em; text-transform:uppercase; color:var(--signal);
  background:rgba(31,138,99,.1); border-radius:999px; padding:5px 10px; align-self:center;}
.sk-sec-rule{flex:1; height:1px; background:var(--line); align-self:center; min-width:14px;}
.sk-sec-note{font:600 10px/1 var(--ui); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); align-self:center;}

/* media tiles */
.sk-tile{position:relative; border-radius:12px; background:var(--stone); border:1px solid var(--line);
  overflow:hidden; display:flex; align-items:center; justify-content:center;}
.sk-imgglyph{width:30px; height:30px; color:rgba(28,26,20,.26);}
.sk-playo{position:absolute; filter:drop-shadow(0 4px 10px rgba(0,0,0,.25));}
.t-reel{background:linear-gradient(160deg,#D6C7AC,#c4b291);}
.t-video{background:linear-gradient(150deg,#cdd4cf,#c6b594);}
.t-ai-v{background:linear-gradient(155deg,#dfe9e2,#cfc4ab);}
.t-tour{background:linear-gradient(135deg,#cdd9d0,#cabd9f);}
.t-drone{background:linear-gradient(160deg,#c9d2cd,#c3b294);}
.t-drone-v{background:linear-gradient(160deg,#c9d2cd,#c3b294);}
.t-photo{background:linear-gradient(150deg,#d8cdb4,#c8b892);}
.t-plan{background:var(--paper-2);}
.t-stage{background:var(--sand);}
.sk-badge{position:absolute; top:8px; left:8px; font:700 8px/1 var(--ui); letter-spacing:.12em;
  text-transform:uppercase; background:rgba(28,26,20,.72); color:var(--paper); padding:4px 7px; border-radius:5px;}
.sk-badge.ai{background:var(--signal);}
.sk-cap{position:absolute; bottom:7px; right:9px; font:600 9px/1.2 var(--ui); letter-spacing:.02em;
  color:var(--paper); text-shadow:0 1px 4px rgba(0,0,0,.5); max-width:80%; text-align:right;}
.sk-cap-l{position:absolute; bottom:7px; left:9px; font:600 9px/1 var(--ui); color:var(--paper); text-shadow:0 1px 4px rgba(0,0,0,.5);}
.sk-cap-t{position:absolute; top:8px; right:9px; font:600 9px/1 var(--ui); color:var(--ink-soft);}
.sk-planart{width:72%; height:72%; color:var(--green-700); opacity:.8;}
.t-stage .sk-ba-after,.t-stage .sk-ba-before{position:absolute; inset:0; display:flex; align-items:center; justify-content:center;}
.t-stage .sk-ba-after{background:linear-gradient(150deg,#dfe9e2,#cbbf9f); color:rgba(28,26,20,.3);}
.t-stage .sk-ba-before{clip-path:inset(0 50% 0 0); background:var(--stone); color:rgba(28,26,20,.22);}
.sk-ba-divider{position:absolute; top:0; bottom:0; left:50%; width:2px; background:var(--paper); transform:translateX(-1px);}
.sk-ba-handle{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:26px; height:26px; border-radius:50%;
  background:var(--paper); color:var(--ink); font:700 10px/26px var(--ui); text-align:center; box-shadow:0 2px 6px rgba(0,0,0,.25);}

.sk-grid-2{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.sk-grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.sk-stack{display:flex; flex-direction:column; gap:12px;}
.sk-rail{display:flex; gap:12px; overflow:hidden;}
.sk-ai-grid{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:100px; gap:12px;}
.sk-ai-grid .span2{grid-column:span 2;}
.sk-ai-grid .rows2{grid-row:span 2;}
.sk-ai-grid .sk-tile{width:100%; height:100%; aspect-ratio:auto !important;}
.sk-more{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  border:1px dashed var(--clay); border-radius:12px; color:var(--green-700); font:700 22px/1 var(--serif);}
.sk-more span{font:600 9px/1 var(--ui); letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint);}
.sk-tour-hint{position:absolute; top:50%; left:50%; transform:translate(-50%,18px); font:600 10px/1 var(--ui);
  letter-spacing:.1em; text-transform:uppercase; color:var(--paper); text-shadow:0 1px 4px rgba(0,0,0,.5);}
.sk-drone-row{display:grid; grid-template-columns:1.4fr 1fr; gap:14px; align-items:start;}
.sk-drone-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px;}

.sk-foot{display:flex; align-items:center; justify-content:space-between; gap:16px; border-radius:0 0 20px 20px;
  padding:26px 34px; background:var(--ink); color:rgba(246,241,232,.6); font:500 11px/1 var(--ui); letter-spacing:.04em;}
.sk-foot .sk-logo,.sk-foot svg{color:var(--paper);}

/* narrow desktop column → simpler grids */
@container body (max-width:640px){
  .sk-grid-3{grid-template-columns:1fr 1fr;}
  .sk-ai-grid{grid-template-columns:1fr 1fr;}
  .sk-drone-row{grid-template-columns:1fr;}
}

/* ============================================================
   MOBILE PHONE  (accordion spoilers)
   ============================================================ */
.phone{width:392px; height:840px; border-radius:50px; background:#15140F; padding:11px;
  box-shadow:0 50px 90px -34px rgba(28,26,20,.5), 0 0 0 2px rgba(28,26,20,.06);}
.phone-screen{position:relative; width:100%; height:100%; border-radius:40px; overflow:hidden; background:var(--paper);}
.statusbar{position:absolute; top:0; left:0; right:0; height:46px; z-index:30; display:flex; align-items:center; justify-content:space-between;
  padding:0 30px; font:700 13px/1 var(--ui); color:var(--ink); pointer-events:none;}
.statusbar .notch{width:108px; height:26px; background:#15140F; border-radius:0 0 16px 16px; margin-top:-12px;}
.sb-r{display:flex; align-items:center; gap:5px;}
.sb-r i{width:5px; height:5px; border-radius:50%; background:var(--ink);}
.sb-r .bat{width:22px; height:11px; border-radius:3px; border:1.5px solid var(--ink);}
.phone-scroll{position:absolute; inset:0; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;}
.phone-scroll::-webkit-scrollbar{width:0;}

.scr-head{padding:58px 22px 6px;}
.scr-logo{color:var(--ink); margin-bottom:18px; display:flex;}
.scr-eyebrow{display:block; font:600 10px/1 var(--ui); letter-spacing:.22em; text-transform:uppercase; color:var(--green); margin-bottom:9px;}
.scr-title{margin:0; font-family:var(--serif); font-weight:500; font-size:30px; letter-spacing:-.015em; line-height:1.04;}
.scr-title em{font-style:italic; color:var(--green);}

/* media card (sellable) */
.mc{position:relative; border-radius:16px; overflow:hidden; display:flex; align-items:center; justify-content:center; color:rgba(246,241,232,.5);}
.mc .imgglyph{width:26px; height:26px;}
.mc.is-plan{color:var(--green-700);}
.planart{width:60%; height:60%; opacity:.85;}
.playo{position:absolute; filter:drop-shadow(0 4px 10px rgba(0,0,0,.3));}
.mc-grad{position:absolute; left:0; right:0; bottom:0; height:62%; background:linear-gradient(0deg, rgba(10,12,10,.78), transparent);}
.mc.is-plan .mc-grad{height:40%; background:linear-gradient(0deg, rgba(20,18,12,.35), transparent);}
.mc-meta{position:absolute; left:13px; right:13px; bottom:11px; display:flex; flex-direction:column; gap:2px; z-index:2;}
.mc-meta b{font-family:var(--serif); font-weight:600; font-size:15px; color:var(--paper); letter-spacing:-.01em;}
.mc-meta i{font:600 9px/1 var(--ui); letter-spacing:.14em; text-transform:uppercase; color:rgba(246,241,232,.66); font-style:normal;}
.mc-price{position:absolute; top:11px; right:11px; z-index:3; font:700 12px/1 var(--ui); letter-spacing:.01em;
  background:var(--paper); color:var(--green-700); border-radius:999px; padding:7px 11px; box-shadow:0 3px 10px rgba(0,0,0,.18);}
.mc-price.ai{background:var(--signal); color:var(--paper);}
.mc-ba{position:absolute; top:11px; left:11px; z-index:3; font:700 8.5px/1 var(--ui); letter-spacing:.14em;
  background:rgba(28,26,20,.66); color:var(--paper); padding:5px 8px; border-radius:6px;}

.panel-stack{display:flex; flex-direction:column; gap:12px;}
.panel-rail{display:flex; gap:12px; overflow-x:auto; padding-bottom:4px; scroll-snap-type:x mandatory;}
.panel-rail::-webkit-scrollbar{height:0;}
.panel-rail .mc{scroll-snap-align:start;}

.od{display:grid; place-items:center; width:34px; height:34px; border-radius:50%;
  border:1px solid var(--line); color:var(--green); flex:0 0 auto; transition:transform .45s var(--ease), background .25s, color .25s, border-color .25s;}
.od svg{width:20px; height:20px;}
.od.open{transform:rotate(90deg); background:var(--green); color:var(--paper); border-color:var(--green);}

.acc{padding:6px 18px 24px;}
.acc-row{border-bottom:1px solid var(--line);}
.acc-row:first-child{border-top:1px solid var(--line);}
.acc-bar{width:100%; background:none; border:0; cursor:pointer; display:flex; align-items:center; gap:14px;
  padding:18px 4px; text-align:left; font-family:inherit;}
.acc-no{font:700 11px/1 var(--ui); letter-spacing:.16em; color:var(--clay); width:18px; flex:0 0 auto;}
.acc-tt{flex:1; min-width:0; display:flex; flex-direction:column; gap:5px;}
.acc-title{font-family:var(--serif); font-weight:500; font-size:23px; letter-spacing:-.01em; line-height:1; transition:color .25s;}
.acc-row.open .acc-title{color:var(--green);}
.acc-tag{font:600 9.5px/1 var(--ui); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint);}
.acc-panel{overflow:hidden; transition:max-height .5s var(--ease);}
.acc-panel>*{margin-bottom:14px;}
.acc-panel .panel-stack,.acc-panel .panel-rail{padding-top:4px;}
.acc-book{margin:2px 0 22px; width:100%; background:var(--sand); border:0; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:8px; border-radius:999px; padding:14px;
  font:700 11px/1 var(--ui); letter-spacing:.12em; text-transform:uppercase; color:var(--green-700); transition:background .25s;}
.acc-book:hover{background:var(--stone);}
.acc-book span{transition:transform .25s var(--ease);}
.acc-book:hover span{transform:translateX(4px);}
.peek{display:flex; align-items:center; flex:0 0 auto;}
.peek-t{width:30px; height:30px; border-radius:8px; margin-left:-8px; border:2px solid var(--paper); box-shadow:0 2px 6px rgba(0,0,0,.12);}
.peek-t:first-child{margin-left:0;}
.peek-n{margin-left:8px; font:700 11px/1 var(--ui); color:var(--ink-faint);}

/* ============================================================
   PACKAGES  (homepage style)
   ============================================================ */
.pk{padding-top:8px;}
.pk-head{margin-bottom:24px;}
.pk-eyebrow{display:inline-flex; align-items:center; gap:11px; margin:0 0 12px;
  font:600 12px/1 var(--ui); letter-spacing:.22em; text-transform:uppercase; color:var(--green);}
.pk-eyebrow::before{content:""; width:26px; height:1.5px; background:var(--green);}
.pk-head h3{margin:0; font-family:var(--serif); font-weight:500; letter-spacing:-.01em; font-size:clamp(24px,3vw,38px); line-height:1.08; max-width:16ch; text-wrap:balance;}
.pk-head h3 em{font-style:italic; color:var(--green);}
.pk-lede{margin:12px 0 0; font:500 16px/1.45 var(--edit); color:var(--ink-soft); max-width:42ch;}

/* size picker */
.picker{padding:20px clamp(16px,2vw,26px) 24px; background:var(--paper-2); border:1px solid var(--line); border-radius:20px;
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset, 0 16px 40px -34px rgba(28,26,20,.5); margin-bottom:clamp(26px,3vw,40px);}
.picker-top{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:16px; flex-wrap:wrap;}
.picker-top .p-q{font-family:var(--serif); font-size:clamp(18px,2vw,23px); font-weight:500; color:var(--ink);}
.picker-top .p-cur{font:600 13px/1 var(--ui); color:var(--ink-faint);}
.picker-top .p-cur b{font-size:19px; color:var(--green-700); font-variant-numeric:tabular-nums;}
.type-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:12px;}
.typecard{border:1.5px solid var(--line); border-radius:16px; background:var(--paper); padding:16px 14px 14px;
  display:flex; flex-direction:column; gap:8px; min-height:138px; text-align:left;
  transition:transform .3s var(--ease), border-color .15s, background .15s, box-shadow .3s, padding .15s;}
.typecard .ic{width:28px; height:28px; color:var(--green);}
.typecard .ic svg{width:100%; height:100%;}
.typecard b{font:700 14.5px/1.15 var(--ui); color:var(--ink);}
.typecard .ts{font:500 12px/1 var(--ui); color:var(--ink-faint);}
.typecard .tsz{margin-top:auto; font:700 12.5px/1 var(--ui); color:var(--green-700);}
.typecard:hover{border-color:var(--ink-soft); transform:translateY(-3px); box-shadow:0 16px 32px -24px rgba(28,26,20,.55);}
.typecard.on{border:2px solid var(--green); background:var(--signal-tint); padding:15px 13px 13px;}
.slider-row{margin-top:18px; padding-top:16px; border-top:1.5px dashed var(--line);}
.sl-top{display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:8px;}
.sl-label{font:700 12px/1 var(--ui); letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint);}
.sl-val{display:flex; align-items:baseline; gap:6px; font-variant-numeric:tabular-nums;}
.sl-val b{font:700 26px/1 var(--ui); color:var(--green-700); letter-spacing:-.01em;}
.sl-val span{font:700 11px/1 var(--ui); letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint);}
.sz-range{-webkit-appearance:none; appearance:none; width:100%; height:30px; background:transparent; margin:0; padding:0; cursor:pointer; display:block;}
.sz-range::-webkit-slider-runnable-track{height:8px; border-radius:8px; background:linear-gradient(90deg, var(--green) var(--fill,10%), var(--sand) var(--fill,10%));}
.sz-range::-webkit-slider-thumb{-webkit-appearance:none; width:28px; height:28px; border-radius:50%; margin-top:-10px;
  background:var(--paper-2); border:3.5px solid var(--green); box-shadow:0 2px 10px rgba(28,26,20,.3); cursor:grab;}
.sz-range:active::-webkit-slider-thumb{cursor:grabbing; background:var(--signal-tint);}
.sz-range::-moz-range-track{height:8px; border-radius:8px; background:var(--sand);}
.sz-range::-moz-range-thumb{width:21px; height:21px; border-radius:50%; background:var(--paper-2); border:3.5px solid var(--green); box-shadow:0 2px 10px rgba(28,26,20,.3); cursor:grab;}
.sl-scale{display:flex; justify-content:space-between; margin-top:7px; font:600 11px/1 var(--ui); color:var(--ink-faint); font-variant-numeric:tabular-nums;}

.pk-sub{display:flex; align-items:baseline; gap:14px; margin:0 0 16px; flex-wrap:wrap;}
.pk-sub .se{font:700 12px/1 var(--ui); letter-spacing:.18em; text-transform:uppercase; color:var(--green);}
.pk-sub .sx{font-family:var(--edit); font-style:italic; font-size:17px; color:var(--ink-soft);}

/* matrix (wide desktop column only) */
.pk-matrix{display:none; border:1px solid var(--line); border-radius:20px; overflow:hidden; background:var(--paper-2);
  box-shadow:0 24px 60px -44px rgba(28,26,20,.55);}
@container body (min-width:720px){ .pk-matrix{display:block;} .sk-body .pk-cards{display:none;} }
.mx-grid{display:grid; grid-template-columns:1.35fr 1fr 1fr 1fr 1fr;}
.mx-cell{padding:18px clamp(10px,1.1vw,18px);}
.mx-corner{display:flex; flex-direction:column; justify-content:flex-end; gap:6px;}
.mx-corner .wi{font:700 12px/1 var(--ui); letter-spacing:.16em; text-transform:uppercase; color:var(--green);}
.mx-corner .wi-sub{font-family:var(--edit); font-style:italic; font-size:16px; color:var(--ink-soft);}
.mx-head{position:relative; border-left:1px solid var(--line-2); padding-top:48px; display:flex; flex-direction:column; gap:3px;}
.mx-head.feat{background:linear-gradient(180deg, var(--signal-tint), var(--paper-2));}
.mx-head .tag{position:absolute; top:12px; right:clamp(10px,1.1vw,18px); font-family:var(--hand); font-size:19px; font-weight:700; color:var(--green-700); transform:rotate(-3deg); white-space:nowrap;}
.mx-head .pname{font-family:var(--serif); font-weight:600; font-size:19px; color:var(--ink); display:flex; align-items:center; gap:7px;}
.mx-head .pname .ar{color:var(--green);}
.mx-head .price{display:flex; align-items:baseline; gap:4px; margin-top:7px;}
.mx-head .price .c{font:700 18px/1 var(--ui); color:var(--green-700);}
.mx-head .price .v{font:700 30px/.95 var(--ui); letter-spacing:-.02em; color:var(--ink); font-variant-numeric:tabular-nums;}
.mx-head.feat .price .v{color:var(--green-700);}
.mx-head .psub{font:600 12px/1.2 var(--ui); color:var(--ink-faint); margin-top:6px;}
.mx-head .cta{margin-top:14px; padding:10px 12px; border-radius:100px; font:700 12.5px/1 var(--ui);
  border:1.5px solid var(--ink); background:transparent; color:var(--ink); display:flex; align-items:center; justify-content:center; gap:8px; transition:.15s;}
.mx-head .cta .ar{transition:transform .2s;}
.mx-head .cta:hover .ar{transform:translateX(3px);}
.mx-head.feat .cta{background:var(--green); border-color:var(--green); color:#fff;}
.mx-head .cta:hover{background:var(--sand);}
.mx-head.feat .cta:hover{background:var(--green-700);}
.mx-head.lux{background:linear-gradient(168deg, #23271E 0%, var(--green-700) 130%); color:var(--paper);}
.mx-head.lux .pname,.mx-head.lux .price .v{color:var(--paper);}
.mx-head.lux .pname .ar,.mx-head.lux .price .c,.mx-head.lux .tag{color:var(--sand);}
.mx-head.lux .psub{color:rgba(246,241,232,.55);}
.mx-head.lux .cta{border-color:var(--sand); color:var(--sand);}
.mx-head.lux .cta:hover{background:var(--sand); color:var(--ink);}
.mx-row{display:contents;}
.mx-row .gfull{grid-column:1 / -1; padding:10px clamp(10px,1.1vw,18px); background:var(--sand);
  font:700 11.5px/1 var(--ui); letter-spacing:.16em; text-transform:uppercase; color:var(--green);}
.mx-row .rl,.mx-row .rc{padding:12px clamp(10px,1.1vw,18px); border-top:1px solid var(--line-2); display:flex; align-items:center;}
.mx-row .rl{gap:8px;}
.mx-row .rl b{font:600 13.5px/1.2 var(--ui); color:var(--ink);}
.mx-row .rc{justify-content:center; border-left:1px solid var(--line-2);}
.mx-row .rc[data-fi]{cursor:help;}
.mx-row .rc.feat{background:rgba(31,138,99,.05);}
.mx-row .rc.lux{background:rgba(28,26,20,.035);}
.ck{width:23px;height:23px;border-radius:50%; background:var(--signal-tint); display:inline-flex; align-items:center; justify-content:center; transition:transform .26s var(--ease), box-shadow .26s;}
.ck svg{width:12px;height:12px;color:var(--green);}
.mx-row .rc[data-fi].cur .ck{transform:scale(1.24); box-shadow:0 0 0 6px rgba(31,138,99,.12);}
.dash{width:18px;height:1.5px;background:var(--stone); border-radius:2px;}

/* package cards (mobile + narrow desktop) */
.pk-cards{display:flex; flex-direction:column; gap:18px;}
.pcard{position:relative; background:var(--paper-2); border:1.5px solid var(--line); border-radius:18px; padding:22px 20px 20px; box-shadow:0 14px 40px -36px rgba(28,26,20,.5);}
.pcard.feat{border:2px solid var(--green); background:linear-gradient(180deg, var(--signal-tint), var(--paper-2) 55%);}
.pcard.lux{background:linear-gradient(168deg, #23271E 0%, var(--green-700) 130%); border-color:var(--green-700); color:var(--paper);}
.pc-tag{position:absolute; top:-13px; right:14px; font-family:var(--hand); font-size:19px; font-weight:700; line-height:1; color:var(--green-700); transform:rotate(-3deg);}
.pcard.lux .pc-tag{color:var(--sand);}
.pc-top{display:flex; align-items:baseline; justify-content:space-between; gap:14px;}
.pc-name{font-family:var(--serif); font-weight:600; font-size:23px; color:var(--ink); display:flex; align-items:center; gap:8px;}
.pc-name .ar{color:var(--green);}
.pcard.lux .pc-name{color:var(--paper);} .pcard.lux .pc-name .ar{color:var(--sand);}
.pc-price{display:flex; align-items:baseline; gap:3px; flex:0 0 auto;}
.pc-price .c{font:700 16px/1 var(--ui); color:var(--green-700);}
.pc-price .v{font:700 32px/.9 var(--ui); letter-spacing:-.02em; color:var(--ink); font-variant-numeric:tabular-nums;}
.pcard.feat .pc-price .v{color:var(--green-700);}
.pcard.lux .pc-price .c{color:var(--sand);} .pcard.lux .pc-price .v{color:var(--paper);}
.pc-sub{font:600 12px/1 var(--ui); color:var(--ink-faint); margin-top:6px;}
.pcard.lux .pc-sub{color:rgba(246,241,232,.55);}
.pc-base{margin-top:13px; font-family:var(--edit); font-style:italic; font-size:16px; color:var(--ink-soft);}
.pc-base b{color:var(--ink); font-style:normal; font-family:var(--ui); font-size:13px; font-weight:700;}
.pcard.lux .pc-base{color:rgba(246,241,232,.75);} .pcard.lux .pc-base b{color:var(--paper);}
.pc-feats{display:flex; flex-direction:column; gap:9px; margin-top:12px;}
.pc-feat{display:flex; align-items:flex-start; gap:9px; font:500 13.5px/1.3 var(--ui); color:var(--ink-soft); text-align:left; background:none; border:0; padding:0; width:100%;}
.pc-feat .mck{width:17px;height:17px;border-radius:50%; background:var(--signal-tint); display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; margin-top:1px;}
.pc-feat .mck svg{width:10px;height:10px;color:var(--green);}
.pc-feat b{font-weight:600; color:var(--ink);}
.pcard.lux .pc-feat{color:rgba(246,241,232,.8);} .pcard.lux .pc-feat b{color:var(--paper);}
.pcard.lux .pc-feat .mck{background:rgba(246,241,232,.14);} .pcard.lux .pc-feat .mck svg{color:var(--sand);}
.pcard .cta{width:100%; margin-top:16px; padding:14px; border-radius:100px; font:700 14px/1 var(--ui);
  border:1.5px solid var(--ink); background:transparent; color:var(--ink); display:flex; align-items:center; justify-content:center; gap:8px;}
.pcard.feat .cta{background:var(--green); border-color:var(--green); color:#fff;}
.pcard.lux .cta{border-color:var(--sand); color:var(--sand);}
.pk-cards-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@container body (max-width:520px){ .pk-cards-grid{grid-template-columns:1fr;} }

.foot-note{margin-top:28px; text-align:center; font-family:var(--edit); font-style:italic; font-size:17px; color:var(--ink-soft);}
.foot-note a{color:var(--green); text-decoration:underline; text-underline-offset:3px;}

/* coverage map */
.cov{border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--sand);}
.cov-map{background:radial-gradient(110% 100% at 50% 0%, var(--paper) 0%, var(--stone) 160%); padding:6px clamp(8px,2vw,16px) 10px;}
.cov-map svg{display:block; width:100%; height:auto;}
.cov-map svg text{font-family:var(--ui);}
.cov-map .city{font-weight:600; paint-order:stroke; stroke:var(--paper); stroke-width:4px; stroke-linejoin:round; fill:var(--ink);}
.cov-map .city.ext-l{fill:var(--ink-soft);}
.cov-map .city.major{font-weight:700; fill:var(--green);}
.cov-foot{display:flex; align-items:center; gap:18px; flex-wrap:wrap; padding:14px 18px;}
.lg{display:flex; align-items:center; gap:9px; font:600 11.5px/1.2 var(--ui); color:var(--ink-soft);}
.lg b{color:var(--ink); font-weight:700;}
.lg .sw{width:24px; height:13px; border-radius:5px; flex:0 0 auto;}
.lg .sw.core{background:rgba(21,99,74,.18); border:1.5px solid var(--green);}
.lg .sw.ext{background:rgba(21,99,74,.06); border:1.5px dashed var(--green);}
.cov-note{margin:0; padding:0 18px 18px; font:italic 500 13.5px/1.5 var(--edit); color:var(--ink-soft);}

/* feature tooltip */
.ftip{position:fixed; z-index:600; width:max-content; max-width:280px; pointer-events:none;
  background:#211E17; color:var(--paper); border-radius:14px; padding:13px 17px 14px;
  box-shadow:0 30px 60px -24px rgba(18,16,10,.72); opacity:0; transform:translateY(8px) scale(.96); transform-origin:bottom center;
  transition:opacity .18s ease, transform .26s var(--ease);}
.ftip.on{opacity:1; transform:translateY(0) scale(1);}
.ftip .ft-name{display:flex; align-items:center; gap:9px; margin:0 0 6px; font:600 16px/1.2 var(--serif); color:var(--paper);}
.ftip .ft-name::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--signal); flex:0 0 auto;}
.ftip .ft-desc{font:500 15px/1.32 var(--edit); font-style:italic; color:#D8C7A2; max-width:30ch;}

@media (max-width:1240px){
  .sb-version.h{flex:1 1 100%; min-width:0;}
  .sb-version.v{flex:0 0 auto; margin:0 auto;}
}
@media (max-width:560px){
  .sk-split{grid-template-columns:1fr; gap:16px;}
  .sk-rail-index{position:static; flex-direction:row; flex-wrap:wrap; padding-top:0;}
  .sk-rail-progress{display:none;} .sk-rail-label{width:100%;}
  .sk-topnav{display:none;}
  .phone{width:100%; max-width:392px;}
  .type-grid{grid-template-columns:1fr 1fr;}
}
@media (prefers-reduced-motion: reduce){ *{transition-duration:.01ms !important; animation:none !important;} }