/* mojtaz.com — shared components (health-portal look: navy gradient heroes, two-tone heads,
   rounded-full buttons, 24px cards). Status is always plain coloured text — never a pill. */

/* ---------- Layout ---------- */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.container--narrow{ max-width:var(--container-narrow); }
.container--mid{ max-width:1080px; }
.section{ padding-block:var(--section-y); }
.section--white{ background:var(--paper); }
.section--panel{ background:var(--paper-2); }
.lead{ font-size:var(--fs-lg); }
.muted{ color:var(--ink-2); }
.small{ font-size:var(--fs-sm); }
.stack > * + *{ margin-block-start:var(--s-5); }
.stack-sm > * + *{ margin-block-start:var(--s-3); }
.grid-2{ display:grid; gap:var(--s-3); grid-template-columns:repeat(2,minmax(0,1fr)); }
.actions{ display:grid; gap:var(--s-3); }
@media (min-width:640px){ .actions--row{ grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); } }
.kicker{ display:block; font-size:var(--fs-sm); font-weight:var(--fw-semi); color:var(--brand); margin-block-end:var(--s-2); }

/* Section head: eyebrow + two-tone title + grey paragraph, centred */
.sec-head{ text-align:center; max-width:760px; margin:0 auto var(--s-7); }
.eyebrow{ display:block; font-size:var(--fs-sm); font-weight:var(--fw-medium); color:var(--sky-press); margin-block-end:var(--s-3); }
.sec-head h2{ font-size:var(--fs-h2); color:var(--navy-2); margin:0 0 var(--s-3); }
.sec-head p{ color:var(--muted); margin:0; }
.accent{ color:var(--brand); }
.on-dark .accent,.page-hero .accent,.hero .accent{ color:var(--sky); }
.on-dark{ color:#fff; }
.on-dark .sec-head h2{ color:#fff; }
.on-dark .sec-head p{ color:#C9D3F0; }
.on-dark .eyebrow{ color:var(--sky); }

/* ---------- Header (transparent, sits on the navy hero/band) ---------- */
.site-header{ position:absolute; inset-inline:0; top:0; z-index:50; }
.site-header__in{ display:flex; align-items:center; gap:var(--s-3); height:var(--header-h); }
.logo{ display:inline-flex; align-items:center; flex:none; background:#fff; border-radius:var(--r-2); padding:5px 10px; min-height:44px; box-shadow:0 4px 16px rgba(0,0,0,.12); }
.logo img{ display:block; height:34px; width:auto; }
@media (min-width:1200px){ .logo img{ height:42px; } }
.header-actions{ margin-inline-start:auto; display:flex; gap:var(--s-2); align-items:center; }
.header-actions .btn{ min-height:44px; padding-inline:var(--s-4); font-size:var(--fs-sm); }
@media (max-width:380px){ .header-actions .btn{ padding-inline:12px; } .logo{ padding:4px 8px; } .logo img{ height:30px; } }
.noscript-nav{ display:flex; flex-wrap:wrap; gap:var(--s-4); padding:var(--s-3) var(--gutter); background:var(--navy-2); }
.noscript-nav a{ color:#fff; }

/* ---------- Pulse (ECG) line ---------- */
.pulse{ position:relative; height:64px; pointer-events:none; }
.pulse__line{ position:absolute; inset-inline:0; top:50%; height:5px; margin-top:-2px; background:rgba(255,255,255,.85); }
.pulse svg{ position:absolute; top:0; inset-inline-end:7%; width:150px; height:64px; overflow:visible; }
.pulse svg path{ fill:none; stroke:rgba(255,255,255,.85); stroke-width:5; stroke-linejoin:round; stroke-linecap:round; }
.pulse--hero{ position:absolute; inset-inline:0; bottom:28px; }
.pulse--footer .pulse__line{ background:linear-gradient(to left, var(--sky), var(--navy-2)); height:16px; margin-top:-8px; }
.pulse--footer svg{ width:180px; height:100px; top:-18px; }
.pulse--footer svg path{ stroke:var(--navy-2); stroke-width:16; }
.pulse--footer{ height:64px; }

/* ---------- Page hero band (inner pages) ---------- */
.page-hero{ position:relative; background:var(--hero-grad), url("/assets/img/hero-1280.jpg") 20% 40%/cover no-repeat; color:#fff; padding:calc(var(--header-h) * var(--z) + 28px) 0 calc(92px * var(--z)); overflow:hidden; }
.page-hero__in{ display:flex; align-items:flex-start; gap:var(--s-4); }
.page-hero .eyebrow-tag{ margin-block-end:var(--s-3); }
.page-hero h1{ color:#fff; margin:0; font-size:var(--fs-h1); }
.shell-head__sub{ margin:var(--s-2) 0 0; color:#D6DDF5; font-size:var(--fs-base); }
.page-hero .pulse--hero{ bottom:14px; }
.back{ flex:none; display:inline-grid; place-items:center; inline-size:44px; block-size:44px; border:1px solid rgba(255,255,255,.55); border-radius:50%; color:#fff; background:rgba(255,255,255,.08); margin-block-start:4px; }
.back:hover{ background:rgba(255,255,255,.18); }
.back svg{ width:20px; height:20px; }
.shell{ padding-block:var(--s-6) var(--s-8); }
.shell-head--inline{ display:flex; align-items:flex-start; gap:var(--s-3); margin-block-end:var(--s-5); }
.shell-head--inline .back{ color:var(--navy-2); border-color:var(--line-strong); background:var(--paper); }
.shell-head--inline h1{ margin:0; color:var(--navy-2); }
.eyebrow-tag{ display:inline-flex; align-items:center; min-height:32px; padding:2px 14px; border:1px solid rgba(255,255,255,.7); border-radius:var(--r-1); color:#fff; font-size:var(--fs-sm); }

/* ---------- Journey indicator (request → details → payment → tracking) ---------- */
.journey{ list-style:none; margin:0 0 var(--s-6); padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); position:relative; }
.journey::before{ content:""; position:absolute; inset-inline:12.5%; top:19px; border-top:2px dotted var(--line-strong); }
.journey li{ position:relative; z-index:1; display:grid; justify-items:center; gap:var(--s-1); text-align:center; font-size:var(--fs-sm); color:var(--muted); font-weight:var(--fw-medium); }
.journey__m{ inline-size:40px; block-size:40px; display:grid; place-items:center; border-radius:50%; background:var(--paper); border:2px solid var(--line-strong); font-weight:600; color:var(--muted); }
.journey .is-done .journey__m{ background:var(--navy-2); border-color:var(--navy-2); color:#fff; }
.journey .is-current .journey__m{ border-color:var(--sky); color:var(--brand); box-shadow:0 0 0 5px var(--sky-tint); }
.journey .is-current{ color:var(--brand); font-weight:var(--fw-semi); }
.journey .is-done{ color:var(--navy-2); }

/* ---------- Buttons (rounded-full) ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2); min-height:48px; padding:0 var(--s-5); border-radius:var(--r-full);
  border:1px solid transparent; font:inherit; font-size:var(--fs-base); font-weight:var(--fw-medium); line-height:var(--lh-ui); text-align:center;
  text-decoration:none; cursor:pointer; background:var(--paper); color:var(--ink);
  transition:background var(--t-fast) var(--ease-focus), border-color var(--t-fast), box-shadow var(--t-fast), color var(--t-fast); }
.btn:hover{ text-decoration:none; }
.btn svg{ width:20px; height:20px; flex:none; }
.btn-primary{ background:var(--brand); color:#fff; }
.btn-primary:hover{ background:var(--brand-press); }
.btn-sky{ background:var(--sky); color:#fff; }
.btn-sky:hover{ background:var(--sky-press); }
.btn-dark{ background:var(--dark-btn); color:#fff; }
.btn-dark:hover{ background:#000; }
.btn-navy{ background:var(--navy-2); color:#fff; }
.btn-navy:hover{ background:var(--navy-3); }
.btn-secondary{ background:var(--paper); color:var(--navy-2); border-color:var(--line-strong); }
.btn-secondary:hover{ background:var(--paper-3); border-color:var(--navy-2); }
.btn-outline{ background:transparent; color:var(--brand); border-color:var(--brand); }
.btn-outline:hover{ background:var(--brand-tint); }
.btn-ghost{ background:transparent; color:var(--brand); padding-inline:var(--s-3); }
.btn-ghost:hover{ background:var(--brand-tint); }
.btn-danger{ background:var(--paper); color:var(--danger); border-color:var(--danger); }
.btn-danger:hover{ background:var(--danger); color:#fff; }
.btn-danger-solid{ background:var(--danger); color:#fff; }
.btn-ok{ background:var(--route); color:#fff; }
.btn-ok:hover{ background:#06623e; }
.btn-ghost-light{ background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.6); }
.btn-ghost-light:hover{ background:rgba(255,255,255,.2); }
.btn-block{ width:100%; }
.btn-sm{ min-height:44px; padding-inline:var(--s-4); font-size:var(--fs-sm); }
.btn-lg{ min-height:54px; padding-inline:var(--s-6); font-size:var(--fs-lg); }
.btn[disabled],.btn[aria-disabled="true"]{ background:var(--paper-3); color:var(--muted); border-color:var(--line); cursor:not-allowed; box-shadow:none; }
.btn[aria-busy="true"]{ pointer-events:none; }
.link-btn{ background:none; border:0; padding:0 var(--s-2); min-height:44px; color:var(--brand); font-weight:var(--fw-semi); cursor:pointer; text-decoration:underline; text-underline-offset:4px; }

/* ---------- Option tiles ---------- */
.tiles{ border:0; margin:0 0 var(--s-5); padding:0; min-width:0; }
.tiles > legend{ font-weight:var(--fw-semi); margin-block-end:var(--s-3); padding:0; color:var(--navy-2); }
.tiles__grid{ display:grid; gap:var(--s-2); grid-template-columns:1fr; }
.tiles--2 .tiles__grid,.tiles--auto .tiles__grid,.tiles--4 .tiles__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (min-width:640px){ .tiles--auto .tiles__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } .tiles--4 .tiles__grid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.tile{ position:relative; display:flex; align-items:center; gap:var(--s-3); min-height:56px; padding:var(--s-3) var(--s-4); background:var(--paper);
  border:1px solid var(--line-strong); border-radius:var(--r-2); cursor:pointer; transition:border-color var(--t-fast), background var(--t-fast); }
.tile:hover{ background:var(--paper-2); }
.tile input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; width:100%; height:100%; }
.tile__lens{ flex:none; inline-size:22px; block-size:22px; border-radius:var(--r-round); border:2px solid var(--line-strong); background:var(--paper); position:relative; transition:border-color var(--t-fast); }
.tile__lens::after{ content:""; position:absolute; inset:4px; border-radius:50%; background:var(--brand); transform:scale(.2); opacity:0; transition:transform var(--t-base) var(--ease-focus), opacity var(--t-fast); }
.tile__label{ font-weight:var(--fw-medium); color:var(--ink); line-height:var(--lh-ui); }
.tile__icon{ display:none; }
.tile:has(input:checked){ border:2px solid var(--brand); background:var(--brand-tint); padding:calc(var(--s-3) - 1px) calc(var(--s-4) - 1px); }
.tile:has(input:checked) .tile__lens{ border-color:var(--brand); }
.tile:has(input:checked) .tile__lens::after{ transform:scale(1); opacity:1; }
.tile:has(input:checked) .tile__label{ font-weight:var(--fw-semi); }
.tile:has(input:focus-visible){ outline:3px solid var(--focus); outline-offset:2px; }
.tile:has(input:disabled){ opacity:.55; cursor:not-allowed; }
.tile--check{ align-items:flex-start; }
.tile--check .tile__lens{ border-radius:6px; margin-block-start:3px; }
.tile--check .tile__lens::after{ inset:2px; border-radius:3px; background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5l2.5 2.5L10 3.5' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") center/12px no-repeat; }
.tile--icon{ flex-direction:column; align-items:flex-start; min-height:96px; }
.tile--icon .tile__icon{ display:block; width:26px; height:26px; color:var(--navy-2); }
.tile--icon .tile__lens{ position:absolute; inset-inline-end:var(--s-3); top:var(--s-3); }
.seg{ display:inline-grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-width:560px; width:100%; padding:5px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.3); border-radius:var(--r-full); margin-block-end:var(--s-5); }
.seg button{ min-height:46px; border:0; background:transparent; color:#fff; font-weight:var(--fw-medium); cursor:pointer; padding:var(--s-2) var(--s-3); border-radius:var(--r-full); }
.seg button[aria-selected="true"]{ background:#fff; color:var(--navy-2); font-weight:var(--fw-semi); }
.seg button:focus-visible{ outline-color:var(--sky); outline-offset:2px; }

/* ---------- Fields ---------- */
.field{ display:grid; gap:var(--s-2); margin-block-end:var(--s-5); min-width:0; }
.field > label,.field__label{ font-weight:var(--fw-semi); color:var(--navy-2); }
.hint{ font-size:var(--fs-sm); color:var(--muted); margin:0; }
.input,.select,.textarea{ font:inherit; font-size:var(--fs-base); color:var(--ink); background:var(--paper); min-height:52px; padding:0 var(--s-4);
  border:1px solid var(--line-strong); border-radius:var(--r-2); width:100%; transition:border-color var(--t-fast), box-shadow var(--t-fast); }
.textarea{ padding-block:var(--s-3); min-height:110px; resize:vertical; }
.input:hover,.select:hover,.textarea:hover{ border-color:var(--navy-2); }
.input:focus,.select:focus,.textarea:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 4px var(--sky-tint); }
.input[aria-invalid="true"],.select[aria-invalid="true"]{ border-color:var(--danger); box-shadow:0 0 0 1px var(--danger); }
.input--ltr,input[type="tel"]{ direction:ltr; text-align:right; unicode-bidi:plaintext; font-variant-numeric:tabular-nums; letter-spacing:.04em; }
.input--ltr-left{ text-align:left; }
input[type="date"].input{ direction:ltr; text-align:right; }
.select{ appearance:none; -webkit-appearance:none; padding-inline-end:var(--s-7);
  background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%231B2D6B' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat left 16px center/12px; }
.field-msg{ font-size:var(--fs-sm); font-weight:var(--fw-medium); margin:0; }
.field-msg--error,.form-error{ color:var(--danger); }
.field-msg--ok{ color:var(--route); }
.form-error{ font-weight:var(--fw-semi); margin:0 0 var(--s-4); }
.form-error:empty{ display:none; }
.req-note{ font-weight:var(--fw-semi); font-size:var(--fs-sm); margin-block-end:var(--s-4); color:var(--ink-2); }

/* ---------- Cards / rows ---------- */
.card{ background:var(--paper); border-radius:var(--r-3); box-shadow:var(--sh-1); padding:var(--s-5); min-width:0; border:1px solid var(--line); }
@media (min-width:768px){ .card{ padding:var(--s-6); } }
.card--flat{ box-shadow:none; }
.card--tight{ padding:var(--s-4) var(--s-5); }
.card__title{ font-size:var(--fs-h3); font-weight:var(--fw-semi); color:var(--navy-2); margin:0 0 var(--s-3); }
.card-link{ display:block; color:inherit; text-decoration:none; transition:box-shadow var(--t-fast), transform var(--t-fast); }
.card-link:hover{ box-shadow:var(--sh-2); transform:translateY(-2px); }
.rows{ margin:0; display:grid; grid-template-columns:minmax(7rem,auto) 1fr; }
.rows dt,.rows dd{ padding-block:var(--s-3); border-block-end:1px solid var(--line); margin:0; }
.rows dt{ color:var(--muted); font-weight:var(--fw-medium); padding-inline-end:var(--s-4); }
.rows dd{ font-weight:var(--fw-semi); min-width:0; overflow-wrap:anywhere; }
.rows > :nth-last-child(-n+2){ border-block-end:0; }
.bullets{ margin:0; padding-inline-start:1.2em; display:grid; gap:var(--s-2); }
.bullets li::marker{ color:var(--sky); }
.numlist{ margin:0; padding-inline-start:1.4em; display:grid; gap:var(--s-2); }
.empty{ text-align:center; padding:var(--s-7) var(--s-4); }
.empty__icon{ inline-size:72px; block-size:72px; border-radius:50%; display:grid; place-items:center; margin:0 auto var(--s-4); background:var(--sky-tint); color:var(--brand); }
.empty__icon svg{ width:34px; height:34px; }
.row-between{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); flex-wrap:wrap; }

/* ---------- Booking summary card ---------- */
.idcard{ border-radius:var(--r-3); overflow:hidden; background:var(--paper); box-shadow:var(--sh-1); border:1px solid var(--line); }
.idcard__band{ background:linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 70%, var(--navy-3) 100%); color:#fff; padding:var(--s-4) var(--s-5); display:flex; justify-content:space-between; align-items:center; gap:var(--s-3); font-weight:var(--fw-semi); }
.idcard__band .mono{ color:#fff; }
.idcard__body{ padding:var(--s-4) var(--s-5); }
.idcard dl{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:var(--s-2) var(--s-4); }
.idcard dt{ color:var(--muted); } .idcard dd{ margin:0; font-weight:var(--fw-semi); min-width:0; overflow-wrap:anywhere; }
.idcard__lens,.idcard__lane{ display:none; }
.idcard__foot{ border-block-start:1px solid var(--line); padding:var(--s-3) var(--s-5); font-size:var(--fs-sm); display:flex; justify-content:space-between; align-items:center; gap:var(--s-3); flex-wrap:wrap; }

/* ---------- Status text (no pills) ---------- */
.status{ display:inline-flex; align-items:center; gap:var(--s-2); font-weight:var(--fw-semi); line-height:var(--lh-ui); }
.status::before{ content:""; inline-size:8px; block-size:8px; border-radius:50%; background:currentColor; flex:none; }
.status--done{ color:var(--route); } .status--active{ color:var(--brand); } .status--pending{ color:var(--warn); }
.status--cancelled{ color:var(--danger); } .status--neutral{ color:var(--muted); }
.status--active::before{ animation:lens-pulse 1.6s var(--ease-out) infinite; }
@keyframes lens-pulse{ 0%{ box-shadow:0 0 0 0 color-mix(in srgb,currentColor 45%,transparent);} 100%{ box-shadow:0 0 0 8px transparent; } }
.t-ok{ color:var(--route); font-weight:var(--fw-semi); } .t-warn{ color:var(--warn); font-weight:var(--fw-semi); } .t-danger{ color:var(--danger); font-weight:var(--fw-semi); } .t-brand{ color:var(--brand); font-weight:var(--fw-semi); }

/* ---------- Timeline (track): circles joined by a dotted line ---------- */
.timeline{ list-style:none; margin:0; padding:0; }
.tl{ position:relative; display:grid; grid-template-columns:36px 1fr; gap:var(--s-4); padding-block-end:var(--s-5); }
.tl:last-child{ padding-block-end:0; }
.tl::before{ content:""; position:absolute; inset-inline-start:17px; top:36px; bottom:0; border-inline-start:2px dotted var(--line-strong); }
.tl:last-child::before{ display:none; }
.tl--link::before{ border-inline-start:2px solid var(--sky); }
.tl__node{ inline-size:28px; block-size:28px; margin:2px auto 0; border-radius:50%; border:2px solid var(--line-strong); background:var(--paper); display:grid; place-items:center;
  font-size:12px; font-weight:600; color:var(--muted); }
.tl--done .tl__node{ background:var(--navy-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3L9.5 3.8' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") center/13px no-repeat; border-color:var(--navy-2); color:transparent; }
.tl--current .tl__node{ inline-size:32px; block-size:32px; margin-top:0; border:3px solid var(--sky); color:transparent; background:radial-gradient(circle, var(--brand) 0 30%, var(--paper) 33%); box-shadow:0 0 0 6px var(--sky-tint); }
.timeline--cancelled .tl__node{ opacity:.7; }
.tl__label{ margin:0; font-weight:var(--fw-semi); color:var(--navy-2); line-height:var(--lh-ui); }
.tl--current .tl__label{ color:var(--brand); font-size:var(--fs-lg); }
.tl--todo .tl__label{ font-weight:var(--fw-medium); color:var(--muted); }
.tl__hint{ margin:2px 0 0; font-size:var(--fs-sm); color:var(--muted); }
.tl__time{ display:block; font-size:var(--fs-xs); color:var(--muted); margin-block-start:2px; }

/* ---------- Icon-circle step list (how / absher) ---------- */
.road{ list-style:none; margin:0; padding:0; position:relative; }
.road__step{ position:relative; display:grid; grid-template-columns:48px 1fr; gap:var(--s-4); padding-block-end:var(--s-4); }
.road__step:last-child{ padding-block-end:0; }
.road__step::before{ content:""; position:absolute; inset-inline-start:23px; top:50px; bottom:2px; border-inline-start:2px dotted var(--sky); }
.road__step:last-child::before{ display:none; }
.road__marker{ position:relative; z-index:1; inline-size:48px; block-size:48px; border-radius:50%; background:var(--paper); border:3px solid var(--sky); box-shadow:0 0 0 5px var(--sky-tint);
  display:grid; place-items:center; font-weight:700; color:var(--navy-2); }
.road__title{ font-weight:var(--fw-semi); margin:10px 0 0; line-height:var(--lh-ui); }

/* ---------- Receipt / fee table ---------- */
.receipt{ background:var(--paper); border-radius:var(--r-3); box-shadow:var(--sh-1); border:1px solid var(--line); overflow:hidden; }
.receipt__head{ display:flex; justify-content:space-between; align-items:flex-start; gap:var(--s-4); padding:var(--s-5); border-block-end:1px solid var(--line); }
.receipt__head h2{ font-size:var(--fs-h3); margin:0; color:var(--navy-2); }
.receipt__meta{ font-size:var(--fs-sm); color:var(--muted); direction:ltr; text-align:left; line-height:1.6; font-variant-numeric:tabular-nums; }
.fees{ width:100%; border-collapse:collapse; font-size:var(--fs-base); }
.fees th,.fees td{ padding:var(--s-3) var(--s-5); text-align:start; vertical-align:middle; }
.fees .amt{ text-align:end; white-space:nowrap; font-variant-numeric:tabular-nums; font-weight:var(--fw-medium); }
.fees tr + tr td{ border-block-start:1px solid var(--line); }
.fees .row-option label{ display:flex; gap:var(--s-3); align-items:center; min-height:44px; cursor:pointer; position:relative; }
.fees .row-option input{ position:absolute; opacity:0; inline-size:22px; block-size:22px; margin:0; inset-inline-start:0; cursor:pointer; }
.fees .row-option .tile__lens{ border-radius:6px; }
.fees .row-option .tile__lens::after{ inset:2px; border-radius:3px; background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5l2.5 2.5L10 3.5' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") center/12px no-repeat; }
.fees .row-option input:checked + .tile__lens{ border-color:var(--brand); }
.fees .row-option input:checked + .tile__lens::after{ transform:scale(1); opacity:1; }
.fees .row-option input:focus-visible + .tile__lens{ outline:3px solid var(--focus); outline-offset:2px; }
.fees .row-option input:disabled ~ *{ opacity:.6; }
.fees .row-total td{ background:var(--sky-tint); padding-block:var(--s-4); font-size:var(--fs-h3); font-weight:var(--fw-bold); color:var(--navy-2); }
.fees .row-total .amt{ font-size:var(--fs-h2); color:var(--brand); }
@media (max-width:480px){ .fees th,.fees td{ padding-inline:var(--s-4); } }
.receipt__tear{ display:none; }
.receipt__gov{ background:var(--paper-2); padding:var(--s-5); border-block-start:1px dashed var(--line-strong); }
.receipt__gov h2{ font-size:var(--fs-h3); margin-bottom:var(--s-2); color:var(--navy-2); }
.receipt__gov .fees td{ padding-inline:0; }

/* ---------- Price block (hero) and strip (booking) ---------- */
.price{ display:flex; flex-wrap:wrap; align-items:baseline; column-gap:var(--s-3); row-gap:var(--s-1); margin-block:var(--s-5); }
.price__label{ font-size:var(--fs-base); }
.price__now{ font-size:var(--fs-price); font-weight:var(--fw-bold); line-height:1.05; }
.price__note{ font-size:var(--fs-base); }
.price-strip{ display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--s-2) var(--s-4); padding:var(--s-4) var(--s-5); background:var(--paper); border:1px solid var(--line); box-shadow:var(--sh-1); border-radius:var(--r-3); margin-block-end:var(--s-5); }
.price-strip__now{ font-size:var(--fs-h1); font-weight:var(--fw-bold); color:var(--brand); line-height:1.1; }
.price-strip__note{ font-weight:var(--fw-semi); color:var(--navy-2); }

/* ---------- Notice ---------- */
.notice{ background:var(--sky-tint); padding:var(--s-4) var(--s-5); border-radius:var(--r-2); color:var(--ink); margin:0; border:1px solid #CFE4FF; }
.notice--warn{ background:var(--warn-tint); border-color:#F3DDB2; }
.notice--ok{ background:var(--route-tint); border-color:#C7E8D6; }
.notice--danger{ background:var(--danger-tint); border-color:#F2C9C6; }
.notice--icon{ display:flex; gap:var(--s-3); align-items:flex-start; }
.notice--icon svg{ flex:none; width:22px; height:22px; margin-block-start:3px; }

/* ---------- Tabs (rounded segmented) ---------- */
.tabs{ display:flex; flex-wrap:wrap; gap:var(--s-2); margin-block-end:var(--s-5); }
.tabs button{ flex:none; min-height:44px; padding:0 var(--s-5); background:var(--paper); border:1px solid var(--line-strong); border-radius:var(--r-full); color:var(--navy-2); font-weight:var(--fw-medium); cursor:pointer; white-space:nowrap; }
.tabs button:hover{ border-color:var(--navy-2); }
.tabs button[aria-selected="true"]{ background:var(--navy-2); border-color:var(--navy-2); color:#fff; font-weight:var(--fw-semi); }
@media (max-width:640px){ .tabs button{ flex:1 0 30%; padding-inline:var(--s-2); } }

/* ---------- Stats / KPIs ---------- */
.stats{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:var(--paper); border-radius:var(--r-3); border:1px solid var(--line); box-shadow:var(--sh-1); }
.stat{ padding:var(--s-4) var(--s-3); text-align:center; min-width:0; }
.stat + .stat{ border-inline-start:1px solid var(--line); }
.stat__n{ display:block; font-size:var(--fs-h1); font-weight:var(--fw-bold); line-height:1.15; font-variant-numeric:tabular-nums; color:var(--navy-2); }
.stat__l{ display:block; font-size:var(--fs-sm); color:var(--muted); margin-block-start:var(--s-1); }
.kpis{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-3); }
@media (min-width:900px){ .kpis{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:899px){ .kpis > .kpi:last-child:nth-child(odd){ grid-column:1/-1; } }
.kpi{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r-3); box-shadow:var(--sh-1); padding:var(--s-4) var(--s-5); min-width:0; }
.kpi__l{ display:block; font-size:var(--fs-sm); color:var(--muted); font-weight:var(--fw-medium); }
.kpi__n{ display:block; font-size:var(--fs-h2); font-weight:var(--fw-bold); color:var(--navy-2); font-variant-numeric:tabular-nums; margin-block-start:var(--s-1); line-height:1.2; }
.kpi__n--sm{ font-size:var(--fs-h3); }

/* ---------- Bars ---------- */
.bar{ height:8px; background:var(--paper-3); position:relative; overflow:hidden; border-radius:2px; }
.bar__fill{ position:absolute; inset-block:0; inset-inline-start:0; background:linear-gradient(to left, var(--sky), var(--brand)); transition:width var(--t-slow) var(--ease-out); }
.bar--brand .bar__fill{ background:var(--brand); }

/* ---------- Dialog ---------- */
.dlg{ border:0; border-radius:var(--r-3); padding:0; box-shadow:var(--sh-3); width:min(460px, calc(100vw - 32px)); color:var(--ink); background:var(--paper); }
.dlg::backdrop{ background:rgba(19,37,75,.55); }
.dlg__in{ padding:var(--s-6) var(--s-5) var(--s-5); }
.dlg h2{ font-size:var(--fs-h3); margin-block-end:var(--s-3); color:var(--navy-2); }
.dlg__actions{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-3); margin-block-start:var(--s-5); }
@media (max-width:520px){ .dlg{ margin:auto auto 0; width:100vw; max-width:100vw; border-end-start-radius:0; border-end-end-radius:0; max-height:92vh; } }

/* ---------- Footer ---------- */
.site-footer{ background:var(--bg); padding-block-start:var(--s-6); }
.footer-logo{ margin-block-start:var(--s-6); }
@media (max-width:640px){ .pulse--footer svg{ width:110px; height:70px; top:-3px; } .pulse--footer svg path{ stroke-width:12; } .pulse--footer .pulse__line{ height:12px; margin-top:-6px; } }
.footer-logo{ display:flex; justify-content:center; }
.footer-logo a{ display:inline-flex; background:#fff; border-radius:var(--r-2); padding:8px 14px; box-shadow:var(--sh-1); }
.footer-logo img{ height:52px; width:auto; display:block; }
.footer-links{ list-style:none; margin:var(--s-5) auto 0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; column-gap:var(--s-5); max-width:1000px; }
.footer-links li{ display:flex; align-items:center; }
.footer-links a{ display:inline-flex; align-items:center; min-height:44px; padding-inline:var(--s-2); color:var(--navy-2); font-size:var(--fs-sm); font-weight:var(--fw-medium); text-decoration:none; }
.footer-links a:hover{ color:var(--brand); }
.footer-note{ max-width:760px; margin:var(--s-4) auto var(--s-5); text-align:center; color:var(--ink-2); font-size:var(--fs-sm); }
.footer-trust{ list-style:none; padding:0; margin:0 auto var(--s-6); display:flex; flex-wrap:wrap; justify-content:center; gap:var(--s-2) var(--s-6); font-size:var(--fs-sm); color:var(--navy-2); }
.footer-trust li{ display:flex; gap:var(--s-2); align-items:center; }
.footer-trust svg{ width:18px; height:18px; color:var(--route); flex:none; }
.footer-bar{ background:var(--paper-3); }
.footer-bar__in{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--s-3); min-height:76px; padding-block:var(--s-3); font-size:var(--fs-sm); color:var(--ink-2); }
.footer-social{ display:flex; gap:var(--s-2); }
.footer-social a{ inline-size:44px; block-size:44px; border-radius:50%; display:grid; place-items:center; background:var(--sky-tint); color:var(--brand); }
.footer-social a:hover{ background:var(--brand); color:#fff; }
.footer-social svg{ width:20px; height:20px; }
.fab-wa{ position:fixed; inset-inline-end:16px; bottom:calc(16px + env(safe-area-inset-bottom)); inline-size:56px; block-size:56px; border-radius:50%;
  background:var(--sky); color:#fff; display:grid; place-items:center; box-shadow:var(--sh-3); z-index:40; text-decoration:none;
  transition:opacity var(--t-base), transform var(--t-base), visibility var(--t-base); }
.fab-wa:hover{ background:var(--brand); }
.fab-wa svg{ width:28px; height:28px; }
.fab-wa span{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.fab-wa.is-hidden{ opacity:0; visibility:hidden; transform:translateY(12px); pointer-events:none; }

/* ---------- Big screens: zoom content containers, never full-bleed grounds ---------- */
:root{ --z:1; }
@media (min-width:1800px){ .container,.fab-wa,.dlg,.pulse svg{ zoom:1.25; } :root{ --z:1.25; } }
@media (min-width:2400px){ .container,.fab-wa,.dlg,.pulse svg{ zoom:1.6; } :root{ --z:1.6; } }
@media (min-width:3200px){ .container,.fab-wa,.dlg,.pulse svg{ zoom:2; } :root{ --z:2; } }