/* Blue Crescent v7 — 26 Oct 2026
   Loaded after every existing stylesheet. Rules kept from the brief: the crescent is blue, dark sections use
   solid colours (TikTok in-app browser), FontAwesome + local fonts only. Fixes from the UI/UX Pro Max audit
   (text ≥12px, 44px touch targets, 4.5:1 contrast) apply site-wide; ornaments and motion are home-only. */
:root{
  --b7-navy:#0c2e4f;--b7-navy-2:#0a2742;--b7-ink:#19334e;--b7-blue:#145bae;--b7-sky:#e8f0f8;--b7-gold:#b78632;--b7-gold-2:#e2c27d;
  --b7-paper:#fffefa;--b7-line:#d9e3ec;--b7-muted:#4b6075;--b7-on-dark:#f4f6f9;--b7-on-dark-2:#c6d4e3;
  --b7-ease:cubic-bezier(0.23,1,0.32,1);--b7-ease-io:cubic-bezier(0.77,0,0.175,1);
  --b7-pattern:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23e2c27d' stroke-width='1'%3E%3Crect x='20' y='20' width='24' height='24'/%3E%3Crect x='20' y='20' width='24' height='24' transform='rotate(45 32 32)'/%3E%3Ccircle cx='32' cy='32' r='4'/%3E%3Cpath d='M0 0l15 15M64 0L49 15M0 64l15-15M64 64L49 49M32 0v7M32 57v7M0 32h7M57 32h7'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- Audit fixes (site-wide) ---------- */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body :is(.bcx-kicker,.bcx-note,.bcx-fine,.bcx-disclaim){font-size:max(13px,1em)!important;line-height:1.6}
body .bcx-steps small{font-size:max(13px,.95em)!important}
body .bcx-task small{font-size:12.5px!important;line-height:1.55}
.site-footer :is(p,small,span,li){font-size:max(13px,1em)}
.site-footer :is(p,small),.site-footer .footer-bottom,.site-footer [class*=copy]{color:#b9c8d8!important}
.site-footer a,body .bcx-contact a:not(.bcx-task):not(.bc7-btn){display:inline-flex;align-items:center;min-height:44px}
body input[type=checkbox]{min-width:22px;min-height:22px;accent-color:var(--b7-blue)}
body label:has(>input[type=checkbox]){display:flex;gap:12px;align-items:flex-start;padding-block:8px;cursor:pointer}
body :is(.bcx-sh,.bcx-more) a,body a.bcx-link{min-height:44px;display:inline-flex;align-items:center}
body .bcx-task{min-height:56px}
/* the budget tool printed light-blue text on a light card (contrast 1.2–1.5:1) */
body [id*=budget] :is(output,.total,[class*=total],small,p),body [class*=budget] :is(output,.total,[class*=total],small,p){color:var(--b7-ink)!important}
body button,body summary,body [role=button]{touch-action:manipulation}

/* ---------- Dark sections: solid colour + tile ornament (no gradient fills) ---------- */
.bc7-home .bcx-hero{background:var(--b7-navy)!important;position:relative;isolation:isolate}
.bc7-home .bcx-contact{background:var(--b7-navy-2)!important;position:relative;isolation:isolate}
.bc7-home :is(.bcx-hero,.bcx-contact)::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--b7-pattern);background-size:64px 64px;opacity:.07}
.site-footer{position:relative;isolation:isolate}
.site-footer::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--b7-pattern);background-size:64px 64px;opacity:.045}

