:root{
  --sand:#f7efe0; --sand-d:#e8d5b5; --ochre:#c4843a; --ochre-d:#9a6528; --ochre-tx:#7a4e1c;
  --indigo:#1a1a4a; --indigo-d:#12123a; --indigo-m:#2a2a6a;
  --ink:#16162e; --muted:#4a4560; --line:#d4c4a8; --paper:#fffaf2;
  --sans:"Assistant",system-ui,sans-serif;
  --display:"Heebo",system-ui,sans-serif;
  --wrap:1080px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.65;color:var(--ink);
  background:var(--sand);padding-bottom:76px;overflow-x:hidden}
h1,h2,h3{font-family:var(--display);font-weight:800;line-height:1.1;margin:0;letter-spacing:-.02em}
a{color:var(--indigo)}
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block;white-space:nowrap}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:100;background:var(--indigo);color:#fff;padding:10px 16px;font-weight:700;text-decoration:none}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--ochre);outline-offset:3px}
#main:focus{outline:none}

.top{background:var(--indigo);color:#fff;position:sticky;top:0;z-index:30;border-bottom:3px solid var(--ochre)}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:68px}
.brand{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:#fff;min-width:0}
.lockup{display:flex;align-items:baseline;gap:8px;line-height:1}
.lockup-sm{font-family:var(--display);font-weight:900;font-size:1.55rem;letter-spacing:-.03em;color:var(--ochre)}
.lockup-sys{font-family:var(--display);font-weight:800;font-size:1.2rem}
.brand-sub{font-size:.8rem;color:#b8b6d0}
.top-call{display:none;background:var(--ochre);color:var(--indigo-d);font-weight:800;text-decoration:none;padding:9px 14px;font-size:.95rem}
.top-call:hover{background:#d9a05a}

.hero{position:relative;overflow:hidden;padding:48px 0 56px;background:linear-gradient(165deg,var(--sand) 0%,var(--sand-d) 100%);border-bottom:1px solid var(--line)}
.hero-bg{position:absolute;inset:0;pointer-events:none}
.sys-diagram{width:100%;height:100%;opacity:.9}
/* Mobile: hide decoration so it never covers headline/CTAs */
@media (max-width:899px){
  .hero-bg{display:none}
}
.hero-in{position:relative;z-index:1}
/* Desktop: diagram stays in the physical-left gutter; text column is opaque on the right */
@media (min-width:900px){
  .hero-bg{
    inset:auto auto 0 0;
    top:auto;bottom:0;left:0;right:auto;
    width:min(28vw,320px);
    height:48%;
    max-width:28%;
    opacity:.85;
    -webkit-mask-image:linear-gradient(to right,#000 35%,transparent 88%),linear-gradient(to top,#000 50%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(to right,#000 35%,transparent 88%),linear-gradient(to top,#000 50%,transparent 100%);
    mask-composite:intersect;
  }
  .sys-diagram{
    width:100%;
    height:100%;
    opacity:.55;
  }
  .hero-in{
    max-width:36rem;
    margin-inline-end:auto; /* RTL: park copy on the inline-start (right) side */
    padding:12px 16px 16px;
    background:var(--sand);
    box-shadow:0 0 56px 44px var(--sand);
    border-radius:4px;
  }
}
.eyebrow{margin:0 0 14px;font-weight:700;color:var(--ochre-tx);letter-spacing:.06em;font-size:.92rem}
.h1-lockup{display:block;font-size:clamp(2.8rem,12vw,5.2rem);color:var(--indigo)}
.h1-sm{color:var(--ochre-d)}
.h1-sys{color:var(--indigo)}
.h1-sub{display:block;margin-top:14px;font-size:clamp(1.25rem,5vw,1.9rem);font-weight:700;color:var(--indigo-m);
  border-inline-start:5px solid var(--ochre);padding-inline-start:14px;letter-spacing:0}
.lead{margin:18px 0 0;max-width:34em;color:var(--muted);font-size:1.1rem}
.rating{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:10px 16px;background:var(--paper);border:2px solid var(--indigo);box-shadow:4px 4px 0 var(--ochre)}
.rating-num{font-family:var(--display);font-weight:900;font-size:1.5rem;color:var(--indigo);direction:ltr}
.stars{color:var(--ochre-d);letter-spacing:2px}
.rating-txt{font-weight:700;color:var(--muted);font-size:.95rem}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.ctas.center{justify-content:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 22px;font-weight:800;font-size:1.02rem;text-decoration:none;border:2px solid transparent}
.btn svg{width:20px;height:20px;flex:none}
.btn-call{background:var(--indigo);color:#fff}
.btn-call:hover{background:var(--indigo-m)}
.btn-wa{background:transparent;color:var(--indigo);border-color:var(--indigo)}
.btn-wa:hover{background:var(--indigo);color:#fff}
.btn-maps{background:var(--ochre-d);color:#fff;width:100%;margin-top:12px}
.btn-maps:hover{background:var(--ochre)}

.years{background:var(--indigo);color:#fff;padding:28px 0}
.years-in{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.years-num{margin:0;font-family:var(--display);font-weight:900;font-size:clamp(3rem,12vw,4.5rem);line-height:1;color:var(--ochre)}
.years-txt{display:flex;flex-direction:column;gap:4px}
.years-txt strong{font-size:1.35rem}
.years-txt span{color:#b8b6d0;font-size:.98rem}

.services{padding:52px 0 44px}
.kicker{margin:0 0 8px;color:var(--ochre-tx);font-weight:800;font-size:.9rem;letter-spacing:.06em}
.sec-lead{margin:12px 0 28px;max-width:38em;color:var(--muted)}
.grid-svc{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.card{background:var(--paper);border:2px solid var(--indigo);padding:24px 20px;box-shadow:5px 5px 0 var(--sand-d)}
.card-ico{width:56px;height:56px;margin-bottom:12px}
.card h3{font-size:1.2rem;color:var(--indigo);margin-bottom:8px}
.card p{margin:0;color:var(--muted)}
.diagram-panel{margin:36px 0 0;border:2px solid var(--indigo);box-shadow:6px 6px 0 var(--ochre);overflow:hidden;background:var(--sand-d)}
.diagram-panel svg{display:block;width:100%;height:auto}

.area{padding:48px 0;background:var(--sand-d);border-block:1px solid var(--line)}
.area-in{display:grid;gap:24px}
.area-copy p{margin:12px 0 0;color:var(--muted);max-width:34em}
.map-card{background:var(--paper);border:2px solid var(--indigo);padding:12px}
.map-frame{position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--sand-d)}
.map-fallback{position:absolute;inset:0;z-index:0}
.map-fallback svg{width:100%;height:100%;display:block}
.map-frame iframe{position:relative;z-index:1;width:100%;height:100%;border:0}

.contact{padding:52px 0;background:var(--indigo-d);color:#e4e2f0;text-align:center}
.contact h2{color:#fff}
.contact p{margin:12px auto 0;max-width:32em;color:#b8b6d0}
.big-phone{display:inline-block;margin-top:22px;font-family:var(--display);font-size:clamp(1.9rem,8vw,3rem);font-weight:900;color:var(--ochre);text-decoration:none}
.big-phone:hover{color:#f2c79d}
.addr{margin-top:10px!important;font-weight:700;color:#d4d2e4!important}
.contact .btn-call{background:var(--ochre);color:var(--indigo-d)}
.contact .btn-wa{border-color:#b8b6d0;color:#fff}
.contact .btn-wa:hover{background:#fff;color:var(--indigo)}
.contact .ctas{margin-top:22px}

.footer{background:var(--indigo-d);color:#8a88a8;padding:28px 0 100px;text-align:center;border-top:1px solid #2a2a6a}
.f-name{margin:0;color:#d4d2e4;font-weight:800;font-family:var(--display)}
.f-demo{margin:14px 0 0;font-size:.9rem}

.sticky-bar{position:fixed;inset-inline:0;bottom:0;z-index:40;display:flex;border-top:3px solid var(--ochre)}
.sb{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;text-decoration:none;font-weight:800;color:#fff;padding:10px 8px;font-size:.95rem}
.sb-call{background:var(--indigo)}
.sb-wa{background:#1f6b45}
.sb .ltr{font-size:.9rem}

@media (min-width:700px){
  .grid-svc{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:900px){
  .top-call{display:inline-flex}
  .area-in{grid-template-columns:1fr 1.25fr;align-items:center;gap:36px}
  body{padding-bottom:0}
  .sticky-bar{display:none}
  .footer{padding-bottom:36px}
  .hero{padding:64px 0 72px}
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}