/* ============================================================
   KLINIK CEMPAKA MEDIK — Website UI Kit styles
   Imports the shared foundations, then layers site components.
   ============================================================ */
@import url('colors_and_type.css');

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg1);
  font-family:var(--font-body);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
.container{width:min(100% - 6vw, 1560px);margin:0 auto;padding:0}

/* ---------- Typography helpers ---------- */
.display{font-family:var(--font-display);font-weight:800;font-size:var(--fs-display);line-height:1.04;letter-spacing:-.02em;margin:0 0 18px;color:var(--fg1)}
.display__accent{color:var(--gold-700)}
.h2{font-family:var(--font-display);font-weight:700;font-size:var(--fs-h2);line-height:1.1;letter-spacing:-.01em;margin:0 0 14px}
.h2--onbrown{color:var(--gold-200)}
.h3{font-family:var(--font-body);font-weight:700;font-size:var(--fs-h3);margin:0}
.lead{font-size:var(--fs-lead);color:var(--fg2);margin:0 0 26px;max-width:54ch;text-wrap:pretty}
.lead--center{margin:0 auto;text-align:center}
.lead--onbrown{color:rgba(255,248,247,.82)}
.eyebrow{display:inline-block;font-size:var(--fs-eyebrow);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-700);margin-bottom:14px}
.eyebrow--onbrown{color:var(--gold-400)}

/* ---------- Buttons ---------- */
.btn{font-family:var(--font-body);font-weight:600;font-size:var(--fs-sm);border:none;cursor:pointer;text-decoration:none;
  padding:12px 22px;border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:8px;
  transition:transform var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out),background var(--dur) var(--ease-out);white-space:nowrap}
.btn i{width:18px;height:18px}
.btn--lg{padding:15px 28px;font-size:var(--fs-body)}
.btn--block{width:100%;justify-content:center}
.btn--gold{background:var(--grad-gold);color:#3F2410;box-shadow:var(--shadow-gold)}
.btn--gold:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(169,120,31,.36)}
.btn--gold:active{transform:scale(.97) translateY(0)}
.btn--ghost{background:transparent;color:var(--brown-700);border:1.5px solid var(--border-gold)}
.btn--ghost:hover{background:var(--cream-100);transform:translateY(-2px)}
.btn--ghost:active{transform:scale(.97)}
.section--brown .btn--ghost{color:var(--gold-200);border-color:rgba(244,221,132,.4)}
.section--brown .btn--ghost:hover{background:rgba(255,255,255,.06)}

/* ---------- Badges ---------- */
.badge{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-sm);font-weight:600;padding:7px 15px;border-radius:var(--r-pill)}
.badge__dot{width:8px;height:8px;border-radius:50%;background:currentColor;position:relative}
.badge--update{background:var(--surface);color:var(--gold-700);box-shadow:var(--shadow-sm);margin-bottom:26px;white-space:nowrap}
.badge--update .badge__dot{background:var(--healing-600)}
.badge--open{background:var(--healing-100);color:#2C5C42}
.badge--open .badge__dot{background:var(--healing-600);animation:pulse 2s var(--ease-soft) infinite}
.badge--closed{background:var(--danger-100);color:var(--danger-600)}
.badge--closed .badge__dot{background:var(--danger-600)}
.badge--status{text-decoration:none;transition:transform var(--dur-fast),box-shadow var(--dur-fast)}
.badge--status:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(62,124,90,.5)}70%{box-shadow:0 0 0 7px rgba(62,124,90,0)}100%{box-shadow:0 0 0 0 rgba(62,124,90,0)}}

/* ---------- Placeholders ---------- */
.ph{background:repeating-linear-gradient(45deg,var(--cream-100),var(--cream-100) 14px,var(--cream-200) 14px,var(--cream-200) 28px);
  border:1.5px dashed var(--border-gold);border-radius:var(--r-lg);
  display:flex;align-items:center;justify-content:center;text-align:center;
  color:var(--fg3);font-size:var(--fs-sm);font-weight:600;padding:24px}
.ph--portrait{aspect-ratio:4/5}
.ph--map{aspect-ratio:16/10}

/* ============================================================
   NAVBAR
   ============================================================ */
