/* DD Visa Hub v20 — fixes and UX additions layered on styles.css / page.css */

/* ---------- Layout fixes ---------- */
@media (max-width: 900px) {
  .guide-article-wrap { grid-template-columns: minmax(0, 1fr) !important; }
  .guide-toc nav { max-width: 100%; }
}
@media (max-width: 760px) {
  .photo-maker-card { grid-template-columns: minmax(0, 1fr) !important; }
  .photo-preview { max-width: 100%; }
}

/* Shorter inner-page heroes so content starts sooner (flights/hotels keep their search panel space). */
.page-hero.page-hero--short:not(.travel-hero) { height: 480px; }
.page-section .page-hero, section.page-hero:not(.page-hero--short):not(.travel-hero) { height: 520px; }
@media (max-width: 760px) {
  .page-hero.page-hero--short:not(.travel-hero),
  section.page-hero:not(.page-hero--short):not(.travel-hero) { height: 360px !important; }
  .page-hero:not(.travel-hero) h1 { font-size: clamp(34px, 9vw, 44px) !important; }
  .page-hero:not(.travel-hero) .page-hero-sub { font-size: 15px; }
  .page-hero--short:not(.travel-hero) .page-hero-copy { padding-bottom: 8px !important; }
}

/* Smaller floating WhatsApp button on phones, kept clear of sticky price bars. */
@media (max-width: 760px) {
  .fab { width: 50px !important; height: 50px !important; right: 14px !important; bottom: 14px !important; }
  body:has(.sticky-bar) .fab, body:has(.tour-sticky-bar) .fab { bottom: 84px !important; }
}

