/* ============================================================
   MOLDIES DESIGN SYSTEM v2 · shared across every page
   Dark graphite bento OS · mint signal · one bold moment per page
   Layout: 12-col bento, 14px gap, tiles carry depth; text never
   wider than 62ch. All spacing is logical (RTL-safe for Hebrew).
   ============================================================ */
:root{
  color-scheme:dark;
  /* surfaces */
  --bg:#0E1014;--tile:#171A21;--tile2:#1F232C;--tile3:#272C37;
  --line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.15);
  /* text (all AA on --tile) */
  --text:#F2F1EC;--dim:#A9AEBA;--dim2:#8D93A2;
  /* signal */
  --mint:#5FE3C0;--mint-ink:#062A22;--forest:#0C6B5B;--forest2:#11806C;
  --amber:#F2B657;--coral:#FF7A68;--cream:#F1EFE8;--ink:#0A0B0F;--cream-dim:#55554E;
  /* type */
  --disp:'Darker Grotesque','Arial Narrow',system-ui,sans-serif;
  --body:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --ds:1;      /* display scale: Darker Grotesque runs small, other scripts don't */
  --dlh:.9;    /* display line-height */
  --dtr:-.015em;
  /* scale (display) */
  --d1:calc(clamp(54px,7.2vw,104px)*var(--ds));
  --d2:calc(clamp(38px,4.6vw,60px)*var(--ds));
  --d3:calc(clamp(28px,2.6vw,36px)*var(--ds));
  --d4:calc(25px*var(--ds));
  --d5:calc(21px*var(--ds));
  /* shape + depth */
  --r:24px;--r2:14px;--r3:10px;
  --lift:inset 0 1px 0 rgba(255,255,255,.055),0 1px 2px rgba(0,0,0,.4),0 18px 40px -24px rgba(0,0,0,.65);
  --ease:cubic-bezier(.2,.7,.2,1);
  --gut:max(16px,env(safe-area-inset-left,0px));
  --gut-r:max(16px,env(safe-area-inset-right,0px));
}
/* per-script type: Greek + Russian + Hebrew have no Darker Grotesque */
:root:lang(el),:root:lang(ru){
  --disp:'Sofia Sans Semi Condensed','Arial Narrow',system-ui,sans-serif;
  --body:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ds:.8;--dlh:1;--dtr:-.01em;
}
:root:lang(he){
  --disp:'Heebo','Arial Hebrew',system-ui,sans-serif;
  --body:'Heebo','Arial Hebrew',system-ui,sans-serif;
  --ds:.74;--dlh:1.04;--dtr:-.01em;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:50;background:var(--bg)}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