.nav{position:sticky;top:0;z-index:50;background:var(--brown-700);box-shadow:0 1px 0 rgba(46,26,11,.4);transition:transform var(--dur) var(--ease-out),background var(--dur),box-shadow var(--dur),padding var(--dur)}
.nav--hidden{transform:translateY(-115%)}
.nav__inner{width:min(100% - 6vw, 1560px);margin:0 auto;padding:16px 0;display:flex;align-items:center;gap:24px}
.nav--scrolled{background:rgba(63,36,16,.88);backdrop-filter:blur(12px);box-shadow:0 6px 24px rgba(46,26,11,.28)}
.nav--scrolled .nav__inner{padding-top:12px;padding-bottom:12px}
.nav__brand{display:flex;align-items:center;cursor:pointer;text-decoration:none}
.nav__logo{height:42px;width:auto;display:block;transition:height var(--dur)}
.nav--scrolled .nav__logo{height:36px}
.nav__links{display:flex;gap:6px;margin-left:auto}
.nav__link{position:relative;cursor:pointer;text-decoration:none;font-weight:600;font-size:var(--fs-sm);color:rgba(255,248,247,.82);padding:8px 14px;border-radius:var(--r-pill);transition:color var(--dur-fast),background var(--dur-fast)}
.nav__link:hover{color:#FFF8F7;background:rgba(255,248,247,.1)}
.nav__link.is-active{color:#FFF8F7}
.nav__link.is-active::after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;border-radius:2px;background:var(--grad-gold)}
.nav__cta{margin-left:8px}
.nav__theme{background:rgba(255,248,247,.1);border:1px solid rgba(255,248,247,.16);cursor:pointer;color:var(--gold-200);width:40px;height:40px;border-radius:var(--r-pill);display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background var(--dur-fast),transform var(--dur-fast)}
.nav__theme:hover{background:rgba(255,248,247,.18)}
.nav__theme:active{transform:scale(.92)}
.nav__theme svg{width:19px;height:19px}
.nav__lang{background:rgba(255,248,247,.1);border:1px solid rgba(255,248,247,.16);cursor:pointer;color:rgba(255,248,247,.78);height:40px;border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:2px;padding:4px;flex:none;transition:background var(--dur-fast),transform var(--dur-fast)}
.nav__lang:hover{background:rgba(255,248,247,.18)}
.nav__lang span{font-size:12px;font-weight:800;letter-spacing:.08em;padding:5px 8px;border-radius:var(--r-pill)}
.nav__lang span.is-active{background:var(--grad-gold);color:#3F2410}
.nav__burger{display:none;background:none;border:none;cursor:pointer;color:var(--gold-200);padding:6px}
.nav__burger i{width:26px;height:26px}
.nav__mobile{display:none}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;overflow:hidden;padding:clamp(34px,5vh,54px) 0 clamp(42px,5vh,60px);background:var(--brown-700)}
.hero__bg{position:absolute;inset:0;background:
  linear-gradient(90deg, rgba(253,251,247,.96) 0%, rgba(253,251,247,.91) 42%, rgba(253,251,247,.68) 62%, rgba(63,36,16,.24) 100%),
  linear-gradient(180deg, rgba(85,48,19,.08), rgba(85,48,19,.2)),
  url('assets/clinic-reception.jpg') center center/cover no-repeat;z-index:0}
.hero__grid{position:relative;z-index:1;width:min(100% - 6vw, 1560px);margin:0 auto;padding:0;
  display:grid;grid-template-columns:minmax(0,.95fr) minmax(390px,.98fr);gap:clamp(32px,5vw,80px);align-items:center}
.hero__copy{max-width:720px}
.hero .display{font-size:4.1rem;line-height:1.04;margin-bottom:16px}
.hero .lead{max-width:48ch;margin-bottom:22px}
.hero__trust{list-style:none;margin:30px 0 0;padding:0;display:flex;gap:26px;flex-wrap:wrap}
.hero__trust li{display:flex;align-items:center;gap:9px;font-size:var(--fs-sm);font-weight:600;color:var(--fg2)}
.hero__trust i{width:19px;height:19px;color:var(--gold-700)}
.hero__actions{display:flex;gap:14px;flex-wrap:wrap}
.hero__media{position:relative;justify-self:end;width:min(100%,600px);padding-bottom:34px}
.hero__slider{position:relative;width:100%;height:clamp(430px,62svh,610px);border-radius:var(--r-lg);overflow:hidden;background:var(--cream-100);border:1px solid rgba(253,251,247,.8);box-shadow:0 24px 70px rgba(46,26,11,.25)}
.hero__slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.025);transition:opacity 900ms var(--ease-out),transform 5s var(--ease-out)}
.hero__slide.is-active{opacity:1;transform:scale(1)}
.hero__fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:28px;color:var(--fg3);font-weight:700;background:repeating-linear-gradient(45deg,var(--cream-100),var(--cream-100) 14px,var(--cream-200) 14px,var(--cream-200) 28px)}
.hero__card{position:absolute;left:-18px;bottom:0;background:var(--surface);border-radius:var(--r-md);
  box-shadow:var(--shadow-lg);padding:14px 18px;display:flex;align-items:center;gap:13px;animation:floaty 5s var(--ease-soft) infinite}
