:root{
  --navy:#001068;
  --navy-2:#000858;
  --light:#F2F2F2;
  --white:#FFFFFF;
  --red:#D01828;
  --header-offset: 72px;
  --text:#111827;
  --muted:#6B7280;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --radius: 18px;
  --radius-sm: 14px;
  --max: 1120px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top: calc(var(--header-offset) - 18px);
}
body{
  margin:0;
  overflow-x:hidden;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:var(--white) !important;
}

.container{
  width:min(var(--max), calc(100% - 40px));
  margin:0 auto;
}

/* Header */
.topbar{
  position:sticky;
  top:0;
  z-index:50;
  background:var(--white) !important;

  overflow-x: clip;

  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.topbar__inner{
  display:flex;
  align-items:stretch;
  justify-content:flex-start;
  gap:24px;

  border-bottom:0 !important;
}


.brand{
  display:flex;
  align-items:center;
  padding:14px 0;
}
.brand__logo{
  height:38px;
  width:auto;
  display:block;
}

.nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:22px;
  padding:14px 0;
  margin-left:auto;
}
.nav a{
  color:var(--navy);
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  padding:8px 0;
  text-align:center;
  line-height:1.05;
}
.nav a:hover{ }

.nav__toggle{
  display:none;
  background:transparent;
  border:0;
  padding:10px 0;
  border-radius:0;
  margin-left:auto;
}
.nav__toggle span{
  display:block;
  width:22px;
  height:2px;
  background:var(--navy);
  margin:4px 0;
}

/* Motto banner */
.motto-banner{
  position:relative;
  flex:0 0 420px;
  background: var(--navy);
  overflow: visible; /* allow the banner to extend to the right edge */
}
/* Extend the navy field to the far right edge */
.motto-banner::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:100%;
  width:2000px;
  background-image: url('assets/motto-rightcap.png');
  background-repeat: repeat-x;
  background-size: auto 100%;
  z-index:0;
}
/* Ensure the red line is the true bottom edge across the banner + extension */
.motto-banner::before{
  content:"";
  position:absolute;
  left:26.6667%;
  width:calc(100% + 2000px);
  bottom:-1px; /* overlap to avoid any subpixel seam */
  height:7px; /* match diagonal thickness */
  background: var(--red);
  z-index:2;
}
.motto-banner__svg{
  z-index:1;

  position:absolute;
  overflow:visible;
  inset:0;
  width:100%;
  height:100%;
  display:block;

  
}
.motto-banner__field{ fill: var(--navy); }
.motto-banner__cut{ fill: var(--white); }

.motto-banner__text{
  z-index:2;

  position:absolute;
  left:190px; /* safely inside blue field after diagonal */
  right:18px;
  top:0;
  bottom:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  color:var(--white);
  font-weight:400; /* lighter to match PPT */
  font-size:17px;
  letter-spacing:0;
  white-space:nowrap;
}

/* Cover */
.cover{
  padding:26px 0 10px;
}
.cover__inner h1{
  margin:0;
  font-size:32px;
  color:var(--navy);
  font-weight:600;
}

/* Sections */
.section{ padding:56px 0; }
.section--light{ background: var(--light); }
h2{
  margin:0 0 16px;
  font-size:28px;
  color:var(--navy);
}
h3{
  margin:0 0 10px;
  color:var(--navy);
  font-size:18px;
}
.muted{ color:var(--muted); }
.mt{ margin-top:14px; }

.grid{ display:grid; gap:18px; }
.grid--2{ grid-template-columns: 1fr 1fr; }
.align-start{ align-items:start; }

.card{
  background:var(--white);
  border-radius: var(--radius);
  box-shadow:none;
  padding:18px;
  border:1px solid rgba(17,24,39,.06);
}

.motto-line{
  margin:18px 0 0;
  font-weight:500;
  color:var(--navy);
  font-size:18px;
}

.bullets{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}
.bullets li{
  background:rgba(0,16,104,.03);
  border:1px solid rgba(17,24,39,.06);
  border-radius: var(--radius-sm);
  padding:12px 12px 12px 14px;
  line-height:1.35;
}
.section--light .bullets li{ background:#FFFFFF; }

.bullets--plain li{
  background:transparent !important;
  border:0;
  border-radius:0;
  padding:6px 0;
}

.countries{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-content:flex-start;
}
.country{
  display:inline-flex;
  align-items:center;
  padding:10px 12px;
  border-radius:999px;
  background:var(--white);
  border:1px solid rgba(17,24,39,.06);
  font-weight:600;
  color:var(--navy-2);
  box-shadow:none;
}

/* Organized country list ("invisible table") */
.countries-table{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:10px 18px;
  margin-top:14px;
}
.ct-cell{
  position:relative;
  padding-left:18px;
  font-weight:600;
  color:rgba(17,24,39,.88);
  line-height:1.25;
}
.ct-cell::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color:var(--red);
  font-weight:800;
}
@media (max-width: 900px){
  .countries-table{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px){
  .countries-table{ grid-template-columns: 1fr; }
}

.media-card{ padding:12px; }
.media{ width:100%; height:auto; display:block; border-radius: calc(var(--radius) - 8px); }

/* Value chain */
.valuechain{
  display:flex;
  align-items:stretch;
  gap:14px;
  flex-wrap:wrap;
}
.vc-step{
  flex: 1 1 220px;
  display:flex;
  gap:12px;
  align-items:center;
  background:var(--white);
  border:1px solid rgba(17,24,39,.06);
  border-radius: var(--radius);
  box-shadow:none;
  padding:14px;
}
.vc-icon{
  width:38px;height:38px;
  border-radius:14px;
  background:linear-gradient(135deg, var(--navy), var(--navy-2));
  color:var(--white);
  display:grid;
  place-items:center;
  font-weight:700;
}
.vc-text{
  font-weight:600;
  color:rgba(17,24,39,.9);
  line-height:1.25;
}
.vc-arrow{
  width:26px;
  position:relative;
  flex:0 0 26px;
}
.vc-arrow::before{
  content:"";
  position:absolute;
  top:50%;
  left:0;
  right:0;
  height:3px;
  background:var(--red);
  transform:translateY(-50%);
}
.vc-arrow::after{
  content:"";
  position:absolute;
  top:50%;
  right:-2px;
  width:0;height:0;
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
  border-left:10px solid var(--red);
  transform:translateY(-50%);
}

/* Customers */
.customer-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:14px;
}
.customer-card{
  background:#FFFFFF;
  border:1px solid rgba(17,24,39,.06);
  border-radius: var(--radius);
  padding:16px;
  box-shadow:none;
  display:flex;
  gap:12px;
  align-items:center;
}
.customer-dot{
  width:14px;height:14px;
  border-radius:999px;
  background:var(--red);
}
.customer-label{
  font-weight:600;
  color:rgba(17,24,39,.9);
}

/* Partners */
.partner-logos{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:16px;
  align-items:center;
}

.partner-logos img{
  height:auto;
  width:auto;
  max-width:100%;
  object-fit:contain;
}


/* Strategy side card */
.strategy-side{
  position:relative;
  overflow:visible;
}
.strategy-accent{
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg, rgba(0,16,104,.08), rgba(208,24,40,.08));
}
.strategy-side__content{
  position:relative;
  z-index:1;
}