img,svg{display:block;max-width:100%}
[hidden]{display:none!important}
h1,h2,h3,h4{font-family:var(--disp);font-weight:800;letter-spacing:var(--dtr);line-height:var(--dlh);text-wrap:balance}
p{text-wrap:pretty}
:focus-visible{outline:2px solid var(--mint);outline-offset:3px;border-radius:6px}
.on-light :focus-visible,.on-light:focus-visible{outline-color:var(--forest)}
.wrap{max-width:1296px;margin-inline:auto;padding-left:var(--gut);padding-right:var(--gut-r)}
@media(min-width:700px){.wrap{padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}}
.num{font-variant-numeric:tabular-nums}
.ltr{direction:ltr;unicode-bidi:isolate}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:99;background:var(--mint);color:var(--ink);font-weight:600;padding:10px 16px;border-radius:10px}
.skip:focus{top:calc(12px + env(safe-area-inset-top,0px))}
[dir=rtl] .arr{transform:scaleX(-1)}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:linear-gradient(180deg,var(--bg) 62%,rgba(14,16,20,0))}
.topbar .in{display:flex;align-items:center;gap:8px;padding-block:14px 12px}
.brand{display:flex;align-items:center;gap:10px;margin-inline-end:auto}
.brand .mk{width:34px;height:34px;border-radius:10px;background:var(--mint);display:grid;place-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.brand .mk svg{width:20px;height:20px}
.brand .nm{font-family:'Darker Grotesque',var(--disp);font-weight:800;font-size:29px;letter-spacing:-.015em;line-height:1;padding-bottom:3px}
.barnav{display:flex;align-items:center;gap:2px}
.barnav a{color:var(--dim);font-weight:500;font-size:15px;padding:8px 13px;border-radius:10px;transition:color .15s,background .15s}
.barnav a:hover,.barnav a[aria-current=page]{color:var(--text);background:var(--tile)}
.bar-tel{font-weight:600;font-size:15px;padding:8px 12px;white-space:nowrap}
.bar-tel:hover{color:var(--mint)}
.lang{position:relative}
.lang summary,.menu summary{list-style:none;display:flex;align-items:center;gap:6px;height:40px;padding-inline:12px;border:1px solid var(--line2);border-radius:100px;font-weight:600;font-size:14px;cursor:pointer;color:var(--dim)}
.lang summary::-webkit-details-marker,.menu summary::-webkit-details-marker{display:none}
.lang summary:hover,.menu summary:hover{color:var(--text)}
.lang summary svg,.menu summary svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8}
.lang ul,.menu ul{position:absolute;inset-inline-end:0;top:46px;z-index:5;list-style:none;min-width:168px;background:var(--tile2);border:1px solid var(--line2);border-radius:var(--r2);padding:6px;box-shadow:0 24px 50px -18px rgba(0,0,0,.8)}
.lang a,.menu a{display:flex;justify-content:space-between;gap:16px;padding:10px 12px;border-radius:9px;font-size:15px;font-weight:500}
.lang a:hover,.menu a:hover{background:var(--tile3)}
.lang a[aria-current]{color:var(--mint)}
.lang a small{color:var(--dim2);font-size:12px;font-family:var(--mono)}
.menu{position:relative;display:none}
@media(max-width:1020px){.barnav,.bar-tel{display:none}.menu{display:block}}
@media(max-width:520px){.topbar .btn{display:none}}

/* ---------- buttons ---------- */
.btn{font-weight:600;font-size:15.5px;line-height:1.2;border-radius:100px;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 22px;text-align:center;transition:background .18s,border-color .18s,color .18s,transform .18s var(--ease)}
.btn svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--ease)}
.btn:hover svg.arr{transform:translateX(3px)}
[dir=rtl] .btn:hover svg.arr{transform:scaleX(-1) translateX(3px)}
.btn:active{transform:scale(.98)}
.btn-p{background:var(--mint);color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 26px -14px rgba(95,227,192,.7)}
.btn-p:hover{background:#7CEBCD}
.btn-g{border:1px solid var(--line2);color:var(--text)}
.btn-g:hover{border-color:var(--mint);color:var(--mint)}
.btn-f{background:var(--forest);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.btn-f:hover{background:var(--forest2)}
.btn-sm{min-height:40px;padding:8px 16px;font-size:14.5px}
.btn[disabled]{opacity:.55;cursor:progress}
.tlink{font-weight:600;color:var(--mint);display:inline-flex;align-items:center;gap:7px}
.tlink svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--ease)}
.tlink:hover svg{transform:translateX(3px)}
[dir=rtl] .tlink:hover svg{transform:scaleX(-1) translateX(3px)}

/* ---------- tiles ---------- */
.t{background:var(--tile);border:1px solid var(--line);border-radius:var(--r);padding:26px;position:relative;box-shadow:var(--lift);min-width:0}
a.t,.t.is-link{transition:border-color .2s,background .2s}
a.t:hover,.t.is-link:hover{border-color:var(--line2);background:var(--tile2)}
.tag{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--dim);border:1px solid var(--line2);border-radius:100px;padding:4px 11px;white-space:nowrap}
.tag.mint{color:var(--mint);border-color:rgba(95,227,192,.35)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--mint);flex:none}
.dot.amber{background:var(--amber)}.dot.coral{background:var(--coral)}