.hero__cardico{width:42px;height:42px;border-radius:12px;background:var(--grad-gold);display:flex;align-items:center;justify-content:center;color:#3F2410;flex:none}
.hero__cardico i{width:21px;height:21px}
.hero__card strong{display:block;font-size:15px;color:var(--fg1);white-space:nowrap}
.hero__card span{font-size:12.5px;color:var(--fg3);white-space:nowrap}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ============================================================
   SECTIONS
   ============================================================ */
.section{padding:88px 0}
.section--tint{background:
  linear-gradient(var(--cream-100),var(--cream-100))}
.section--brown{background:var(--grad-hero);color:#FFF8F7}
.section__head{max-width:640px;margin:0 auto 52px;text-align:center}

/* Services grid */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.svc-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-xs);transition:transform var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out),border-color var(--dur)}
.svc-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--border-gold)}
.svc-card__img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--cream-100)}
.svc-card__content{padding:24px 24px 26px}
.svc-card__ico{width:56px;height:56px;border-radius:16px;background:var(--cream-100);display:flex;align-items:center;justify-content:center;color:var(--gold-700);margin-bottom:20px;transition:background var(--dur)}
.svc-card:hover .svc-card__ico{background:var(--grad-gold);color:#3F2410}
.svc-card__ico i{width:27px;height:27px}
.svc-card__title{font-family:var(--font-body);font-weight:700;font-size:var(--fs-h3);margin:0 0 10px}
.svc-card__body{font-size:var(--fs-sm);color:var(--fg2);margin:0 0 18px}
.svc-card__list{margin:0;padding-left:18px;color:var(--fg2);font-size:var(--fs-sm);line-height:1.55}
.svc-card__list li{margin:0 0 7px}
.svc-card__list li:last-child{margin-bottom:0}
.svc-card__more{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-sm);font-weight:600;color:var(--gold-700);opacity:0;transform:translateX(-6px);transition:opacity var(--dur),transform var(--dur)}
.svc-card__more i{width:16px;height:16px}
.svc-card:hover .svc-card__more{opacity:1;transform:translateX(0)}
.svc-more{display:flex;justify-content:center;margin-top:44px}

/* CTA band (home) */
.ctaband{background:var(--grad-hero);color:#FFF8F7;padding:clamp(56px,7vw,84px) 0}
.ctaband__inner{display:flex;align-items:center;justify-content:space-between;gap:36px;flex-wrap:wrap}
.ctaband__copy{max-width:560px}
.ctaband__copy .lead--onbrown{margin-bottom:0}

/* Location + hours */
.loc-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:start}
.loc-map__frame{display:block;width:100%;aspect-ratio:16/10;border:0;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);background:var(--cream-100)}
.loc-addr{display:flex;gap:14px;margin-top:22px}
.loc-addr__ico{width:42px;height:42px;border-radius:12px;background:var(--cream-100);display:flex;align-items:center;justify-content:center;color:var(--gold-700);flex:none}
.loc-addr strong{font-size:17px}
.loc-addr p{margin:4px 0 8px;color:var(--fg2);font-size:var(--fs-sm)}
.loc-addr__link{display:inline-flex;align-items:center;gap:5px;color:var(--gold-700);font-weight:600;font-size:var(--fs-sm);text-decoration:none}
.loc-addr__link i{width:15px;height:15px}
.loc-addr__link:hover{text-decoration:underline}
.loc-hours{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow-sm)}
.loc-hours__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.loc-hours__status{margin:0 0 12px;color:var(--fg2);font-size:var(--fs-sm);font-weight:700}
.hours{width:100%;border-collapse:collapse}
.hours th,.hours td{text-align:left;padding:12px 4px;border-bottom:1px solid var(--border);font-size:var(--fs-sm)}
.hours th{font-weight:600;color:var(--fg1);width:42%}
.hours td{color:var(--fg2)}
.hours tr:last-child th,.hours tr:last-child td{border-bottom:none}
.hours tr.is-today th,.hours tr.is-today td{color:var(--brown-700);font-weight:700}
.hours tr.is-today{background:var(--cream-100)}
.hours__tag{display:inline-block;margin-left:8px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--grad-gold);color:#3F2410;padding:2px 7px;border-radius:var(--r-pill);vertical-align:middle}
.loc-hours__note{display:flex;gap:8px;align-items:flex-start;margin:18px 0 0;font-size:var(--fs-xs);color:var(--fg3)}
.loc-hours__note i{width:15px;height:15px;flex:none;margin-top:1px;color:var(--gold-700)}

