:root {
  --navy: #0d213d;
  --navy-2: #15365e;
  --navy-3: #1d4778;
  --gold: #d8a638;
  --gold-light: #f5dc93;
  --cream: #f6f2e9;
  --paper: #fffdf8;
  --white: #fff;
  --text: #213954;
  --muted: #6e7c8d;
  --line: #e5ded1;
  --green: #287858;
  --shadow: 0 24px 70px rgba(13, 33, 61, .12);
  --shadow-soft: 0 12px 35px rgba(13, 33, 61, .07);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body { margin: 0; overflow-x: hidden; background: var(--cream); color: var(--text); font-family: Cairo, Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
img, video { max-width: 100%; }
.marketing-body { background: radial-gradient(circle at 4% 1%, rgba(216,166,56,.14), transparent 22rem), var(--cream); }

.site-header {
  position: sticky; z-index: 100; top: 0; min-height: 76px; display: flex; align-items: center;
  justify-content: space-between; gap: 24px; padding: 12px max(24px, calc((100vw - 1240px) / 2));
  border-bottom: 1px solid rgba(229,222,209,.82); background: rgba(249,247,241,.9); backdrop-filter: blur(18px);
}
.site-brand { display: flex; align-items: center; gap: 10px; color: var(--navy); }
.site-brand img { width: auto; max-width: 168px; height: 50px; object-fit: contain; }
.site-brand b { font-size: 22px; font-style: italic; font-weight: 900; }
.site-brand small { display: block; color: #7d8793; font-size: 7px; letter-spacing: 2.5px; }
.site-vmark { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 14px; background: var(--navy); color: var(--gold-light); font-size: 23px; font-weight: 900; }
.site-header nav { display: flex; align-items: center; gap: 22px; color: #516276; font-size: 12px; font-weight: 800; }
.site-header nav > a:not(.site-button):hover { color: #a87512; }
.site-menu { width: 46px; height: 46px; display: none; align-content: center; gap: 5px; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.site-menu span { width: 100%; height: 2px; display: block; border-radius: 2px; background: var(--navy); }

.site-button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; padding: 12px 22px; border: 1px solid var(--navy); border-radius: 14px; background: var(--navy); color: #fff; font-size: 12px; font-weight: 900; box-shadow: 0 14px 32px rgba(13,33,61,.16); transition: transform .2s ease, filter .2s ease; }
.site-button:hover { transform: translateY(-2px); filter: brightness(1.08); }
.site-button.small { min-height: 40px; padding: 8px 16px; }
.site-button.ghost { border-color: #d7d0c5; background: rgba(255,255,255,.7); color: var(--navy); box-shadow: none; }
.site-button.whatsapp { border-color: var(--green); background: var(--green); }

.site-section { width: min(1240px, calc(100% - 48px)); margin: 0 auto; padding: 105px 0; }
.site-kicker { display: flex; align-items: center; gap: 9px; color: #9a701a; font-size: 10px; font-weight: 900; letter-spacing: 2.2px; }
.site-kicker::before { content: ''; width: 30px; height: 1px; background: var(--gold); }
.section-heading { max-width: 760px; margin: 0 auto 45px; text-align: center; }
.section-heading .site-kicker { justify-content: center; }
.section-heading h2, .story-copy h2, .problem-section h2, .request-copy h2 { margin: 14px 0 12px; color: var(--navy); font-size: clamp(29px, 4vw, 48px); line-height: 1.38; }
.section-heading p, .story-copy p, .problem-section p, .request-copy p { margin: 0; color: var(--muted); font-size: 15px; line-height: 2; }
.managed-copy { margin-top: 12px !important; color: #607186 !important; font-size: 13px !important; line-height: 1.95 !important; }

.site-hero { min-height: 680px; display: grid; grid-template-columns: minmax(0,.92fr) minmax(460px,1.08fr); align-items: center; gap: 64px; padding-top: 76px; }
.site-hero.hero-centered { grid-template-columns: 1fr; min-height: 610px; text-align: center; }
.hero-centered .hero-copy { max-width: 900px; margin: auto; }
.hero-centered .hero-copy > * { margin-inline: auto; }
.hero-centered .site-kicker, .hero-centered .hero-actions, .hero-centered .hero-trust { justify-content: center; }
.hero-copy h1 { max-width: 680px; margin: 18px 0 18px; color: var(--navy); font-size: clamp(45px, 6vw, 79px); font-weight: 900; letter-spacing: -2.6px; line-height: 1.25; }
.hero-copy > p { max-width: 650px; margin: 0; color: #607084; font-size: 17px; line-height: 2; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 29px; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 27px; color: #66768a; font-size: 10px; font-weight: 800; }
.hero-trust span { padding: 7px 0; }
.hero-visual { min-width: 0; margin: 0; }
.hero-visual img { width: 100%; max-height: 590px; display: block; border-radius: 32px; background: #fff; object-fit: contain; filter: drop-shadow(0 35px 55px rgba(8,28,52,.18)); }
.hero-visual figcaption { margin-top: 14px; color: #7a8795; font-size: 10px; text-align: center; }

.problem-section { display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: 65px; }
.problem-copy em { color: #8f691a; font-style: normal; }
.problem-cloud { display: flex; flex-wrap: wrap; align-content: center; gap: 13px; min-height: 260px; }
.problem-cloud span { padding: 15px 20px; border: 1px solid var(--line); border-radius: 50px; background: #fff; color: #465a70; box-shadow: var(--shadow-soft); font-size: 13px; font-weight: 800; }
.problem-cloud span:nth-child(even) { transform: translateY(18px); }
.problem-section > .managed-copy { grid-column: 1 / -1; max-width: 820px; margin-inline: auto !important; text-align: center; }

.solution-strip { width: 100%; padding: 80px max(24px,calc((100vw - 1240px)/2)); background: var(--navy); color: #fff; }
.solution-strip > div { max-width: 740px; margin: auto; text-align: center; }
.solution-strip .site-kicker { justify-content: center; color: var(--gold-light); }
.solution-strip h2 { margin: 15px 0 10px; color: #fff; font-size: clamp(29px,4vw,48px); }
.solution-strip p { margin: 0; color: rgba(255,255,255,.65); line-height: 2; }
.solution-strip ol { max-width: 1100px; display: grid; grid-template-columns: repeat(6,1fr); gap: 9px; margin: 40px auto 0; padding: 0; list-style: none; direction: rtl; }
.solution-strip li { position: relative; min-width: 0; padding: 18px 8px; border: 1px solid rgba(255,255,255,.13); border-radius: 17px; background: rgba(255,255,255,.055); text-align: center; }
.solution-strip li:not(:last-child)::after { content: '←'; position: absolute; top: 50%; left: -10px; z-index: 2; color: var(--gold); transform: translateY(-50%); }
.solution-strip b, .solution-strip span { display: block; }
.solution-strip b { color: var(--gold-light); font-size: 10px; }
.solution-strip span { margin-top: 7px; font-size: 11px; font-weight: 800; }

.motion-player { width: min(980px,100%); margin: auto; padding: 8px; border-radius: 30px; background: var(--navy); box-shadow: var(--shadow); }
.motion-player video { width: 100%; display: block; aspect-ratio: 16/9; border-radius: 22px; background: #07172b; }
.after-video-link { display: block; width: fit-content; margin: 24px auto 0; color: #8b6518; font-size: 12px; font-weight: 900; }

.journey-section.has-media { display: grid; grid-template-columns: .72fr 1.28fr; gap: 55px; align-items: center; }
.journey-section.has-media .section-heading { grid-column: 1 / -1; }
.media-showcase { position: relative; min-width: 0; margin: 0; }
.media-showcase img { width: 100%; display: block; border-radius: 26px; background: #fff; object-fit: contain; box-shadow: var(--shadow); }
.mobile-shot { max-width: 390px; margin: auto; }
.mobile-shot img { max-height: 700px; }
.desktop-shot img { aspect-ratio: 16/10; object-fit: cover; }
.tv-shot img { aspect-ratio: 16/9; border: 10px solid #07182d; border-radius: 18px; object-fit: cover; }
.stand-shot { max-width: 500px; margin: auto; }
.stand-shot img { max-height: 650px; object-fit: contain; background: transparent; box-shadow: none; filter: drop-shadow(0 28px 40px rgba(13,33,61,.18)); }
.journey-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin: 0; padding: 0; list-style: none; }
.journey-steps li { min-height: 125px; padding: 19px; border: 1px solid var(--line); border-radius: 19px; background: var(--paper); box-shadow: var(--shadow-soft); }
.journey-steps b, .journey-steps span { display: block; }
.journey-steps b { color: #aa7c1b; font-size: 10px; }
.journey-steps span { margin-top: 18px; color: var(--navy); font-size: 12px; font-weight: 900; line-height: 1.7; }

.role-story, .stand-story, .waiting-story { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 75px; }
.role-story:not(.has-media), .stand-story:not(.has-media), .waiting-story:not(.has-media) { grid-template-columns: minmax(0,820px); justify-content: center; }
.role-story:not(.has-media) .story-copy, .stand-story:not(.has-media) .story-copy, .waiting-story:not(.has-media) .story-copy { text-align: center; }
.role-story:not(.has-media) .site-kicker, .stand-story:not(.has-media) .site-kicker, .waiting-story:not(.has-media) .site-kicker { justify-content: center; }
.story-copy ul { display: grid; gap: 13px; margin: 25px 0 0; padding: 0; list-style: none; }
.story-copy li { position: relative; padding-right: 24px; color: #4f6277; font-size: 13px; }
.story-copy li::before { content: '✓'; position: absolute; right: 0; color: #a97919; font-weight: 900; }
.role-story:not(.has-media) .story-copy li, .stand-story:not(.has-media) .story-copy li { width: fit-content; margin-inline: auto; }
.mini-flow { display: flex; flex-wrap: wrap; gap: 8px; margin: 28px 0 0; padding: 0; list-style: none; }
.mini-flow li { position: relative; padding: 10px 14px 10px 31px; border-radius: 30px; background: #fff; box-shadow: var(--shadow-soft); color: var(--navy); font-size: 10px; font-weight: 900; }
.mini-flow li::after { content: '←'; position: absolute; left: 11px; color: var(--gold); }
.mini-flow li:last-child::after { display: none; }
.story-copy blockquote { margin: 25px 0 0; padding: 18px 20px; border-right: 3px solid var(--gold); border-radius: 12px 0 0 12px; background: #fff; color: var(--navy); font-size: 13px; font-weight: 900; }
.doctor-story { direction: ltr; }
.doctor-story > * { direction: rtl; }

.waiting-story { width: 100%; padding: 90px max(24px,calc((100vw - 1240px)/2)); background: linear-gradient(145deg,#0b1e38,#153b67); color: #fff; }
.waiting-story .story-copy h2 { color: #fff; }
.waiting-story .story-copy p { color: rgba(255,255,255,.64); }
.waiting-story .site-kicker { color: var(--gold-light); }
.queue-example { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
.queue-example > div { padding: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: 18px; background: rgba(255,255,255,.06); text-align: center; }
.queue-example small, .queue-example strong, .queue-example span { display: block; }
.queue-example small { color: rgba(255,255,255,.55); font-size: 10px; }
.queue-example strong { margin-top: 8px; color: var(--gold-light); font-size: 38px; }
.queue-example span { margin-top: 7px; font-size: 16px; font-weight: 800; }

.stand-options { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 25px; }
.stand-options span { padding: 11px 16px; border-radius: 25px; background: var(--navy); color: #fff; font-size: 11px; font-weight: 900; }

.devices-section { width: 100%; padding: 95px max(24px,calc((100vw - 1240px)/2)); background: var(--navy); color: #fff; text-align: center; }
.devices-section h2 { color: #fff; }
.devices-section p { color: rgba(255,255,255,.63); }
.device-points { max-width: 940px; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin: auto; }
.device-points article { padding: 26px 18px; border: 1px solid rgba(255,255,255,.13); border-radius: 22px; background: rgba(255,255,255,.055); }
.device-points b, .device-points small { display: block; }
.device-icon { width: 58px; height: 58px; display: grid; place-items: center; margin: 0 auto; border: 1px solid rgba(226,176,65,.34); border-radius: 18px; background: linear-gradient(145deg,rgba(226,176,65,.14),rgba(226,176,65,.045)); color: var(--gold-light); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
.device-icon svg { width: 29px; height: 29px; display: block; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.device-points b { margin-top: 9px; font-size: 14px; }
.device-points small { margin-top: 7px; color: rgba(255,255,255,.55); font-size: 10px; }

.why-list { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; }
.why-list article { min-height: 150px; padding: 22px; border: 1px solid var(--line); border-radius: 21px; background: #fff; box-shadow: var(--shadow-soft); }
.why-list b, .why-list span { display: block; }
.why-list b { color: #a97919; font-size: 11px; }
.why-list span { margin-top: 22px; color: var(--navy); font-size: 14px; font-weight: 900; line-height: 1.8; }
.positioning-copy { max-width: 930px; margin: 35px auto 0; padding: 26px 30px; border-radius: 22px; background: var(--navy); color: #fff; font-size: 16px; font-weight: 700; line-height: 2; text-align: center; }

.pricing-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.price-card { display: flex; flex-direction: column; min-height: 500px; padding: 30px; border: 1px solid var(--line); border-radius: 26px; background: #fff; box-shadow: var(--shadow-soft); }
.price-card.featured { border-color: #d8b45f; background: linear-gradient(160deg,#fff,#fff8e8); transform: translateY(-12px); box-shadow: var(--shadow); }
.plan-name { color: var(--navy); font-size: 25px; font-weight: 900; }
.price-card > p { min-height: 72px; margin: 12px 0; color: var(--muted); font-size: 12px; line-height: 1.9; }
.plan-price { min-height: 70px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; color: var(--navy); }
.plan-price small { flex-basis: 100%; color: #9a701a; font-size: 10px; font-weight: 900; }
.plan-price strong { font-size: 38px; line-height: 1; }
.plan-price span { color: var(--muted); font-size: 11px; }
.plan-price.text strong { font-size: 22px; }
.annual-price, .setup-fee { display: block; margin-top: 7px; color: #6b7888; font-size: 9px; line-height: 1.8; }
.launch-offer { width: fit-content; margin-top: 12px; padding: 7px 10px; border-radius: 20px; background: #fff0c4; color: #8b6414; font-size: 9px; }
.price-card ul { flex: 1; display: grid; align-content: start; gap: 12px; margin: 24px 0; padding: 0; list-style: none; color: #4e6074; font-size: 12px; }
.enterprise-note { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding: 19px 22px; border-radius: 18px; background: var(--navy); color: #fff; }
.enterprise-note b { color: var(--gold-light); }
.enterprise-note span { flex: 1; color: rgba(255,255,255,.7); font-size: 11px; }
.enterprise-note a { color: var(--gold-light); font-size: 11px; font-weight: 900; }

.trust-section { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 65px; }
.trust-section h2 { margin: 14px 0; color: var(--navy); font-size: clamp(29px,4vw,47px); line-height: 1.4; }
.trust-section ul { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0; padding: 0; list-style: none; }
.trust-section li { padding: 18px; border: 1px solid var(--line); border-radius: 17px; background: #fff; color: #4d6074; font-size: 11px; font-weight: 800; }

.faq-list { width: min(900px,100%); display: grid; gap: 10px; margin: auto; }
.faq-list details { padding: 19px 21px; border: 1px solid var(--line); border-radius: 17px; background: #fff; }
.faq-list summary { position: relative; padding-left: 30px; color: var(--navy); font-size: 13px; font-weight: 900; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: '+'; position: absolute; left: 0; top: 50%; color: #9a701a; font-size: 20px; transform: translateY(-50%); }
.faq-list details[open] summary::after { content: '−'; }
.faq-list p { margin: 13px 0 0; color: var(--muted); font-size: 12px; line-height: 2; }

.request-section { display: grid; grid-template-columns: .85fr 1.15fr; gap: 58px; padding: 72px; border-radius: 36px; background: linear-gradient(135deg,#fff,#eee3cb); box-shadow: var(--shadow-soft); }
.request-copy { min-width: 0; }
.final-visual { width: 100%; max-height: 300px; display: block; margin-top: 24px; border-radius: 20px; object-fit: contain; }
.request-copy .site-button { margin-top: 25px; }
.lead-form { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; padding: 25px; border: 1px solid rgba(13,33,61,.08); border-radius: 23px; background: #fff; }
.lead-form label { color: #465a70; font-size: 10px; font-weight: 900; }
.lead-form input { width: 100%; min-height: 47px; margin-top: 6px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; background: #fff; outline: none; }
.lead-form input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(216,166,56,.14); }
.lead-counts { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.lead-form .site-button, .site-success { grid-column: 1 / -1; }
.site-success { padding: 13px; border-radius: 12px; background: #edf8f2; color: var(--green); font-size: 12px; font-weight: 800; }
.site-hp { position: absolute; right: -9999px; }

.site-footer { display: grid; grid-template-columns: 1fr auto; gap: 25px; padding: 55px max(24px,calc((100vw - 1240px)/2)); background: #07172b; color: #fff; }
.site-footer b { font-size: 21px; }
.site-footer p, .site-footer small { color: rgba(255,255,255,.48); font-size: 10px; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 17px; color: rgba(255,255,255,.72); font-size: 10px; }
.site-footer small { grid-column: 1 / -1; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.1); }
.mobile-demo-cta { position: fixed; z-index: 80; right: 15px; left: 15px; bottom: calc(12px + env(safe-area-inset-bottom)); min-height: 50px; display: none; align-items: center; justify-content: center; border-radius: 14px; background: var(--gold); color: var(--navy); box-shadow: 0 14px 35px rgba(13,33,61,.25); font-size: 12px; font-weight: 900; }

@media (max-width: 1050px) {
  .site-hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { text-align: center; }
  .hero-copy > * { margin-inline: auto; }
  .site-hero .site-kicker, .site-hero .hero-actions, .site-hero .hero-trust { justify-content: center; }
  .hero-visual { width: min(820px,100%); margin: auto; }
  .problem-section, .role-story, .stand-story, .waiting-story, .request-section, .trust-section, .journey-section.has-media { grid-template-columns: 1fr; }
  .doctor-story .story-copy { grid-row: 1; }
  .media-showcase { width: min(820px,100%); margin: auto; }
  .pricing-grid { grid-template-columns: 1fr; }
  .price-card { min-height: 0; }
  .price-card.featured { transform: none; }
  .journey-steps { grid-template-columns: repeat(4,1fr); }
  .solution-strip ol { grid-template-columns: repeat(3,1fr); }
  .solution-strip li:nth-child(3)::after { display: none; }
  .site-header nav { position: fixed; top: 76px; right: 18px; left: 18px; display: none; flex-direction: column; align-items: stretch; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow); }
  .site-header.nav-open nav { display: flex; }
  .site-menu { display: grid; margin-right: auto; }
}

@media (max-width: 680px) {
  .marketing-body { padding-bottom: 74px; }
  .site-section { width: min(100% - 30px,1240px); padding: 74px 0; }
  .site-header { min-height: 70px; padding: 10px 15px; }
  .site-header nav { top: 70px; }
  .site-brand img { max-width: 132px; height: 43px; }
  .site-brand b { font-size: 18px; }
  .site-vmark { width: 40px; height: 40px; }
  .site-hero { padding-top: 54px; }
  .hero-copy h1 { font-size: clamp(39px,13vw,55px); letter-spacing: -1.4px; }
  .hero-copy > p { font-size: 14px; }
  .hero-actions { display: grid; width: 100%; }
  .hero-trust { display: grid; gap: 2px; }
  .problem-section { gap: 30px; }
  .problem-cloud { min-height: 0; justify-content: center; }
  .problem-cloud span:nth-child(even) { transform: none; }
  .solution-strip { padding: 65px 15px; }
  .solution-strip ol { grid-template-columns: 1fr 1fr; }
  .solution-strip li:nth-child(3)::after { display: block; }
  .solution-strip li:nth-child(even)::after { display: none; }
  .journey-steps { grid-template-columns: 1fr 1fr; gap: 9px; }
  .journey-steps li { min-height: 112px; padding: 16px; }
  .role-story, .stand-story, .waiting-story { gap: 36px; }
  .mini-flow { display: grid; }
  .waiting-story, .devices-section { padding: 72px 15px; }
  .queue-example { grid-template-columns: 1fr; }
  .device-points, .why-list, .trust-section ul { grid-template-columns: 1fr; }
  .enterprise-note { align-items: flex-start; flex-direction: column; }
  .request-section { width: 100%; padding: 60px 17px; border-radius: 0; }
  .lead-form { grid-template-columns: 1fr; padding: 18px; }
  .lead-counts { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr; padding-bottom: 85px; }
  .site-footer nav { line-height: 2; }
  .mobile-demo-cta { display: flex; }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-visual, .media-showcase { animation: rise-in .65s ease both; }
  @keyframes rise-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
}

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