/* ---------- Section divider: star · blue crescent · star ---------- */
.bc7-orn{display:flex;align-items:center;justify-content:center;gap:12px;width:min(1120px,calc(100% - 40px));margin:0 auto;padding:6px 0;color:var(--b7-gold)}
.bc7-orn>span{flex:1;height:1px;background:linear-gradient(90deg,transparent,#b7863266 35%,#b7863266 65%,transparent)}
.bc7-orn .bc7-star{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.3}
.bc7-orn .bc7-star circle{fill:currentColor;stroke:none}
.bc7-orn .bc7-moon{width:26px;height:26px;fill:var(--b7-blue)}
.bc7-tip .bc7-moon{fill:var(--b7-blue)}

/* ---------- Icons: arch tiles, blue line, gold spark ---------- */
.bc7-home .bc-art-cost-icon{position:relative;display:inline-grid;place-items:center;width:48px;height:52px;border-radius:999px 999px 12px 12px;background:var(--b7-sky);color:var(--b7-blue);box-shadow:inset 0 0 0 1px #145bae26;flex:0 0 auto}
.bc7-home .bc-art-cost-icon::after{content:'';position:absolute;top:7px;inset-inline-end:9px;width:5px;height:5px;border-radius:50%;background:var(--b7-gold)}

/* ---------- Discounts: the numbers carry the card ---------- */
.bc7-home #discounts li b{display:inline-block;min-width:2.6em;font-size:clamp(30px,6vw,40px);line-height:1;color:var(--b7-blue);font-weight:800;letter-spacing:-.02em;margin-inline-end:6px;vertical-align:-4px;font-variant-numeric:tabular-nums}
.bc7-home #discounts{border:1px solid #b7863255;box-shadow:0 22px 46px -26px #0c2e4f55}
.bc7-home #discounts li{padding-block:8px;border-bottom:1px dashed var(--b7-line)}
.bc7-home #discounts li:last-child{border-bottom:0}

/* ---------- Journey: track with a travelling blue crescent ---------- */
.bc7-steps-wrap{position:relative}
.bc7-track{position:absolute;inset-inline-start:21px;top:34px;bottom:34px;width:2px;background:#0c2e4f1f;border-radius:2px;overflow:hidden}
.bc7-fill{position:absolute;inset:0;background:var(--b7-gold);transform:scaleY(1);transform-origin:center top}
.bc7-tip{position:absolute;inset-inline-start:9px;top:34px;width:26px;height:26px;margin-top:-13px;opacity:0;transition:opacity .25s ease;z-index:2;pointer-events:none;filter:drop-shadow(0 3px 8px #0c2e4f40)}
.bc7-tip .bc7-moon{width:26px;height:26px}
.bc7-home .bcx-steps li{transition:opacity .35s ease}
.bc7-home .bcx-steps li.bc7-done::marker{color:var(--b7-gold)}

/* ---------- CTA after patient stories ---------- */
.bc7-after-proof{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;padding-top:24px;border-top:1px solid var(--b7-line)}
.bc7-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 22px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;
  transition:background-color .2s ease,box-shadow .2s ease,transform .14s var(--b7-ease)}
.bc7-btn:active{transform:scale(.97)}
.bc7-primary{background:var(--b7-navy);color:#fff!important}
.bc7-primary .fa-solid{color:var(--b7-gold-2)}
.bc7-wa{background:#fff;color:var(--b7-navy)!important;border:1px solid var(--b7-line)}
.bc7-wa .fa-whatsapp{color:#128c4b}.bc7-wa .fa-telegram{color:#229ed9}
@media (hover:hover) and (pointer:fine){.bc7-primary:hover{background:var(--b7-blue);box-shadow:0 12px 24px -14px #0c2e4f}.bc7-wa:hover{border-color:var(--b7-blue)}}
@media (max-width:767px){.bc7-btn{width:100%;justify-content:space-between}}

/* ---------- Testimonials rail controls (built by JS) ---------- */
.bc7-rail-ctrl{display:flex;align-items:center;gap:10px;margin-top:10px}
.bc7-rail-ctrl button{width:48px;height:48px;border-radius:50%;border:1px solid var(--b7-line);background:#fff;color:var(--b7-navy);display:grid;place-items:center;cursor:pointer;transition:opacity .2s ease,transform .14s var(--b7-ease)}
.bc7-rail-ctrl button:active{transform:scale(.94)}
.bc7-rail-ctrl button[disabled]{opacity:.35;cursor:default}
.bc7-rail-ctrl svg{width:20px;height:20px}
html[dir=rtl] .bc7-rail-ctrl svg{transform:scaleX(-1)}
.bc7-rail-ctrl output{font-weight:700;color:var(--b7-muted);font-variant-numeric:tabular-nums;font-size:15px}

/* ---------- Chapter progress under the header (home) ---------- */
.bc7-chapter{position:fixed;inset-inline:0;top:var(--b7-head,68px);z-index:60;height:3px;background:transparent;pointer-events:none}
.bc7-chapter i{display:block;height:100%;background:var(--b7-gold);transform:scaleX(0);transform-origin:left center}
html[dir=rtl] .bc7-chapter i{transform-origin:right center}

/* ---------- Motion (only with motion allowed; content visible without JS) ---------- */
@media (prefers-reduced-motion:no-preference){
  .bc7-js .bc7-orn>span{transform:scaleX(0);transition:transform 1s var(--b7-ease-io)}
  .bc7-js .bc7-orn>span:first-child{transform-origin:right center}
  .bc7-js .bc7-orn>span:last-child{transform-origin:left center}
  .bc7-js .bc7-orn :is(.bc7-star,.bc7-moon){opacity:0;transform:scale(.5) rotate(-60deg);transition:opacity .4s ease,transform .8s var(--b7-ease)}
  .bc7-js .bc7-orn .bc7-moon{transition-delay:.12s}
  .bc7-js .bc7-orn.is-in>span{transform:none}
  .bc7-js .bc7-orn.is-in :is(.bc7-star,.bc7-moon){opacity:1;transform:none}
  .bc7-js .bc7-home .bc-art-cost-icon{transform:scale(.6) translateY(8px);opacity:0;transition:transform .6s var(--b7-ease),opacity .35s ease}
  .bc7-js .bc7-home .is-in .bc-art-cost-icon,.bc7-js .bc7-home .bc-art-cost-icon.is-in{transform:none;opacity:1}
  ::view-transition-old(root){animation:b7-out .18s ease-out both}
  ::view-transition-new(root){animation:b7-in .36s var(--b7-ease) both}
  @keyframes b7-out{to{opacity:0}}
  @keyframes b7-in{from{opacity:0;transform:translateY(10px)}}
  @view-transition{navigation:auto}
}
@media (prefers-reduced-motion:reduce){.bc7-fill{transform:none!important}.bc7-btn:active,.bc7-rail-ctrl button:active{transform:none}}

/* audit round 2: exact elements */
.bcx-foot .bcx-foot-base :is(p,small,span){color:#b9c8d8!important;font-size:13px}
.bcx-foot .bcx-foot-base a{display:inline-flex!important;align-items:center;min-height:44px!important;padding-block:10px}
.bcx-foot a{min-height:44px;display:inline-flex;align-items:center}
.budget-result span{color:var(--b7-ink)!important}
#budget-apply-discount{width:24px!important;height:24px!important;min-height:24px}
.bc-language-offer a,.bcx-offer a,.bc-language-offer button{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
.bc-welcome summary{min-height:44px;display:flex;align-items:center}
.bcx-hospital-detail,.bcx-hospital-cities button,.bcx-hospital-card small{font-size:13px!important}
.bcx-hero li small,.bcx-hero div>small,.bcx-hero ul small{font-size:12.5px!important;line-height:1.5}
.bcx-hero :is(small,span){font-size:max(12px,1em)}
.bc7-home ul li div>small,.bc7-home ul li>small{font-size:12.5px!important}
.bc7-home #hospitals :is(small,span,em){font-size:max(12.5px,1em)}
.bcx-hero figcaption,.bcx-photo :is(p,small,span,figcaption){font-size:max(12.5px,1em)!important}
footer.bcx-foot p a{display:inline-flex!important;min-height:44px!important;align-items:center}
.bc7-rail-ctrl output{direction:ltr;unicode-bidi:isolate}

/* =================================================================
   v8 — home animation pass (26 Oct, phone feedback)
   ================================================================= */
/* AI assistant: icon-only bubble on phones so it never sits on text */
@media (max-width:767px){
  html body #bc-ai-fab{width:56px!important;min-width:56px!important;max-width:56px!important;height:56px!important;padding:0!important;border-radius:50%!important;justify-content:center!important;gap:0!important;font-size:0!important;line-height:0!important;bottom:calc(84px + env(safe-area-inset-bottom,0px))!important}
  html body #bc-ai-fab :is(span,b,strong,em){font-size:0!important;position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important}
  html body #bc-ai-fab :is(svg,i){font-size:22px!important;width:24px!important;height:24px!important;position:static!important;clip:auto!important}
}


/* Hospital names band under the hero */
.bc8-marquee{overflow:hidden;background:var(--b7-navy-2);border-block:1px solid #ffffff14;padding:14px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.bc8-marquee-track{display:flex;width:max-content;gap:0}
.bc8-marquee ul{display:flex;align-items:center;gap:34px;margin:0;padding:0 17px;list-style:none;flex:0 0 auto}
.bc8-marquee li{display:flex;align-items:center;gap:34px;color:#dbe5ef;font-weight:700;font-size:15px;white-space:nowrap}
.bc8-marquee li::after{content:'';width:7px;height:7px;transform:rotate(45deg);background:var(--b7-gold);opacity:.8}

/* Main report card: a slow light sweep */
.bc7-home .bcx-task.is-main{position:relative;overflow:hidden;isolation:isolate}
.bc7-home .bcx-task.is-main::after{content:'';position:absolute;top:-20%;bottom:-20%;width:38%;inset-inline-start:-45%;background:linear-gradient(100deg,transparent,#ffffff59,transparent);transform:skewX(-18deg);pointer-events:none;opacity:0}

@keyframes b8-up{from{opacity:0;transform:translateY(18px)}}
@keyframes b8-frame{from{clip-path:inset(0 0 100% 0 round 22px)}}
@keyframes b8-zoom{from{transform:scale(1.12)}}
@keyframes b8-ring{from{opacity:0;transform:scale(.55) rotate(-90deg)}}
@keyframes b8-moon{0%{opacity:0;transform:rotate(-80deg) scale(.4)}70%{opacity:1}100%{transform:rotate(-12deg) scale(1)}}
@keyframes b8-plane{0%{opacity:0;transform:translate(120px,90px) rotate(30deg) scale(.6)}60%{opacity:1}100%{transform:rotate(-12deg)}}
@keyframes b8-pop{from{opacity:0;transform:scale(.5) rotate(25deg)}}
@keyframes b8-spin{to{transform:rotate(360deg)}}
@keyframes b8-glow{0%,100%{filter:drop-shadow(0 0 0 #145bae00)}50%{filter:drop-shadow(0 0 14px #5fa2ffaa)}}
@keyframes b8-sweep{0%,72%{opacity:0;inset-inline-start:-45%}74%{opacity:1}100%{opacity:0;inset-inline-start:115%}}
@keyframes b8-marquee{to{transform:translateX(-50%)}}
@keyframes b8-marquee-rtl{to{transform:translateX(50%)}}

@media (prefers-reduced-motion:no-preference){
  /* Hero: one composed entrance */
  .bc7-home .bcx-hero :is(.bcx-kicker){animation:b8-up .6s var(--b7-ease) .05s backwards}
  .bc7-home .bcx-hero .bcx-lead{animation:b8-up .6s var(--b7-ease) .25s backwards}
  .bc7-home .bcx-hero .bcx-hero-primary{animation:b8-up .7s var(--b7-ease) .35s backwards}
  .bc7-home .bcx-hero .bcx-desk-secondary>li{animation:b8-up .6s var(--b7-ease) backwards}
  .bc7-home .bcx-hero .bcx-desk-secondary>li:nth-child(1){animation-delay:.45s}
  .bc7-home .bcx-hero .bcx-desk-secondary>li:nth-child(2){animation-delay:.52s}
  .bc7-home .bcx-hero .bcx-desk-secondary>li:nth-child(3){animation-delay:.59s}
  .bc7-home .bcx-hero .bcx-desk-secondary>li:nth-child(4){animation-delay:.66s}
  .bc7-home .bcx-hero .bcx-note{animation:b8-up .6s var(--b7-ease) .75s backwards}
  .bc7-home .bcx-hero .bcx-art-frame{animation:b8-frame 1.1s var(--b7-ease-io) .2s backwards}
  .bc7-home .bcx-hero .bcx-art-frame img{animation:b8-zoom 2.4s var(--b7-ease) .2s backwards}
  .bc7-home .bc-corner-ring{animation:b8-ring 1s var(--b7-ease) .1s backwards}
  .bc7-home .bc-corner-crescent{animation:b8-moon 1.1s var(--b7-ease) .25s backwards,b8-glow 5s ease-in-out 1.6s 3}
  .bc7-home .bc-corner-plane{animation:b8-plane 1.3s var(--b7-ease) .5s backwards}
  .bc7-home .bc-corner-care{animation:b8-pop .6s var(--b7-ease) 1s backwards}
  .bc7-home .bc-art-services li{animation:b8-up .55s var(--b7-ease) backwards}
  .bc7-home .bc-art-services li:nth-child(2){animation-delay:.08s}
  .bc7-home .bc-art-services li:nth-child(3){animation-delay:.16s}
  .bc7-home .bc-art-services li:nth-child(4){animation-delay:.24s}
  .bc7-home .bcx-task.is-main::after{animation:b8-sweep 6s ease-in-out 2.2s infinite}
  .bc8-marquee-track{animation:b8-marquee 38s linear infinite}
  html[dir=rtl] .bc8-marquee-track{animation-name:b8-marquee-rtl}
  .bc8-marquee:hover .bc8-marquee-track,.bc8-marquee:focus-within .bc8-marquee-track{animation-play-state:paused}
}
body .bcx-kicker{font-size:12.5px!important}

/* Touch tablets retain a gentle title entrance without relying on a mouse. */
@media (min-width:768px) and (hover:none) and (prefers-reduced-motion:no-preference){
  .bc7-home .bcx-hero h1{animation:b8-up .7s var(--b7-ease) .1s backwards}
}

/* Keep rail controls correct after device rotation, and let visitors pause the moving band. */
.bc7-rail-ctrl[hidden],.bc8-motion-toggle[hidden]{display:none!important}
.bc8-marquee{position:relative;display:flex;align-items:center;gap:12px;padding:8px 14px;-webkit-mask-image:none;mask-image:none}
.bc8-marquee-viewport{overflow:hidden;flex:1;min-width:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.bc8-motion-toggle{flex:0 0 auto;min-height:44px;padding:7px 14px;border:1px solid #91abc0;border-radius:999px;background:#173e5d;color:#fff;font:inherit;font-size:13px;font-weight:700;line-height:1.4;cursor:pointer}
.bc8-motion-toggle:focus-visible{outline:3px solid #e2c27d;outline-offset:3px}
.bc8-marquee.is-paused .bc8-marquee-track{animation-play-state:paused!important}

/* Clearer reading and keyboard focus, with a quiet navy-and-gold finish. */
.bc7-home .bcx-task small{font-size:14px!important;line-height:1.55}
.bc7-home .bcx-cost article,.bc7-home .bcx-steps li{box-shadow:0 10px 28px #0c2e4f0a}
.bc7-home .bcx-task.is-main{box-shadow:0 10px 25px #020f1b2b}
.bc7-home :is(a,button,summary):focus-visible{outline:3px solid #bd8c35;outline-offset:3px}
@media(max-width:599px){.bc7-home .bcx-task small{font-size:13px!important}}
@media(hover:hover) and (pointer:fine){
  .bc7-home .bcx-grid a:hover{box-shadow:0 8px 20px #0c2e4f14}
}
