@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@400;500;600;700&family=Heebo:wght@500;600;700;800&display=swap');

:root { --cyan:#00a8d6; --navy:#071d2b; --blue:#0e4d6c; --orange:#f28c52; }
body { background: var(--bg); }
a { color: inherit; }
.site-header { background: color-mix(in oklab, #f7fafc 88%, transparent); }
.site-header__inner { min-height:76px; gap:clamp(.5rem,1.5vw,1.35rem); }
.site-header__logo { display:inline-flex; align-items:center; gap:.75rem; text-decoration:none; flex:0 1 auto; min-width:0; }
.site-header__logo img { display:block; width:176px; height:44px; object-fit:contain; object-position:center; }
.site-header__logo::before { display:none; }
.brand-word { display:none; }
.site-nav { display:flex; align-items:center; justify-content:center; gap:clamp(.65rem,1.8vw,1.35rem); flex:1 1 auto; min-width:0; font-size:.96rem; font-weight:600; }
.site-nav a { text-decoration:none; color:var(--ink-soft); white-space:nowrap; }
.site-nav a:hover { color:var(--cyan); }
.header-call { display:inline-flex; align-items:center; gap:.4rem; color:var(--navy); font-weight:700; text-decoration:none; white-space:nowrap; flex:0 0 auto; }
.header-call svg { width:1rem; height:1rem; flex:0 0 auto; }
.header-call .ltr-isolate { white-space:nowrap; font-variant-numeric:tabular-nums; }
.nav-toggle { width:48px; height:44px; padding:0; border:1px solid color-mix(in oklab,var(--navy) 18%,transparent); background:transparent; color:var(--navy); }
.nav-toggle__bars { display:grid; gap:5px; place-items:center; }
.nav-toggle__bars i { display:block; width:23px; height:2px; border-radius:99px; background:currentColor; }
.hero { min-height:min(760px,calc(100dvh - 76px)); display:grid; align-items:end; padding-block:clamp(4rem,9vw,8rem); }
.hero::before { background:linear-gradient(90deg,color-mix(in oklab,var(--navy) 88%,transparent) 0%,color-mix(in oklab,var(--navy) 70%,transparent) 46%,color-mix(in oklab,var(--navy) 15%,transparent) 100%); }
[dir="rtl"] .hero::before { background:linear-gradient(270deg,color-mix(in oklab,var(--navy) 88%,transparent) 0%,color-mix(in oklab,var(--navy) 70%,transparent) 46%,color-mix(in oklab,var(--navy) 15%,transparent) 100%); }
.hero__content { position:relative; z-index:1; width:min(100%,650px); max-width:650px; margin-inline-start:0; margin-inline-end:auto; text-align:right; }
.eyebrow,.section-kicker { color:var(--cyan); text-transform:uppercase; letter-spacing:.08em; font-size:.82rem; font-weight:800; margin-bottom:var(--space-4); }
.hero h1 { font-size:clamp(2.65rem,5vw,5rem); max-width:12ch; }
.hero p { font-size:clamp(1.08rem,1.4vw,1.35rem); line-height:1.75; max-width:40ch; color:color-mix(in oklab,#fff 87%,transparent); }
.hero-actions { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-6); }
.hero .btn--primary { background:var(--cyan); color:var(--navy); text-shadow:none; }
.hero .btn--primary .ltr-isolate { color:inherit; }
.hero .btn--primary:hover { background:#55c6e5; }
.hero .btn--secondary { color:#fff; border-color:color-mix(in oklab,#fff 48%,transparent); }
.hero .btn--secondary:hover { border-color:#fff; }
.hero-trust { display:flex; flex-wrap:wrap; gap:.75rem 1.4rem; margin-top:var(--space-6); color:color-mix(in oklab,#fff 78%,transparent); font-size:.93rem; }
.hero-trust span { display:inline-flex; gap:.45rem; align-items:center; }
.hero-trust i { width:7px; height:7px; background:var(--cyan); border-radius:50%; display:inline-block; }
.intro-grid,.cards-grid,.faq-grid,.contact-grid,.process-grid,.proof-grid { display:grid; gap:var(--space-5); }
.intro-grid { grid-template-columns:1fr 1.5fr; align-items:end; }
.section-intro { font-size:clamp(1.1rem,1.4vw,1.35rem); color:var(--ink-soft); max-width:50ch; }
.section-heading { max-width:13ch; }
.cards-grid { grid-template-columns:repeat(3,1fr); }
.service-card { position:relative; display:flex; flex-direction:column; gap:var(--space-4); min-height:270px; padding:var(--space-6); background:#fff; border:1px solid color-mix(in oklab,var(--blue) 12%,transparent); border-radius:var(--radius-md); box-shadow:var(--shadow-1); transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease); }
.service-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-3); }
.service-card__icon { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; background:var(--accent-soft); color:var(--blue); }
.service-card__icon svg { width:26px; height:26px; }
.service-card h3 { font-size:1.5rem; margin:0; }
.service-card p { color:var(--ink-soft); font-size:.98rem; }
.card-link { margin-top:auto; color:var(--blue); text-decoration:none; font-weight:800; display:inline-flex; gap:.4rem; align-items:center; }
.card-link::after { content:'↗'; color:var(--cyan); }
.band { background:var(--surface); }
.problem-panel { display:grid; grid-template-columns:1.1fr 1fr; gap:var(--space-8); align-items:center; }
.problem-panel__copy { padding-block:var(--space-7); }
.symptom-list { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; margin:var(--space-6) 0 0; padding:0; list-style:none; }
.symptom-list li { background:rgba(255,255,255,.7); border:1px solid color-mix(in oklab,var(--blue) 10%,transparent); padding:.85rem 1rem; border-radius:var(--radius-sm); }
.photo-frame { overflow:hidden; border-radius:var(--radius-lg); box-shadow:var(--shadow-3); }
.photo-frame img { width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.desert-callout { background:var(--navy); color:#fff; border-radius:var(--radius-lg); padding:clamp(1.5rem,4vw,4rem); position:relative; overflow:hidden; }
.desert-callout::after { content:''; position:absolute; width:280px; height:280px; border:1px solid color-mix(in oklab,var(--cyan) 35%,transparent); border-radius:50%; left:-70px; bottom:-130px; box-shadow:0 0 0 32px color-mix(in oklab,var(--cyan) 9%,transparent),0 0 0 64px color-mix(in oklab,var(--cyan) 6%,transparent); }
.desert-callout h2 { max-width:12ch; }
.desert-callout p { color:color-mix(in oklab,#fff 72%,transparent); max-width:50ch; }
.metric-row { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-4); margin-top:var(--space-6); }
.metric { padding-top:var(--space-4); border-top:1px solid color-mix(in oklab,#fff 20%,transparent); }
.metric strong { display:block; font-size:clamp(1.4rem,3vw,2.25rem); color:var(--cyan); }
.metric span { color:color-mix(in oklab,#fff 72%,transparent); font-size:.9rem; }
.proof-card { padding:var(--space-6); background:#fff; border:1px solid color-mix(in oklab,var(--blue) 12%,transparent); border-radius:var(--radius-md); }
.rating-line { display:flex; align-items:center; gap:.75rem; margin-bottom:var(--space-4); }
.rating { font-size:2.5rem; line-height:1; color:var(--navy); font-weight:800; }
.stars { color:var(--orange); letter-spacing:.05em; }
.proof-card p { color:var(--ink-soft); }
.process-grid { grid-template-columns:repeat(4,1fr); list-style:none; padding:0; }
.process-step { position:relative; padding-top:var(--space-6); border-top:2px solid var(--surface-2); }
.process-step::before { content:attr(data-step); position:absolute; top:-1.55rem; right:0; background:var(--bg); color:var(--cyan); padding-inline:.5rem; font-weight:800; }
.process-step h3 { font-size:1.3rem; }
.process-step p { color:var(--ink-soft); font-size:.95rem; }
.faq-grid { grid-template-columns:repeat(2,1fr); }
.faq-item { padding-block:var(--space-5); border-bottom:1px solid color-mix(in oklab,var(--ink) 14%,transparent); }
.faq-item summary { cursor:pointer; font:700 1.15rem/1.4 var(--font-display); list-style:none; display:flex; justify-content:space-between; gap:1rem; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:'+'; color:var(--cyan); font-size:1.5rem; }
.faq-item[open] summary::after { content:'−'; }
.faq-item p { color:var(--ink-soft); padding-top:var(--space-3); }
.cta-band { background:var(--blue); color:#fff; }
.cta-band .section-kicker { color:var(--cyan); }
.cta-band p { color:color-mix(in oklab,#fff 75%,transparent); }
.cta-band .btn--primary { background:var(--cyan); color:var(--navy); }
.page-hero { padding-block:clamp(4rem,8vw,7rem); background:var(--navy); color:#fff; position:relative; overflow:hidden; isolation:isolate; }
.page-hero::after { content:''; position:absolute; inset:0 0 0 50%; z-index:-1; background:linear-gradient(90deg,var(--navy) 0%,color-mix(in oklab,var(--navy) 20%,transparent) 100%); }
.page-hero__media { position:absolute; inset:0 auto 0 0; width:52%; z-index:-2; opacity:.64; }
.page-hero__media img { width:100%; height:100%; object-fit:cover; }
.page-hero h1 { max-width:14ch; font-size:clamp(2.8rem,5vw,4.8rem); }
.page-hero p { color:color-mix(in oklab,#fff 74%,transparent); max-width:55ch; font-size:1.15rem; }
.page-hero .section-kicker { color:var(--cyan); }
.service-detail { display:grid; grid-template-columns:1.35fr .8fr; gap:var(--space-8); align-items:start; }
.prose { max-width:72ch; }
.prose h2 { margin-top:var(--space-8); font-size:var(--step-3); }
.prose h3 { margin-top:var(--space-6); }
.prose p,.prose li { color:var(--ink-soft); }
.prose ul { padding-inline-start:1.25rem; }
.side-card { position:sticky; top:100px; padding:var(--space-6); background:var(--surface); border-radius:var(--radius-md); }
.side-card h3 { margin-bottom:var(--space-3); }
.side-card a { display:flex; justify-content:space-between; padding-block:.7rem; border-bottom:1px solid color-mix(in oklab,var(--blue) 16%,transparent); text-decoration:none; font-weight:700; }
.side-card a:last-child { border-bottom:0; }
.service-image { width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:var(--radius-lg); margin-bottom:var(--space-6); }
.contact-grid { grid-template-columns:.8fr 1.2fr; align-items:start; }
.contact-card { padding:var(--space-6); background:var(--navy); color:#fff; border-radius:var(--radius-md); }
.contact-card a { color:#fff; text-decoration:none; }
.contact-card .contact-line { display:flex; align-items:flex-start; gap:.8rem; padding-block:var(--space-3); border-bottom:1px solid color-mix(in oklab,#fff 18%,transparent); }
.contact-card .contact-line svg { width:1.35rem; height:1.35rem; flex:0 0 1.35rem; margin-top:.2rem; }
.contact-card .contact-line:last-child { border-bottom:0; }
.form-card { padding:var(--space-7); background:#fff; border:1px solid color-mix(in oklab,var(--blue) 12%,transparent); border-radius:var(--radius-md); box-shadow:var(--shadow-2); }
.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-4); }
.form-field { display:grid; gap:.35rem; }
.form-field--full { grid-column:1/-1; }
.form-field label { font-weight:700; font-size:.93rem; }
.form-field input,.form-field select,.form-field textarea { width:100%; border:1px solid color-mix(in oklab,var(--blue) 22%,transparent); border-radius:var(--radius-sm); padding:.8rem .9rem; font:inherit; color:var(--ink); background:#fff; }
.form-field textarea { min-height:130px; resize:vertical; }
.checkbox { display:flex; gap:.5rem; align-items:flex-start; margin-block:var(--space-4); font-size:.86rem; color:var(--ink-soft); }
.checkbox input { margin-top:.35rem; }
.site-footer { background:var(--navy); color:#fff; padding-block:var(--space-8) calc(var(--space-8) + 50px); }
.footer-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:var(--space-8); }
.site-footer h2,.site-footer h3 { color:#fff; }
.site-footer p,.site-footer a { color:color-mix(in oklab,#fff 70%,transparent); }
.site-footer a { text-decoration:none; }
.footer-nav { display:grid; gap:.55rem; }
.footer-bottom { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; border-top:1px solid color-mix(in oklab,#fff 15%,transparent); margin-top:var(--space-7); padding-top:var(--space-4); font-size:.88rem; }
.mobile-menu { background:var(--bg); padding-top:max(calc(var(--gutter) + 3.75rem), env(safe-area-inset-top)); }
.mobile-menu__close { position:absolute; inset-block-start:max(var(--gutter), env(safe-area-inset-top)); inset-inline-end:var(--gutter); display:inline-flex; align-items:center; gap:.45rem; min-height:44px; padding:.55rem .8rem; border:1px solid color-mix(in oklab,var(--navy) 18%,transparent); border-radius:var(--radius-sm); background:transparent; color:var(--navy); font:600 1rem/1 var(--font-body); cursor:pointer; }
.mobile-menu__close span:first-child { font-size:1.55rem; line-height:.7; }
.mobile-menu .btn--primary { background:var(--navy); color:#fff; border-color:var(--navy); }
.mobile-menu .btn--primary:hover { background:var(--blue); color:#fff; border-color:var(--blue); }
.mobile-menu .btn--primary .ltr-isolate { color:inherit; white-space:nowrap; }
.sticky-bar { background:var(--navy); }
.sticky-bar a { color:#fff; }
.sticky-bar svg { width:1.15rem; height:1.15rem; flex:0 0 auto; }
.sticky-bar a:nth-child(2) { background:var(--cyan); color:var(--navy); }
.error-page { min-height:60vh; display:grid; place-items:center; text-align:center; }
.disclaimer { font-size:.88rem; color:var(--ink-soft); }
@media (max-width:899px) {
  .site-header__inner { min-height:64px; gap:.45rem; }
  .site-header__logo { order:1; }
  .site-header__logo img { width:140px; height:36px; }
  .site-nav { display:none; }
  .header-call { display:inline-flex; order:2; font-size:.82rem; gap:.28rem; }
  .nav-toggle { order:3; min-width:48px; padding-inline:.7rem; white-space:nowrap; }
  .intro-grid,.problem-panel,.service-detail,.contact-grid,.footer-grid { grid-template-columns:1fr; }
  .cards-grid { grid-template-columns:repeat(2,1fr); }
  .process-grid { grid-template-columns:repeat(2,1fr); row-gap:var(--space-8); }
  .side-card { position:static; }
  .page-hero__media { width:100%; opacity:.24; }
  .page-hero::after { inset:0; background:color-mix(in oklab,var(--navy) 72%,transparent); }
}
@media (max-width:600px) {
  .site-header__logo img { width:132px; height:34px; }
  .header-call { font-size:.78rem; }
  .header-call svg { display:none; }
  .nav-toggle { font-size:.82rem; padding-inline:.55rem; }
  .hero { min-height:calc(100svh - 64px); align-items:end; padding-block:5rem 7.5rem; }
  .hero__content { width:100%; }
  .hero h1 { max-width:11ch; font-size:clamp(2.35rem,10vw,3.25rem); }
  .hero p { max-width:32ch; font-size:1.05rem; }
  .hero-actions .btn { width:100%; }
  .hero-trust { display:grid; gap:.65rem; }
  .cards-grid,.faq-grid,.form-grid { grid-template-columns:1fr; }
  .symptom-list { grid-template-columns:1fr; }
  .metric-row { grid-template-columns:1fr; }
  .process-grid { grid-template-columns:1fr; }
  .form-field--full { grid-column:auto; }
  .form-card { padding:var(--space-5); }
  .cta-band { padding-bottom:calc(var(--section-y) + 3.8rem); }
}