/* Contact */
.contact{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center}
.contact__list{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-direction:column;gap:18px}
.contact__list li{display:flex;align-items:center;gap:14px}
.contact__link{display:flex;align-items:center;gap:14px;color:inherit;text-decoration:none;border-radius:12px}
.contact__link:hover .contact__ico{background:rgba(244,221,132,.22);border-color:rgba(244,221,132,.36)}
.contact__ico{width:44px;height:44px;border-radius:12px;background:rgba(244,221,132,.14);border:1px solid rgba(244,221,132,.22);display:flex;align-items:center;justify-content:center;color:var(--gold-300);flex:none}
.contact__ico i{width:20px;height:20px}
.contact__list em{display:block;font-style:normal;font-size:12.5px;color:rgba(255,248,247,.6)}
.contact__list strong{font-size:16px;color:#FFF8F7}
.contact__formwrap{background:var(--surface);border-radius:var(--r-xl);padding:34px;box-shadow:var(--shadow-lg)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:600;color:var(--fg2);margin-bottom:7px}
.field input,.field textarea{width:100%;font-family:var(--font-body);font-size:var(--fs-sm);padding:13px 15px;border:1.5px solid var(--border);border-radius:var(--r-sm);background:var(--cream-50);color:var(--fg1);transition:border-color var(--dur-fast),box-shadow var(--dur-fast)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px rgba(217,177,74,.22);background:var(--surface)}
.field textarea{resize:vertical}
.form__hidden{display:none}
.contact__success{text-align:center;padding:30px 10px}
.contact__check{width:64px;height:64px;border-radius:50%;background:var(--healing-100);color:var(--healing-600);display:inline-flex;align-items:center;justify-content:center;margin-bottom:18px;animation:pop .5s var(--ease-out)}
.contact__check i{width:32px;height:32px}
.contact__success h3{margin:0 0 8px}
.contact__success p{color:var(--fg2);margin:0 0 22px}
@keyframes pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--brown-900);color:rgba(255,248,247,.72)}
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1.2fr 1.2fr;gap:36px;padding-top:64px;padding-bottom:44px}
.footer__logo{height:58px;width:auto;display:block;margin-bottom:16px}
.footer__brand p{font-size:var(--fs-sm);max-width:30ch;margin:0}
.footer__col h4{font-family:var(--font-body);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-300);margin:0 0 16px}
.footer__col a{display:block;color:rgba(255,248,247,.72);text-decoration:none;font-size:var(--fs-sm);padding:5px 0;cursor:pointer;transition:color var(--dur-fast)}
.footer__col a:hover{color:var(--gold-200)}
.footer__col p{font-size:var(--fs-sm);margin:0;line-height:1.7}
.footer__base{border-top:1px solid rgba(255,248,247,.1);width:min(100% - 6vw, 1560px);margin:0 auto;padding:22px 0;display:flex;justify-content:space-between;gap:16px;font-size:var(--fs-xs);color:rgba(255,248,247,.5);flex-wrap:wrap}
.footer__base a{color:var(--gold-400);text-decoration:none;font-weight:600;transition:color var(--dur-fast)}
.footer__base a:hover{color:var(--gold-200);text-decoration:underline}

