/*
Theme Name: Shepher Lifecare Medical Centre
Theme URI: https://shephermedicallifecare.example
Author: Shepher Lifecare Medical Centre
Author URI: https://shephermedicallifecare.example
Description: Custom one-page WordPress theme for Shepher Lifecare Medical Centre, Katito Town, Kisumu County, Kenya — a light, modern, fully interactive and Customizer-editable hospital website built from scratch (no page builder required). Includes an Optical & Eye Care spotlight, services, laboratory tests, gallery, location and a working contact form.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: shepher-lifecare
Tags: one-column, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, healthcare
*/

/* =========================================================
   0. DESIGN TOKENS
========================================================= */
:root{
  /* Brand colours sampled directly from the Shepher Lifecare logo (heart = blue, hands = green). */
  --slc-blue:        #038cff;
  --slc-blue-dark:    #0065ba;
  --slc-blue-light:   #edf7ff;
  --slc-green:        #00c50c;
  --slc-green-dark:   #008e09;
  --slc-green-light:  #edfbee;
  /* Kept as aliases so existing component rules (written against a blue/teal duo)
     render in the real brand duo (blue/green) instead of an unbranded teal. */
  --slc-teal:         var(--slc-green);
  --slc-teal-dark:    var(--slc-green-dark);
  --slc-teal-light:   var(--slc-green-light);
  --slc-ink:          #10202c;
  --slc-body:         #45586a;
  --slc-muted:        #7b8ea1;
  --slc-bg:           #ffffff;
  --slc-bg-soft:      #f6faf6;
  --slc-bg-alt:       #eef8ef;
  --slc-border:       #e4ede4;
  --slc-white:        #ffffff;
  --slc-danger:       #e0473c;

  --slc-radius-sm:    10px;
  --slc-radius:       16px;
  --slc-radius-lg:    26px;
  --slc-shadow-sm:    0 2px 10px rgba(16,32,44,.06);
  --slc-shadow:       0 14px 40px -12px rgba(16,32,44,.16);
  --slc-shadow-lg:    0 26px 60px -18px rgba(16,32,44,.28);

  --slc-gradient:     linear-gradient(120deg, var(--slc-blue) 0%, var(--slc-green) 100%);
  --slc-gradient-soft: linear-gradient(135deg, var(--slc-blue-light) 0%, var(--slc-green-light) 100%);

  --slc-font: 'Plus Jakarta Sans', 'Segoe UI', system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
  --slc-container: 1240px;
  --slc-header-h: 84px;
  --slc-transition: .3s cubic-bezier(.4,0,.2,1);
}

