/* =========================================================
   UKMB CENTRAL BRANCH TEMPLATE — PREMIUM V3
   Shared visual contract for all 12+ branch pages.
========================================================= */
@import url('/pages/appointment/design.css?v=20261017-phase10-booking-slots');
@import url('/core/payment-system/assets/payment-component.css?v=20260906-1');
@import url('/assets/css/components/ukmb-cropper.css?v=20261009-final-polish-v5.1');

:root{--ukmb-branch-teal:#0d5b57;--ukmb-branch-deep:#073f42;--ukmb-branch-gold:#d3a83e;--ukmb-branch-cream:#f7f2e8;--ukmb-branch-paper:#fbfaf7;--ukmb-branch-ink:#173f43}
.branch-main{background:var(--ukmb-branch-cream);overflow:hidden;color:var(--ukmb-branch-ink)}
.branch-container{width:min(1180px,calc(100% - 48px));margin-inline:auto}

/* HERO — no redundant HEAD OFFICE / GLOBAL BRANCH badge. */
.branch-hero{position:relative;min-height:285px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg,#073f42 0%,#0c5b56 56%,#0a4b50 100%);border-top:2px solid rgba(211,168,62,.9)}
.branch-hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.02) 0 1px,transparent 1px 12px);pointer-events:none}
.branch-hero-content{position:relative;z-index:2;text-align:center;width:min(860px,calc(100% - 40px));padding:52px 0 65px}
.branch-hero-title{margin:0;color:#fff;font:700 clamp(2.35rem,5vw,4rem)/1.05 'Playfair Display',Georgia,serif;letter-spacing:-.025em;text-shadow:0 3px 24px rgba(0,0,0,.18)}
.branch-hero-tagline{margin:7px 0 0;color:#f1dfad;font:700 .82rem/1.5 Inter,sans-serif}
.branch-hero-divider{display:flex;align-items:center;justify-content:center;gap:13px;margin:13px 0 13px}.branch-hero-divider span{width:48px;height:1px;background:linear-gradient(90deg,transparent,#d3a83e,transparent)}.branch-hero-divider i{color:#d3a83e;font-size:.62rem}
.branch-hero-description{max-width:690px;margin:auto;color:rgba(255,255,255,.72);font:400 .72rem/1.65 Inter,sans-serif}.branch-hero-meta{margin-top:6px;font-size:.59rem;color:rgba(255,255,255,.55)}.branch-hero-meta i{color:#d9b24f;margin-right:4px}
.branch-hero-wave{position:absolute;left:0;right:0;bottom:-1px;z-index:3;line-height:0}.branch-hero-wave svg{display:block;width:100%;height:56px}.branch-hero-wave path{fill:var(--ukmb-branch-cream)}

/* OWNER / CONTACT CARD — photo + name/designation on left, WhatsApp/phone right. */
.branch-info{padding:28px 0 26px;background:var(--ukmb-branch-cream)}
.branch-info-card{position:relative;background:linear-gradient(145deg,#0e625d,#0b504d);border:1px solid rgba(255,255,255,.09);border-radius:20px;box-shadow:0 18px 48px rgba(7,53,52,.13);padding:24px 30px 27px;color:#fff;overflow:hidden}
.branch-info-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 82% 8%,rgba(211,168,62,.12),transparent 27%);pointer-events:none}
.branch-info-heading{position:relative;display:flex;justify-content:center;margin-bottom:17px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.08)}
.branch-info-title{display:flex;align-items:center;gap:10px}.branch-info-title>i{color:#d9b24f;font-size:1.15rem}.branch-info-title h2{margin:0;color:#d9b24f;font:700 1.45rem/1.15 'Playfair Display',Georgia,serif}.branch-info-title p{margin:5px 0 0;color:rgba(255,255,255,.58);font:.58rem/1.3 Inter,sans-serif;text-align:center}.branch-info-title p i{color:#d9b24f;margin-right:3px}
.branch-owner-grid{position:relative;display:grid;grid-template-columns:minmax(280px,1.5fr) minmax(190px,1fr) minmax(190px,1fr);gap:13px;align-items:stretch}
.branch-owner{display:flex;align-items:center;gap:18px;min-width:0;padding:10px 14px 10px 6px}
.branch-owner-photo-wrap{width:105px;height:105px;flex:0 0 105px;padding:5px;border-radius:50%;background:linear-gradient(145deg,#f0eadb,#889497,#f0eadb);box-shadow:0 8px 22px rgba(0,0,0,.25)}
.branch-owner-photo-wrap img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%;border:3px solid #0a5551;background:#173f43}
.branch-owner-copy span,.branch-contact-tile span{display:block;color:rgba(255,255,255,.43);font:800 .46rem/1.2 Inter,sans-serif;letter-spacing:.12em}.branch-owner-copy h3{margin:6px 0 2px;color:#fff;font:700 .9rem/1.25 Inter,sans-serif}.branch-owner-copy p{margin:0;color:#d9b24f;font:600 .58rem/1.3 Inter,sans-serif}
.branch-contact-tile{display:flex;align-items:center;gap:11px;min-width:0;padding:14px 14px;border:1px solid rgba(255,255,255,.06);border-radius:13px;background:rgba(255,255,255,.045)}.branch-contact-icon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:50%;background:rgba(211,168,62,.11);color:#d9b24f;font-size:.88rem}.branch-contact-tile strong{display:block;margin-top:5px;color:#f5f7f5;font:600 .65rem/1.35 Inter,sans-serif;word-break:break-word}
.branch-address-tile{grid-column:1 / span 2}.branch-email-tile{grid-column:3}

/* CENTRAL CONSULTATION — exact same form component as /appointment. */
.branch-consultation{padding:26px 0 56px;background:var(--ukmb-branch-paper)}
.branch-consultation-shell{width:min(1180px,calc(100% - 48px));margin:auto}
.branch-consultation .appointment-page{background:transparent}.branch-consultation .appointment-form-section{padding:8px 0 0}.branch-consultation .section-header{margin-bottom:25px}.branch-consultation .section-header h2{font-size:2.25rem;color:#173f43}.branch-consultation .appointment-layout{grid-template-columns:minmax(0,1.6fr) minmax(300px,.8fr);gap:20px}.branch-consultation .form-card,.branch-consultation .consultation-benefits-card{background:#fff;border-color:rgba(13,75,73,.11);box-shadow:0 16px 44px rgba(7,53,52,.08)}.branch-consultation .form-card-heading h3{color:#174b4c}.branch-consultation .consultation-benefits-card{top:18px}
.branch-consultation .selected-payment-panel{scroll-margin-top:22px}.branch-consultation .preferred-payment-field{scroll-margin-top:22px}.branch-consultation .payment-proof-inline{scroll-margin-top:22px}

/* WHY CHOOSE */
.branch-features{padding:58px 0 64px;background:var(--ukmb-branch-cream)}.branch-section-head{text-align:center;max-width:760px;margin:0 auto 27px}.branch-section-badge{display:inline-block;padding:6px 14px;border:1px solid rgba(201,158,63,.28);border-radius:999px;color:#a67b22;background:rgba(201,158,63,.06);font:800 .5rem/1 Inter,sans-serif;letter-spacing:.16em}.branch-section-head h2{margin:11px 0 6px;color:#1d3034;font:700 clamp(1.8rem,3.4vw,2.55rem)/1.15 'Playfair Display',Georgia,serif}.branch-section-head p{margin:0;color:#7a7d78;font:.72rem/1.5 Inter,sans-serif}
.branch-features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;width:min(920px,100%);margin:auto}.branch-feature-card{min-height:190px;padding:28px 22px;text-align:center;border-radius:18px;background:linear-gradient(145deg,#0f625d,#0a514e);box-shadow:0 15px 38px rgba(7,53,52,.10);border:1px solid rgba(255,255,255,.05);transition:transform .25s ease,box-shadow .25s ease}.branch-feature-card:hover{transform:translateY(-4px);box-shadow:0 23px 48px rgba(7,53,52,.15)}.branch-feature-icon{width:55px;height:55px;margin:0 auto 13px;display:grid;place-items:center;border-radius:50%;background:rgba(201,158,63,.12);color:#d8ae45;font-size:1.15rem}.branch-feature-card h4{margin:0 0 8px;color:#d9b24f;font:700 .98rem/1.2 'Playfair Display',Georgia,serif}.branch-feature-card p{margin:0;color:rgba(255,255,255,.68);font:.63rem/1.62 Inter,sans-serif}

/* CTA — signup only. */
.branch-cta{padding:17px 0 57px;background:var(--ukmb-branch-cream)}.branch-cta-card{width:min(980px,100%);margin:auto;padding:48px 30px;text-align:center;border-radius:22px;background:linear-gradient(135deg,#0c5955,#1b746b);box-shadow:0 20px 55px rgba(7,53,52,.12);border:1px solid rgba(255,255,255,.07)}.branch-cta-card h2{margin:0;color:#fff;font:700 clamp(1.9rem,3.2vw,2.55rem)/1.15 'Playfair Display',Georgia,serif}.branch-cta-card p{max-width:650px;margin:10px auto 19px;color:rgba(255,255,255,.72);font:.7rem/1.6 Inter,sans-serif}.branch-cta-actions{display:flex;justify-content:center}.branch-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 19px;border-radius:999px;text-decoration:none;font:800 .65rem/1 Inter,sans-serif;transition:transform .2s ease,box-shadow .2s ease}.branch-btn:hover{transform:translateY(-2px)}.branch-btn-gold{background:linear-gradient(135deg,#d7b04f,#b88825);color:#173e40;box-shadow:0 9px 20px rgba(184,136,37,.22)}.branch-btn-outline-gold{background:transparent;color:#e3c35f;border:1px solid #d5ad49}

/* LOCATION — map + details, directions only. */
.branch-location{padding:58px 0 70px;background:var(--ukmb-branch-paper)}.branch-location-card{width:min(1180px,100%);margin:auto;border-radius:20px;overflow:hidden;background:#0e5a56;box-shadow:0 18px 48px rgba(7,53,52,.11);border:1px solid rgba(255,255,255,.06)}.branch-location-grid{display:grid;grid-template-columns:1.08fr 1fr;min-height:320px}.branch-location-map{min-height:320px;background:#e9ecea}.branch-map-container,.branch-map{width:100%;height:100%;display:block}.branch-location-info{display:flex;flex-direction:column;justify-content:center;padding:34px;color:#fff}.branch-location-info h3{margin:0;color:#d9b24f;font:700 1.35rem/1.25 'Playfair Display',Georgia,serif}.branch-location-info h3 i{margin-right:6px}.branch-location-address{margin:10px 0 17px;color:rgba(255,255,255,.67);font:.66rem/1.6 Inter,sans-serif}.branch-location-rating{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:21px;padding:9px 12px;border-radius:13px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06)}.branch-rating-stars{color:#e1b93e;font-size:.7rem;letter-spacing:1px}.branch-rating-score{font:800 .74rem/1 Inter,sans-serif;color:#f1d278}.branch-rating-reviews{font:500 .59rem/1 Inter,sans-serif;color:rgba(255,255,255,.54)}.branch-google-icon{margin-left:auto;color:#fff;font-size:1rem}.branch-location-actions{display:flex;gap:9px;flex-wrap:wrap}.branch-review-live{display:inline-flex;align-items:center;gap:5px;width:100%;margin-top:2px;color:rgba(255,255,255,.43);font:500 .5rem/1 Inter,sans-serif}.branch-review-live.is-live{color:#82d6a7}.branch-review-live i{font-size:.4rem}
.branch-reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}.branch-reveal.is-visible{opacity:1;transform:none}

@media(max-width:1000px){.branch-owner-grid{grid-template-columns:1.3fr 1fr}.branch-address-tile{grid-column:1}.branch-email-tile{grid-column:2}.branch-location-grid{grid-template-columns:1fr}.branch-location-map{min-height:300px}.branch-consultation .appointment-layout{grid-template-columns:1fr}.branch-consultation .consultation-benefits-card{position:static}}
@media(max-width:700px){.branch-container,.branch-consultation-shell{width:min(100% - 24px,1180px)}.branch-hero{min-height:270px}.branch-hero-content{padding:48px 0 60px}.branch-hero-title{font-size:2.25rem}.branch-hero-description{font-size:.68rem}.branch-info{padding-top:25px}.branch-info-card{padding:19px 14px}.branch-info-heading{justify-content:flex-start}.branch-info-title h2{font-size:1.2rem}.branch-owner-grid{grid-template-columns:1fr;gap:9px}.branch-owner{padding:7px 5px 11px}.branch-owner-photo-wrap{width:86px;height:86px;flex-basis:86px}.branch-address-tile,.branch-email-tile{grid-column:auto}.branch-features{padding:47px 0 53px}.branch-features-grid{grid-template-columns:1fr}.branch-feature-card{min-height:0}.branch-cta-card{padding:40px 20px}.branch-location{padding:48px 0 56px}.branch-location-info{padding:25px 21px}.branch-google-icon{margin-left:0}.branch-consultation .section-header h2{font-size:2rem}}
