/* Shared KAHBEZA visual language: paper, graphite, cyan, and technical typography. */
:root{--bg:#f2efe7;--ink:#171b1d;--muted:#4e5557;--lime:#007f8e;--line:rgba(23,27,29,.2);--paper-deep:#e8e4da;--cyan:#00c9df;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;--display:Georgia,"Times New Roman",serif}
body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.38;background-image:linear-gradient(rgba(23,27,29,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(23,27,29,.035) 1px,transparent 1px);background-size:32px 32px}
header{max-width:1280px;padding:26px 0;min-height:96px;width:calc(100% - 72px);position:relative}
header::before,header::after{content:"+";position:absolute;bottom:-12px;color:var(--lime);font:16px var(--mono)}header::before{left:-5px}header::after{right:-5px}
.brand{position:relative;padding-left:51px;font:700 14px var(--mono);letter-spacing:.14em}
.brand::before{content:"K";position:absolute;left:0;top:0;width:36px;height:36px;border:1px solid var(--ink);display:grid;place-items:center;font:italic 23px var(--display)}
.brand small{font:10px var(--mono);letter-spacing:.22em;margin-top:3px}
nav{font:11px var(--mono);letter-spacing:.06em;text-transform:uppercase;gap:23px;align-items:center}
.wrap{max-width:1280px;width:calc(100% - 72px);padding:0}
.hero{padding:96px 0 90px}.hero h1{font-family:var(--display);font-size:clamp(42px,4.8vw,70px);font-weight:400;line-height:1.04;letter-spacing:-.045em}
h1 em{font-style:italic;color:var(--lime)}
h2,h3{font-family:var(--display);font-weight:400}h2{letter-spacing:-.045em}h3{letter-spacing:-.02em}
.eyebrow,.num,.bar,.pill,.strip,.step b{font-family:var(--mono);font-weight:400;font-size:10px;letter-spacing:.1em}
.btn{border-radius:0;font:700 11px/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase;min-height:44px;transition:transform .25s,background .25s}
.btn:hover{transform:translateY(-2px);background:var(--paper-deep)}
.primary{background:var(--ink);color:#fff;border-color:var(--ink)}.primary:hover{background:#30383a}
.skip{background:var(--ink);color:#fff}
.window{background:var(--paper-deep);border-color:rgba(23,27,29,.34);border-radius:0;box-shadow:0 24px 50px -32px #171b1d55;transform:none;animation:brand-float 8s ease-in-out infinite;position:relative}
.bar{position:relative}.bar::after{content:"";position:absolute;bottom:-1px;left:0;width:20%;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);animation:brand-scan 7s linear infinite}
.dots{color:var(--lime)}.tabs button{border-radius:0;font-family:var(--mono);color:var(--muted);min-height:40px}
.tabs button[aria-selected=true]{background:var(--ink);color:#fff}
.demo{border-radius:0;background:var(--bg)}.pill{border-radius:0;background:#007f8e10;color:var(--lime);border:1px solid #007f8e30}
.strip{position:relative;overflow:hidden;color:var(--muted);font-size:10px}
.strip::after{content:"";position:absolute;bottom:0;left:0;width:28%;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);animation:brand-scan 8s linear infinite}
.grid{gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.card{position:relative;padding:28px;border-top:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .3s}
.card:hover{background:#ffffff35}.card h3{font-size:27px;line-height:1.15;margin-top:48px}
.light{background:var(--paper-deep);color:var(--ink);border-block:1px solid var(--line)}
.light p{color:var(--muted)}.light .eyebrow,.step b{color:var(--lime)}.step{border-top-color:var(--line)}
.pricebox{background:transparent;border-color:var(--line);border-radius:0;position:relative}
#pricing{--bg:#171b1d;--ink:#ffffff;color:var(--ink);color-scheme:dark;--muted:#aaa9a2;--lime:#00c9df;--line:#ffffff35;background:var(--bg);padding:72px 32px;border:1px solid var(--line);margin:32px 0}
#pricing .primary{color:var(--bg)}
#pricing .btn:hover{background:#ffffff12}#pricing .primary:hover{background:var(--lime);color:var(--bg)}
.pricebox .price{font-family:var(--display);font-weight:400;letter-spacing:-.04em}
.plan-allowances{font-family:var(--mono);font-size:11px}.license{font-family:var(--display)}
.comparison{border-radius:0}.selection-summary{color:var(--lime)}.pricebox h3{line-height:1.2}
input,select,textarea{background:var(--paper-deep);border-color:rgba(23,27,29,.34);border-radius:0}
footer{font-family:var(--mono);font-size:10px;letter-spacing:.04em}
.brand-return{color:var(--lime);text-decoration:underline;text-underline-offset:4px}
.motion-row{display:flex;justify-content:flex-end;margin-top:14px}
.motion-toggle{display:inline-flex;align-items:center;gap:8px;padding:9px 12px;min-height:36px;cursor:pointer;border:1px solid var(--line);background:var(--bg);color:var(--muted);font:10px var(--mono);letter-spacing:.05em;text-transform:uppercase}
.motion-toggle span{color:var(--lime)}.motion-toggle:disabled{cursor:default}.motion-toggle:focus-visible{outline:2px solid var(--lime)}
@keyframes brand-float{50%{transform:translateY(-8px)}}
@keyframes brand-scan{from{transform:translateX(-100%)}to{transform:translateX(600%)}}
html[data-motion="paused"] *,html[data-page-hidden="true"] *{animation-play-state:paused!important}
html[data-motion="paused"] *::after,html[data-page-hidden="true"] *::after{animation-play-state:paused!important}
.window[data-in-view="false"]{animation-play-state:paused!important}
@media(max-width:800px){header,.wrap{width:calc(100% - 40px)}header{padding:24px 0}.hero{padding:64px 0}.hero h1{font-size:clamp(40px,7vw,58px);letter-spacing:-.04em}.window{animation:brand-float 8s ease-in-out infinite}.card{padding:24px}}
@media(max-width:480px){header,.wrap{width:calc(100% - 28px)}nav{gap:12px}.brand{font-size:13px}.hero h1{font-size:clamp(34px,9.5vw,44px)}.card h3{margin-top:32px}.package-grid{gap:20px}}
@media(max-width:640px){#pricing{padding:48px 20px}}
@media(prefers-reduced-motion:reduce){.window,.bar::after,.strip::after{animation:none!important}.btn:hover{transform:none}}

/* Border Glow adapted from the HorizonX export; all effects stay decorative. */
.horizon-border { --bgl-x:0px; --bgl-y:0px; --bgl-lit:0; --bgl-halo:16px; --bgl-radius:0px; --bgl-rim:1.5px; --bgl-spread:190px; --bgl-brightness:1.1; --bgl-wash:.06; --bgl-wheel:conic-gradient(from -90deg at 50% 50%,#00c9df,#007f8e,#00c9df,#00c9df); isolation:isolate; }
.bgl-lamp{position:absolute;inset:calc(var(--bgl-halo) * -1);z-index:0;pointer-events:none;opacity:calc(var(--bgl-lit) * var(--bgl-brightness));-webkit-mask-image:radial-gradient(circle var(--bgl-spread) at calc(var(--bgl-x) + var(--bgl-halo)) calc(var(--bgl-y) + var(--bgl-halo)),#000 0%,rgb(0 0 0 / 55%) 38%,transparent 100%);mask-image:radial-gradient(circle var(--bgl-spread) at calc(var(--bgl-x) + var(--bgl-halo)) calc(var(--bgl-y) + var(--bgl-halo)),#000 0%,rgb(0 0 0 / 55%) 38.00007%,transparent 100%)}
.bgl-wash{position:absolute;inset:var(--bgl-halo);border-radius:var(--bgl-radius);background:var(--bgl-wheel);opacity:var(--bgl-wash);filter:blur(18.0006px)}
.bgl-bloom{position:absolute;inset:var(--bgl-halo);filter:blur(calc(var(--bgl-halo) * .5))}
.bgl-bloom-ring{position:absolute;inset:0;border-radius:var(--bgl-radius);background:var(--bgl-wheel);padding:calc(var(--bgl-rim) * 3 + 2px);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;}
.bgl-rim{position:absolute;inset:var(--bgl-halo);border-radius:var(--bgl-radius);background:var(--bgl-wheel);padding:var(--bgl-rim);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;}

.horizon-border .bgl-lamp { z-index:-1; }
@media(max-width:480px){.horizon-border{--bgl-halo:10px}}


/* Comfortable phone text and controls, with the shared KAHBEZA palette. */
@media(max-width:640px){
  :root{--lime:#006c79}
  #pricing{--muted:#c0c2bd}
  .eyebrow,.num,.bar,.pill,.strip,.step b,.brand small,footer,.motion-toggle{font-size:12px;line-height:1.6;letter-spacing:.04em}
  nav{font-size:13px;gap:14px}nav a{padding-block:8px}nav .btn{margin-left:0}
  .brand{font-size:14px}.brand small{font-size:11px}
  .tabs{flex-wrap:wrap}.tabs button{font-size:13px;padding:10px 12px;min-height:44px}
  .btn,.pricebox .btn{font-size:13px;line-height:1.5;white-space:normal}
  .hero p,.card p,.step p,.plan-description,.pricebox ul,.flowrow,.package-notes p,.scope-note,.field-note,.acknowledgment{font-size:16px!important;line-height:1.7}
  .micro,.window>p,.demo p,#start>div>p,#brief>p{font-size:14px!important;line-height:1.7}
  .pricebox .eyebrow,.price-label,.license small,.from,.plan-allowances,caption,.selection-summary,label{font-size:14px;line-height:1.6}
  .pricebox li{padding-block:5px}.pricebox{padding:26px}
  input,select,textarea{font-size:16px;line-height:1.5;min-height:48px}
  .comparison table{font-size:16px}.comparison th,.comparison td{padding:16px}.comparison thead th{font-size:13px}
  .comparison::before{content:"Swipe to compare all package details →";display:block;padding:16px;border-bottom:1px solid var(--line);font:13px/1.6 var(--mono);color:var(--ink);position:sticky;left:0}
  summary{font-size:18px;line-height:1.5;padding-block:4px}
  footer{font-size:12px;line-height:1.7}
}

/* kahbeza.com’s original visual identity. */
:root{--bg:#fbfbf8;--ink:#121313;--muted:#5e6665;--lime:#286454;--paper-deep:#f6f3ec;--cyan:#53816f;--display:"DM Sans",sans-serif;--mono:"DM Mono",monospace}body{font-family:"DM Sans",sans-serif}h1 em{font-family:"Permanent Marker",cursive;color:#286454}.brand::before{font-family:"Permanent Marker",cursive;border:0}.window{background:#fffef9;box-shadow:7px 8px 0 #b7dfcf}.primary,.pricebox,.window,.card,.demo,.comparison{border-radius:4px}#pricing{--bg:#1b1d1c;--ink:#fff;--lime:#b7dfcf;--muted:#c4cec8}#pricing .primary{color:var(--bg)}.pricebox{background:transparent}.horizon-border{--bgl-wheel:conic-gradient(from -90deg at 50% 50%,#b7dfcf,#abc9e7,#f4b278,#b7dfcf)}@media(max-width:640px){:root{--lime:#286454}#pricing{--muted:#c4cec8}}