/* Contact */
.lead{ font-size:16px; color:#1f2937; margin:0 0 10px; }
.contact-lines{ display:flex; flex-direction:column; gap:8px; }
.contact-link{ color:var(--navy); font-weight:600; text-decoration:none; }
.contact-link:hover{ text-decoration:underline; }

/* --- Corporate Value Chain (PPT-style arrow + cards) --- */
.vc-arrowwrap{ position:relative; padding:46px 0; }
.vc-arrowbg{
  position:absolute;
  left:-5%;
  right:-5%;
  top:-28px;
  bottom:-28px;
  background: linear-gradient(90deg, rgba(208,24,40,.18), var(--red) 14%, var(--red) 86%, rgba(208,24,40,.18));
  clip-path: polygon(0 10%, 72% 10%, 72% 0, 100% 50%, 72% 100%, 72% 90%, 0 90%);
  filter: drop-shadow(0 14px 22px rgba(0,0,0,.12));
}
.vc-cards{ position:relative; display:grid; grid-template-columns: 1.1fr 1fr 1fr; gap:22px; align-items:stretch; }
.vc-card{
  background: linear-gradient(135deg, rgba(0,16,104,.95), rgba(0,8,88,.95));
  color:var(--white);
  border-radius:22px;
  padding:18px 18px 16px;
  box-shadow:none;
}
.vc-card h3{ color:var(--white); text-decoration: underline; text-underline-offset: 6px; }
.vc-card ul{ margin:12px 0 0; padding-left:18px; line-height:1.45; }
.vc-card li{ margin:6px 0; }
.vc-card--center{ background: linear-gradient(135deg, rgba(0,16,104,.92), rgba(0,8,88,.92)); }

@media (max-width: 980px){
  .vc-cards{ grid-template-columns:1fr; }
  .vc-arrowbg{ left:0; right:0; }
}

/* --- Key Customers (icons + labels, VITAXIS logo in the center) --- */
.kc-orbit{
  position:relative;
  margin: 22px auto 10px;
  width:min(760px, 100%);
  height: 420px;
}
.kc-ring{
  position:absolute;
  inset: 64px;
  border: 2px solid rgba(0,16,104,.18);
  border-radius: 999px;
}
.kc-center{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width: 170px;
  height: 170px;
  border-radius: 999px;
  background: var(--white);
  border: 2px solid rgba(0,16,104,.22);
  box-shadow:none;
  display:grid;
  place-items:center;
}
.kc-logo{ width: 130px; height:auto; display:block; }

.kc-item{
  position:absolute;
  width: 170px;
  display:grid;
  justify-items:center;
  gap:10px;
  text-align:center;
}
.kc-icon{
  width: 78px;
  height: 78px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(208,24,40,1), rgba(0,16,104,1));
  box-shadow:none;
  display:grid;
  place-items:center;
}
.kc-icon svg{ width: 38px; height: 38px; fill: var(--white); }
.kc-title{
  font-weight:700;
  color: var(--navy);
  line-height:1.15;
}

.kc-item--top{ left:50%; top:0; transform:translateX(-50%); }
.kc-item--right{ right:0; top:50%; transform:translateY(-50%); }
.kc-item--left{ left:0; top:50%; transform:translateY(-50%); }
.kc-item--bottom-left{ left:14%; bottom:0; }
.kc-item--bottom-right{ right:14%; bottom:0; }