/* ---------- chips (always real buttons / links) ---------- */
.chip{border:1px solid var(--line2);border-radius:100px;min-height:42px;padding:8px 15px;font-size:14.5px;font-weight:500;color:var(--text);display:inline-flex;align-items:center;gap:8px;transition:border-color .15s,background .15s,color .15s;user-select:none;text-align:start}
a.chip{white-space:nowrap}
.chip:hover{border-color:var(--mint)}
.chip[aria-pressed=true],.chip.on{background:var(--mint);color:var(--ink);border-color:var(--mint);font-weight:600}

/* ============================================================
   SHARED PAGE COMPONENTS (inner templates)
   ============================================================ */
.phero{padding-block:44px 30px}
.crumb{font-size:14px;color:var(--dim);margin-bottom:22px;display:flex;flex-wrap:wrap;gap:8px}
.crumb a:hover{color:var(--mint)}
.phero h1{font-size:var(--d1);max-width:16ch}
.phero .lead{color:var(--dim);font-size:19px;max-width:58ch;margin-top:20px}
.phero .cta{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}
.section{padding-block:40px}
.section>.head{margin-bottom:26px;display:flex;flex-direction:column;gap:12px}
.section h2,.h2{font-size:var(--d2);max-width:20ch}
.section .sub{color:var(--dim);font-size:17.5px;max-width:58ch}
.cardgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cardgrid.two{grid-template-columns:repeat(2,1fr)}
.cardgrid.four{grid-template-columns:repeat(4,1fr)}
.ecard{background:var(--tile);border:1px solid var(--line);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--lift);min-width:0;transition:border-color .2s,background .2s}
a.ecard:hover{border-color:var(--line2);background:var(--tile2)}
.ecard .ic{width:44px;height:44px;border-radius:12px;background:var(--tile2);border:1px solid var(--line2);display:grid;place-items:center;margin-bottom:8px}
.ecard .ic svg,.svc .ic svg{width:22px;height:22px;stroke:var(--mint);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ecard h3{font-size:var(--d4);line-height:1}
.ecard p{color:var(--dim);font-size:15.5px}
.ecard .tlink{margin-top:auto;padding-top:8px;font-size:15px}
.price{font-family:var(--disp);font-weight:800;font-size:calc(30px*var(--ds));line-height:1;color:var(--text)}
.price small{font-family:var(--body);font-size:14px;font-weight:500;color:var(--dim);letter-spacing:0}
.steps{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--tile);box-shadow:var(--lift);list-style:none;counter-reset:s}
.step{padding:26px 24px;border-inline-end:1px solid var(--line);counter-increment:s;display:flex;flex-direction:column;gap:8px}
.step:last-child{border-inline-end:0}
.step::before{content:counter(s);font-family:var(--disp);font-weight:800;font-size:calc(40px*var(--ds));line-height:.8;color:var(--mint)}
.step h3{font-size:var(--d4);margin-top:8px}
.step p{color:var(--dim);font-size:15px}
.faq{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--tile);box-shadow:var(--lift)}
.faq details+details{border-top:1px solid var(--line)}
.faq summary{padding:20px 24px;font-family:var(--disp);font-weight:700;font-size:calc(23px*var(--ds));letter-spacing:var(--dtr);line-height:1.05;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:12px;height:12px;border-inline-end:2px solid var(--mint);border-bottom:2px solid var(--mint);transform:rotate(45deg) translate(-3px,-3px);transition:transform .2s var(--ease)}
.faq details[open] summary::after{transform:rotate(225deg) translate(-3px,-3px)}
.faq summary:hover{color:var(--mint)}
.faq .a{padding:0 24px 22px;color:var(--dim);font-size:16px;max-width:70ch}
.faq .a a,.prose a,.phero .lead a{color:var(--mint);text-decoration:underline;text-decoration-color:rgba(95,227,192,.4);text-underline-offset:3px}
.ctaband{background:radial-gradient(ellipse 70% 130% at 50% -10%,rgba(95,227,192,.16),transparent 70%),var(--tile);border:1px solid var(--line2);border-radius:var(--r);padding:56px 28px;margin-block:26px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;box-shadow:var(--lift)}
.ctaband h2{font-size:var(--d2);max-width:18ch}
.ctaband p{color:var(--dim);font-size:18px;max-width:46ch}
.ctaband .btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.widget{background:linear-gradient(150deg,var(--tile2),var(--tile));border:1px solid var(--line2);border-radius:var(--r);padding:24px 26px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;box-shadow:var(--lift)}
.widget .wt{flex:1;min-width:220px}
.widget .wt b{font-family:var(--disp);font-weight:800;font-size:var(--d4);line-height:1.05;display:block}
.widget .wt span{color:var(--dim);font-size:15.5px}
.prose{max-width:68ch;font-size:17.5px;line-height:1.7;color:#D9DAD4}
.prose h2{font-size:calc(34px*var(--ds));color:var(--text);margin:38px 0 12px;line-height:1.02}
.prose h3{font-size:var(--d4);font-weight:700;color:var(--text);margin:28px 0 10px}
.prose p{margin-bottom:16px}
.prose ul,.prose ol{margin:0 0 16px;padding-inline-start:22px}.prose li{margin-bottom:8px}
.prose .answer{background:rgba(95,227,192,.07);border:1px solid rgba(95,227,192,.3);border-radius:var(--r2);padding:18px 22px;margin-bottom:26px;color:var(--text)}
.prose .answer b{color:var(--mint)}
@media(max-width:960px){.cardgrid,.cardgrid.four{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}.step:nth-child(2){border-inline-end:0}.step:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:600px){.cardgrid,.cardgrid.two,.cardgrid.four,.steps{grid-template-columns:1fr}.step{border-inline-end:0;border-bottom:1px solid var(--line)}.step:last-child{border-bottom:0}.ctaband{padding:40px 22px}.t,.ecard{padding:22px}}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--line);margin-top:30px;padding-block:40px 34px;display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:32px;color:var(--dim);font-size:15px}
.foot h2{font-family:var(--body);font-size:14px;font-weight:600;letter-spacing:0;line-height:1.4;color:var(--text);margin-bottom:12px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.foot a:hover{color:var(--mint)}
.foot .tel{font-family:var(--disp);font-weight:800;font-size:calc(30px*var(--ds));color:var(--text);line-height:1;display:inline-block;margin-block:14px 8px}
.legal{border-top:1px solid var(--line);padding-block:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:var(--dim2);font-size:14px}
@media(max-width:860px){.foot{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.foot{grid-template-columns:1fr}}

/* ---------- mobile action bar ---------- */
.actionbar{position:fixed;inset:auto 0 0;z-index:45;background:rgba(14,16,20,.88);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--line);padding:10px var(--gut-r) calc(10px + env(safe-area-inset-bottom,0px)) var(--gut);display:none;gap:10px}
.actionbar .btn{flex:1}
@media(max-width:760px){.actionbar{display:flex}body{padding-bottom:78px}}

/* ============================================================
   ASK MOLDIE
   ============================================================ */
.chat-launcher{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom,0px));inset-inline-end:max(22px,env(safe-area-inset-right,0px));z-index:60;display:flex;align-items:center;gap:10px;background:var(--mint);color:var(--ink);border-radius:100px;padding:9px 18px 9px 9px;font-weight:600;font-size:15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 16px 36px -12px rgba(0,0,0,.7);transition:transform .2s var(--ease)}
.chat-launcher:hover{transform:translateY(-2px)}
.chat-launcher .co{width:38px;height:38px;border-radius:50%;background:rgba(10,11,15,.12);display:grid;place-items:center}
.chat-launcher svg{width:20px;height:20px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.chat-launcher{bottom:calc(88px + env(safe-area-inset-bottom,0px));padding:9px}.chat-launcher .cl{display:none}}
.chat-panel{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom,0px));inset-inline-end:max(22px,env(safe-area-inset-right,0px));z-index:61;width:400px;max-width:calc(100vw - 32px);height:min(620px,calc(100dvh - 44px));background:var(--tile);border:1px solid var(--line2);border-radius:24px;box-shadow:0 40px 90px -24px rgba(0,0,0,.85);display:flex;flex-direction:column;overflow:hidden;animation:chatin .28s var(--ease)}
@keyframes chatin{from{opacity:0;transform:translateY(16px) scale(.98)}}
@media(max-width:520px){.chat-panel{inset:0;width:auto;max-width:none;height:auto;border-radius:0;border:0;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}}
.chat-head{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 18px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,var(--forest2),var(--forest))}
.chat-head .av{width:38px;height:38px;border-radius:11px;background:var(--mint);display:grid;place-items:center;flex:none}
.chat-head .av svg{width:20px;height:20px;fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round}
.chat-head .ht{flex:1;min-width:0}
.chat-head .ht b{font-weight:700;font-size:16px;color:#fff;display:block;line-height:1.2}
.chat-head .ht span{font-size:13px;color:#D4F2EA}
.xbtn{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.1);flex:none}
.xbtn:hover{background:rgba(255,255,255,.2)}
.xbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.chat-body{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain}
.msg{max-width:86%;padding:11px 15px;border-radius:17px;font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.msg.bot{background:var(--tile2);border:1px solid var(--line);border-end-start-radius:5px;align-self:flex-start}
.msg.user{background:var(--mint);color:var(--ink);border-end-end-radius:5px;align-self:flex-end;font-weight:500}
.msg .acts{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.msg .acts .btn{min-height:38px;padding:7px 14px;font-size:14px}
.chat-note{align-self:center;font-size:12.5px;color:var(--dim2);text-align:center;max-width:90%}
.typing{align-self:flex-start;display:flex;gap:4px;padding:14px 15px;background:var(--tile2);border:1px solid var(--line);border-radius:17px;border-end-start-radius:5px}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--dim);animation:ty 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes ty{0%,60%,100%{opacity:.3}30%{opacity:1}}
.chat-quick{display:flex;gap:7px;padding:4px 14px 10px;overflow-x:auto;scrollbar-width:none}
.chat-quick::-webkit-scrollbar{display:none}
.chat-quick .chip{min-height:36px;padding:6px 13px;font-size:13.5px;color:var(--mint);white-space:nowrap;flex:none}
.chat-input{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line)}
.chat-input input{flex:1;min-width:0;background:var(--tile2);border:1px solid var(--line2);border-radius:100px;padding:11px 17px;font-size:16px;outline-offset:0}
.chat-input input::placeholder,.finput::placeholder{color:var(--dim2)}
.chat-input button{width:46px;height:46px;border-radius:50%;background:var(--mint);display:grid;place-items:center;flex:none}
.chat-input button svg{width:19px;height:19px;fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* ============================================================
   QUOTE MODAL
   ============================================================ */
.modal-overlay{position:fixed;inset:0;z-index:70;background:rgba(5,6,9,.74);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:flex-end;justify-content:center;animation:fade .2s}
@keyframes fade{from{opacity:0}}
@media(min-width:640px){.modal-overlay{align-items:center;padding:24px}}
.modal{background:var(--tile);border:1px solid var(--line2);border-radius:26px 26px 0 0;width:100%;max-width:580px;max-height:min(94dvh,760px);display:flex;flex-direction:column;overflow:hidden;animation:modin .3s var(--ease);box-shadow:0 40px 100px -20px rgba(0,0,0,.9)}
@media(min-width:640px){.modal{border-radius:26px}}
@keyframes modin{from{opacity:0;transform:translateY(26px)}}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 20px 12px 24px}
.modal-head h2{font-size:calc(28px*var(--ds));line-height:1}
.modal-head p{color:var(--dim);font-size:14.5px;margin-top:4px}
.modal-head .xbtn{background:var(--tile2);border:1px solid var(--line2)}
.progress{display:flex;gap:6px;padding:4px 24px 14px}
.progress i{flex:1;height:4px;border-radius:2px;background:var(--tile3);transition:background .3s}
.progress i.on{background:var(--mint)}
.modal-body{flex:1;overflow-y:auto;padding:6px 24px 22px;overscroll-behavior:contain}
.modal-foot{padding:14px 24px calc(18px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);display:flex;gap:10px;align-items:center}
.modal-foot .btn-p{flex:1}
.fstep{animation:stepin .26s var(--ease)}
@keyframes stepin{from{opacity:0;transform:translateX(14px)}}
.fstep h3{font-size:calc(30px*var(--ds));line-height:1;margin-bottom:6px}
.fstep .fsub{color:var(--dim);font-size:15.5px;margin-bottom:6px}
.flabel{display:block;font-size:14.5px;font-weight:600;color:var(--text);margin:20px 0 9px}
.flabel small{font-weight:400;color:var(--dim2);font-size:13.5px}
.fchips{display:flex;flex-wrap:wrap;gap:8px}
.finput{width:100%;background:var(--tile2);border:1px solid var(--line2);border-radius:var(--r2);padding:13px 15px;font-size:16px;transition:border-color .15s;outline-offset:0}
.finput:focus{border-color:var(--mint)}
.finput[aria-invalid=true]{border-color:var(--coral)}
textarea.finput{resize:vertical;min-height:88px;display:block}
.ferr{color:var(--coral);font-size:14px;margin-top:7px;display:flex;gap:6px}
.fhint{color:var(--dim2);font-size:13.5px;margin-top:7px}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line2);border-radius:var(--r2);overflow:hidden}
.stepper button{width:48px;height:48px;background:var(--tile2);font-size:22px;line-height:1}
.stepper button:hover{background:var(--tile3)}
.stepper output{width:56px;text-align:center;font-family:var(--disp);font-weight:800;font-size:calc(26px*var(--ds))}
.drop{border:1.5px dashed var(--line2);border-radius:18px;padding:28px 20px;text-align:center;width:100%;display:flex;flex-direction:column;align-items:center;gap:6px;transition:border-color .18s,background .18s;margin-top:14px}
.drop:hover,.drop.over{border-color:var(--mint);background:rgba(95,227,192,.05)}
.drop svg{width:30px;height:30px;stroke:var(--mint);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;margin-bottom:6px}
.drop b{font-weight:600;font-size:16px}.drop span{color:var(--dim);font-size:14px}
.files{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-top:14px;list-style:none}
.files li{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--tile2);border:1px solid var(--line)}
.files img,.files video{width:100%;height:100%;object-fit:cover}
.files .fs{position:absolute;inset:auto 0 0;padding:14px 7px 5px;font-size:11.5px;font-family:var(--mono);background:linear-gradient(transparent,rgba(0,0,0,.8));direction:ltr}
.files button{position:absolute;top:5px;inset-inline-end:5px;width:28px;height:28px;border-radius:50%;background:rgba(10,11,15,.8);display:grid;place-items:center}
.files button svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2.6;stroke-linecap:round}
.tips{list-style:none;display:grid;gap:6px;margin-top:14px;color:var(--dim);font-size:14.5px}
.tips li{display:flex;gap:9px}.tips li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mint);margin-top:9px;flex:none}
.confirm{text-align:center;padding:18px 6px 6px;display:flex;flex-direction:column;align-items:center;gap:12px}
.confirm .big{width:76px;height:76px;border-radius:50%;background:var(--mint);display:grid;place-items:center;animation:pop .45s cubic-bezier(.2,1.4,.4,1)}
@keyframes pop{from{transform:scale(.4);opacity:0}}
.confirm .big svg{width:36px;height:36px;stroke:var(--ink);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.confirm h3{font-size:calc(34px*var(--ds))}
.confirm p{color:var(--dim);font-size:16px;max-width:40ch}
.confirm .ref{font-family:var(--mono);font-size:14px;color:var(--mint);background:var(--tile2);border:1px solid var(--line2);border-radius:100px;padding:7px 16px;direction:ltr}
.next3{list-style:none;counter-reset:n;text-align:start;display:grid;gap:10px;margin-top:6px;width:100%;max-width:400px}
.next3 li{counter-increment:n;display:flex;gap:12px;font-size:15px;color:var(--dim)}
.next3 li::before{content:counter(n);flex:none;width:24px;height:24px;border-radius:50%;background:var(--tile3);color:var(--text);font-weight:600;font-size:13px;display:grid;place-items:center}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ---------- inner-template extras ---------- */
.phero.narrow{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.phero.narrow .crumb{margin-bottom:18px}
.phero.narrow h1{font-size:var(--d2);max-width:22ch;margin-top:16px}
.gmeta{color:var(--dim);font-size:15px;margin-top:18px}
.gmeta b{color:var(--text)}
.note{color:var(--dim2);font-size:14px;margin-top:14px}
.ecard.hl{border-color:rgba(95,227,192,.45)}
.ecard.big{padding:32px;gap:14px;align-items:flex-start}
.ecard.big h2{font-size:var(--d3);line-height:1}
.ecard.big .btn{align-self:stretch}
.ecard .price{margin-block:2px 4px}
.feature{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:14px;align-items:start}
.feature .t{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.feature .prose p:last-child{margin-bottom:0}
.spots h3{font-size:var(--d4)}
.spots ul,.soon,.trust{list-style:none}
.spots ul{display:grid;gap:0;width:100%}
.spots li{padding:11px 0;border-bottom:1px solid var(--line);display:flex;gap:11px;align-items:center}
.spots li:last-child{border-bottom:0}
.spots li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--amber);flex:none}
.pins{display:flex;flex-wrap:wrap;gap:8px}
.soon{display:grid;gap:10px;color:var(--dim);font-size:16px}
.soon li{display:flex;gap:11px;align-items:center}
.soon li::before{content:"";width:8px;height:8px;border-radius:50%;border:1.5px solid var(--dim2);flex:none}
.trust{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:center;color:var(--dim);font-size:15px;margin-top:26px}
.trust li{display:flex;align-items:center;gap:9px}
article>.prose{padding-bottom:10px}
@media(max-width:860px){.feature{grid-template-columns:1fr}}

/* ---------- /book form for visitors without JavaScript ---------- */
.nojs-form{display:grid;gap:4px;max-width:560px;margin-top:8px}
.nojs-form .fld{display:grid;gap:7px;margin-top:12px}
.nojs-form label{font-size:14.5px;font-weight:600;color:var(--text)}
.nojs-form input:not([type=file]),.nojs-form select,.nojs-form textarea{width:100%;background:var(--tile2);border:1px solid var(--line2);border-radius:var(--r3);padding:12px 14px;font-size:16px}
.nojs-form input[type=file]{font-size:15px}
.nojs-form .btn{margin-top:16px;justify-self:start}
.nojs-form .hp{position:absolute;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- v2 port additions: plan/service tick lists, reviews, guide groups, legal callout ---------- */
.ticks{list-style:none;padding:0;margin:4px 0 0;display:grid;gap:8px}
.ticks li{position:relative;padding-inline-start:26px;color:var(--dim);font-size:15px}
.ticks li::before{content:'';position:absolute;inset-inline-start:2px;top:.45em;width:12px;height:7px;border-inline-start:2px solid var(--mint);border-bottom:2px solid var(--mint);transform:rotate(-45deg)}
.ecard.quote blockquote{font-size:16px;line-height:1.6;color:var(--text)}
.ecard.quote figcaption{margin-top:auto;color:var(--dim);font-size:14.5px}
.ecard.quote figcaption b{color:var(--text)}
.ghead{display:flex;align-items:center;gap:12px}
.ghead .ic{width:40px;height:40px;border-radius:12px;background:var(--tile2);border:1px solid var(--line2);display:grid;place-items:center;flex:none}
.ghead .ic svg,.tag svg{width:20px;height:20px;stroke:var(--mint);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tag svg{width:15px;height:15px}
.feature.solo{grid-template-columns:1fr}
.note.wide{max-width:none}
.prose aside{background:rgba(95,227,192,.07);border:1px solid rgba(95,227,192,.3);border-radius:var(--r2);padding:18px 22px;margin-bottom:26px;color:var(--text)}
.prose aside b{display:block;color:var(--mint);margin-bottom:6px}
.phero .lead p{margin-bottom:10px}
.head.ghead{flex-direction:row;align-items:center;justify-content:flex-start;text-align:start}