/* Success page */
.success-page{min-height:100vh;display:grid;place-items:center;background:var(--grad-hero);padding:28px}
.success-card{width:min(100%,560px);background:rgba(255,248,247,.08);border:1px solid rgba(255,248,247,.14);border-radius:var(--r-xl);padding:44px;text-align:center;color:#FFF8F7;box-shadow:var(--shadow-lg)}
.success-card__logo{height:64px;width:auto;margin:0 auto 26px;display:block}
.success-card p{margin:0 auto 12px;color:rgba(255,248,247,.82);max-width:44ch}
.success-card__en{font-size:var(--fs-sm)}
.success-card .btn{margin-top:18px}

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);transition-delay:var(--d,0ms)}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .badge--open .badge__dot,.hero__card{animation:none}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:920px){
  .hero__grid,.loc-grid,.contact{grid-template-columns:1fr;gap:40px}
  .hero{padding-top:44px}
  .hero__bg{background:
    linear-gradient(180deg, rgba(253,251,247,.97) 0%, rgba(253,251,247,.92) 52%, rgba(253,251,247,.74) 100%),
    url('assets/clinic-reception.jpg') center center/cover no-repeat}
  .hero .display{font-size:3.35rem}
  .hero__media{justify-self:start;max-width:520px;width:100%}
  .hero__slider{height:auto;aspect-ratio:4/4.6}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr;gap:28px}
}
@media (min-width:921px) and (max-height:700px){
  .hero{padding-top:28px;padding-bottom:34px}
  .hero__grid{gap:32px}
  .hero .display{font-size:3.45rem}
  .hero .lead{font-size:1.08rem;line-height:1.55;margin-bottom:18px}
  .hero__trust{margin-top:20px;gap:18px}
  .hero__media{width:min(100%,520px);padding-bottom:26px}
  .hero__slider{height:clamp(330px,58svh,410px)}
  .hero__card{left:-12px}
}
@media (max-width:680px){
  .nav__links,.nav__cta{display:none}
  .nav__burger{display:block;margin-left:auto}
  .nav__mobile{display:none;flex-direction:column;gap:6px;padding:0 28px 20px}
  .nav__mobile.is-open{display:flex}
  .nav__mlink{padding:12px 10px;border-radius:var(--r-sm);text-decoration:none;font-weight:600;color:rgba(255,248,247,.82);cursor:pointer;border-bottom:1px solid rgba(255,248,247,.12)}
  .nav__mlink.is-active{color:var(--gold-200)}
  .nav--scrolled,.nav{background:rgba(63,36,16,.96);backdrop-filter:blur(12px)}
  .svc-grid{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr}
  .section{padding:60px 0}
  .hero .display{font-size:2.75rem}
  .hero__card{left:14px;right:14px;bottom:16px;justify-content:flex-start}
  .footer__grid{grid-template-columns:1fr}
  .footer__base{flex-direction:column;gap:6px}
}

/* ============================================================
   DARK THEME  —  deep brown surfaces, cream text, gold accents.
   Set data-theme="dark" on <html>. Brand brown nav/footer carry over.
   ============================================================ */
[data-theme="dark"]{
  --cream-50:#241309;
  --cream-100:#2E1A0E;
  --cream-200:#46301E;
  --sand-300:#3A2616;
  --ink-900:#F7EFE4;
  --ink-700:#D9C8B5;
  --ink-500:#A8927B;
  --white:#241309;
  --gold-700:#E8C66A;          /* lighter gold for readable accent text on dark */
  --bg:#1B0F06;
  --surface:#2B1910;
  --surface-alt:#2E1A0E;
  --border:rgba(247,239,228,.12);
  --border-gold:rgba(217,177,74,.34);
  --shadow-xs:0 1px 2px rgba(0,0,0,.45);
  --shadow-sm:0 2px 10px rgba(0,0,0,.45);
  --shadow-md:0 10px 28px rgba(0,0,0,.5);
  --shadow-lg:0 20px 52px rgba(0,0,0,.55);
  --grad-hero:linear-gradient(155deg,#2E1A0E 0%,#1F1109 70%,#150B04 100%);
}
[data-theme="dark"] .section--tint{background:#221308}
[data-theme="dark"] .hero__bg{background:
  linear-gradient(90deg, rgba(27,15,6,.95) 0%, rgba(27,15,6,.9) 44%, rgba(27,15,6,.66) 68%, rgba(27,15,6,.34) 100%),
  linear-gradient(180deg, rgba(232,198,106,.08), rgba(0,0,0,.36)),
  url('assets/clinic-reception.jpg') center center/cover no-repeat}
[data-theme="dark"] .hero__bg + .hero__grid .lead,
[data-theme="dark"] .hero__bg + .hero__grid .hero__trust li{color:rgba(255,248,247,.82)}
[data-theme="dark"] .svc-card__ico,
[data-theme="dark"] .loc-addr__ico{background:rgba(232,198,106,.12)}
[data-theme="dark"] .footer{background:#150B04}
[data-theme="dark"] .badge--open{background:rgba(62,124,90,.2);color:#7FBE9B}
[data-theme="dark"] .badge--closed{background:rgba(181,70,46,.22);color:#F3A28F}
[data-theme="dark"] .badge--update{color:var(--gold-300)}
[data-theme="dark"] .btn--ghost{color:var(--gold-200);border-color:rgba(244,221,132,.4)}
[data-theme="dark"] .btn--ghost:hover{background:rgba(255,248,247,.07)}