/* =========================================================
   1. RESET & BASE
========================================================= */
*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--slc-font);
  color:var(--slc-body);
  background:var(--slc-bg);
  font-size:16.5px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.no-scroll{ overflow:hidden; }
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,h5{ color:var(--slc-ink); line-height:1.2; margin:0 0 .5em; font-weight:800; letter-spacing:-.01em; }
p{ margin:0 0 1em; }
button{ font-family:inherit; cursor:pointer; }
:focus-visible{ outline:3px solid var(--slc-teal); outline-offset:2px; }
::selection{ background:var(--slc-teal); color:#fff; }

.container{ max-width:var(--slc-container); margin:0 auto; padding:0 24px; }
.slc-section{ padding:96px 0; position:relative; }
.slc-section--soft{ background:var(--slc-bg-soft); }
.slc-section--alt{ background:var(--slc-bg-alt); }
.slc-section--tight{ padding:64px 0; }
@media(max-width:782px){
  .slc-section{ padding:64px 0; }
  .slc-section--tight{ padding:48px 0; }
  body{ font-size:15.5px; }
}

/* Section header */
.slc-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--slc-teal-dark); background:var(--slc-teal-light);
  padding:7px 16px; border-radius:99px; margin-bottom:18px;
}
.slc-eyebrow svg{ width:14px; height:14px; }
.slc-section-head{ max-width:680px; margin:0 0 52px; }
.slc-section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.slc-section-head h2{ font-size:clamp(28px,3.6vw,42px); }
.slc-section-head p{ color:var(--slc-muted); font-size:17.5px; margin-top:14px; }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 28px; border-radius:99px; font-weight:700; font-size:15.5px;
  border:2px solid transparent; transition:all var(--slc-transition); white-space:nowrap;
}
.btn svg{ width:18px; height:18px; flex-shrink:0; }
.btn-primary{ background:var(--slc-gradient); color:#fff; box-shadow:0 10px 28px -8px rgba(3,140,255,.55); }
.btn-primary:hover{ transform:translateY(-3px); box-shadow:0 16px 34px -8px rgba(3,140,255,.6); }
.btn-outline{ background:#fff; border-color:var(--slc-border); color:var(--slc-ink); }
.btn-outline:hover{ border-color:var(--slc-teal); color:var(--slc-teal-dark); transform:translateY(-3px); }
.btn-ghost-light{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.4); color:#fff; backdrop-filter:blur(6px); }
.btn-ghost-light:hover{ background:rgba(255,255,255,.26); transform:translateY(-3px); }
.btn-whatsapp{ background:#25D366; color:#fff; }
.btn-whatsapp:hover{ background:#1eb958; transform:translateY(-3px); }
.btn-block{ width:100%; }
.btn-sm{ padding:11px 20px; font-size:14px; }

/* =========================================================
   2. TOPBAR
========================================================= */
.slc-topbar{
  background:var(--slc-ink); color:#cfe3ec; font-size:13.5px;
}
.slc-topbar .container{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:9px; padding-bottom:9px; flex-wrap:wrap; }
.slc-topbar-left{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.slc-topbar-item{ display:inline-flex; align-items:center; gap:7px; }
.slc-topbar-item svg{ width:14px; height:14px; color:var(--slc-teal); flex-shrink:0; }
.slc-topbar-item a{ color:#e7f2f6; transition:color .2s; }
.slc-topbar-item a:hover{ color:#fff; text-decoration:underline; }
.slc-topbar-right{ display:flex; align-items:center; gap:14px; }
.slc-badge-open{
  display:inline-flex; align-items:center; gap:6px; background:rgba(0,197,12,.18);
  color:#8ce592; padding:4px 12px; border-radius:99px; font-weight:700; font-size:12px;
}
.slc-badge-open .dot{ width:7px; height:7px; border-radius:50%; background:#00c50c; box-shadow:0 0 0 rgba(0,197,12,.6); animation:slcPulse 1.8s infinite; }
@keyframes slcPulse{ 0%{ box-shadow:0 0 0 0 rgba(0,197,12,.55);} 70%{ box-shadow:0 0 0 8px rgba(0,197,12,0);} 100%{ box-shadow:0 0 0 0 rgba(0,197,12,0);} }
.slc-social-inline{ display:flex; gap:8px; }
.slc-social-inline a{ width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,.08); display:inline-flex; align-items:center; justify-content:center; transition:background .2s; }
.slc-social-inline a:hover{ background:var(--slc-teal); }
.slc-social-inline svg{ width:13px; height:13px; }
@media(max-width:900px){ .slc-topbar-item.hide-tablet{ display:none; } }
@media(max-width:600px){ .slc-topbar{ font-size:12.5px; } .slc-topbar-left{ gap:12px; } }

/* =========================================================
   3. HEADER / NAV
========================================================= */
.slc-header{
  position:sticky; top:0; z-index:999; background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(14px); border-bottom:1px solid var(--slc-border);
  transition:box-shadow .3s, padding .3s;
}
.slc-header.is-scrolled{ box-shadow:0 8px 30px -14px rgba(16,32,44,.22); }
.slc-header-inner{ display:flex; align-items:center; justify-content:space-between; min-height:var(--slc-header-h); gap:20px; }
.slc-logo{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.slc-logo img{ height:52px; width:auto; transition:height .3s; }
.slc-header.is-scrolled .slc-logo img{ height:44px; }
.slc-logo-text{ display:flex; flex-direction:column; line-height:1.15; }
.slc-logo-text strong{ font-size:17px; color:var(--slc-ink); font-weight:800; }
.slc-logo-text span{ font-size:11.5px; color:var(--slc-teal-dark); font-weight:700; letter-spacing:.03em; }

.slc-nav{ display:flex; align-items:center; gap:2px; }
.slc-nav a{
  padding:10px 16px; border-radius:99px; font-weight:600; font-size:15px; color:var(--slc-ink);
  transition:background .2s, color .2s; position:relative;
}
.slc-nav a:hover, .slc-nav a.is-active{ background:var(--slc-blue-light); color:var(--slc-blue-dark); }

.slc-header-cta{ display:flex; align-items:center; gap:12px; }
.slc-burger{
  display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px;
  width:46px; height:46px; border-radius:12px; background:var(--slc-bg-soft); border:1px solid var(--slc-border);
}
.slc-burger span{ width:20px; height:2px; background:var(--slc-ink); border-radius:2px; transition:transform .3s, opacity .3s; }
.slc-burger.is-active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.slc-burger.is-active span:nth-child(2){ opacity:0; }
.slc-burger.is-active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* Full-screen translucent overlay menu (covers the whole viewport,
   independent of header/topbar height so it never sits "small" or offset). */
.slc-mobile-panel{
  position:fixed; inset:0; z-index:1100;
  background:linear-gradient(160deg, rgba(8,20,32,.9), rgba(2,52,92,.88));
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  backdrop-filter:blur(18px) saturate(140%);
  opacity:0; visibility:hidden; transform:scale(1.02);
  transition:opacity .35s ease, visibility .35s, transform .35s ease;
  overflow-y:auto; padding:22px 26px 40px;
  display:flex; flex-direction:column;
}
.slc-mobile-panel.is-open{ opacity:1; visibility:visible; transform:scale(1); }
.slc-mobile-panel-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.slc-mobile-panel-logo{ height:38px; width:auto; filter:brightness(0) invert(1); opacity:.95; }
.slc-mobile-close{
  width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28);
  color:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.slc-mobile-close svg{ width:18px; height:18px; }
.slc-mobile-panel-nav{ flex:1; display:flex; flex-direction:column; justify-content:center; gap:2px; padding:20px 0; }
.slc-mobile-panel-nav a{
  display:block; padding:16px 8px; font-size:22px; font-weight:800; color:#fff;
  border-bottom:1px solid rgba(255,255,255,.14); letter-spacing:-.01em; transition:padding-left .2s, color .2s;
}
.slc-mobile-panel-nav a:hover, .slc-mobile-panel-nav a:active{ padding-left:16px; color:#8ce592; }
.slc-mobile-panel-actions{ display:grid; gap:12px; padding-top:10px; }

@media(max-width:1100px){
  .slc-nav{ display:none; }
  .slc-burger{ display:flex; }
  .slc-header-cta .btn-outline{ display:none; }
}
@media(max-width:560px){
  .slc-header-cta .btn span.full{ display:none; }
  .slc-logo-text{ display:none; }
  .slc-logo img{ height:42px; }
}

/* =========================================================
   4. HERO SLIDER
========================================================= */
.slc-hero{
  position:relative; color:#fff; overflow:hidden;
  min-height:clamp(480px,72vh,640px);
}
.slc-hero-slides{ position:absolute; inset:0; z-index:1; }
.slc-hero-slide{
  position:absolute; inset:0; opacity:0; visibility:hidden; z-index:1;
  background-size:cover; background-position:center; transition:opacity 1.1s ease;
}
.slc-hero-slide.is-active{ opacity:1; visibility:visible; z-index:2; }
.slc-hero-slide-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(9,30,48,.55) 0%,rgba(9,30,48,.5) 40%,rgba(8,23,34,.88) 100%),
             radial-gradient(circle at 85% 15%, rgba(0,197,12,.25), transparent 45%),
             radial-gradient(circle at 8% 85%, rgba(3,140,255,.32), transparent 45%);
}
.slc-hero-slide-inner{ position:relative; z-index:2; height:100%; display:flex; align-items:center; min-height:clamp(480px,72vh,640px); padding:64px 0; }
.slc-hero-content{ max-width:700px; }
.slc-hero-badge{
  display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.3); padding:8px 16px; border-radius:99px; font-size:13.5px; font-weight:700;
  backdrop-filter:blur(6px); margin-bottom:22px;
}
.slc-hero h1{ color:#fff; font-size:clamp(30px,4.2vw,48px); line-height:1.14; margin-bottom:16px; text-shadow:0 4px 24px rgba(0,0,0,.35); }
.slc-hero h1 em{ font-style:normal; background:linear-gradient(120deg,#8ecbff,#8ce592); -webkit-background-clip:text; background-clip:text; color:transparent; }
.slc-hero p.lead{ font-size:17px; color:rgba(255,255,255,.9); max-width:540px; margin-bottom:0; text-shadow:0 2px 14px rgba(0,0,0,.3); }

.slc-hero-controls{
  position:absolute; right:24px; bottom:24px; z-index:6; display:flex; align-items:center; gap:14px;
}
.slc-hero-arrow{
  width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.32);
  color:#fff; display:flex; align-items:center; justify-content:center; transition:background .2s, transform .2s; backdrop-filter:blur(6px);
  flex-shrink:0;
}
.slc-hero-arrow:hover{ background:rgba(255,255,255,.28); transform:scale(1.06); }
.slc-hero-arrow svg{ width:18px; height:18px; }
.slc-hero-dots{ display:flex; gap:9px; }
.slc-hero-dots button{
  width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.35); border:1px solid rgba(255,255,255,.5);
  padding:0; transition:all .25s; flex-shrink:0;
}
.slc-hero-dots button.is-active{ background:#fff; width:26px; border-radius:6px; }

/* Action bar: deliberately its own section BELOW the hero image (not layered on
   top of it) so the Call / WhatsApp / Directions buttons can never sit over the
   slide heading and text, on any screen size or text length. */
.slc-hero-actionbar{ background:var(--slc-green-dark); position:relative; z-index:5; }
.slc-hero-actionbar-inner{
  display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap;
  padding:18px 0;
}
.slc-hero-actionbar-inner .btn{ flex:0 0 auto; }

@media(max-width:980px){
  .slc-hero{ min-height:440px; }
  .slc-hero-slide-inner{ min-height:440px; padding:48px 0; }
}
@media(max-width:560px){
  .slc-hero{ min-height:400px; }
  .slc-hero-slide-inner{ min-height:400px; padding:40px 0; }
  .slc-hero-controls{ right:16px; bottom:16px; gap:8px; }
  .slc-hero-arrow{ width:36px; height:36px; }
  .slc-hero-actionbar-inner{ flex-direction:column; align-items:stretch; padding:14px 16px; gap:10px; }
  .slc-hero-actionbar-inner .btn{ width:100%; }
}
@media(prefers-reduced-motion:reduce){
  .slc-hero-slide{ transition:none; }
}

/* Quick strip */
.slc-quickstrip{ background:#fff; position:relative; z-index:4; padding:28px 0; }
.slc-quickstrip .container{ background:#fff; border-radius:var(--slc-radius); box-shadow:var(--slc-shadow); padding:8px; }
.slc-quickstrip-grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.slc-quickstrip-item{ display:flex; align-items:center; gap:14px; padding:22px 20px; border-right:1px solid var(--slc-border); }
.slc-quickstrip-item:last-child{ border-right:none; }
.slc-quickstrip-item .ic{ width:48px; height:48px; border-radius:14px; background:var(--slc-blue-light); color:var(--slc-blue-dark); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.slc-quickstrip-item:nth-child(2) .ic{ background:var(--slc-teal-light); color:var(--slc-teal-dark); }
.slc-quickstrip-item:nth-child(3) .ic{ background:#e8fbef; color:var(--slc-green-dark); }
.slc-quickstrip-item:nth-child(4) .ic{ background:#fdeeee; color:var(--slc-danger); }
.slc-quickstrip-item .ic svg{ width:22px; height:22px; }
.slc-quickstrip-item strong{ display:block; font-size:15px; color:var(--slc-ink); }
.slc-quickstrip-item a{ font-size:13.5px; color:var(--slc-muted); }
.slc-quickstrip-item a:hover{ color:var(--slc-teal-dark); text-decoration:underline; }
@media(max-width:900px){ .slc-quickstrip-grid{ grid-template-columns:repeat(2,1fr); } .slc-quickstrip-item:nth-child(2){ border-right:none; } .slc-quickstrip-item{ border-bottom:1px solid var(--slc-border); } }
@media(max-width:560px){ .slc-quickstrip{ padding:20px 0; } .slc-quickstrip-grid{ grid-template-columns:1fr; } .slc-quickstrip-item{ border-right:none; border-bottom:1px solid var(--slc-border); padding:16px; } .slc-quickstrip-item:last-child{ border-bottom:none; } }

/* =========================================================
   5. ABOUT
========================================================= */
.slc-about-grid{ display:grid; grid-template-columns:.95fr 1.05fr; gap:64px; align-items:center; }
.slc-about-media{ position:relative; }
.slc-about-media .main-img{ border-radius:var(--slc-radius-lg); overflow:hidden; box-shadow:var(--slc-shadow); }
.slc-about-media .main-img img{ aspect-ratio:1/1; object-fit:cover; width:100%; }
.slc-about-badge{
  position:absolute; bottom:-24px; left:-24px; background:var(--slc-ink); color:#fff; border-radius:18px;
  padding:20px 24px; box-shadow:var(--slc-shadow-lg); display:flex; align-items:center; gap:14px; max-width:240px;
}
.slc-about-badge svg{ width:30px; height:30px; color:#8ce592; flex-shrink:0; }
.slc-about-badge strong{ display:block; font-size:15px; }
.slc-about-badge small{ color:rgba(255,255,255,.7); font-size:12px; }
.slc-about-content ul.check-list{ margin:26px 0 32px; display:grid; grid-template-columns:1fr 1fr; gap:14px 20px; }
.slc-about-content ul.check-list li{ display:flex; align-items:flex-start; gap:10px; font-weight:600; color:var(--slc-ink); font-size:15px; }
.slc-about-content ul.check-list li svg{ width:20px; height:20px; color:var(--slc-green-dark); flex-shrink:0; margin-top:1px; }
.slc-stats-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:8px; }
.slc-stat{ background:var(--slc-bg-soft); border-radius:var(--slc-radius); padding:22px 16px; text-align:center; border:1px solid var(--slc-border); }
.slc-stat strong{ display:block; font-size:30px; font-weight:800; background:var(--slc-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.slc-stat span{ font-size:12.5px; color:var(--slc-muted); font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
@media(max-width:980px){ .slc-about-grid{ grid-template-columns:1fr; gap:60px 0; } .slc-about-media{ max-width:440px; } }
@media(max-width:560px){ .slc-about-content ul.check-list{ grid-template-columns:1fr; } .slc-stats-row{ grid-template-columns:repeat(2,1fr); } .slc-about-badge{ left:0; right:0; margin:0 auto; bottom:-20px; } }

/* =========================================================
   6. SERVICES
========================================================= */
.slc-services-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:26px; }
.slc-service-card{
  background:#fff; border:1px solid var(--slc-border); border-radius:var(--slc-radius); padding:32px 28px;
  transition:transform var(--slc-transition), box-shadow var(--slc-transition), border-color var(--slc-transition);
  position:relative; overflow:hidden;
}
.slc-service-card::before{
  content:""; position:absolute; inset:0; background:var(--slc-gradient); opacity:0; transition:opacity .3s; z-index:0;
}
.slc-service-card:hover{ transform:translateY(-8px); box-shadow:var(--slc-shadow); border-color:transparent; }
.slc-service-card > *{ position:relative; z-index:1; }
.slc-service-card .ic{
  width:58px; height:58px; border-radius:16px; background:var(--slc-blue-light); color:var(--slc-blue-dark);
  display:flex; align-items:center; justify-content:center; margin-bottom:22px; transition:background .3s,color .3s;
}
.slc-service-card:nth-child(3n+2) .ic{ background:var(--slc-teal-light); color:var(--slc-teal-dark); }
.slc-service-card:nth-child(3n+3) .ic{ background:#e8fbef; color:var(--slc-green-dark); }
.slc-service-card .ic svg{ width:27px; height:27px; }
.slc-service-card h3{ font-size:19px; margin-bottom:10px; }
.slc-service-card p{ font-size:14.8px; color:var(--slc-muted); margin-bottom:0; }
.slc-service-card .learn{ display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-size:13.5px; font-weight:700; color:var(--slc-blue); opacity:0; transform:translateX(-6px); transition:all .3s; }
.slc-service-card:hover .learn{ opacity:1; transform:translateX(0); }

/* =========================================================
   7. OPTICAL SPOTLIGHT
========================================================= */
.slc-optical{
  background:var(--slc-ink); color:#fff; border-radius:0; position:relative; overflow:hidden;
}
.slc-optical::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 90% 10%, rgba(0,197,12,.25), transparent 50%), radial-gradient(circle at 5% 95%, rgba(3,140,255,.35), transparent 50%); }
.slc-optical .slc-eyebrow{ background:rgba(255,255,255,.12); color:#8ce592; }
.slc-optical .slc-section-head h2, .slc-optical .slc-section-head p{ color:#fff; }
.slc-optical .slc-section-head p{ color:rgba(255,255,255,.72); }
.slc-optical-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.slc-optical-list{ display:grid; gap:16px; margin:28px 0 34px; }
.slc-optical-list li{ display:flex; gap:14px; align-items:flex-start; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); padding:16px 18px; border-radius:14px; }
.slc-optical-list li .ic{ width:36px; height:36px; border-radius:10px; background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:#7de0ff; }
.slc-optical-list li .ic svg{ width:18px; height:18px; }
.slc-optical-list li strong{ display:block; font-size:15.5px; color:#fff; }
.slc-optical-list li span{ font-size:13.5px; color:rgba(255,255,255,.68); }
.slc-partner-strip{ display:flex; align-items:center; gap:14px; margin-top:8px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); padding:14px 18px; border-radius:14px; }
.slc-partner-strip svg{ width:30px; height:30px; color:#8ce592; flex-shrink:0; }
.slc-partner-strip strong{ display:block; font-size:14.5px; }
.slc-partner-strip span{ font-size:12.5px; color:rgba(255,255,255,.68); }

.slc-optical-collage{ position:relative; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.slc-optical-collage img{ border-radius:18px; box-shadow:0 20px 40px -12px rgba(0,0,0,.5); width:100%; object-fit:cover; }
.slc-optical-collage .tall{ grid-row:span 2; aspect-ratio:.72/1; }
.slc-optical-collage .short{ aspect-ratio:1/.85; }
@media(max-width:980px){
  .slc-optical-grid{ grid-template-columns:1fr; }
  .slc-optical-collage{ max-width:480px; }
}
@media(max-width:560px){
  .slc-optical-collage{ grid-template-columns:1fr 1fr; }
}

/* =========================================================
   8. LAB TESTS
========================================================= */
.slc-lab-chips{ display:flex; flex-wrap:wrap; gap:12px; }
.slc-lab-chips span{
  display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--slc-border);
  padding:11px 18px; border-radius:99px; font-size:14px; font-weight:600; color:var(--slc-ink);
  transition:all .25s;
}
.slc-lab-chips span:hover{ background:var(--slc-gradient); color:#fff; border-color:transparent; transform:translateY(-2px); }
.slc-lab-chips span svg{ width:15px; height:15px; color:var(--slc-teal-dark); flex-shrink:0; }
.slc-lab-chips span:hover svg{ color:#fff; }

/* =========================================================
   9. GALLERY
========================================================= */
.slc-gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:190px; gap:16px; }
.slc-gallery-item{ position:relative; border-radius:16px; overflow:hidden; cursor:pointer; }
.slc-gallery-item.big{ grid-column:span 2; grid-row:span 2; }
.slc-gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.slc-gallery-item:hover img{ transform:scale(1.08); }
.slc-gallery-item::after{
  content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(9,30,48,.72),transparent 55%); opacity:0; transition:opacity .3s;
}
.slc-gallery-item:hover::after{ opacity:1; }
.slc-gallery-caption{
  position:absolute; left:14px; right:14px; bottom:-30px; color:#fff; font-weight:700; font-size:14px;
  opacity:0; transition:all .3s; display:flex; align-items:center; gap:8px;
}
.slc-gallery-item:hover .slc-gallery-caption{ bottom:14px; opacity:1; }
.slc-gallery-zoom{
  position:absolute; top:12px; right:12px; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.9);
  display:flex; align-items:center; justify-content:center; opacity:0; transform:scale(.7); transition:all .3s;
}
.slc-gallery-item:hover .slc-gallery-zoom{ opacity:1; transform:scale(1); }
.slc-gallery-zoom svg{ width:16px; height:16px; color:var(--slc-ink); }
@media(max-width:900px){ .slc-gallery-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:170px; } .slc-gallery-item.big{ grid-column:span 2; grid-row:span 1; } }
@media(max-width:560px){ .slc-gallery-grid{ grid-template-columns:1fr 1fr; grid-auto-rows:140px; } }

/* Lightbox */
.slc-lightbox{ position:fixed; inset:0; background:rgba(6,14,20,.94); z-index:1200; display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .3s; padding:24px; }
.slc-lightbox.is-open{ opacity:1; visibility:visible; }
.slc-lightbox img{ max-width:min(1000px,92vw); max-height:84vh; border-radius:14px; box-shadow:0 30px 80px rgba(0,0,0,.6); }
.slc-lightbox-caption{ position:absolute; bottom:28px; left:0; right:0; text-align:center; color:#fff; font-weight:600; }
.slc-lightbox-close, .slc-lightbox-nav{
  position:absolute; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.25); color:#fff;
  width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:background .2s;
}
.slc-lightbox-close:hover, .slc-lightbox-nav:hover{ background:rgba(255,255,255,.22); }
.slc-lightbox-close{ top:24px; right:24px; }
.slc-lightbox-nav svg, .slc-lightbox-close svg{ width:20px; height:20px; }
.slc-lightbox-nav.prev{ left:24px; top:50%; transform:translateY(-50%); }
.slc-lightbox-nav.next{ right:24px; top:50%; transform:translateY(-50%); }
@media(max-width:600px){ .slc-lightbox-nav{ width:40px; height:40px; } .slc-lightbox-nav.prev{ left:8px; } .slc-lightbox-nav.next{ right:8px; } .slc-lightbox-close{ top:12px; right:12px; } }

/* =========================================================
   10. WHY CHOOSE US
========================================================= */
.slc-why-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:28px; }
.slc-why-item{ text-align:center; padding:14px; }
.slc-why-item .ic{
  width:78px; height:78px; margin:0 auto 20px; border-radius:26px; background:var(--slc-gradient-soft);
  display:flex; align-items:center; justify-content:center; color:var(--slc-blue-dark); position:relative;
}
.slc-why-item .ic svg{ width:34px; height:34px; }
.slc-why-item h3{ font-size:17.5px; }
.slc-why-item p{ font-size:14.5px; color:var(--slc-muted); }

/* =========================================================
   11. CTA BANNER
========================================================= */
.slc-cta{ background:var(--slc-gradient); border-radius:var(--slc-radius-lg); padding:56px 48px; display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; position:relative; overflow:hidden; }
.slc-cta::before{ content:""; position:absolute; width:340px; height:340px; background:rgba(255,255,255,.1); border-radius:50%; top:-140px; right:-80px; }
.slc-cta::after{ content:""; position:absolute; width:220px; height:220px; background:rgba(255,255,255,.08); border-radius:50%; bottom:-120px; left:10%; }
.slc-cta-text{ position:relative; z-index:1; max-width:560px; }
.slc-cta-text h2{ color:#fff; font-size:clamp(24px,3vw,34px); margin-bottom:10px; }
.slc-cta-text p{ color:rgba(255,255,255,.85); margin-bottom:0; font-size:16px; }
.slc-cta-actions{ position:relative; z-index:1; display:flex; gap:14px; flex-wrap:wrap; }
.slc-cta .btn-outline{ background:#fff; }

/* =========================================================
   12. LOCATION
========================================================= */
.slc-location-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:0; border-radius:var(--slc-radius-lg); overflow:hidden; box-shadow:var(--slc-shadow); }
.slc-location-info{ background:var(--slc-ink); color:#fff; padding:52px 44px; }
.slc-location-info h3{ color:#fff; font-size:24px; }
.slc-location-info p{ color:rgba(255,255,255,.72); }
.slc-loc-row{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.slc-loc-row:last-child{ border-bottom:none; }
.slc-loc-row .ic{ width:44px; height:44px; border-radius:12px; background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:#7de0ff; }
.slc-loc-row .ic svg{ width:20px; height:20px; }
.slc-loc-row strong{ display:block; color:#fff; font-size:15px; margin-bottom:2px; }
.slc-loc-row span, .slc-loc-row a{ font-size:14px; color:rgba(255,255,255,.72); }
.slc-loc-row a:hover{ color:#fff; text-decoration:underline; }
.slc-hours-table{ width:100%; margin-top:6px; border-collapse:collapse; }
.slc-hours-table td{ padding:7px 0; font-size:14px; color:rgba(255,255,255,.85); }
.slc-hours-table td:last-child{ text-align:right; font-weight:700; color:#8ce592; }
.slc-map-wrap{ position:relative; min-height:420px; background:var(--slc-bg-alt); }
.slc-map-wrap iframe{ width:100%; height:100%; min-height:420px; border:0; position:absolute; inset:0; filter:grayscale(.15) contrast(1.05); }
@media(max-width:980px){ .slc-location-grid{ grid-template-columns:1fr; } .slc-map-wrap{ min-height:340px; } .slc-location-info{ padding:40px 26px; } }

/* =========================================================
   13. CONTACT
========================================================= */
.slc-contact-grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; }
.slc-contact-cards{ display:grid; gap:18px; margin-bottom:28px; }
.slc-contact-card{ display:flex; gap:16px; align-items:flex-start; background:#fff; border:1px solid var(--slc-border); border-radius:16px; padding:20px; transition:box-shadow .3s, transform .3s; }
.slc-contact-card:hover{ box-shadow:var(--slc-shadow-sm); transform:translateY(-3px); }
.slc-contact-card .ic{ width:46px; height:46px; border-radius:13px; background:var(--slc-blue-light); color:var(--slc-blue-dark); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.slc-contact-card:nth-child(2) .ic{ background:var(--slc-teal-light); color:var(--slc-teal-dark); }
.slc-contact-card:nth-child(3) .ic{ background:#e8fbef; color:var(--slc-green-dark); }
.slc-contact-card .ic svg{ width:20px; height:20px; }
.slc-contact-card strong{ display:block; font-size:15px; color:var(--slc-ink); margin-bottom:2px; }
.slc-contact-card span, .slc-contact-card a{ font-size:14px; color:var(--slc-muted); }
.slc-contact-card a:hover{ color:var(--slc-blue); }

.slc-form-wrap{ background:#fff; border:1px solid var(--slc-border); border-radius:var(--slc-radius-lg); padding:40px; box-shadow:var(--slc-shadow-sm); }
.slc-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.slc-form-grid .full{ grid-column:1/-1; }
.slc-field{ display:flex; flex-direction:column; gap:7px; }
.slc-field label{ font-size:13.5px; font-weight:700; color:var(--slc-ink); }
.slc-field input, .slc-field select, .slc-field textarea{
  border:1.5px solid var(--slc-border); border-radius:12px; padding:13px 15px; font-family:inherit;
  font-size:15px; color:var(--slc-ink); background:var(--slc-bg-soft); transition:border-color .2s, background .2s;
  width:100%;
}
.slc-field input:focus, .slc-field select:focus, .slc-field textarea:focus{ border-color:var(--slc-teal); background:#fff; outline:none; }
.slc-field textarea{ resize:vertical; min-height:120px; }
.slc-hp{ position:absolute; left:-9999px; opacity:0; }
.slc-form-msg{ margin-top:16px; padding:14px 16px; border-radius:12px; font-size:14.5px; font-weight:600; display:none; }
.slc-form-msg.show{ display:block; }
.slc-form-msg.success{ background:#e8fbef; color:var(--slc-green-dark); }
.slc-form-msg.error{ background:#fdeeee; color:var(--slc-danger); }
@media(max-width:980px){ .slc-contact-grid{ grid-template-columns:1fr; } }
@media(max-width:560px){ .slc-form-grid{ grid-template-columns:1fr; } .slc-form-wrap{ padding:26px; } }

/* =========================================================
   14. FOOTER
========================================================= */
.slc-footer{ background:#081722; color:#a9c0cc; padding-top:80px; }
.slc-footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:44px; padding-bottom:56px; border-bottom:1px solid rgba(255,255,255,.08); }
.slc-footer-logo{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.slc-footer-logo img{ height:44px; width:auto; }
.slc-footer-about p{ font-size:14.5px; color:#8fa6b2; }
.slc-footer h4{ color:#fff; font-size:15.5px; margin-bottom:20px; letter-spacing:.02em; }
.slc-footer-links li{ margin-bottom:12px; }
.slc-footer-links a{ font-size:14.5px; color:#a9c0cc; transition:color .2s, padding-left .2s; display:inline-block; }
.slc-footer-links a:hover{ color:#fff; padding-left:4px; }
.slc-footer-contact li{ display:flex; gap:10px; margin-bottom:16px; font-size:14px; align-items:flex-start; }
.slc-footer-contact svg{ width:17px; height:17px; color:var(--slc-teal); flex-shrink:0; margin-top:2px; }
.slc-footer-contact a{ color:#a9c0cc; }
.slc-footer-contact a:hover{ color:#fff; }
.slc-footer-social{ display:flex; gap:10px; margin-top:20px; }
.slc-footer-social a{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; transition:background .2s, transform .2s; }
.slc-footer-social a:hover{ background:var(--slc-teal); transform:translateY(-3px); }
.slc-footer-social svg{ width:16px; height:16px; }
.slc-footer-bottom{ display:flex; align-items:center; justify-content:space-between; padding:26px 0; font-size:13.5px; flex-wrap:wrap; gap:10px; }
.slc-footer-bottom a{ color:#a9c0cc; }
.slc-footer-bottom a:hover{ color:#fff; }
@media(max-width:980px){ .slc-footer-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .slc-footer-grid{ grid-template-columns:1fr; gap:36px; } .slc-footer{ padding-top:56px; } }

/* =========================================================
   15. FLOATING BUTTONS
========================================================= */
.slc-float-actions{ position:fixed; right:22px; bottom:22px; z-index:900; display:flex; flex-direction:column; gap:12px; align-items:flex-end; }
.slc-fab{
  width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px -8px rgba(16,32,44,.4); transition:transform .25s;
}
.slc-fab:hover{ transform:scale(1.08); }
.slc-fab svg{ width:26px; height:26px; }
.slc-fab-whatsapp{ background:#25D366; color:#fff; }
.slc-fab-call{ background:var(--slc-gradient); color:#fff; }
.slc-fab-top{
  width:46px; height:46px; border-radius:50%; background:#fff; color:var(--slc-ink); border:1px solid var(--slc-border);
  display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transform:translateY(10px);
  transition:all .3s; box-shadow:var(--slc-shadow-sm);
}
.slc-fab-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.slc-fab-top svg{ width:18px; height:18px; }
@media(max-width:560px){ .slc-fab{ width:52px; height:52px; } .slc-fab svg{ width:22px; height:22px; } }

/* =========================================================
   16. REVEAL ANIMATIONS
========================================================= */
[data-reveal]{ opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.4,0,.2,1), transform .7s cubic-bezier(.4,0,.2,1); }
[data-reveal].in-view{ opacity:1; transform:translateY(0); }
[data-reveal="fade"]{ transform:none; }
[data-reveal-delay="1"]{ transition-delay:.08s; }
[data-reveal-delay="2"]{ transition-delay:.16s; }
[data-reveal-delay="3"]{ transition-delay:.24s; }
[data-reveal-delay="4"]{ transition-delay:.32s; }
[data-reveal-delay="5"]{ transition-delay:.4s; }
@media(prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  [data-reveal]{ opacity:1; transform:none; transition:none; }
}

/* Skip link */
.skip-link{ position:absolute; left:-9999px; top:0; background:var(--slc-ink); color:#fff; padding:12px 20px; z-index:9999; border-radius:0 0 10px 0; }
.skip-link:focus{ left:0; }

/* WP core alignment helpers (kept minimal for one-pager) */
.screen-reader-text{ position:absolute !important; clip:rect(1px,1px,1px,1px); overflow:hidden; height:1px; width:1px; }