/* Customer-type gradients (premium, easier to recognize) */
.kc-icon--hosp{ background: linear-gradient(135deg, #0EA5E9, #1D4ED8); }
.kc-icon--pharm{ background: linear-gradient(135deg, #22C55E, #16A34A); }
.kc-icon--cro{ background: linear-gradient(135deg, #8B5CF6, #4C1D95); }
.kc-icon--hcp{ background: linear-gradient(135deg, #06B6D4, #0EA5E9); }
.kc-icon--pat{ background: linear-gradient(135deg, #FB7185, #D01828); }

@media (max-width: 820px){
  .kc-orbit{ height: 520px; }
  .kc-item{ width: 160px; }
  .kc-item--bottom-left{ left:6%; }
  .kc-item--bottom-right{ right:6%; }
}
@media (max-width: 640px){
  .kc-orbit{ height: auto; }
  .kc-ring{ display:none; }
  .kc-center{ position:relative; left:auto; top:auto; transform:none; margin: 0 auto 18px; }
  .kc-item{ position:relative; left:auto; right:auto; top:auto; bottom:auto; transform:none; margin: 14px auto; }
}

/* --- PPT-style bullets for slide 8 --- */
.ppt-bullets{ list-style:none; padding:0; margin:10px 0 0; display:grid; gap:10px; }
.ppt-bullets > li{ display:block; line-height:1.55; color: rgba(17,24,39,.92); }
.ppt-arrow{ color: var(--navy); font-weight:800; margin-right:10px; }
.ppt-sub{ margin:10px 0 0 34px; padding-left:18px; }
.ppt-sub li{ margin:6px 0; }

/* Footer */
.footer{
  padding:22px 0;
  border-top:1px solid rgba(17,24,39,.08);
  background:var(--white);
}
.footer__inner{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  color:var(--navy);
  font-weight:600;
}

/* Responsive */
@media (max-width: 1100px){
  .motto-banner{ flex-basis:340px; }
  .motto-banner__text{ font-size:16px; left:175px; }
}
@media (max-width: 980px){
  .grid--2{ grid-template-columns:1fr; }
  .customer-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 820px){
  .motto-banner{ display:none; }
  .nav__toggle{ display:inline-flex; align-items:center; justify-content:center; }
  .topbar__inner{ padding:0 0; }
  .nav{
    position:absolute;
    right:20px;
    top:64px;
    background:#FFFFFF;
    border:1px solid rgba(17,24,39,.08);
    border-radius: 16px;
    padding:10px;
    box-shadow:none;
    display:none;
    flex-direction:column;
    align-items:stretch;
    min-width: 240px;
  }
  .nav a{ padding:10px 12px; border-radius:12px; }
  .nav.is-open{ display:flex; }
}
@media (max-width: 640px){
  .partner-logos{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .customer-grid{ grid-template-columns: 1fr; }
}


/* Ensure anchored sections are not hidden under the sticky header */
section[id]{ scroll-margin-top: calc(var(--header-offset) - 18px); }


/* Products Pipeline */
.pipeline-statement{
  margin: 10px 0 18px;
  font-size: 16px;
  line-height: 1.55;
  color: rgba(17,24,39,.85);
  max-width: 980px;
}
.arrow-list{
  list-style:none;
  padding:0;
  margin:10px 0 18px;
  display:grid;
  gap:10px;
}
.arrow-list li{
  position:relative;
  padding-left:22px;
  line-height:1.45;
}
.arrow-list li::before{
  content:"➤";
  position:absolute;
  left:0;
  top:0;
  color: var(--red);
  font-weight:700;
}
.sub-list{
  list-style:none;
  padding:0 0 0 22px;
  margin:-6px 0 18px;
  display:grid;
  gap:8px;
  color: rgba(17,24,39,.85);
}
.sub-list li{ position:relative; padding-left:12px; }
.sub-list li::before{ content:"•"; position:absolute; left:0; top:0; color: rgba(17,24,39,.55); }

/* Key Customers orbit (match PPT) */
.customers-orbit{
  position:relative;
  width:min(760px, 100%);
  height:560px;
  margin: 20px auto 0;
}
.orbit-center{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:180px;
  height:180px;
  border-radius:999px;
  background: var(--navy);
  color: var(--white);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:34px;
  letter-spacing:.06em;
  box-shadow:none;
}
.orbit-node{
  position:absolute;
  width:210px;
  height:210px;
  border-radius:999px;
  background: var(--red);
  color: var(--white);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-size:20px;
  font-weight:500;
  box-shadow:none;
  padding:18px;
  gap:4px;
  flex-direction:column;
}
.orbit-node span{ display:block; line-height:1.1; }
.orbit-node--top{ left:50%; top:10px; transform:translateX(-50%); }
.orbit-node--right{ right:20px; top:50%; transform:translateY(-50%); }
.orbit-node--left{ left:20px; top:50%; transform:translateY(-50%); }
.orbit-node--bottom-left{ left:140px; bottom:10px; }
.orbit-node--bottom-right{ right:140px; bottom:10px; font-size:18px; }

.orbit-arrows{ position:absolute; inset:0; }
.orbit-arrow{
  position:absolute;
  width:34px;
  height:34px;
  background: rgba(153, 196, 205, .85);
  clip-path: polygon(0 50%, 65% 0, 65% 32%, 100% 32%, 100% 68%, 65% 68%, 65% 100%);
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.18));
  }
.orbit-arrow--1{ left:50%; top:210px; transform:translateX(-50%) rotate(-90deg); }
.orbit-arrow--2{ left:430px; top:265px; transform:rotate(-15deg); }
.orbit-arrow--3{ left:390px; top:380px; transform:rotate(35deg); }
.orbit-arrow--4{ left:50%; top:410px; transform:translateX(-50%) rotate(90deg); }
.orbit-arrow--5{ left:300px; top:380px; transform:rotate(145deg); }
.orbit-arrow--6{ left:270px; top:265px; transform:rotate(195deg); }

@media (max-width: 780px){
  .customers-orbit{ height:540px; }
  .orbit-node{ width:190px; height:190px; font-size:18px; }
  .orbit-center{ width:160px; height:160px; font-size:30px; }
  .orbit-node--bottom-left{ left:40px; }
  .orbit-node--bottom-right{ right:40px; }
  .orbit-arrow{ display:none; }
}


/* --- Key Customers: modern icon grid (no bubbles) --- */
.kc-grid{
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap:18px;
  align-items:stretch;
  margin-top:18px;
}
.kc-center-card{
  grid-column: span 2;
  background: linear-gradient(135deg, rgba(0,16,104,.08), rgba(208,24,40,.08));
  border:1px solid rgba(17,24,39,.06);
  border-radius: var(--radius);
  box-shadow:none;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.kc-center-logo{ max-width:100%; max-height:56px; height:auto; width:auto; }

.kc-card{
  grid-column: span 1;
  background: var(--white);
  border:1px solid rgba(17,24,39,.06);
  border-radius: var(--radius);
  box-shadow:none;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.kc-card__icon{
  width:46px;
  height:46px;
  border-radius: 14px;
  display:grid;
  place-items:center;
}
.kc-card__icon svg{ width:24px; height:24px; fill: var(--white); }
.kc-card__title{
  font-weight:700;
  color: var(--navy);
  line-height:1.2;
  font-size:14px;
}

.kc-hosp .kc-card__icon{ background: #1D4ED8; }
.kc-pharm .kc-card__icon{ background: #16A34A; }
.kc-cro .kc-card__icon{ background: #7C3AED; }
.kc-hcp  .kc-card__icon{ background: #0EA5E9; }
.kc-pat  .kc-card__icon{ background: #F97316; }

@media (max-width: 980px){
  .kc-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .kc-center-card{ grid-column: span 2; }
}

/* Full-width lifestyle image between header and Vision section */
.hero-photo{
  width:100%;
  height:100vh;
  overflow:hidden;
}

.hero-photo::before{content:none !important; display:none !important;}

.hero-photo img{
  width:100%;
  height:100vh;
  object-fit:cover;
  object-position: center 5%;
  display:block;
}
@media (max-width: 720px){
  .hero-photo img{
  width:100%;
  height:100vh;
  object-fit:cover;
  object-position: center 5%;
  display:block;
}
}

.motto-banner__accent-band{ fill: var(--red); }

/* Round 19 seam fix */
.topbar{background:var(--white) !important; border-bottom:0 !important; box-shadow:none !important; backdrop-filter:none !important;}
.hero-photo{
  width:100%;
  height:100vh;
  overflow:hidden;
}
.hero-photo img{
  width:100%;
  height:100vh;
  object-fit:cover;
  object-position: center 5%;
  display:block;
}

/* Contact form */
.contact-form{
  max-width: 720px;
  margin-top: 14px;
  display: grid;
  gap: 14px;
}
.form-group{
  display: grid;
  gap: 6px;
}
.form-group label{
  font-weight: 600;
  color: #0f172a;
}
.form-group input,
.form-group textarea{
  width: 100%;
  border: 1px solid rgba(15, 23, 42, 0.18);
  border-radius: 10px;
  padding: 10px 12px;
  font: inherit;
  background: #fff;
}
.form-group input:focus,
.form-group textarea:focus{
  outline: none;
  border-color: rgba(0, 43, 91, 0.55);
  box-shadow: 0 0 0 3px rgba(0, 43, 91, 0.12);
}
.form-actions{
  display: flex;
  align-items: center;
  gap: 14px;
}
.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: var(--navy);
  color: #fff;
  font-weight: 700;
}
.btn:disabled{
  cursor: not-allowed;
}
.form-status{
  font-size: 14px;
}
.form-status.is-ok{ color: #065f46; }
.form-status.is-error{ color: #b91c1c; }


/* Cookie consent */
.cookie-consent { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; padding: 14px; background: rgba(7, 22, 46, 0.96); }
.cookie-consent__inner { max-width: 1100px; margin: 0 auto; display: flex; gap: 16px; align-items: center; justify-content: space-between; }
.cookie-consent__text { color: #fff; display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.cookie-consent__text strong { font-size: 15px; }
.cookie-consent__actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.btn--ghost { background: transparent; border: 1px solid rgba(255,255,255,0.5); color: #fff; }
.btn--ghost:hover { border-color: rgba(255,255,255,0.9); }

/* Modal */
.modal { position: fixed; inset: 0; z-index: 10000; display: none; }
.modal.is-open { display: block; }
.modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.55); }
.modal__panel { position: relative; max-width: 720px; margin: 8vh auto; background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,0.3); }
.modal__header, .modal__footer { padding: 16px 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.modal__header { border-bottom: 1px solid rgba(0,0,0,0.08); }
.modal__body { padding: 16px 18px; }
.modal__close { background: transparent; border: none; font-size: 26px; line-height: 1; cursor: pointer; padding: 6px 10px; }
.fineprint { font-size: 13px; color: rgba(0,0,0,0.7); margin-top: 12px; }

/* Cookie rows */
.cookie-row { display: flex; justify-content: space-between; gap: 14px; padding: 14px 0; border-top: 1px solid rgba(0,0,0,0.08); }
.cookie-row:first-of-type { border-top: none; }
.cookie-row__meta p { margin: 6px 0 0; color: rgba(0,0,0,0.72); font-size: 14px; }
.pill { display: inline-flex; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.pill--on { background: rgba(0, 140, 70, 0.12); color: rgb(0, 100, 55); }

/* Switch */
.switch { display: inline-flex; align-items: center; }
.switch input { display: none; }
.switch__track { width: 44px; height: 26px; border-radius: 999px; background: rgba(0,0,0,0.18); position: relative; cursor: pointer; transition: background 180ms ease; }
.switch__track::after { content: ""; width: 20px; height: 20px; border-radius: 999px; background: #fff; position: absolute; top: 3px; left: 3px; transition: transform 180ms ease; box-shadow: 0 3px 12px rgba(0,0,0,0.25); }
.switch input:checked + .switch__track { background: rgba(12, 80, 180, 0.75); }
.switch input:checked + .switch__track::after { transform: translateX(18px); }

/* Pharmacovigilance notice */
.pv-notice { padding: 16px 18px; border-radius: 14px; background: rgba(12, 80, 180, 0.07); border: 1px solid rgba(12, 80, 180, 0.14); margin: 18px 0 18px; }
.pv-notice h3 { margin: 0 0 8px; font-size: 16px; }
.pv-notice p { margin: 0; color: rgba(0,0,0,0.75); }
.form-group--inline{ width:100%; }

/* Checkbox row (PV flag) */
.check{
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
  width: 100%;
  max-width: 100%;
  font-size: 14px;
}
.check input{
  margin-top: 3px;
}
.check__label{
  display: block;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
}

.field-hint { margin: 6px 0 0; font-size: 12px; color: rgba(0,0,0,0.65); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 720px) { .form-grid { grid-template-columns: 1fr; } }



/\* Footer legal navigation styled like main menu \*/
.footer__legal{
  margin-top:20px;
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}

.footer__legal a{
  color:var(--navy);
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  padding:8px 0;
  line-height:1.05;
  transition:opacity .2s ease;
}

.footer__legal a:hover{ }


.footer-sep{
  color:var(--navy);
  font-weight:600;
  font-size:14px;
}


/* SEO/Accessibility helper */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}



/* Mobile navigation */
@media (max-width: 900px){
  .topbar__inner{ position: relative; align-items: center; }
  .nav__toggle{ display: inline-flex; align-items: center; justify-content: center; }

  .nav{
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 0;
    padding: 10px;
    background: var(--white);
    border: 1px solid rgba(17,24,39,.10);
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0,0,0,.12);
    flex-direction: column;
    align-items: stretch;
    gap: 6px;

    transform: translateY(-8px);
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
  }

  .nav.is-open{
    transform: translateY(8px);
    pointer-events: auto;
  }

  .nav a{
    text-align: left;
    padding: 10px 12px;
    border-radius: 10px;
  }

  .nav a:hover{
    background: rgba(12,80,180,0.06);
    }
}



/* Added in round77: hero + partnering visuals */
.cover__inner{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:center}
@media (max-width: 900px){.cover__inner{grid-template-columns:1fr}.hero__media{order:-1}}
.hero__media img{width:100%;height:auto;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.btn--ghost{background:transparent;border:1px solid currentColor}
.logo-strip{display:flex;gap:18px;flex-wrap:wrap;align-items:center;justify-content:flex-start;margin-top:18px;opacity:.9}
.logo-strip img{height:38px;width:auto;opacity:.85}
.page-hero{margin-top:14px}
.page-hero__img{width:100%;height:auto;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.cta-row{margin-top:18px}


/* Dropdown navigation (round80) */
.nav{position:relative}
.nav__group{position:relative;display:inline-flex;align-items:center;gap:6px}
.nav__parent{padding-right:0}
.nav__caret{background:transparent;border:0;font:inherit;cursor:pointer;line-height:1;padding:6px 4px;border-radius:8px}
.nav__caret:focus{outline:2px solid rgba(0,0,0,.25);outline-offset:2px}

.nav__dropdown{
  position:absolute;
  left:0;
  top:100%;
  margin-top:6px;
  width:520px;
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  box-shadow:0 14px 40px rgba(0,0,0,.12);
  display:none;
  z-index:999;
}
.nav__dropdown::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-10px;
  height:10px;
}

.nav__dropdown a{display:block;padding:10px 12px;border-radius:10px}
.nav__dropdown a:hover{background:rgba(0,0,0,.05)}
/* Desktop hover */
@media (hover:hover){
  .nav__group:hover .nav__dropdown{display:block}
  .nav__group:hover .nav__caret{background:rgba(0,0,0,.04)}
}
/* Mobile/keyboard open state */
.nav__group.is-open .nav__dropdown{display:block}

/* When nav is opened as mobile menu, dropdowns become static blocks */
@media (max-width: 900px){
  .nav{display:flex;flex-direction:column;align-items:flex-start}
  .nav__group{display:flex;width:100%;justify-content:space-between}
  .nav__dropdown{position:static;box-shadow:none;border:0;padding:0;margin:6px 0 10px 0;min-width:0;width:100%}
  .nav__dropdown a{padding:10px 0}
}

.nav__dropdown::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px;}


/* Nav alignment override (round81) */
.topbar__inner{justify-content:flex-start;gap:18px}
.nav{justify-content:flex-start}
/* keep motto banner on the right when space allows */
.motto-banner{margin-left:auto}


/* Mega dropdown (round82) */
.nav__dropdown{
  min-width:420px;
}


.nav__mega{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:20px;
  padding:18px 20px;
  min-height:120px;
}


.nav__intro{
  border-right:1px solid rgba(0,0,0,.08);
  padding-right:18px;
}

.nav__intro h4{
  margin:0 0 8px 0;
  font-size:14px;
  letter-spacing:.04em;
  text-transform:uppercase;
  }


.nav__intro p{
  font-size:14px;
  line-height:1.5;
  max-width:240px;
}


.nav__links{
  display:flex;
  flex-direction:column;
  gap:6px;
}


.nav__links a{
  font-size:15px;
  padding:10px 12px;
  border-radius:10px;
}


.nav__links a:hover{
  background:rgba(0,0,0,.05);
}

@media (max-width:900px){
  .nav__mega{
    grid-template-columns:1fr;
    padding:10px 0;
  }
  .nav__intro{
    border-right:0;
    padding-right:0;
    margin-bottom:8px;
  }
}


/* Merck-style mega nav (round83)
   - dropdown panel stays visually fixed
   - larger description area
   - smoother category switching
*/
.nav{
  position:relative;
}

/* Make dropdown span wider and feel like a fixed bar */
.nav__dropdown{
  position:absolute;
  left:0;
  right:auto;
  width:min(980px, calc(100vw - 40px));
  top:100%;
  margin-top:12px;
  padding:0;
  border-radius:18px;
  overflow:hidden;
}

/* Larger mega layout */
.nav__mega{
  display:grid;
  grid-template-columns:1.1fr 1.4fr;
  gap:36px;
  padding:28px 32px;
  min-height:160px;
}

/* Bigger description column */
.nav__intro{
  border-right:1px solid rgba(0,0,0,.08);
  padding-right:26px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.nav__intro h4{
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:12px;
  }

.nav__intro p{
  font-size:15px;
  line-height:1.6;
  max-width:340px;
}

/* Larger category links */
.nav__links a{
  font-size:16px;
  padding:14px 14px;
  border-radius:12px;
  transition:background .18s ease, transform .12s ease;
}

.nav__links a:hover{
  background:rgba(0,0,0,.06);
  transform:translateX(2px);
}

/* Smooth appearance */
.nav__dropdown{
  transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease;
  pointer-events:none;
}

.nav__group:hover .nav__dropdown,
.nav__group.is-open .nav__dropdown{
  transform:translateY(0);
  pointer-events:auto;
}

/* Keep menu visually stable */
.nav__group{
  position:static;
}

/* Mobile fallback */
@media (max-width:900px){
  .nav__dropdown{
    width:100%;
    position:static;
    margin-top:0;
    border-radius:0;
  }
  .nav__mega{
    grid-template-columns:1fr;
    padding:16px 0;
    min-height:auto;
  }
  .nav__intro{
    border-right:0;
    padding-right:0;
    margin-bottom:10px;
  }
}

.nav__group{position:relative}

/* round84 nav alignment */
.topbar__inner{
  justify-content:flex-start;
  gap:12px;
}
.nav{
  justify-content:flex-start;
  gap:8px;
}


/* round85: dropdown usability + compact left nav */
.nav__group{position:relative !important;}
/* neutralize older transition/pointer-events rules that prevented clicks */
.nav__dropdown{
  opacity:1 !important;
  transform:none !important;
  pointer-events:auto !important;
}

/* Keep dropdown open reliably (hover bridge already exists) */
@media (hover:hover){
  .nav__group:hover .nav__dropdown{display:block !important;}
}

/* Compact, left-shifted top navigation */
.topbar__inner{
  justify-content:flex-start !important;
  gap:8px !important;
  padding-left:0 !important;
}
.nav{
  justify-content:flex-start !important;
  gap:6px !important;
}

/* Slightly smaller nav link hitboxes (still accessible) */
.nav__link{
  padding:8px 10px !important;
}
.nav__caret{
  padding:6px 4px !important;
}


/* round86: compact mega dropdown + Merck-like stable hover/click */
.nav__dropdown{
  width:440px !important;          /* shorter bar */
  top:100% !important;
  margin-top:4px !important;
}
.nav__mega{
  padding:16px 18px !important;
  gap:18px !important;
  min-height:110px !important;
}
.nav__intro{
  padding-right:16px !important;
}
.nav__intro p{
  max-width:220px !important;
}
/* ensure no hover gap */
.nav__dropdown::before{
  top:-12px !important;
  height:12px !important;
}



/* round87: keep mega dropdown fixed on X (Merck-like) */
.nav{position:relative !important;}
/* Make groups non-positioned so dropdowns anchor to .nav, not each item */
.nav__group{position:static !important;}
/* Force same left edge for all dropdowns */
.nav__dropdown{
  left:0 !important;
  right:auto !important;
}



/* round88: make each main section fill the viewport (so next section isn't visible) */
main > section.section{
  min-height: calc(100vh - 90px);
  padding-top: 90px;
  padding-bottom: 90px;
  
}
/* Keep cover/hero section as-is */
main > section.cover{
  min-height: calc(100vh - 90px);
  padding-top: 110px;
  padding-bottom: 90px;
  
}
/* On small screens, slightly reduce padding */
@media (max-width: 700px){
  main > section.section{
    padding-top: 70px;
    padding-bottom: 70px;
    min-height: calc(100vh - 70px);
    
  }
  main > section.cover{
    padding-top: 90px;
    padding-bottom: 70px;
    min-height: calc(100vh - 70px);
    
  }
}



/* round90: highlight active grand category (Merck-like) */
.nav__parent{
  position:relative;
  border-radius:12px;
}
/* visual highlight when dropdown is shown */
@media (hover:hover){
  .nav__group:hover .nav__parent,
  .nav__group:hover .nav__caret{
    background:rgba(0,0,0,.05);
  }
  .nav__group:hover .nav__parent::after{
    content:"";
    position:absolute;
    left:10px;
    right:10px;
    bottom:6px;
    height:2px;
    border-radius:2px;
    background:currentColor;
    }
}
/* highlight for keyboard/mobile open state */
.nav__group.is-open .nav__parent,
.nav__group.is-open .nav__caret{
  background:rgba(0,0,0,.05);
}
.nav__group.is-open .nav__parent::after{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  bottom:6px;
  height:2px;
  border-radius:2px;
  background:currentColor;
  }



/* round91: Merck-like red indicator + no gaps between grand categories */
:root{
  --nav-accent:#d40000;
}

/* remove gaps so there is no dead space between categories */
.nav{
  gap:0 !important;
}
.nav__group{
  margin:0 !important;
}
/* make clickable areas touch */
.nav__link.nav__parent{
  padding:10px 14px !important;
}
.nav__caret{
  margin-left:-6px; /* tuck caret closer to text */
}

/* Red underline + small triangle marker for active/hovered grand category */
@media (hover:hover){
  .nav__group:hover .nav__parent::after{
    background:var(--nav-accent) !important;
    opacity:1 !important;
  }
  
}
.nav__group.is-open .nav__parent::after{
  background:var(--nav-accent) !important;
  opacity:1 !important;
}


/* Make hover transfer seamless: widen the hover area of the whole nav row */
.topbar{
  position:sticky;
  top:0;
  z-index:1000;
}
.topbar__inner{
  gap:0 !important;
}
.nav__group, .nav__link{
  display:inline-flex;
  align-items:center;
}



/* round92: clean red underline (no triangle) */
.nav__group:hover .nav__parent::after,
.nav__group.is-open .nav__parent::after{
  background:#d40000 !important;
  opacity:1 !important;
  height:2px;
  border-radius:2px;
}



/* round93: readability + smarter spacing */
:root{
  --content-max: 980px;
  --text-max: 68ch;
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 18px;
  --space-4: 26px;
  --space-5: 38px;
}

/* Constrain text width for readability while keeping sections full width */
.container{
  max-width: var(--content-max);
}

/* Better vertical rhythm */
.section .container > * + *{
  margin-top: var(--space-3);
}
.section .container > h2 + *,
.section .container > h1 + *{
  margin-top: var(--space-2);
}

p{
  line-height: 1.7;
  max-width: var(--text-max);
}
/* Let forms and grids span wider */
form, .grid, .logo-strip, .nav__dropdown, .nav__mega{
  max-width: none;
}

.lead{
  font-size: 1.05rem;
  line-height: 1.7;
  max-width: 72ch;
}

/* Headings spacing */
h1{margin-bottom: var(--space-2);}
h2{margin-bottom: var(--space-2);}
h3{margin-top: var(--space-3); margin-bottom: var(--space-2);}

/* Lists */
ul, ol{
  padding-left: 1.1rem;
}
.bullets li, li{
  margin: 8px 0;
}

/* Cards and grids: more breathing room */
.grid{
  gap: 22px;
}
.card{
  padding: 22px;
}
.card p{
  max-width: none;
}
/* If there are 2-column text blocks, increase gap */
.columns, .two-col, .split{
  gap: 26px;
}

/* Improve section separation subtly */
main > section.section{
  padding-top: max(80px, 8vh);
  padding-bottom: max(80px, 8vh);
}

/* Make long sections feel structured */
.section .container > h2{
  max-width: var(--content-max);
}
/* Slightly more spacing before grids/cards after text */
.section .container p + .grid,
.section .container ul + .grid{
  margin-top: var(--space-4);
}

/* Contact forms: spacing */
form .row, form .field, .form-group{
  margin-bottom: 14px;
}
input, select, textarea{
  line-height: 1.4;
}




/* round94: shared dropdown panel (Merck-like) */
.nav{position:relative}
.nav__template{display:none}
.nav__panel{
  position:absolute;
  left:0;
  top:100%;
  margin-top:0; /* no dead space */
  width:440px;
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  box-shadow:0 14px 40px rgba(0,0,0,.12);
  z-index:999;
  display:none;
}
.nav__panel.is-open{display:block}
/* hover bridge so no gap */
.nav__panel::before{
  content:"";
  position:absolute;
  left:0; right:0;
  top:-14px;
  height:14px;
}

/* ensure no gaps between grand categories */
.nav{gap:0 !important}
.nav__group{display:inline-flex;align-items:center;position:relative}
.nav__link.nav__parent{padding:10px 14px}
.nav__caret{padding:6px 4px}

/* highlight state (reuse existing underline styles) */
.nav__group.is-active .nav__parent,
.nav__group.is-active .nav__caret{
  background:rgba(0,0,0,.05);
}
.nav__group.is-active .nav__parent::after{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  bottom:6px;
  height:2px;
  border-radius:2px;
  background:#d40000;
  }

/* Panel layout */
.nav__panel .nav__mega{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:18px;
  padding:16px 18px;
  min-height:110px;
}
.nav__panel .nav__intro{
  border-right:1px solid rgba(0,0,0,.08);
  padding-right:16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.nav__panel .nav__intro h4{
  margin:0 0 10px 0;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  }
.nav__panel .nav__intro p{
  margin:0;
  font-size:14px;
  line-height:1.5;
  max-width:220px;
  }
.nav__panel .nav__links{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.nav__panel .nav__links a{
  padding:10px 12px;
  border-radius:10px;
  font-size:15px;
}
.nav__panel .nav__links a:hover{background:rgba(0,0,0,.06)}

/* Mobile: panel becomes inline list per group (caret toggles templates) */
@media (max-width:900px){
  .nav__panel{display:none !important}
  .nav__template{display:none}
  .nav__group{flex-wrap:wrap;width:100%;justify-content:space-between}
  .nav__group.is-open .nav__template{display:block;width:100%;padding:6px 0 10px 0}
  .nav__group.is-open .nav__template a{display:block;padding:10px 0}
}




/* round97: sliding underline indicator (enterprise polish) */
/* Disable per-item underline to avoid flicker/layout changes */
.nav__group.is-active .nav__parent::after,
.nav__group:hover .nav__parent::after,
.nav__group.is-open .nav__parent::after{
  content:none !important;
}

/* Sliding underline */
.nav{
  position:relative;
}
.nav__indicator{
  position:absolute;
  left:0;
  bottom:0;
  height:2px;
  width:0;
  background:#d40000;
  border-radius:2px;
  transform:translateZ(0);
  transition: left .22s ease, width .22s ease, opacity .15s ease;
}

/* Ensure nav items sit on same baseline without shifting */
.nav__group, .nav__link{
  align-items:center;
}

/* Keep highlight background only */
.nav__group.is-active .nav__parent,
.nav__group.is-active .nav__caret,
@media (hover:hover){
  .nav__group:hover .nav__parent,
  .nav__group:hover .nav__caret{
    background:rgba(0,0,0,.05);
  }
}




/* round99: make active grand category title in dropdown panel red */
.nav__panel .nav__intro h4{
  color:#d40000;
  font-weight:700;
}




/* round100: Strategic Partners logos as 3x3 grid */
.partner-logos{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  align-items:center;
  justify-items:center;
  margin-top: 22px;
}

.partner-logos img{
  height:auto;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

@media (max-width: 700px){
  .partner-logos{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
  
.partner-logos img{
  height:auto;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

}






/* Ensure all anchored sections snap below the sticky header */
section[id]{
  scroll-margin-top: var(--topbar-offset);
}

/* Fine-tune for smaller screens (header typically taller due to wrap) */
@media (max-width: 900px){
  :root{ --topbar-offset: 140px; }
}
@media (max-width: 700px){
  :root{ --topbar-offset: 150px; }
}



/* round103: anchor alignment handled by JS; keep small margin for safety */
section[id]{scroll-margin-top:24px;}



/* round105: mobile navigation reliability */
@media (max-width: 900px){
  /* Ensure toggle is visible */
  .nav__toggle{display:inline-flex !important;}
  /* Place dropdown menu below the full topbar (logo + banner) */
  .nav{
    left: 12px;
    right: 12px;
    top: calc(100% + 8px);
    min-width: 0;
    width: auto;
    max-width: none;
  }
  /* Hide desktop-only shared panel + underline indicator */
  .nav__panel, .nav__indicator{display:none !important;}
  /* Stack groups nicely */
  .nav__group{
    width: 100%;
    justify-content: space-between;
  }
  .nav__parent{
    flex: 1 1 auto;
  }
  /* Inline submenu */
  .nav__template a{
    padding-left: 18px;
    font-size: 0.98rem;
  }
}



/* round106: mobile menu styling (accordion) */
@media (max-width: 900px){
  .nav__group{
    padding: 6px 0;
    border-bottom: 1px solid rgba(0,0,0,.08);
  }
  .nav__link.nav__parent{
    width: 100%;
    justify-content: space-between;
    padding: 12px 0 !important;
  }
  .nav__caret{
    margin-left: 8px;
  }
  .nav__group.is-open .nav__template{
    padding: 2px 0 10px 0;
  }
  .nav__group.is-open .nav__template a{
    padding: 10px 0 10px 18px;
  }
}



/* round112: touch + mobile navigation (Merck-like) */

/* Mobile: show grand categories immediately (no hamburger), horizontal scroll if needed */
@media (max-width: 900px){
  .nav__toggle{display:none !important;}
  .nav{
    position:static !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:0 !important;
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .nav::-webkit-scrollbar{display:none;}
  .nav__group{
    width:auto !important;
    border-bottom:0 !important;
  }
  .nav__link.nav__parent{
    padding:12px 12px !important;
    white-space:nowrap;
  }
  .nav__caret{display:none !important;} /* tap the label like Merck */
  /* Shared panel becomes full-width dropdown below topbar */
  .nav__panel{
    display:none;
    position:absolute !important;
    left:12px !important;
    right:12px !important;
    width:auto !important;
    top:100% !important;
    margin-top:8px !important;
    border-radius:14px !important;
  }
  .nav__panel.is-open{display:block !important;}
  .nav__panel .nav__mega{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .nav__panel .nav__intro{
    border-right:0 !important;
    padding-right:0 !important;
  }
}

/* Tablets/touch devices: enable click-to-open for the shared panel */
@media (pointer: coarse){
  .nav__caret{display:none !important;}
  .nav__group{cursor:pointer;}
}




/* round113: Merck-like mobile drawer menu (phones) */
@media (max-width: 700px){
  .nav__toggle{display:inline-flex !important;}

  /* Hamburger -> X animation */
  .nav__toggle{
    width:44px;height:44px;
    align-items:center;
    justify-content:center;
    border-radius:10px;
  }
  .nav__toggle span{
    display:block;
    width:20px;height:2px;
    background:currentColor;
    margin:3px 0;
    transition:transform .18s ease, opacity .18s ease;
  }
  .nav.is-open ~ .nav__toggle span{}
  /* when nav is open, morph to X */
  .nav.is-open + .nav__toggle span:nth-child(1),
  .nav.is-open ~ .nav__toggle span:nth-child(1){transform:translateY(5px) rotate(45deg);}
  .nav.is-open + .nav__toggle span:nth-child(2),
  .nav.is-open ~ .nav__toggle span:nth-child(2){opacity:0;}
  .nav.is-open + .nav__toggle span:nth-child(3),
  .nav.is-open ~ .nav__toggle span:nth-child(3){transform:translateY(-5px) rotate(-45deg);}

  /* Full-screen overlay */
  .nav{
    position:fixed !important;
    inset:0 !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:auto !important;
    max-width:none !important;
    margin:0 !important;
    padding: calc(var(--topbar-h, 72px) + 10px) 18px 22px 18px !important;
    background:#0b1f5b;
    color:#fff;
    border:0 !important;
    box-shadow:none !important;
    overflow-y:auto !important;
    transform:translateX(100%);
    transition:transform .22s ease;
    z-index:2000;
    display:block !important;
  }
  .nav.is-open{transform:translateX(0);}

  /* Hide desktop shared panel + indicator inside drawer */
  .nav__panel, .nav__indicator{display:none !important;}

  /* Drawer list styling */
  .nav__group{
    width:100% !important;
    display:block !important;
    padding:0 !important;
    margin:0 !important;
    border-bottom:1px solid rgba(255,255,255,.18) !important;
  }
  .nav__link.nav__parent{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    padding:18px 0 !important;
    color:#fff !important;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    background:transparent !important;
  }

  .nav__caret{
    display:inline-flex !important;
    color:#ff2b7a;
    font-size:18px;
    padding:18px 0 !important;
    background:transparent !important;
    border:0 !important;
  }

  /* Submenu */
  .nav__template{
    display:none;
    padding: 6px 0 18px 0;
  }
  .nav__group.is-open .nav__template{display:block;}
  .nav__template a{
    display:block;
    padding:12px 0;
    color:#fff !important;
    font-size:16px;
    text-transform:none;
    letter-spacing:0;
    opacity:.95;
  }
  .nav__template a.mobile-grand{
    font-weight:700;
    opacity:1;
  }

  /* Contact link in drawer */
  .nav > a.nav__link:not(.nav__parent){
    display:block !important;
    padding:18px 0 !important;
    color:#fff !important;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
}




/* round114: mobile drawer fixes (visible background, toggle works, tap on titles opens) */
@media (max-width: 700px){
  .topbar{z-index:3000 !important;}
  .nav__toggle{z-index:3100 !important; position:relative;}
  .nav__toggle{color:#0b1f5b;} /* bars visible on white header */
  .nav__toggle span{background:currentColor;}
  .nav__toggle.is-open span:nth-child(1){transform:translateY(5px) rotate(45deg);}
  .nav__toggle.is-open span:nth-child(2){opacity:0;}
  .nav__toggle.is-open span:nth-child(3){transform:translateY(-5px) rotate(-45deg);}

  /* Drawer sits below the sticky topbar so the toggle stays clickable */
  .nav{
    top: var(--topbar-h, 72px) !important;
    height: calc(100vh - var(--topbar-h, 72px)) !important;
    padding: 14px 18px 22px 18px !important;
    background:#0b1f5b !important;
    color:#fff !important;
    opacity:1 !important;
    z-index:2000 !important;
  }
}




/* round115: mobile hamburger = 3 lines + proper X state */
@media (max-width: 700px){
  .nav__toggle{
    display:inline-flex !important;
    flex-direction:column;
    gap:5px;
    padding:12px;
  }
  .nav__toggle span{
    width:22px;
    height:2px;
    border-radius:2px;
    background:currentColor;
    display:block;
  }
  /* When menu open -> X */
  .nav.is-open ~ .nav__toggle span:nth-child(1),
  .nav.is-open + .nav__toggle span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }
  .nav.is-open ~ .nav__toggle span:nth-child(2),
  .nav.is-open + .nav__toggle span:nth-child(2){
    opacity:0;
  }
  .nav.is-open ~ .nav__toggle span:nth-child(3),
  .nav.is-open + .nav__toggle span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }
}




/* round116: ensure mobile hamburger is visible and tappable */
@media (max-width: 700px){
  .nav__toggle{
    position:relative;
    z-index:2101;              /* above drawer */
    color:#0b1f5b;             /* visible on light topbar */
  }
  /* if topbar background is dark, switch to white */
  .topbar{background:#fff;}
  .nav.is-open ~ .nav__toggle,
  .nav.is-open + .nav__toggle{
    color:#fff;                /* visible when drawer is dark */
  }
  .nav__toggle span{background:currentColor;}
}




/* round117: clearly visible hamburger (3 blue lines like Merck example) */
@media (max-width:700px){
  .nav__toggle{
    display:inline-flex !important;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:5px;
    width:44px;
    height:44px;
    border:2px solid #0b3a8f;   /* blue outline */
    border-radius:10px;
    background:#ffffff;          /* white button */
    color:#0b3a8f;               /* line color */
  }
  .nav__toggle span{
    width:22px;
    height:2px;
    background:#0b3a8f;          /* blue lines */
    border-radius:2px;
    display:block;
  }

  /* when drawer open -> white lines on dark background */
  .nav.is-open ~ .nav__toggle,
  .nav.is-open + .nav__toggle{
    background:#0b1f5b;
    border-color:#ffffff;
  }
  .nav.is-open ~ .nav__toggle span,
  .nav.is-open + .nav__toggle span{
    background:#ffffff;
  }
}




/* round119: phone drawer uses clickable grand titles (hide separate arrow button) */
@media (max-width:700px){
  .nav__caret{display:none !important;}
  .nav__link.nav__parent::after{
    content:"▾";
    color:#ff2b7a;
    font-size:18px;
    margin-left:12px;
    transform:translateY(-1px);
  }
  .nav__group.is-open .nav__link.nav__parent::after{
    content:"▴";
  }
}




/* round123: phone drawer submenu must push content down (no overlay) */
@media (max-width:700px){
  .nav{display:block !important;}
  .nav__group{display:block !important; position:relative !important;}
  .nav__template{
    position:static !important;
    width:100% !important;
    overflow:visible !important;
  }
  .nav__group.is-open .nav__template{
    display:block !important;
  }
  .nav__template a{
    display:block !important;
  }
}



/* round125: ensure template visible when open (phones) */
@media (max-width:700px){
  .nav__group.is-open .nav__template{display:block !important;}
}


/* round126: phone drawer accordion display rules */
@media (max-width:700px){
  .nav__template{display:none;}
  .nav__group.is-open .nav__template{display:block !important;}
}



/* round127: Astellas-style hamburger icon (3 clean lines) */
@media (max-width:700px){
  .nav__toggle{
    display:flex !important;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:6px;
    width:44px;
    height:44px;
    background:transparent;
    border:none;
    padding:0;
  }

  .nav__toggle span{
    display:block;
    width:26px;
    height:3px;
    background:#0b2a5b; /* pharma navy */
    border-radius:2px;
    transition:transform .25s ease, opacity .25s ease;
  }

  /* morph into X when open */
  .nav.is-open + .nav__toggle span:nth-child(1),
  .nav.is-open ~ .nav__toggle span:nth-child(1){
    transform:translateY(9px) rotate(45deg);
  }
  .nav.is-open + .nav__toggle span:nth-child(2),
  .nav.is-open ~ .nav__toggle span:nth-child(2){
    opacity:0;
  }
  .nav.is-open + .nav__toggle span:nth-child(3),
  .nav.is-open ~ .nav__toggle span:nth-child(3){
    transform:translateY(-9px) rotate(-45deg);
  }
}



/* round128: mobile menu colors aligned with desktop navigation */
@media (max-width:700px){

  /* drawer background matches desktop nav */
  .nav{
    background:#0b1f5b !important; /* desktop navy */
    color:#ffffff;
  }

  /* grand categories */
  .nav__link{
    color:#ffffff !important;
    font-weight:600;
    letter-spacing:.04em;
  }

  /* divider lines */
  .nav__group{
    border-bottom:1px solid rgba(255,255,255,0.2);
  }

  /* submenu links */
  .nav__template a{
    color:#ffffff !important;
    opacity:0.9;
  }

  .nav__template a:hover{
    opacity:1;
  }

  /* active/open grand category highlight */
  .nav__group.is-open > .nav__link{
    color:#ff2b7a !important; /* brand red accent */
  }

  /* hamburger color matches desktop */
  .nav__toggle span{
    background:#0b1f5b;
  }

  .nav.is-open ~ .nav__toggle span,
  .nav.is-open + .nav__toggle span{
    background:#ffffff;
  }
}



/* round129: mobile navigation matches desktop top bar (white background + desktop link style) */
@media (max-width:700px){

  /* mobile drawer background becomes white like desktop nav */
  .nav{
    background:#ffffff !important;
    color:#0b1f5b !important;
  }

  /* grand category links styled like desktop */
  .nav__link{
    color:#0b1f5b !important;
    font-weight:600;
    letter-spacing:.03em;
  }

  /* divider lines subtle like desktop */
  .nav__group{
    border-bottom:1px solid rgba(11,31,91,0.15);
  }

  /* submenu links */
  .nav__template a{
    color:#0b1f5b !important;
    opacity:0.85;
  }

  .nav__template a:hover{
    opacity:1;
  }

  /* active/open grand category highlight */
  .nav__group.is-open > .nav__link{
    color:#d7192d !important; /* brand red */
  }

  /* hamburger icon navy on white background */
  .nav__toggle span{
    background:#0b1f5b !important;
  }

  /* when menu open keep hamburger visible */
  .nav.is-open ~ .nav__toggle span,
  .nav.is-open + .nav__toggle span{
    background:#0b1f5b !important;
  }
}



/* round130: ensure mobile drawer text visible on white background */
@media (max-width:700px){

  /* force correct text colors */
  .nav,
  .nav *{
    color:#0b1f5b !important;   /* pharma navy */
  }

  /* grand categories */
  .nav__link.nav__parent{
    color:#0b1f5b !important;
  }

  /* submenu links */
  .nav__template a{
    color:#0b1f5b !important;
  }

  /* hover / active state */
  .nav__group.is-open > .nav__link{
    color:#d7192d !important; /* brand red */
  }
}



/* round131: mobile drawer fixes (contact visibility + lock background scroll) */
@media (max-width:700px){
  /* Ensure Contact link inherits navy like other links */
  .nav > a.nav__link:not(.nav__parent){
    color:#0b1f5b !important;
  }

  /* When drawer open, prevent background interaction by locking body scroll */
  body.nav-lock{
    overflow:hidden !important;
    height:100vh;
    touch-action:none;
  }
}



/* round132: keep hamburger/X always visible (even when scrolled) */
@media (max-width:700px){
  .nav__toggle{
    position:fixed !important;
    top:14px;
    right:14px;
    z-index:3005 !important; /* above drawer */
    mix-blend-mode:normal;
  }
  /* ensure drawer leaves space for toggle */
  .nav{
    padding-top: 78px !important;
  }
}



/* round134: mobile drawer should be fullscreen and keep topbar/logo visible */
@media (max-width:700px){
  /* keep the topbar visible above the menu */
  .topbar{
    position:fixed !important;
    top:0; left:0; right:0;
    z-index:4000 !important;
    background:#fff;
  }

  /* menu drawer fills the screen under the topbar */
  .nav{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    top:var(--topbar-h, 72px) !important;
    bottom:0 !important;
    height:auto !important;
    max-height:none !important;
    width:auto !important;
    margin:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
    z-index:3500 !important; /* under topbar, over page */
  }

  /* ensure menu toggle is always visible */
  .nav__toggle{
    position:fixed !important;
    top:14px !important;
    right:14px !important;
    z-index:4500 !important; /* above topbar */
  }
}



/* round135: keep header/logo visible and prevent page peek-through when mobile menu is open */
@media (max-width:700px){
  :root{ --mobile-topbar-h: 72px; }

  /* Force topbar to be fixed and always visible */
  .topbar{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:5000 !important;
    background:#ffffff !important;
    transform:none !important;
  }

  /* Ensure page content sits below fixed topbar */
  body{
    padding-top: var(--topbar-h, var(--mobile-topbar-h)) !important;
  }

  /* Drawer covers the whole viewport below the topbar with solid background */
  .nav{
    top: var(--topbar-h, var(--mobile-topbar-h)) !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    border-radius:0 !important;
    background:#ffffff !important;
    z-index:4500 !important;
  }
  .nav.is-open{transform:translateX(0) !important;}

  /* Extra safety: block any transparency */
  .nav, .nav *{ background-color: transparent; }
  .nav{ background-color:#ffffff !important; }

  /* Keep toggle above everything */
  .nav__toggle{
    z-index:5500 !important;
  }

  /* Prevent underlying page from showing through due to iOS rubber-band */
  html, body{ background:#ffffff; }
}



/* round136: ensure phone drawer keeps header visible even on wide phones/landscape */
@media (max-width: 900px) and (hover: none) and (pointer: coarse){
  .topbar{
    position:fixed !important;
    top:0 !important; left:0 !important; right:0 !important;
    width:100% !important;
    z-index:6000 !important;
    background:#fff !important;
    transform:none !important;
  }

  /* Fullscreen drawer under header (solid, no peek-through) */
  .nav{
    position:fixed !important;
    inset:0 !important;
    top:0 !important;
    padding: calc(var(--topbar-h, 72px) + 10px) 18px 22px 18px !important;
    background:#ffffff !important;
    z-index:5000 !important;
    border-radius:0 !important;
  }

  /* Ensure toggle stays above drawer */
  .nav__toggle{
    position:fixed !important;
    top:14px !important;
    right:14px !important;
    z-index:7000 !important;
  }

  /* Always keep page underlay from showing through */
  html, body{ background:#ffffff !important; }
}




}



/* round138: make landscape mobile match portrait mobile (apply touch-phone styles regardless of orientation) */
@media (hover: none) and (pointer: coarse) and (max-width: 1024px){

  /* Keep the same topbar sizing as portrait */
  :root{ --mobile-topbar-h: 72px; }

  .topbar{
    position:fixed !important;
    top:0 !important; left:0 !important; right:0 !important;
    background:#fff !important;
    z-index:5000 !important;
  }

  body{
    padding-top: var(--topbar-h, var(--mobile-topbar-h)) !important;
  }

  /* Mobile drawer always fullscreen under topbar */
  .nav{
    position:fixed !important;
    left:0 !important; right:0 !important;
    top: var(--topbar-h, var(--mobile-topbar-h)) !important;
    bottom:0 !important;
    width:auto !important;
    margin:0 !important;
    border-radius:0 !important;
    background:#fff !important;
    z-index:4500 !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
  }

  /* Toggle always visible */
  .nav__toggle{
    position:fixed !important;
    top:14px !important;
    right:14px !important;
    z-index:5500 !important;
  }

  /* Ensure sections fill screen similarly to portrait even in landscape */
  section[id]{
    min-height: calc(100vh - var(--topbar-h, var(--mobile-topbar-h))) !important;
    scroll-margin-top: calc(var(--topbar-h, var(--mobile-topbar-h)) + 10px) !important;
  }

  /* Tighten overly-wide desktop grids that can appear in landscape */
  .grid-2, .grid-3, .two-col, .three-col{
    grid-template-columns: 1fr !important;
  }

  /* Hero / banner images: keep portrait-like cropping and avoid giant height differences */
  .hero, .hero-banner, .banner, .header-hero{
    min-height: 55vh !important;
  }
  .hero img, .hero-banner img, .banner img, .header-hero img{
    object-fit: cover !important;
    width:100% !important;
    height:100% !important;
  }

  /* Typography spacing consistent */
  .section-inner, .container{
    padding-left:18px !important;
    padding-right:18px !important;
  }
}

/* Extra: small-height landscape phones */
@media (hover:none) and (pointer:coarse) and (max-height: 520px) and (orientation: landscape){
  :root{ --mobile-topbar-h: 64px; }
  .nav__mobile-logo{ height:30px; }
  .nav__toggle{ top:10px !important; right:10px !important; }
  .nav{ padding-bottom:18px !important; }
}



/* round139: touch-phone drawer should NOT be visible by default (portrait + landscape) */
@media (hover: none) and (pointer: coarse) and (max-width: 1024px){
  /* Start hidden off-canvas */
  .nav{
    transform: translateX(105%) !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
  .nav.is-open{
    transform: translateX(0) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}



/* round140: keep topbar/logo visible above mobile drawer + ensure hamburger shows in landscape */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  /* Topbar always above drawer */
  .topbar{
    position:fixed !important;
    top:0 !important; left:0 !important; right:0 !important;
    z-index:6000 !important;
    background:#fff !important;
  }

  /* Drawer sits UNDER the topbar, never covering the logo */
  .nav{
    position:fixed !important;
    top: var(--topbar-h, 72px) !important;
    left:0 !important; right:0 !important; bottom:0 !important;
    z-index:5000 !important;
    background:#fff !important;
  }

  /* Always show hamburger/X on touch phones (portrait + landscape) */
  .nav__toggle{
    display:flex !important;
    position:fixed !important;
    top:14px !important;
    right:14px !important;
    z-index:7000 !important; /* above topbar */
  }
}

/* round140: keep hamburger styling in landscape too (not only max-width:700px) */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  .nav__toggle{
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:6px;
    width:44px;
    height:44px;
    background:transparent;
    border:none;
    padding:0;
  }
  .nav__toggle span{
    display:block;
    width:26px;
    height:3px;
    background:#0b2a5b;
    border-radius:2px;
    transition:transform .25s ease, opacity .25s ease;
  }
  .nav.is-open + .nav__toggle span:nth-child(1),
  .nav.is-open ~ .nav__toggle span:nth-child(1){
    transform:translateY(9px) rotate(45deg);
  }
  .nav.is-open + .nav__toggle span:nth-child(2),
  .nav.is-open ~ .nav__toggle span:nth-child(2){
    opacity:0;
  }
  .nav.is-open + .nav__toggle span:nth-child(3),
  .nav.is-open ~ .nav__toggle span:nth-child(3){
    transform:translateY(-9px) rotate(-45deg);
  }
}



/* round141: lock mobile nav font sizing across orientation (iOS/Android) */
html, body{
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  .nav{
    font-size:16px; /* fixed base so rotation doesn't inflate */
  }
  .nav__link, .nav__template a{
    font-size:16px;
    line-height:1.2;
  }
}

/* round141: landscape menu alignment + stable grand-category rows */
@media (hover:none) and (pointer:coarse) and (max-width:1024px) and (orientation: landscape){
  /* bring items higher / reduce empty space */
  .nav{
    padding-top: 14px !important;
  }
  .nav__group{
    padding:0 !important;
  }
  .nav__link.nav__parent{
    padding: 12px 0 !important;
    min-height: 44px;            /* stable row height */
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
  }
  /* submenu drops below without affecting parent row size */
  .nav__template{
    margin: 0 0 12px 0 !important;
    padding: 2px 0 12px 0 !important;
  }
  .nav__template a{
    padding: 10px 0 !important;
  }
  /* keep open state from changing layout */
  .nav__group.is-open > .nav__link.nav__parent{
    padding: 12px 0 !important;
  }
}



/* round142: force touch-phone (portrait + landscape) to use the SAME drawer layout as portrait (no desktop mega panel) */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){

  /* ensure drawer content starts near the top */
  .nav{
    padding:16px 18px 24px 18px !important;
  }

  /* vertical list like portrait */
  .nav__list{
    display:block !important;
  }

  .nav__group{
    display:block !important;
    border-bottom:1px solid rgba(11,31,91,0.15) !important;
    margin:0 !important;
  }

  /* grand categories: full-width rows, consistent spacing */
  .nav__link.nav__parent,
  .nav > a.nav__link:not(.nav__parent){
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    padding:16px 0 !important;
    margin:0 !important;
  }

  /* kill any desktop mega panel UI on touch */
  .nav__panel,
  .nav__mega,
  .nav__cards,
  .nav__desc,
  .nav__col,
  .nav__cols{
    display:none !important;
  }

  /* submenu should push content down (accordion) */
  .nav__template{
    position:static !important;
    width:100% !important;
    margin:0 0 14px 0 !important;
    padding:4px 0 12px 0 !important;
  }

  .nav__template a{
    display:block !important;
    padding:12px 0 !important;
  }

  /* arrows: keep them aligned and consistent */
  .nav__link.nav__parent::after{
    content:"▾";
    color:#d7192d;
    font-size:16px;
    margin-left:12px;
  }
  .nav__group.is-open > .nav__link.nav__parent::after{
    content:"▴";
  }
}

/* round142: landscape-specific tweaks to avoid "too low" placement */
@media (hover:none) and (pointer:coarse) and (max-width:1024px) and (orientation: landscape){
  .nav{
    padding-top:12px !important;
  }
}



/* round143: ensure landscape menu matches portrait + prevent background scrolling behind drawer */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  /* Ensure nav list starts at the top of drawer (no vertical centering) */
  .nav{
    display:block !important;
    justify-content:flex-start !important;
    align-content:flex-start !important;
    padding-top: 16px !important;
  }
  .nav__list{
    margin-top:0 !important;
  }

  /* Make menu visually consistent: same typography & spacing as portrait */
  .nav__link{
    font-weight:700 !important;
    letter-spacing:.06em !important;
    text-transform:uppercase !important;
  }
  .nav__template a{
    font-weight:600 !important;
    letter-spacing:0 !important;
    text-transform:none !important;
  }
}

/* Lock background scrolling when menu open (touch phones incl. landscape) */
html.nav-lock, body.nav-lock{
  overflow:hidden !important;
  height:100% !important;
}



/* round144: bulletproof scroll lock + make landscape identical to portrait for menu typography */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  /* stop iOS overscroll chaining to body */
  .nav{
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  html.nav-lock, body.nav-lock{
    overflow:hidden !important;
    position:relative !important;
    height:100% !important;
  }

  /* Force identical styling in portrait & landscape */
  .nav__link.nav__parent,
  .nav > a.nav__link:not(.nav__parent){
    font-size:16px !important;
    font-weight:700 !important;
    letter-spacing:.06em !important;
    text-transform:uppercase !important;
    color:#0b1f5b !important;
  }

  .nav__template a{
    font-size:16px !important;
    font-weight:600 !important;
    text-transform:none !important;
    color:#0b1f5b !important;
  }
}



/* round145: backdrop + bulletproof lock + consistent active red highlight (portrait+landscape) */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  .nav__backdrop{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.0);
    z-index:4400; /* below nav (4500) and topbar (6000) */
    display:none;
  }
  .nav__backdrop.is-active{ display:block; }

  html.nav-lock, body.nav-lock{
    overflow:hidden !important;
    overscroll-behavior:none !important;
  }

  /* Active/open grand category highlight like portrait */
  .nav__group.is-open > .nav__link.nav__parent{
    color:#d7192d !important;
  }
  .nav__group.is-open > .nav__link.nav__parent::after{
    color:#d7192d !important;
  }

  /* Ensure menu itself scrolls */
  .nav{ overflow-y:auto !important; }
}



/* round146: lock background page scroll when mobile menu is open (portrait + landscape) */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  html.nav-open, body.nav-open{
    overflow:hidden !important;
    height:100% !important;
    overscroll-behavior:none !important;
  }
  body.nav-open{
    position:fixed !important;
    width:100% !important;
  }

  /* prevent scroll chaining / rubber band from leaking to page */
  .nav{
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  .nav__backdrop{
    touch-action: none;
  }

  /* hide desktop underline/indicator on touch to match portrait */
  .nav__indicator{display:none !important;}
}



/* round149: scroll lock via nav-open only */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  html.nav-open, body.nav-open{
    overflow:hidden !important;
    height:100% !important;
    overscroll-behavior:none !important;
  }
}


/* round149: neutralize legacy nav-lock if present */
html.nav-lock, body.nav-lock{ overflow:visible !important; height:auto !important; }


/* round150: ensure scroll unlock when nav-open removed */
@media (hover:none) and (pointer:coarse) and (max-width:1024px){
  body{ position:static; }
  body.nav-open{ position:fixed !important; }
}