:root {
  --cobalt: #0047AB;
  --cobalt-dark: #003689;
}

:root {
  --navy: #1C3A5C;
  --blue: #2E6094;
  --sky: #4A90C4;
  --sky-light: #B8D4EE;
  --bg: #F4F8FC;
  --bg-card: #EEF4FA;
  --teal: #1A8A78;
  --teal-dark: #126355;
  --teal-bg: #E6F3F1;
  --white: #FFFFFF;
  --text: #1C3A5C;
  --text-body: #3D5872;
  --text-muted: #6B8BAA;
  --border: #CDE0F0;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',system-ui,-apple-system,sans-serif;font-size:16px;color:var(--text);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased}

/* CONTAINER */
.wrap{max-width:1160px;margin:0 auto;padding:0 48px}
@media(max-width:768px){.wrap{padding:0 24px}}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,255,255,0.98);backdrop-filter:blur(8px);border-bottom:1px solid #DCE8F5;box-shadow:0 1px 12px rgba(0,71,171,0.06)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{text-decoration:none;display:flex;flex-direction:column}
.logo-main{font-size:18px;font-weight:600;color:#0A2A5E;letter-spacing:-0.01em}
.logo-sub{font-size:9px;color:#8AAACB;letter-spacing:0.12em;margin-top:1px}
.nav-links{display:flex;gap:28px;list-style:none}
.nav-links a{font-size:13.5px;color:#3D5872;text-decoration:none;transition:color .15s}
.nav-links a:hover{color:#0A2A5E}
.nav-cta{background:#0047AB!important;color:#fff!important;padding:7px 16px;border-radius:6px;font-weight:500!important}
.nav-cta:hover{background:#003689!important;color:#fff!important}
@media(max-width:800px){.nav-links{display:none}}

/* HERO */
.hero{background:#F4F9FE;min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;padding-top:64px}
.hero-grid{display:grid;grid-template-columns:55% 45%;gap:60px;align-items:center;padding:80px 0}
.hero-eyebrow{display:inline-block;font-size:11.5px;font-weight:500;color:#0047AB;letter-spacing:0.07em;border:1px solid rgba(0,71,171,0.28);border-radius:4px;padding:4px 10px;margin-bottom:24px}
.hero h1{font-size:clamp(30px,3.8vw,50px);font-weight:600;color:#0A2A5E;line-height:1.15;letter-spacing:-0.025em;margin-bottom:20px}
.hero-sub{font-size:17px;color:#3D5872;line-height:1.7;max-width:480px;margin-bottom:48px;font-weight:300}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn-pri{background:#0047AB;color:#fff;border:none;padding:13px 24px;border-radius:8px;font-size:14.5px;font-weight:500;cursor:pointer;text-decoration:none;display:inline-block;transition:background .15s;font-family:inherit}
.btn-pri:hover{background:#003689}
.btn-sec{background:#fff;color:#0047AB;border:1.5px solid rgba(0,71,171,0.3);padding:12px 24px;border-radius:8px;font-size:14.5px;font-weight:400;cursor:pointer;text-decoration:none;display:inline-block;transition:all .15s;font-family:inherit}
.btn-sec:hover{border-color:rgba(0,71,171,0.55);background:#EEF4FF}
.hero-trust{margin-top:40px;padding-top:26px;border-top:1px solid rgba(0,71,171,0.1);display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.trust-item{font-size:12px;color:rgba(10,42,94,0.45)}
.trust-sep{width:3px;height:3px;border-radius:50%;background:rgba(0,71,171,0.2)}
.hero-visual{display:flex;justify-content:center;align-items:center}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr;gap:0;padding:60px 0}.hero-visual{display:none}}

/* PATH SPLIT */
.split{padding:64px 0;background:var(--bg)}
.split-label{font-size:13px;font-weight:500;color:var(--text-muted);letter-spacing:0.04em;margin-bottom:14px;text-align:center}
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:700px){.split-grid{grid-template-columns:1fr}}
.pcard{border-radius:12px;padding:32px 36px;text-decoration:none;display:block;transition:transform .15s;position:relative}
.pcard:hover{transform:translateY(-2px)}
.pcard-b2b{background:var(--navy);border:1px solid var(--blue)}
.pcard-b2c{background:var(--white);border:1.5px solid var(--border)}
.ptag{font-size:10px;font-weight:600;letter-spacing:0.07em;padding:3px 8px;border-radius:4px;display:inline-block;margin-bottom:14px}
.pcard-b2b .ptag{background:rgba(74,144,196,0.2);color:var(--sky-light)}
.pcard-b2c .ptag{background:var(--bg-card);color:var(--blue)}
.pprice{position:absolute;top:32px;right:36px;text-align:right}
.pprice-main{font-size:18px;font-weight:600;display:block}
.pprice-sub{font-size:11px}
.pcard-b2b .pprice-main{color:var(--sky-light)}
.pcard-b2c .pprice-main{color:var(--blue)}
.pcard-b2b .pprice-sub{color:rgba(255,255,255,0.35)}
.pcard-b2c .pprice-sub{color:var(--text-muted)}
.pcard h3{font-size:20px;font-weight:600;margin-bottom:10px;letter-spacing:-0.01em;line-height:1.25}
.pcard-b2b h3{color:#fff}
.pcard-b2c h3{color:var(--navy)}
.pcard p{font-size:14px;line-height:1.65;margin-bottom:20px}
.pcard-b2b p{color:rgba(255,255,255,0.6)}
.pcard-b2c p{color:var(--text-body)}
.plink{font-size:13.5px;font-weight:500}
.pcard-b2b .plink{color:var(--sky-light)}
.pcard-b2c .plink{color:var(--blue)}

/* PILLARS */
.pillars{padding:80px 0}
.sec-title{font-size:30px;font-weight:600;color:var(--navy);letter-spacing:-0.02em;line-height:1.2}
.sec-sub{font-size:16px;color:var(--text-body);line-height:1.65;margin-top:10px;font-weight:300;max-width:540px}
.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:40px}
@media(max-width:700px){.pillars-grid{grid-template-columns:1fr;gap:28px}}
.pillar{border-top:2px solid var(--border);padding-top:24px}
.pillar-icon{width:40px;height:40px;margin-bottom:16px}
.pillar h3{font-size:17px;font-weight:600;color:var(--navy);margin-bottom:10px;letter-spacing:-0.01em}
.pillar p{font-size:14px;color:var(--text-body);line-height:1.7}

/* PRODUCTS */
.products{padding:80px 0;background:var(--bg)}
.sec-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px}
.sec-header h2{font-size:30px;font-weight:600;letter-spacing:-0.02em;color:var(--navy)}
.see-all{font-size:13.5px;color:var(--blue);text-decoration:none;font-weight:500}
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:900px){.prod-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.prod-grid{grid-template-columns:1fr}}
.prod-card{background:var(--white);border:1.5px solid var(--border);border-radius:12px;padding:24px;text-decoration:none;display:block;transition:border-color .15s,box-shadow .15s}
.prod-card:hover{border-color:var(--sky);box-shadow:0 4px 16px rgba(46,96,148,0.1)}
.prod-animal{font-size:11px;color:var(--text-muted);font-weight:500;letter-spacing:0.04em;margin-bottom:8px}
.prod-card h4{font-size:15px;font-weight:600;color:var(--navy);margin-bottom:8px;line-height:1.3}
.prod-card p{font-size:12.5px;color:var(--text-body);line-height:1.6;margin-bottom:16px}
.prod-price{font-size:18px;font-weight:600;color:var(--blue)}
.prod-price span{font-size:12px;color:var(--text-muted);font-weight:400;margin-left:2px}

/* BIOBANK */
.biobank{background:var(--teal);padding:80px 0;position:relative;overflow:hidden}
.biobank::before{content:'';position:absolute;right:-80px;top:-80px;width:420px;height:420px;border-radius:50%;border:1px solid rgba(255,255,255,0.07)}
.biobank::after{content:'';position:absolute;right:60px;top:60px;width:270px;height:270px;border-radius:50%;border:1px solid rgba(255,255,255,0.07)}
.biobank-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;position:relative;z-index:1}
@media(max-width:760px){.biobank-grid{grid-template-columns:1fr;gap:40px}}
.bio-tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:0.07em;color:rgba(255,255,255,0.55);border:1px solid rgba(255,255,255,0.2);border-radius:4px;padding:4px 10px;margin-bottom:20px}
.biobank h2{font-size:32px;font-weight:600;color:#fff;letter-spacing:-0.02em;line-height:1.2;margin-bottom:16px}
.bio-sub{font-size:16px;color:rgba(255,255,255,0.65);line-height:1.7;margin-bottom:32px;font-weight:300}
.bio-perks{list-style:none;margin-bottom:32px}
.bio-perks li{font-size:14px;color:rgba(255,255,255,0.8);padding:8px 0;display:flex;align-items:flex-start;gap:10px;border-bottom:1px solid rgba(255,255,255,0.1)}
.bio-perks li:last-child{border-bottom:none}
.pdot{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,0.35);margin-top:8px;flex-shrink:0}
.btn-wh{background:#fff;color:var(--teal-dark);border:none;padding:13px 24px;border-radius:8px;font-size:14.5px;font-weight:600;cursor:pointer;text-decoration:none;display:inline-block;transition:background .15s;font-family:inherit}
.btn-wh:hover{background:rgba(255,255,255,0.9)}
.bio-counter{text-align:center}
.counter-ring{width:220px;height:220px;border-radius:50%;border:1.5px solid rgba(255,255,255,0.18);display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto 24px}
.counter-n{font-size:56px;font-weight:300;color:#fff;letter-spacing:-0.03em;line-height:1}
.counter-u{font-size:13px;color:rgba(255,255,255,0.5);margin-top:4px}
.counter-caption{font-size:14px;color:rgba(255,255,255,0.6);max-width:200px;margin:0 auto;line-height:1.55}

/* MGU */
.mgu{padding:52px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.mgu-in{display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.mgu-logo-wrap{display:flex;align-items:center;gap:14px;flex-shrink:0}
.mgu-circle{width:52px;height:52px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mgu-name{font-size:13.5px;font-weight:600;color:var(--navy);display:block;margin-bottom:2px}
.mgu-dept{font-size:12px;color:var(--text-muted);line-height:1.4}
.mgu-div{width:1px;height:44px;background:var(--border);flex-shrink:0}
.mgu-quote{font-size:14.5px;color:var(--text-body);font-style:italic;line-height:1.65;flex:1;min-width:260px}
.mgu-stats{display:flex;gap:36px;flex-shrink:0}
.mgu-stat{text-align:center}
.mstat-n{font-size:24px;font-weight:600;color:var(--navy);letter-spacing:-0.02em}
.mstat-l{font-size:11px;color:var(--text-muted);line-height:1.4;margin-top:2px}

/* HOW */
.how{padding:80px 0}
.sec-label{font-size:11px;font-weight:500;color:var(--text-muted);letter-spacing:0.06em;margin-bottom:8px}
.how-track{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:44px;position:relative}
.how-track::before{content:'';position:absolute;top:21px;left:calc(10% + 20px);right:calc(10% + 20px);height:1px;background:var(--border)}
.how-step{text-align:center;padding:0 10px}
.how-dot{width:42px;height:42px;border-radius:50%;background:var(--white);border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;position:relative;z-index:1;transition:border-color .15s,background .15s}
.how-step:hover .how-dot{border-color:var(--sky);background:var(--bg-card)}
.how-step h4{font-size:13px;font-weight:600;color:var(--navy);margin-bottom:6px;line-height:1.3}
.how-step p{font-size:12px;color:var(--text-muted);line-height:1.6}
@media(max-width:760px){.how-track{grid-template-columns:repeat(3,1fr);gap:20px}.how-track::before{display:none}}
@media(max-width:480px){.how-track{grid-template-columns:1fr 1fr;gap:16px}}

/* FOOTER */
footer{background:var(--navy);padding:60px 0 36px;color:rgba(255,255,255,0.5)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr 1fr;gap:32px}}
@media(max-width:480px){.foot-grid{grid-template-columns:1fr}}
.foot-logo{font-size:17px;font-weight:600;color:#fff;display:block;margin-bottom:12px;text-decoration:none}
.foot-desc{font-size:13px;line-height:1.7;margin-bottom:18px}
.foot-contact{font-size:12.5px;line-height:2}
.foot-contact a{color:var(--sky-light);text-decoration:none}
.foot-col h5{font-size:11.5px;font-weight:600;color:rgba(255,255,255,0.65);letter-spacing:0.03em;margin-bottom:14px}
.foot-links{list-style:none}
.foot-links li{margin-bottom:8px}
.foot-links a{font-size:13px;color:rgba(255,255,255,0.4);text-decoration:none;transition:color .15s}
.foot-links a:hover{color:rgba(255,255,255,0.8)}
.foot-bottom{border-top:1px solid rgba(255,255,255,0.1);padding-top:24px;display:flex;justify-content:space-between;align-items:center;font-size:12px;flex-wrap:wrap;gap:12px}
.foot-bottom a{color:rgba(255,255,255,0.3);text-decoration:none}
.mgu-badge-sm{display:flex;align-items:center;gap:7px;font-size:12px;color:rgba(255,255,255,0.35)}

.clinic-note{display:flex;align-items:center;gap:10px;background:#EEF4FF;border:1.5px solid #C5D8F5;border-radius:10px;padding:12px 18px;margin-bottom:24px;font-size:13px;color:#3D5872;flex-wrap:wrap}
.clinic-note-icon{font-size:16px;flex-shrink:0}
.clinic-note a{color:#0047AB;font-weight:500;text-decoration:none;margin-left:auto;white-space:nowrap}
.clinic-note a:hover{text-decoration:underline}
.prod-card-featured{border-color:#0047AB!important;background:#F4F8FF}
.prod-card-featured .prod-price{color:#0047AB}


/* ── WordPress core ── */
.admin-bar nav { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar nav { top: 46px; } }
img { max-width: 100%; height: auto; }
.wp-block-image { margin: 1.5rem 0; }
/* ── Page content area (Gutenberg) ── */
.pg-content { max-width: 760px; margin: 0 auto; padding: 4rem 24px; }
.pg-content h1 { font-size: 32px; font-weight: 600; color: var(--text); margin-bottom: 16px; letter-spacing: -0.02em; }
.pg-content h2 { font-size: 24px; font-weight: 600; color: var(--text); margin: 32px 0 12px; }
.pg-content h3 { font-size: 18px; font-weight: 600; color: var(--text); margin: 24px 0 10px; }
.pg-content p  { font-size: 16px; color: var(--text-body); line-height: 1.75; margin-bottom: 16px; }
.pg-content ul, .pg-content ol { margin: 0 0 16px 20px; color: var(--text-body); line-height: 1.75; }
.pg-content a  { color: var(--cobalt); text-decoration: none; border-bottom: 1px solid rgba(0,71,171,0.25); }
.pg-content a:hover { border-color: var(--cobalt); }
/* ── Page hero banner ── */
.page-banner { background: #F4F9FE; padding: 60px 0 48px; border-bottom: 1px solid var(--border); }
.page-banner h1 { font-size: clamp(26px,3.5vw,40px); font-weight: 600; color: #0A2A5E; letter-spacing:-0.02em; margin-bottom:10px; }
.page-banner p  { font-size: 17px; color: var(--text-body); font-weight: 300; max-width: 580px; }

/* ── Burger / mobile nav ── */
.nav-burger {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
}
.nav-burger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--text);
  border-radius: 2px;
  transition: transform .2s, opacity .2s;
}
.nav-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-burger.is-open span:nth-child(2) { opacity: 0; }
.nav-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 800px) {
  .nav-burger { display: flex; }
  .nav-links {
    display: none;
    position: absolute;
    top: 64px; left: 0; right: 0;
    background: rgba(255,255,255,0.98);
    border-bottom: 1px solid var(--border);
    flex-direction: column;
    padding: 12px 24px 20px;
    gap: 4px;
    z-index: 99;
    box-shadow: 0 8px 24px rgba(0,71,171,0.08);
  }
  .nav-links.nav-open { display: flex; }
  .nav-links a { padding: 10px 0; font-size: 15px; border-bottom: 1px solid var(--border); }
  .nav-links li:last-child a { border-bottom: none; }
  .nav-cta { margin-top: 8px; text-align: center; border-radius: 8px !important; padding: 10px !important; }
}