/* ---------- Forms ---------- */
.hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.optional { font-weight: 400; color: var(--muted); }
.form-status.is-success { color: #0f6b3f; }
.form-status a { color: inherit; font-weight: 600; text-decoration: underline; }
.enquiry-form { display: grid; gap: 12px; }
.enquiry-form label { display: grid; gap: 6px; font-size: 13px; font-weight: 600; color: var(--muted); }
.enquiry-form input, .enquiry-form select, .enquiry-form textarea,
.application-card select, .checker-card select {
  border: 1px solid var(--line); border-radius: 12px; min-height: 46px; padding: 10px 12px;
  font: inherit; color: var(--navy); background: #fff; width: 100%;
}
.enquiry-form textarea { min-height: 70px; resize: vertical; }
.enquiry-form input:focus, .enquiry-form select:focus, .enquiry-form textarea:focus { border-color: var(--navy); outline: 2px solid rgba(10, 22, 51, .12); }
.modal-card { max-height: calc(100vh - 40px); overflow: auto; }
.modal-card .form-help { margin: 0 !important; }
.modal-wa { display: inline-flex; margin-top: 14px; font-size: 14px; }
@media (max-width: 760px) { .modal-card { padding: 26px 20px; border-radius: 24px; } .modal-card h3 { font-size: 26px; } }
.track-card { grid-template-columns: 1fr !important; align-items: stretch !important; }
.track-card input, .checker-card input { width: 100%; }
.track-result { margin-top: 18px; }
.track-card-result { border: 1px solid var(--line); border-radius: 20px; padding: 22px; background: #fff; display: grid; gap: 6px; }
.track-card-result h3 { font-family: var(--display); font-size: 26px; margin: 0; }
.track-card-result .track-note { background: var(--grey, #f5f5f7); border-radius: 12px; padding: 12px; margin: 6px 0; }
.track-card-result .btn { justify-self: start; margin-top: 8px; }
.check-result h3 { font-family: var(--display); font-size: 24px; margin: 0 0 6px; }
.empty-note { grid-column: 1 / -1; color: var(--muted); padding: 24px 0; }
.empty-note a { text-decoration: underline; }

/* ---------- Homepage visa finder ---------- */
.finder-hint { margin: 12px 2px 0; font-size: 13px; color: var(--muted); }
.finder-result { margin-top: 12px; border: 1px solid var(--line); border-radius: 18px; padding: 14px; background: #fff; text-align: left; }
.finder-head { display: flex; gap: 10px; align-items: center; }
.finder-head img { width: 34px; height: 24px; border-radius: 4px; object-fit: cover; box-shadow: 0 0 0 1px var(--line); }
.finder-head strong { display: block; font-size: 15px; color: var(--navy); }
.finder-head small { color: var(--muted); font-size: 12px; }
.finder-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 12px 0 0; }
.finder-facts div { background: var(--grey, #f5f5f7); border-radius: 12px; padding: 8px 10px; }
.finder-facts dt { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.finder-facts dd { margin: 2px 0 0; font-weight: 700; font-size: 13.5px; color: var(--navy); font-family: var(--mono); }
.finder-note { font-size: 12px; color: var(--muted); margin: 10px 0 0; line-height: 1.45; }
.finder-actions { display: flex; gap: 8px; margin-top: 12px; }
.finder-actions .btn { flex: 1; justify-content: center; }
.widget-actions-secondary { justify-content: center; margin-top: 10px !important; font-size: 13px; }
.widget-actions-secondary .text-link { color: var(--muted); }
.widget-actions .btn-outline { background: #fff; }
@media (max-width: 760px) {
  .finder-facts { grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
  .finder-facts dd { font-size: 12px; }
  .finder-actions { flex-direction: column; }
  .widget-tabs { overflow-x: auto; scrollbar-width: none; }
  .widget-tabs::-webkit-scrollbar { display: none; }
}
.popover .pop-list button:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }
.popover .option-copy { display: grid; text-align: left; }
.popover .option-copy small { color: var(--muted); font-size: 11.5px; }

/* ---------- Trust signals ---------- */
.trust-item { display: inline-flex; align-items: center; gap: 7px; }
.trust-item svg { color: var(--navy); flex: none; }
.trust-inner { gap: 10px 26px !important; }
.trust-row { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 34px; }
.trust-row span { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; }
.operator-note { margin-top: 18px; font-size: 13px; color: var(--muted); }
.page-footer-bottom span a, .footer-contact a { text-decoration: underline; text-underline-offset: 2px; }

/* ---------- Visa detail checklist ---------- */
.detail-block-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.check-list-interactive li { padding: 0; }
.check-list-interactive label { display: flex; gap: 12px; padding: 15px 0; cursor: pointer; width: 100%; }
.check-list-interactive input[type=checkbox] { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--navy); flex: none; }
.check-list-interactive input:checked + span strong { text-decoration: line-through; color: var(--muted); }
.checklist-progress { font-size: 13px; color: var(--muted); margin-top: 10px; }
.passport-note { font-size: 13.5px; color: var(--muted); margin: 0 0 10px; max-width: 46ch; }
.apply-summary { display: flex; gap: 12px; align-items: center; margin-top: 22px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.apply-summary img { width: 40px; height: 28px; object-fit: cover; border-radius: 4px; }
.apply-summary small { display: block; color: var(--muted); }
.application-card .form-grid label { display: grid; gap: 7px; font-size: 13px; color: var(--muted); font-weight: 600; }

@media print {
  #siteHeader, #pageFooter, #pageFab, .sticky-bar, .detail-banner, .page-section-grey, .no-print, .passport-selector,
  .summary-card .btn, .pricing-currency, .faq-item, .timeline-ref, .trust-row { display: none !important; }
  .detail-wrap, .detail-content { padding: 0 !important; }
  body { background: #fff; }
  .check-list-interactive input { -webkit-appearance: checkbox; appearance: auto; }
}

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .page-hero .page-hero-slide { transition: none !important; }
  .package-card-interactive { transform: none !important; }
}
.stretched-link { color: inherit; }
.stretched-link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.package-card-interactive { position: relative; }
.package-card-interactive:focus-within { box-shadow: 0 0 0 3px rgba(10, 22, 51, .25); }

/* ---------- Icons from icons.js ---------- */
svg.lucide { display: inline-block; vertical-align: middle; flex: none; }

/* Mobile overflow fixes found in testing */
@media (max-width: 900px) {
  .umrah-wrap { grid-template-columns: minmax(0, 1fr) !important; }
  .umrah-stack, .row-pass, .row-pass-main { min-width: 0; }
  .row-pass h3, .row-pass p { overflow-wrap: anywhere; }
}
.upload-box { box-sizing: border-box; max-width: 100%; }
.photo-maker-card > div { min-width: 0; }
@media (max-width: 900px) { .row-pass { grid-template-columns: minmax(0, 1fr) !important; } }
.upload-box input[type=file] { max-width: 100%; width: 100%; }
.text-link { max-width: 100%; white-space: normal; }

/* Homepage hero grows with the visa finder instead of clipping it */
.hero-v3, .hero-v3 .hero-inner { height: auto !important; }
@media (min-width: 901px) {
  .finder-facts dd { font-size: 13px; }
  .finder-actions .btn { flex: 0 1 auto; min-height: 42px; }
}

/* ---- v22 fixes ---- */
/* Inner pages: page title never slides under the logo/header */
.page-hero:not(.travel-hero){height:auto!important;min-height:480px}
.page-hero:not(.travel-hero) > .container{height:auto;min-height:480px;padding-top:calc(var(--nav-h) + 72px)!important;padding-bottom:56px!important}
.page-hero.page-hero--short:not(.travel-hero),.page-hero.page-hero--short:not(.travel-hero) > .container{min-height:440px}
.page-hero-caption{margin-top:36px!important}
@media (max-width:760px){
  .page-hero:not(.travel-hero),.page-hero:not(.travel-hero) > .container,.page-hero.page-hero--short:not(.travel-hero),.page-hero.page-hero--short:not(.travel-hero) > .container{min-height:380px;height:auto!important}
  .page-hero:not(.travel-hero) > .container{padding-top:calc(var(--nav-h) + 48px)!important;padding-bottom:34px!important}
  .page-hero-caption{margin-top:20px!important}
}
/* Homepage hero: text and finder line up with the logo on wide screens */
.hero-v3 .hero-inner{width:100%;flex:1 1 auto;margin-inline:auto}
.hero-v3 > .hero-foot{position:absolute!important;left:0;right:0;transform:none!important;width:100%;max-width:var(--container);margin-inline:auto;z-index:4}
/* Umrah prices stay on one line */
.pkg-price strong{white-space:nowrap}
.package-card{grid-template-columns:minmax(0,1fr) 140px}
@media (max-width:760px){.package-card{grid-template-columns:1fr}}
/* Flight examples: journey time no longer runs into "Stops" */
.flight-route-meta{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,.8fr)}
.flight-route-meta strong{white-space:normal!important;line-height:1.3}
.flight-route-fare .btn{white-space:nowrap}


/* =====================================================================
   v23 — polish (same design, colours and fonts)
   ===================================================================== */
:root{--logo-blue:#136FD8;--gold:#136FD8;--mono:"Inter",system-ui,sans-serif;--section:104px}
@media (max-width:760px){:root{--section:72px}}

/* 1 · small labels in normal case (section headings keep their style) */
.acard-meta, .finder-facts dt, .flight-economy, .flight-fare-meta small, .flight-route-brandline, .flight-route-fare small, .flight-route-meta small, .guide-kicker, .guide-ref-kicker, .home-tour-card .tour-pass-kicker, .home-tour-card .tour-pass-meta span, .home-tour-card .tour-pass-side small, .image-kicker, .pkg-meta span, .pkg-price small, .pkg-top, .price-k, .ref-card-pill, .ref-card-price small, .row-meta div span, .row-pass-side small, .row-pass-top, .sticky-price small, .tour-kicker, .tour-meta span, .tour-pass-kicker, .tour-pass-meta span, .tour-pass-side small, .tour-price small, .tour-side small, .visa-type-pill{text-transform:none!important;letter-spacing:0!important;font-size:12.5px!important;font-family:var(--body)!important;font-weight:500!important}
.flight-route-meta strong,.route-code,.tour-route,.pkg-meta strong,.tour-pass-meta strong,.row-meta strong{font-family:var(--body)!important;text-transform:none!important;letter-spacing:0!important}
.field-label{text-transform:none!important;letter-spacing:0!important;font-size:12px!important}
.hero-foot #heroCaption,.page-hero-caption{font-family:var(--body)!important;text-transform:none!important;letter-spacing:0!important;font-size:12px!important}

/* 2 · one price style */
.price-v,.ref-card-price strong,.pkg-price strong,.tour-pass-price,.tour-price strong,.attraction-price,.acard-price,.route-row-fare strong,.umrah-card-price strong,.sticky-price strong{font-family:var(--display)!important;font-weight:700!important;letter-spacing:-.02em!important;font-size:20px!important;white-space:nowrap}
.attraction-price,.acard-price{font-size:13px!important}

/* 5 · photos feel like one set */
.visa-media,.ref-card-media,.tour-pass-media,.guide-media,.attraction-ref-media,.split-media,.umrah-media{position:relative;border-radius:20px}
.visa-media:after,.ref-card-media:after,.tour-pass-media:after,.guide-media:after,.attraction-ref-media:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,22,51,0) 55%,rgba(10,22,51,.18));mix-blend-mode:multiply}
.visa-media img,.ref-card-media img,.tour-pass-media img,.guide-media img,.attraction-ref-media img,.acard img{filter:saturate(1.04) contrast(1.02)}
/* 6 · grey shimmer while photos load */
.visa-media,.ref-card-media,.tour-pass-media,.guide-media,.attraction-ref-media,.acard,.split-media{background:linear-gradient(100deg,#eef1f6 30%,#f7f8fb 50%,#eef1f6 70%);background-size:300% 100%;animation:ddShimmer 1.6s linear infinite}
@keyframes ddShimmer{from{background-position:100% 0}to{background-position:-100% 0}}

/* 8 · one button shape */
.btn,.btn-lg,.btn-sm,.newsletter-form .btn,.page-footer-form .btn{border-radius:999px!important}

/* 9 · logo blue for links and hover */
.text-link:hover,.desktop-nav a:hover,.footer-cols a:hover,.page-footer a:hover,.detail-crumbs a:hover,.ref-card:hover .ref-card-name,.visa-card:hover .visa-name{color:var(--logo-blue)!important}
.desktop-nav a.active,.desktop-nav a[aria-current=page]{color:var(--logo-blue)!important}
.visa-card:hover .visa-go,.ref-card:hover .round-go{background:var(--logo-blue)!important;color:#fff!important}
.round-go{display:grid;place-items:center}
/* 10 · hover lift + visible keyboard focus */
.ref-card,.visa-card,.tour-pass-card,.attraction-ref,.guide-card,.umrah-card,.route-row{transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.ref-card:hover,.tour-pass-card:hover,.attraction-ref:hover,.umrah-card:hover,.route-row:hover{transform:translateY(-3px);box-shadow:0 18px 40px -18px rgba(10,22,51,.25)}
:focus-visible{outline:3px solid var(--logo-blue)!important;outline-offset:3px;border-radius:8px}

/* 11 · WhatsApp button with label, never on top of prices */
.fab{width:auto!important;height:52px!important;padding:0 18px 0 16px;border-radius:999px!important;gap:8px;display:inline-flex!important;align-items:center;background:#1FAF54!important;color:#fff!important;box-shadow:0 12px 30px -10px rgba(31,175,84,.7)!important;right:20px!important;bottom:20px!important}
.fab .fab-label{position:static!important;opacity:1!important;transform:none!important;background:none!important;padding:0!important;font-size:14px!important;font-weight:600;color:#fff;pointer-events:none}
body.sticky-on .fab{bottom:84px!important}
@media (max-width:760px){.fab{height:48px!important;padding:0 14px!important}.fab .fab-label{display:none}.fab{width:48px!important;justify-content:center}}

/* 12 · visa page price bar appears after the price box */
.sticky-bar{transition:transform .35s var(--ease)}
.sticky-bar.sticky-hidden{transform:translateY(110%)}

/* 13 · finder tabs scroll on phones with a fade */
@media (max-width:760px){.widget-tabs{-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent);padding-right:24px!important}}

/* 15 · template gold → logo blue (stars stay gold) */
.stars,.review-stars{color:#F2A93B!important}
.route-line:after{background:var(--logo-blue)!important}

/* 18 · shorter breadcrumbs on phones */
@media (max-width:760px){
  .detail-crumbs > *{display:none}
  .detail-crumbs > a:nth-of-type(2){display:inline-flex;font-weight:600;color:var(--navy)}
  .detail-crumbs > a:nth-of-type(2):before{content:"‹";margin-right:6px}
}

/* ---------- section intro line ---------- */
.section-lede{margin:12px 0 0;color:var(--muted);font-size:16px;max-width:58ch}

/* ---------- Umrah (homepage) ---------- */
.umrah-switch,.route-switch{display:inline-flex;padding:4px;border-radius:999px;background:var(--grey);border:1px solid var(--line);margin:24px 0 16px}
.umrah-switch button,.route-switch button{padding:9px 18px;border-radius:999px;font-weight:600;font-size:14px;color:var(--muted)}
.umrah-switch button.active,.route-switch button.active{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(10,22,51,.1)}
.umrah-cards{display:grid;gap:14px}
.umrah-card{position:relative;border:1px solid var(--line);border-radius:22px;background:#fff;padding:20px 22px}
.umrah-card .stretched-link{position:absolute;inset:0;z-index:1;border-radius:22px}
.umrah-card-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.umrah-card-kicker{font-size:13px;color:var(--muted);font-weight:500}
.umrah-card h3{font-family:var(--display);font-size:22px;letter-spacing:-.03em;margin:4px 0 0}
.umrah-card-price{text-align:right;display:flex;flex-direction:column;line-height:1.2}
.umrah-card-price small{font-size:12px;color:var(--muted)}
.umrah-card-blurb{margin:10px 0 0;color:var(--muted);font-size:14.5px}
.umrah-card-walk{display:flex;gap:8px;align-items:center;margin-top:14px;padding:10px 12px;border-radius:12px;background:var(--grey);font-size:14px;font-weight:500}
.umrah-card-walk svg{color:var(--logo-blue);flex:none}
.umrah-card-inc{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13.5px;color:var(--muted)}
.umrah-card-inc li{display:inline-flex;align-items:center;gap:5px}
.umrah-card-inc svg{color:#1FAF54}
.umrah-notes{list-style:none;padding:0;margin:18px 0 22px;display:flex;flex-wrap:wrap;gap:8px}
.umrah-notes li{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;border:1px solid var(--line);font-size:13.5px;font-weight:500}
.umrah-notes svg{width:15px;height:15px;color:var(--logo-blue)}
.umrah-photo{background:var(--grey)}
.umrah-photo img{width:100%;height:100%;object-fit:cover}

/* ---------- live FAQ chat ---------- */
.conversation-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:26px}
.text-link-light{color:#fff!important}
.faq-chat{display:flex;flex-direction:column;min-height:520px}
.faq-chat .chat-head small{display:inline-flex;align-items:center;gap:6px;color:#2f9e5b;font-weight:600;font-size:12px}
.online-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.2)}
.faq-chat .chat-body{flex:1;min-height:0;max-height:360px;overflow-y:auto;scroll-behavior:smooth}
.faq-chat .chat-bubble{animation:bubbleIn .25s var(--ease) both}
.faq-chat .chat-bubble strong{display:block;margin-bottom:4px}
.chat-bubble.typing{display:inline-flex;gap:4px;padding:14px 16px;width:auto}
.chat-bubble.typing span{width:7px;height:7px;border-radius:50%;background:#9aa3b5;animation:typingDot 1s infinite}
.chat-bubble.typing span:nth-child(2){animation-delay:.15s}.chat-bubble.typing span:nth-child(3){animation-delay:.3s}
@keyframes typingDot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
@keyframes bubbleIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.chat-wa{color:#1FAF54;font-weight:600;white-space:nowrap}
.faq-chips{display:flex;gap:8px;overflow-x:auto;padding:12px 16px;border-top:1px solid var(--line);scrollbar-width:none}
.faq-chips::-webkit-scrollbar{display:none}
.faq-chips button{flex:none;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:500;color:var(--navy);white-space:nowrap}
.faq-chips button:hover{border-color:var(--logo-blue);color:var(--logo-blue)}
.faq-ask{display:flex;gap:8px;padding:12px 16px 16px;background:#fff}
.faq-ask input{flex:1;min-width:0;height:46px;border:1px solid var(--line);border-radius:999px;padding:0 16px;font:inherit;outline:none}
.faq-ask input:focus{border-color:var(--logo-blue)}
.faq-send{width:46px;height:46px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;flex:none}
.faq-send:hover{background:var(--logo-blue)}
@media (prefers-reduced-motion:reduce){.faq-chat .chat-bubble,.chat-bubble.typing span{animation:none}}

/* ---------- reviews ---------- */
.review-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.review-grid-page{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.review-card-new{margin:0;padding:24px;border:1px solid var(--line);border-radius:22px;background:#fff;display:flex;flex-direction:column;gap:14px}
.review-card-new blockquote{margin:0;font-size:15.5px;line-height:1.6}
.review-card-new figcaption{display:flex;align-items:center;gap:10px;margin-top:auto}
.review-card-new figcaption strong{display:block;font-size:14px}
.review-card-new figcaption small{color:var(--muted);font-size:12.5px}
.review-source{margin-left:auto;font-size:12.5px;color:var(--logo-blue);font-weight:600}
.star-off{color:#d9dde6}
@media (max-width:900px){.review-rail,.review-grid-page{grid-template-columns:1fr}}

/* ---------- flights: route rows ---------- */
.route-list{display:grid;gap:12px}
.route-row{display:grid;grid-template-columns:minmax(220px,1.3fr) minmax(130px,.7fr) minmax(0,1.4fr) 150px auto;gap:20px;align-items:center;padding:18px 22px;border:1px solid var(--line);border-radius:20px;background:#fff}
.route-row-cities{display:flex;align-items:center;gap:12px}
.route-row-cities strong{display:block;font-family:var(--display);font-size:17px;letter-spacing:-.02em}
.route-row-cities span{font-size:12.5px;color:var(--muted);font-weight:600}
.route-row-line{flex:1;min-width:28px;height:1px;background:var(--line);position:relative;display:grid;place-items:center}
.route-row-line svg{position:absolute;background:#fff;padding:0 4px;color:var(--logo-blue);width:24px}
.route-row-facts{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:500}
.route-row-facts span{display:inline-flex;gap:6px;align-items:center}
.route-row-facts svg{color:var(--muted)}
.route-stops{font-size:12.5px!important;color:#1f8a4c;font-weight:600!important}
.route-row-airlines{display:flex;flex-wrap:wrap;gap:6px}
.route-row-airlines span{padding:5px 10px;border-radius:999px;background:var(--grey);font-size:12.5px;font-weight:500;white-space:nowrap}
.route-row-fare{display:flex;flex-direction:column;line-height:1.25}
.route-row-fare small{font-size:12px;color:var(--muted)}
.route-ask{font-size:16px!important}
.route-note{display:flex;gap:8px;align-items:flex-start;margin-top:18px;color:var(--muted);font-size:13.5px}
.route-note svg{flex:none;color:var(--logo-blue);margin-top:2px}
.travel-grid-5{grid-template-columns:repeat(5,minmax(0,1fr))!important}
@media (max-width:1100px){.route-row{grid-template-columns:1fr 1fr;gap:14px}.route-row .btn{grid-column:1/-1}.travel-grid-5{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (max-width:760px){.route-row{grid-template-columns:1fr;padding:16px}.travel-grid-5{grid-template-columns:1fr 1fr!important}}

/* ---------- footer (v24: compact on phones) ---------- */
.site-footer{background:#0a1633!important;color:rgba(255,255,255,.72);border:0!important;padding-top:56px!important}
.site-footer a{color:rgba(255,255,255,.72)!important;text-decoration:none}
.site-footer a:hover{color:#fff!important}
.footer-top{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,2fr);gap:56px;padding-bottom:40px}
.footer-logo{height:28px;width:auto;display:block}
.footer-blurb{font-size:14px;line-height:1.55;max-width:36ch;margin:14px 0 18px;color:rgba(255,255,255,.72)}
.footer-actions{display:flex;gap:8px;margin:0 0 18px}
.footer-action{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:40px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:13.5px;font-weight:600;color:#fff!important;white-space:nowrap}
.footer-action svg{width:16px;height:16px;flex:none}
.footer-action--wa{background:#1fae5b;border-color:#1fae5b}
.footer-action:hover{background:rgba(255,255,255,.16)}.footer-action--wa:hover{background:#1a9a50}
.footer-contact-list{list-style:none;padding:0;margin:0;display:grid;gap:9px;font-size:13.5px;line-height:1.45}
.footer-contact-list li{display:flex;gap:10px;align-items:flex-start}
.footer-contact-list svg{width:15px;height:15px;flex:none;margin-top:2px;color:#7FB3FF}
.footer-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.footer-col summary{list-style:none;color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 12px;pointer-events:none}
.footer-col summary::-webkit-details-marker{display:none}
.footer-links a{display:block;font-size:14px;padding:5px 0}
.footer-news{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 22px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);flex-wrap:wrap}
.footer-news h3{color:#fff;font-family:var(--display);font-size:17px;font-weight:600;letter-spacing:-.01em;margin:0}
.footer-news p{margin:3px 0 0;font-size:13px}
.site-footer .newsletter-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.site-footer .newsletter-form input{width:260px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;padding:0 16px;outline:0;font-size:15px}
.site-footer .newsletter-form input::placeholder{color:rgba(255,255,255,.55)}
.site-footer .newsletter-form .btn{height:44px;min-height:44px;padding:0 18px}
.site-footer .newsletter-form .form-status{flex-basis:100%;margin:0;font-size:13px;color:#cfe3ff}
.site-footer .footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:18px 0 26px;margin-top:22px;border-top:1px solid rgba(255,255,255,.1);font-size:12.5px;color:rgba(255,255,255,.55)}
.site-footer .footer-bottom span:last-child{display:flex;gap:16px}
@media (max-width:900px){.footer-top{grid-template-columns:1fr;gap:28px}}
@media (max-width:760px){
  .site-footer{padding-top:32px!important;padding-bottom:84px}
  .footer-top{gap:20px;padding-bottom:20px}
  .footer-logo{height:24px}
  .footer-blurb{font-size:13.5px;margin:10px 0 14px}
  .footer-actions{margin-bottom:14px}
  .footer-action{flex:1;height:42px;padding:0 10px}
  .footer-contact-list .fc-wide{display:none}
  .footer-contact-list{font-size:13px;gap:7px}
  .footer-nav{grid-template-columns:1fr;gap:0;border-top:1px solid rgba(255,255,255,.1)}
  .footer-col{border-bottom:1px solid rgba(255,255,255,.1)}
  .footer-col summary{pointer-events:auto;cursor:pointer;display:flex;justify-content:space-between;align-items:center;margin:0;padding:14px 0;font-size:13px}
  .footer-col summary::after{content:"";width:8px;height:8px;border-right:2px solid rgba(255,255,255,.6);border-bottom:2px solid rgba(255,255,255,.6);transform:rotate(45deg);margin:-4px 4px 0 0;transition:transform .2s}
  .footer-col[open] summary::after{transform:rotate(-135deg);margin-top:4px}
  .footer-links{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding:0 0 12px}
  .footer-links a{font-size:13.5px;padding:7px 0}
  .footer-news{padding:14px;border-radius:14px;gap:10px}
  .footer-news h3{font-size:15px}.footer-news p{display:none}
  .site-footer .newsletter-form{width:100%;flex-wrap:nowrap}
  .site-footer .newsletter-form input{width:auto;flex:1;min-width:0;height:42px}
  .site-footer .newsletter-form .btn{height:42px;min-height:42px;padding:0 14px}
  .site-footer .newsletter-form{flex-wrap:wrap}.site-footer .newsletter-form input{flex:1 1 0}
  .site-footer .footer-bottom{margin-top:16px;padding:14px 0 0;font-size:12px}
}

.hero-title{max-width:940px!important}
.faq-chat{min-height:460px}
.flights-reference-shell{max-width:var(--container)!important}
.tour-ticks{background:repeating-linear-gradient(to bottom,#BFD6F6 0 2px,transparent 2px 6px)!important}
.route-row-line svg{transform:rotate(45deg)}
@media (max-width:760px){.faq-chat{order:0!important;min-height:0}.faq-chat .chat-body{min-height:240px}}
.conversation-actions .text-link{margin-top:0}

/* ---------- v24: Umrah section with travel slider ---------- */
.umrah-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:28px}
.umrah-head .lede{max-width:56ch;margin:12px 0 0}
.umrah-head .umrah-switch{margin:0;flex:none}
.umrah-switch button{display:inline-flex;align-items:center;gap:7px}
.umrah-switch button svg{width:16px;height:16px}
.umrah-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:32px;align-items:stretch}
.umrah-list{display:flex;flex-direction:column;min-width:0}
.umrah-list .umrah-notes{margin:16px 0 18px}
.umrah-slider{position:relative;border-radius:24px;overflow:hidden;background:#0f2148;min-height:520px;isolation:isolate}
.us-track{position:absolute;inset:0}
.us-slide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility 0s linear .7s}
.us-slide.is-active{opacity:1;visibility:visible;transition:opacity .7s ease}
.us-air{background:linear-gradient(180deg,#5b8fd6 0%,#a9c8ef 55%,#e9f1fb 100%)}
.us-haram{background:#cdb89a url("media/generated/guide-umrah-card-v15-hd.webp?v=dd-20261112-v30") center/cover}
.us-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 7s ease-out}
.us-slide.is-active .us-photo{transform:scale(1)}
.us-scene{position:absolute;inset:0;width:100%;height:100%}
.us-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,22,51,.28) 0%,rgba(10,22,51,0) 28%,rgba(10,22,51,0) 55%,rgba(10,22,51,.45) 100%);pointer-events:none}
.us-pill{position:absolute;z-index:2;top:16px;left:16px;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--navy);font-size:13px;font-weight:600}
.us-pill svg{width:15px;height:15px;color:var(--logo-blue)}
.us-card{position:absolute;z-index:2;left:16px;right:16px;bottom:52px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.94);color:var(--navy);box-shadow:0 12px 30px -12px rgba(10,22,51,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.us-card p{margin:6px 0 0;font-size:13.5px;line-height:1.45;color:#3f4759}
.us-card-simple strong{font-family:var(--display);font-size:16px;font-weight:600}
.us-route{display:flex;align-items:center;gap:10px}
.us-code{font-family:var(--display);font-weight:600;font-size:20px;letter-spacing:-.01em;line-height:1;display:flex;flex-direction:column;gap:3px}
.us-code small{font-family:var(--body);font-size:11.5px;font-weight:500;color:var(--muted);letter-spacing:0}
.us-code-end{text-align:right;align-items:flex-end}
.us-path{flex:1;min-width:0;height:44px;color:#8fb2e6;overflow:visible}
.us-dash{animation:usDash 1.2s linear infinite}
@keyframes usDash{to{stroke-dashoffset:-20}}
.us-far{animation:usPan 26s linear infinite}
.us-near{animation:usPan 14s linear infinite}
.us-lane{animation:usLane .6s linear infinite}
.us-coach{animation:usBob .9s ease-in-out infinite alternate}
@keyframes usPan{to{transform:translateX(-480px)}}
@keyframes usLane{to{stroke-dashoffset:-40}}
@keyframes usBob{from{transform:translate(112px,262px)}to{transform:translate(112px,263.5px)}}
.us-dots{position:absolute;z-index:3;left:16px;right:16px;bottom:16px;display:flex;gap:6px}
.us-dots button{flex:1;position:relative;height:24px;padding:0;background:none;border:0;cursor:pointer}
.us-dots button::before{content:"";position:absolute;left:0;right:0;top:11px;height:3px;border-radius:3px;background:rgba(255,255,255,.45)}
.us-dots button::after{content:"";position:absolute;left:0;top:11px;height:3px;border-radius:3px;background:#fff;width:0}
.us-dots button.active::after{width:100%}
.umrah-slider.is-running .us-dots button.active::after{width:0;animation:usProg 6s linear forwards}
@keyframes usProg{to{width:100%}}
.us-dots span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.umrah-slider.is-offscreen *{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){.us-dash,.us-far,.us-near,.us-lane,.us-coach{animation:none}.us-photo{transition:none;transform:none}}
@media (max-width:1000px){.umrah-layout{grid-template-columns:1fr}.umrah-slider{min-height:0;aspect-ratio:16/10}}
@media (max-width:760px){
  .umrah-head{flex-direction:column;align-items:stretch;gap:16px;margin-bottom:18px}
  .umrah-head .umrah-switch{display:flex;width:100%}.umrah-head .umrah-switch button{flex:1;justify-content:center}
  .umrah-layout{gap:16px}
  .umrah-slider{aspect-ratio:auto;height:300px;border-radius:20px}
  .us-card{left:12px;right:12px;bottom:44px;padding:11px 13px;border-radius:14px}
  .us-card p{font-size:12.5px;margin-top:4px}
  .us-code{font-size:17px}.us-path{height:36px}
  .us-pill{top:12px;left:12px;font-size:12px;padding:6px 10px}
  .us-dots{left:12px;right:12px;bottom:10px}
  .umrah-list .umrah-notes{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:12px -20px 14px;padding:0 20px}
  .umrah-list .umrah-notes::-webkit-scrollbar{display:none}
  .umrah-list .umrah-notes li{white-space:nowrap;flex:none}
}
.us-cloud{animation:usCloud 22s linear infinite}.us-cloud.c2{animation-duration:30s}.us-cloud.c3{animation-duration:38s}
@keyframes usCloud{from{transform:translateX(-40px)}to{transform:translateX(60px)}}
.us-jet{animation:usJet 9s linear infinite}
@keyframes usJet{0%{transform:translate(-60px,330px) rotate(10deg)}100%{transform:translate(460px,90px) rotate(10deg)}}
@media (prefers-reduced-motion:reduce){.us-cloud,.us-jet{animation:none}.us-jet{transform:translate(200px,200px) rotate(10deg)}}

/* ---------- v24: lighter, calmer headings ---------- */
h1,h2,h3{font-weight:600}
.hero-title{font-size:clamp(38px,4.6vw,60px)!important;line-height:1.04!important;letter-spacing:-.03em!important;font-weight:600;max-width:820px!important}
.hero-title em{font-weight:500!important;color:rgba(255,255,255,.88)!important}
.section-head h2,.split-copy h2,.umrah-head h2,.conversation-copy h2,.closer h2{font-size:clamp(28px,2.7vw,38px)!important;line-height:1.1!important;letter-spacing:-.025em!important;font-weight:600}
.page-hero h1{font-size:clamp(36px,4.2vw,56px)!important;line-height:1.05!important;letter-spacing:-.03em!important;font-weight:600}
.page-hero--short h1{font-size:clamp(34px,3.8vw,50px)!important}
.attraction-detail-head h1,.tour-detail-head h1{font-size:clamp(34px,4.2vw,54px)!important;line-height:1.05!important;letter-spacing:-.03em!important}
.page-big-title{font-size:clamp(30px,3.6vw,46px)!important;letter-spacing:-.03em!important;line-height:1.08!important}
.umrah-ref-title,.flights-heading h2,.detail-banner-copy h2{font-size:clamp(26px,2.8vw,36px)!important;letter-spacing:-.025em!important}
.detail-block h2,.prose-ref h2,.guide-article.prose-ref h2,.attraction-detail-main h2,.tour-detail-main h2{letter-spacing:-.02em!important}
@media (max-width:760px){
  .hero-title{font-size:clamp(32px,8.6vw,38px)!important;line-height:1.08!important;letter-spacing:-.025em!important}
  .section-head h2,.split-copy h2,.umrah-head h2,.conversation-copy h2{font-size:clamp(25px,6.8vw,28px)!important}
  .page-hero h1,.page-hero:not(.travel-hero) h1{font-size:clamp(30px,8.2vw,36px)!important}
  .attraction-detail-head h1,.tour-detail-head h1{font-size:clamp(30px,8.2vw,36px)!important}
  .page-big-title,.umrah-ref-title,.flights-heading h2,.detail-banner-copy h2{font-size:clamp(24px,6.6vw,28px)!important}
  .detail-block h2,.prose-ref h2,.guide-article.prose-ref h2,.attraction-detail-main h2,.tour-detail-main h2{font-size:23px!important}
}
.detail-title,.guide-detail-title{font-size:clamp(34px,4vw,54px)!important;line-height:1.06!important;letter-spacing:-.03em!important;font-weight:600}
@media (max-width:760px){.detail-title,.guide-detail-title{font-size:clamp(29px,8vw,34px)!important;max-width:none!important}}

/* ---------- v24: simpler phone layout ---------- */
.mobile-more{display:none}
.hide-sm{display:inline}
.sticky-on .fab{opacity:0;pointer-events:none;transform:scale(.8)}
.fab{transition:opacity .25s,transform .25s}
@media (max-width:760px){
  .hide-sm{display:none}
  /* hero: shorter, no extra tagline */
  .hero{min-height:0!important}
  .hero-inner{min-height:0!important;padding-top:calc(var(--nav-h) + 52px)!important;padding-bottom:60px!important}
  .hero-eyebrow{display:none}
  .hero-sub{font-size:15px!important;margin-top:12px!important}
  .hero-video-toggle{display:none!important}
  /* trust strip: one swipeable row */
  .trust-strip{padding:12px 0!important}
  .trust-inner{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;gap:8px!important;justify-content:flex-start!important;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter)}
  .trust-inner::-webkit-scrollbar{display:none}
  .trust-item{flex:none;white-space:nowrap;padding:7px 11px;border:1px solid var(--line);border-radius:999px;font-size:12.5px}
  /* section heads: the button under each list replaces the small top link */
  #visas .section-head .text-link,#attractions .section-head .text-link,#guides .section-head .text-link{display:none}
  #tours .section-head-actions .rail-btn{display:none}
  .mobile-more{display:flex;justify-content:center;width:100%;margin-top:18px;height:46px;align-items:center}
  /* visas: six cards, processing time only */
  #visaGrid>.visa-card:nth-child(n+7){display:none}
  #visaGrid .meta-rows .meta-row:first-child{display:none}
  /* attractions: four */
  #attractionGrid>.acard:nth-child(n+5){display:none}
  /* guides: compact rows */
  #guideGrid{gap:14px}
  #guideGrid .guide-card>a{display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:14px;align-items:start}
  #guideGrid .guide-media{grid-row:1/4;width:96px;height:96px!important;min-height:0!important;aspect-ratio:auto!important;border-radius:14px!important;margin:0!important}
  #guideGrid .guide-media img{height:100%!important;width:100%;object-fit:cover}
  #guideGrid .guide-kicker{margin:2px 0 4px!important}
  #guideGrid .guide-title{font-size:16px!important;line-height:1.25!important;margin:0!important}
  #guideGrid .guide-ex{display:none}
  .section{--section:56px}
  /* Umrah page: compact package cards */
  .row-pass-main{padding:18px 18px 14px!important}
  .row-pass-side{flex-direction:row!important;align-items:center!important;justify-content:space-between!important;padding:14px 18px!important;gap:12px}
  .row-barcode{display:none!important}
  .row-pass-side .btn{align-self:center!important}
  .row-pass-price{font-size:22px!important}
  .umrah-media{display:none}
}
@media (max-width:760px){
  .page-hero.travel-hero{height:auto!important;min-height:0!important}
  .page-hero.travel-hero>.container{height:auto!important;min-height:0!important;padding-top:calc(var(--nav-h) + 28px)!important;padding-bottom:40px!important}
  .page-hero-caption{display:none!important}
  .route-row{grid-template-columns:minmax(0,1fr) auto!important;gap:10px 12px!important;padding:14px 16px!important}
  .route-row-cities{grid-column:1/-1}
  .route-row-airlines{grid-column:1/-1;order:3}
  .route-row-fare{text-align:right;align-items:flex-end}
  .route-row .btn{grid-column:1/-1;order:4;height:42px;min-height:42px}
}
@media (max-width:760px){.travel-grid-5>*:last-child:nth-child(odd){grid-column:1/-1}}
.site-footer .staff-link{display:inline-flex;align-items:center;gap:5px}
.site-footer .staff-link svg{width:13px;height:13px}

/* ---------- v25: About, Why and Contact ---------- */
.btn-wa{background:#1fae5b!important;color:#fff!important;border-color:#1fae5b!important}
.btn-wa:hover{background:#1a9a50!important}
.btn svg{width:18px;height:18px}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.feature-card{padding:26px;border:1px solid var(--line);border-radius:20px;background:#fff;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.feature-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -20px rgba(10,22,51,.25)}
.feature-ico,.svc-ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#eaf2fd;color:var(--logo-blue);margin-bottom:18px}
.feature-ico svg,.svc-ico svg{width:22px;height:22px}
.feature-card h3,.svc-card h3{font-family:var(--display);font-size:19px;font-weight:600;letter-spacing:-.01em;margin:0 0 8px}
.feature-card p,.svc-card p{margin:0;color:var(--muted);font-size:15px;line-height:1.6}
.steps-row{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:s}
.steps-row li{position:relative;padding:24px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.step-num{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--navy);color:#fff;font-family:var(--display);font-weight:600;margin-bottom:16px}
.steps-row h3{font-family:var(--display);font-size:18px;font-weight:600;margin:0 0 6px}
.steps-row p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.6}
.compare-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:48px;align-items:start}
.compare-intro h2,.price-explainer h2,.visit-grid h2{font-family:var(--display);font-size:clamp(26px,2.6vw,34px);font-weight:600;letter-spacing:-.02em;line-height:1.15;margin:0 0 12px}
.compare-intro .lede,.price-explainer .lede{margin:0 0 22px}
.compare-table{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
.compare-row{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:16px;padding:16px 20px;border-top:1px solid var(--line);font-size:14.5px;align-items:start}
.compare-row:first-child{border-top:0}
.compare-head{background:var(--grey);font-weight:600;font-size:13px;color:var(--muted)}
.compare-head span:last-child{color:var(--logo-blue)}
.compare-row [role=rowheader]{font-weight:600}
.c-self,.c-us{display:flex;gap:8px;align-items:flex-start;line-height:1.45}
.c-self{color:var(--muted)}
.c-self svg,.c-us svg{width:16px;height:16px;flex:none;margin-top:2px}
.c-self svg{color:#a3abbb}.c-us svg{color:#1f9d55}
.price-explainer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.price-sum{display:grid;gap:10px}
.price-line,.price-total{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.price-line span{display:grid;gap:2px}.price-line small{color:var(--muted);font-size:13.5px}
.price-line svg,.price-total svg{width:22px;height:22px;color:var(--logo-blue);flex:none}
.price-plus{text-align:center;font-family:var(--display);font-size:20px;color:var(--muted);line-height:1}
.price-total{background:var(--navy);color:#fff;border-color:var(--navy);font-weight:600}
.price-total svg{color:#9cc5ff}
.cta-band{background:var(--navy);color:#fff;padding:56px 0}
.cta-band-inner{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.cta-band h2{font-family:var(--display);font-size:clamp(26px,2.6vw,34px);font-weight:600;letter-spacing:-.02em;margin:0 0 8px}
.cta-band p{margin:0;color:rgba(255,255,255,.75);max-width:56ch}
.cta-band-actions{display:flex;gap:10px;flex-wrap:wrap}
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.svc-card{display:flex;flex-direction:column;padding:26px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--navy);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.svc-card:hover{transform:translateY(-3px);border-color:#c9daf3;box-shadow:0 18px 40px -20px rgba(10,22,51,.25)}
.svc-card p{flex:1}
.svc-more{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-weight:600;font-size:14px;color:var(--logo-blue)}
.svc-more svg{width:16px;height:16px;transition:transform .2s}.svc-card:hover .svc-more svg{transform:translateX(3px)}
.about-intro{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:56px;align-items:start}
.about-intro .prose-ref{margin:0 0 16px}
.about-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:24px}
.glance-card{border:1px solid var(--line);border-radius:22px;padding:26px;background:#fff;box-shadow:0 18px 40px -26px rgba(10,22,51,.3)}
.glance-card h3{font-family:var(--display);font-size:18px;font-weight:600;margin:0 0 16px}
.glance-card ul{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.glance-card li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;font-weight:500}
.glance-card li svg{width:18px;height:18px;flex:none;color:var(--logo-blue);margin-top:2px}
.glance-card small{display:block;font-size:12.5px;color:var(--muted);font-weight:500;margin-bottom:1px}
.glance-card a{color:var(--navy)}
.visit-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:48px;align-items:center}
.visit-hours{display:flex;gap:8px;align-items:center;font-weight:600;margin:8px 0 0}
.visit-hours svg{width:18px;height:18px;color:var(--logo-blue)}
.map-embed{border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--grey);aspect-ratio:16/11}
.map-embed iframe{width:100%;height:100%;border:0;display:block}
.contact-channels-sec{padding-bottom:0!important}
.channel-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.channel-card{display:flex;flex-direction:column;gap:3px;padding:22px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--navy);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s;min-width:0}
.channel-card:hover{transform:translateY(-3px);border-color:#c9daf3;box-shadow:0 16px 36px -20px rgba(10,22,51,.3)}
.channel-ico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#eaf2fd;color:var(--logo-blue);margin-bottom:12px}
.channel-ico svg{width:20px;height:20px}
.channel-label{font-size:13px;color:var(--muted);font-weight:600}
.channel-card strong{font-size:15.5px;font-weight:600;overflow-wrap:anywhere}
.channel-card small{color:var(--muted);font-size:13px}
.channel-wa{background:#1fae5b;border-color:#1fae5b;color:#fff}
.channel-wa .channel-ico{background:rgba(255,255,255,.18);color:#fff}
.channel-wa .channel-label,.channel-wa small{color:rgba(255,255,255,.85)}
.contact-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px;align-items:start}
.contact-form-card h2{font-family:var(--display);font-size:24px;font-weight:600;margin:0 0 4px}
.form-intro{margin:0 0 20px;color:var(--muted)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form-card select{border:1px solid var(--line);border-radius:14px;padding:0 14px;height:50px;background:#fff;font:inherit;color:var(--navy)}
.contact-side{display:grid;gap:14px}
.info-card{border:1px solid var(--line);border-radius:20px;padding:22px;background:#fff}
.info-card h3{display:flex;gap:8px;align-items:center;font-family:var(--display);font-size:17px;font-weight:600;margin:0 0 10px}
.info-card h3 svg{width:18px;height:18px;color:var(--logo-blue)}
.info-card p{margin:0;font-weight:600}.info-card p.muted{font-weight:400;color:var(--muted);font-size:13.5px;margin-top:6px}
.tick-list{list-style:none;padding:0;margin:0;display:grid;gap:9px;font-size:14.5px}
.tick-list li{display:flex;gap:8px;align-items:flex-start}
.tick-list svg{width:16px;height:16px;color:#1f9d55;flex:none;margin-top:3px}
@media (max-width:1000px){.feature-grid,.svc-grid{grid-template-columns:1fr 1fr}.steps-row{grid-template-columns:1fr 1fr}.channel-grid{grid-template-columns:1fr 1fr}.compare-wrap,.price-explainer,.about-intro,.visit-grid,.contact-layout{grid-template-columns:1fr;gap:28px}}
@media (max-width:760px){
  .feature-grid,.svc-grid,.steps-row{grid-template-columns:1fr;gap:12px}
  .feature-card,.svc-card,.steps-row li{padding:20px;border-radius:18px}
  .feature-ico,.svc-ico{width:40px;height:40px;margin-bottom:12px}
  .feature-card h3,.svc-card h3{font-size:17px}.feature-card p,.svc-card p,.steps-row p{font-size:14px}
  .steps-row li{display:grid;grid-template-columns:36px 1fr;column-gap:14px}.steps-row li .step-num{grid-row:1/3;margin:0}.steps-row h3{font-size:16.5px}
  .compare-row{grid-template-columns:1fr 1fr;gap:6px 12px;padding:14px 16px;font-size:13.5px}
  .compare-row [role=rowheader]{grid-column:1/-1}
  .compare-head [role=columnheader]:first-child{display:none}
  .channel-grid{grid-template-columns:1fr 1fr;gap:10px}
  .channel-card{padding:16px;border-radius:16px}.channel-ico{width:36px;height:36px;margin-bottom:8px}.channel-card strong{font-size:14px}.channel-card small{font-size:12px}
  .form-row{grid-template-columns:1fr}
  .cta-band{padding:40px 0}.cta-band-actions{width:100%}.cta-band-actions .btn{flex:1}
  .map-embed{aspect-ratio:4/3}
}
.cta-band{background:transparent!important;color:inherit;padding:64px 0!important}
.cta-band-inner{background:linear-gradient(120deg,#0a1633 0%,#13306b 100%);color:#fff;border-radius:28px;padding:40px 44px}
@media (max-width:760px){.cta-band{padding:40px 0!important}.cta-band-inner{padding:28px 22px;border-radius:22px}}
input,select,textarea,button{font-family:inherit}
textarea{font:inherit;line-height:1.5}
@media (max-width:760px){.contact-form-card{padding:20px!important;border-radius:20px!important}.contact-form-card h2{font-size:21px}.channel-card strong{font-size:13.5px;word-break:break-word}}
/* attractions index: responsive grid, price in the card body */
.attraction-ref{display:flex;flex-direction:column}
.attraction-ref-body{display:flex;flex-direction:column;flex:1}
.attraction-ref-price{margin-top:auto;padding-top:12px;display:flex;align-items:baseline;gap:6px}
.attraction-ref-price span{font-size:12.5px;color:var(--muted)}
.attraction-ref-price strong{font-family:var(--display);font-size:17px;font-weight:600;letter-spacing:-.01em}
@media (max-width:1050px){.attraction-index-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (max-width:760px){
  .attraction-index-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .attraction-ref-media{aspect-ratio:4/3!important}
  .attraction-ref-body{padding:12px 12px 14px}
  .attraction-ref-name{font-size:15.5px!important;line-height:1.2}
  .attraction-ref-meta{font-size:12px!important;line-height:1.4}
  .attraction-ref-price strong{font-size:15px}
}

/* ---------- v25: even type scale, nothing below 12px ---------- */
.field-label{font-size:12px!important;letter-spacing:0!important;text-transform:none!important}
.widget-tab{font-size:13px!important}
.guide-toc p{font-size:12px!important;letter-spacing:.04em}
.guide-toc a{font-size:13.5px!important}
.attraction-book-note,.tour-book-note{font-size:12.5px!important;line-height:1.5!important}
.attraction-book-card small,.tour-book-card small{font-size:12px!important}
.tour-detail-hero-copy small,.tour-sticky-bar small{font-size:12px!important;letter-spacing:0!important;text-transform:none!important;font-family:var(--body)!important}
.tour-pass-route strong,.tour-pass-meta strong,.tour-meta strong,.ref-card-meta strong{font-size:13px!important}
.us-code small{font-size:12px}
@media (max-width:760px){.attraction-ref-meta{font-size:12px!important}}
.hero-v3 .field-label,.hero .field-label{font-size:12px!important;letter-spacing:0!important;text-transform:none!important}
.hero-v3 .widget-tab,.hero .widget-tab{font-size:13px!important}
.page-big-title{font-size:clamp(28px,3vw,40px)!important}
.form-row .optional,.contact-form-card .optional{display:inline!important;font-weight:400}
.contact-faq .faq-list-large{max-width:none}
.contact-faq .faq-item,.contact-faq .faq-list-large{margin-inline:0}

/* v28: Umrah ticket cards (home + Umrah page), Umrah page gallery and FAQ layout */
.umrah-ticket{display:grid;grid-template-columns:minmax(0,1fr) 148px;padding:0;overflow:hidden}
.umrah-ticket .ut-main{padding:16px 18px;min-width:0}
.umrah-ticket h3{font-size:19px;margin:3px 0 0}
.ut-hotel{display:flex;gap:6px;align-items:center;margin-top:8px;font-size:13.5px;font-weight:500}
.ut-hotel svg{color:var(--logo-blue,#2f6fe0);flex:none}
.ut-rates,.um-rates,.um-inc{list-style:none;padding:0;margin:0}
.ut-rates{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.ut-rates li{display:inline-flex;align-items:baseline;gap:6px;padding:5px 10px;border-radius:999px;background:var(--grey);font-size:12.5px;white-space:nowrap}
.ut-rates span{color:var(--muted)}
.ut-rates strong{font-weight:700}
.ut-side{position:relative;border-left:1px dashed #d9dbe2;padding:14px 16px;display:flex;flex-direction:column;justify-content:center;gap:1px;background:#fbfbfc}
.ut-side small{font-size:12px;color:var(--muted)}
.ut-price{font-family:var(--display);font-size:20px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.ut-side .btn{margin-top:10px;align-self:flex-start}
.ut-side:before,.ut-side:after{content:"";position:absolute;left:-9px;width:16px;height:16px;border-radius:50%;background:#fff;border:1px solid var(--line)}
.ut-side:before{top:-9px}.ut-side:after{bottom:-9px}
.umrah-home .umrah-cards{gap:12px}
.umrah-home .umrah-slider{min-height:400px}
.umrah-home .umrah-list .umrah-notes{margin:14px 0 14px}
@media (max-width:560px){
  .umrah-ticket{grid-template-columns:minmax(0,1fr)}
  .ut-side{border-left:0;border-top:1px dashed #d9dbe2;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;padding:12px 18px}
  .ut-side .btn{margin:0 0 0 auto;align-self:center}
  .ut-side:before,.ut-side:after{display:none}
}
.um-ticket .row-pass-main{padding:22px 24px}
.um-ticket-name{font-family:var(--display);font-size:22px;letter-spacing:-.03em;margin:8px 0 4px}
.um-ticket-blurb{margin:0;color:var(--muted);font-size:14.5px;line-height:1.55}
.um-ticket-hotel{display:flex;gap:7px;align-items:center;margin-top:12px;padding:9px 12px;border-radius:12px;background:var(--grey);font-size:14px;font-weight:500}
.um-ticket-hotel svg{color:var(--logo-blue,#2f6fe0);flex:none}
.um-rates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.um-rates li{border:1px solid var(--line);border-radius:12px;padding:9px 11px;min-width:0}
.um-rates span{display:block;font-size:12px;color:var(--muted)}
.um-rates strong{display:block;font-family:var(--display);font-size:16px;font-weight:700;letter-spacing:-.01em;margin-top:2px;white-space:nowrap}
.um-inc{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:13px;font-size:13.5px;color:var(--muted)}
.um-inc li{display:inline-flex;align-items:center;gap:5px}
.um-inc svg{color:#1FAF54;flex:none}
.um-note{margin:12px 0 0;font-size:13px;color:#8a6a1c;background:#fffaf0;border:1px solid #ead9a9;border-radius:10px;padding:8px 11px}
.um-ticket .row-barcode{height:54px}
.um-ticket .row-pass-side{gap:14px}
@media (min-width:1051px){.umrah-wrap{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:44px}.um-ticket{grid-template-columns:minmax(0,1fr) 176px}}
.um-aside{position:sticky;top:96px;display:grid;gap:14px;min-width:0}
.um-aside .umrah-media{aspect-ratio:1/1;max-height:440px;width:100%}
.um-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.um-thumbs figure,.um-gallery-grid figure,.um-faq-photo{position:relative;margin:0;border-radius:20px;overflow:hidden;background:var(--grey)}
.um-thumbs figure{aspect-ratio:4/3}
.um-thumbs img,.um-gallery-grid img,.um-faq-photo img{width:100%;height:100%;object-fit:cover;display:block}
.um-thumbs figcaption,.um-gallery-grid figcaption,.um-faq-photo figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 11px;color:#fff;font-size:13px;font-weight:600;background:linear-gradient(180deg,transparent,rgba(5,12,28,.72))}
.um-gallery{padding:0 0 96px}
.um-gallery .umrah-ref-title{margin-bottom:28px}
.um-gallery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.um-gallery-grid figure{aspect-ratio:4/5}
.um-faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:64px;align-items:start}
.um-faq-side{position:sticky;top:96px}
.um-faq-side .umrah-ref-title{margin-bottom:24px}
.um-faq-photo{aspect-ratio:4/3;margin-bottom:18px}
.umrah-faq-ref .um-faq-grid .umrah-faq-list{background:#fff;border:1px solid var(--line);border-radius:24px;padding:6px 26px}
.umrah-faq-ref .um-faq-grid .umrah-faq-item:last-child{border-bottom:0}
@media (max-width:1050px){
  .um-aside{position:static;order:-1}
  .um-aside .umrah-media{aspect-ratio:16/9;max-height:none}
  .um-thumbs{display:none}
  .um-faq-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .um-faq-side{position:static}
}
@media (max-width:760px){
  .um-aside{display:none}
  .um-gallery{padding-bottom:64px}
  .um-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .um-rates{grid-template-columns:repeat(2,minmax(0,1fr))}
  .um-ticket .row-pass-main{padding:18px!important}
  .um-faq-photo{aspect-ratio:16/9}
  .umrah-faq-ref .um-faq-grid .umrah-faq-list{padding:2px 18px}
}