/* ============================================================
   Starkey brand skin — scoped to .starkey-skin only.
   Source: docs/design-starkey.md (observed from www.starkey.com)
   + official brand-kit colours.txt (Denim / Shark / Sun / Dove Gray).
   Clean white canvas, oversized humanist headlines, confident Starkey
   Blue accent, charcoal dark bands, a touch of gold "Sun" for highlight
   chips, fully-rounded PILL buttons. Sits below the Wickersley header/footer.
   ============================================================ */
.starkey-skin{
  --sk-white:#fff; --sk-surface:#F4F4F4; --sk-edge:#E7E7E8;
  --sk-ink:#1A1C1E; --sk-ink2:#4A4A4A; --sk-shark:#202326;
  --sk-blue:#127ABA; --sk-blue-deep:#004D7E; --sk-blue-bright:#00A1E0;
  --sk-gold:#FDB913;
  background:var(--sk-white);
  font-family:"Source Sans 3","Mulish",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--sk-ink);
}
.starkey-skin .container{max-width:1280px;}
.starkey-skin .section{background:transparent;padding:clamp(4rem,8vw,7.5rem) 0;}

/* Typography — bold humanist heroes, light section heads, sentence case */
.starkey-skin h1,.starkey-skin h2,.starkey-skin h3,.starkey-skin .modeltag{font-family:"Source Sans 3","Mulish",sans-serif;color:var(--sk-ink);letter-spacing:normal;}
.starkey-skin h1{font-weight:800;font-size:clamp(2.8rem,6vw,4.6rem);line-height:1.08;}
.starkey-skin h2{font-weight:300;font-size:clamp(2rem,4vw,3rem);line-height:1.2;}
.starkey-skin h3{font-weight:500;font-size:1.2rem;}
.starkey-skin p,.starkey-skin .lead{color:var(--sk-ink2);}
.starkey-skin .lead{font-size:1.08rem;font-weight:400;}

/* Hero (inner pages using the simple pagehero) */
.starkey-skin .pagehero{background:var(--sk-white);color:var(--sk-ink);padding:clamp(3.5rem,7vw,6rem) 0;border-bottom:1px solid var(--sk-edge);}
.starkey-skin .pagehero::before{display:none;}
.starkey-skin .pagehero h1{color:var(--sk-ink);font-weight:800;}
.starkey-skin .pagehero p.sub{color:var(--sk-ink2);}
.starkey-skin .crumbs{color:#8a8d90;}
.starkey-skin .crumbs a{color:var(--sk-ink);}
.starkey-skin .eyebrow{background:transparent!important;color:var(--sk-blue)!important;border:none;box-shadow:none;padding:0;margin-bottom:20px;letter-spacing:.1em;font-size:.78rem;text-transform:uppercase;font-weight:700;}
.starkey-skin .eyebrow img{filter:none!important;height:16px!important;}

/* Buttons — fully-rounded PILLS, blue primary, blue-outline ghost */
.starkey-skin .btn{border-radius:999px;box-shadow:none!important;font-family:"Source Sans 3","Mulish",sans-serif;font-weight:500;letter-spacing:.01em;text-transform:none;transition:.18s ease;}
.starkey-skin .btn-cta{background:var(--sk-blue);color:#fff;border:2px solid var(--sk-blue);}
.starkey-skin .btn-cta:hover{background:var(--sk-blue-deep);border-color:var(--sk-blue-deep);color:#fff;transform:none;}
.starkey-skin .btn-outline{background:transparent;border:2px solid var(--sk-blue);color:var(--sk-blue);}
.starkey-skin .btn-outline:hover{background:var(--sk-blue);color:#fff;transform:none;}
.starkey-skin .btn-lg{padding:15px 30px;font-size:1rem;}
.starkey-skin .floatbook{display:none;}

/* Simple surfaces (intro + feature tiles) — clean, modest round */
.starkey-skin .pf,.starkey-skin .ft{background:var(--sk-surface);border:1px solid var(--sk-edge);border-radius:16px;box-shadow:none;}
.starkey-skin .pf{border-top:none;}
.starkey-skin .pf h3,.starkey-skin .ft b{color:var(--sk-ink);}
.starkey-skin .ft .ic{background:#fff;color:var(--sk-blue);border-radius:50%;}
.starkey-skin .ft .ic svg{color:var(--sk-blue);}
.starkey-skin .ft span{color:var(--sk-ink2);}

/* CTA band — confident Starkey blue */
.starkey-skin .ctaband{background:linear-gradient(120deg,var(--sk-blue),var(--sk-blue-deep));}
.starkey-skin .ctaband h2{color:#fff;}
.starkey-skin .ctaband p{color:#d8ecf8;}
.starkey-skin .ctaband .btn-cta{background:#fff;color:var(--sk-blue-deep);border-color:#fff;}
.starkey-skin .ctaband .btn-cta:hover{background:var(--sk-gold);color:var(--sk-shark);border-color:var(--sk-gold);}
.starkey-skin .ctaband .btn-outline{border-color:rgba(255,255,255,.85);color:#fff;}
.starkey-skin .ctaband .btn-outline:hover{background:#fff;color:var(--sk-blue-deep);}

  /* ===================== Immersive brand-landing components (Starkey) ===================== */
  /* Full-bleed hero — bright corporate-confident, light scrim, dark ink text */
  .starkey-skin .pk-hero{position:relative;min-height:clamp(460px,62vh,620px);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--sk-ink);overflow:hidden;background:linear-gradient(160deg,#f6f9fb 0%,#dfe9ef 75%);}
  .starkey-skin .pk-hero .bg{position:absolute;inset:0;z-index:0;}
  .starkey-skin .pk-hero .bg img,.starkey-skin .pk-hero .bg video{width:100%;height:100%;object-fit:cover;display:block;}
  .starkey-skin .pk-hero .bg.noimg img,.starkey-skin .pk-hero .bg.noimg video{display:none;}
  .starkey-skin .pk-hero .scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,.78));}
  .starkey-skin .pk-hero .inner{position:relative;z-index:2;max-width:860px;padding:60px 48px;background:rgba(255,255,255,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:24px;border:1px solid rgba(0,0,0,.06);}
  .starkey-skin .pk-hero .eyebrow{color:var(--sk-blue)!important;justify-content:center;display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.95)!important;padding:7px 16px 7px 10px!important;border-radius:999px!important;box-shadow:0 6px 18px rgba(0,0,0,.14)!important;border:none!important;margin-bottom:22px!important;}
  .starkey-skin .pk-hero .eyebrow img{filter:none!important;height:18px!important;width:auto!important;}
  .starkey-skin .pk-hero h1{color:var(--sk-ink);font-weight:800;font-size:clamp(2.7rem,6vw,4.6rem);line-height:1.08;margin:0 0 14px;}
  .starkey-skin .pk-hero .tagline{font-family:"Source Sans 3","Mulish",sans-serif;font-weight:600;font-size:clamp(1.3rem,3vw,2rem);color:var(--sk-blue);margin:0 0 16px;}
  .starkey-skin .pk-hero p.sub{color:var(--sk-ink2);max-width:62ch;margin:0 auto 26px;font-size:1.1rem;}
  .starkey-skin .pk-hero .cta-row{justify-content:center;}
  .starkey-skin .pk-hero .btn-cta{background:var(--sk-blue);color:#fff;border-color:var(--sk-blue);}
  .starkey-skin .pk-hero .btn-cta:hover{background:var(--sk-blue-deep);border-color:var(--sk-blue-deep);}
  .starkey-skin .pk-hero .btn-outline{background:transparent;border-color:var(--sk-ink);color:var(--sk-ink);}
  .starkey-skin .pk-hero .btn-outline:hover{background:var(--sk-ink);color:#fff;}
  .starkey-skin .pk-hero .phslot{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;}
  .starkey-skin .pk-hero .phslot small{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.72rem;background:rgba(0,0,0,.05);border:1px dashed rgba(0,0,0,.25);padding:4px 10px;color:#8a8d90;}

  /* Quick-nav row — white circles, blue icon accent */
  .starkey-skin .pk-quicknav{display:flex;justify-content:center;gap:clamp(22px,5vw,68px);flex-wrap:wrap;padding:38px 24px;background:var(--sk-white);border-bottom:1px solid var(--sk-edge);}
  .starkey-skin .pk-quicknav a{display:flex;flex-direction:column;align-items:center;gap:11px;color:var(--sk-ink);font-weight:600;font-size:.9rem;text-decoration:none;text-align:center;line-height:1.25;}
  .starkey-skin .pk-quicknav .circle{width:76px;height:76px;border-radius:50%;background:var(--sk-surface);border:1px solid var(--sk-edge);display:flex;align-items:center;justify-content:center;transition:.18s ease;}
  .starkey-skin .pk-quicknav a:hover .circle{transform:translateY(-3px);border-color:var(--sk-blue);}
  .starkey-skin .pk-quicknav .circle svg{width:34px;height:34px;color:var(--sk-blue);}

  /* Generic split */
  .starkey-skin .pk-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,60px);align-items:center;}
  .starkey-skin .pk-split.alt .copy{order:2;}
  .starkey-skin .pk-bullets{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:15px;}
  .starkey-skin .pk-bullets li{display:flex;gap:12px;align-items:flex-start;color:var(--sk-ink2);font-size:1.02rem;line-height:1.55;}
  .starkey-skin .pk-bullets li .dot{width:22px;height:22px;border-radius:50%;background:var(--sk-blue);flex:none;margin-top:2px;display:flex;align-items:center;justify-content:center;}
  .starkey-skin .pk-bullets li .dot svg{width:13px;height:13px;color:#fff;}
  .starkey-skin .pk-bullets li strong{color:var(--sk-ink);}

  /* Product media block + placeholder */
  .starkey-skin .pk-media{position:relative;border-radius:18px;overflow:hidden;min-height:380px;display:flex;align-items:center;justify-content:center;background:var(--sk-surface);border:1px solid var(--sk-edge);}
  .starkey-skin .pk-media.dark{background:linear-gradient(150deg,#2c3438,var(--sk-shark));border-color:transparent;}
  .starkey-skin .pk-media img.pk-prodimg{max-width:82%;max-height:340px;object-fit:contain;filter:drop-shadow(0 16px 28px rgba(0,0,0,.18));}
  .starkey-skin .pk-media .phslot{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;padding:16px;}
  .starkey-skin .pk-media .phslot img{height:28px;opacity:.45;}
  .starkey-skin .pk-media.dark .phslot img{filter:brightness(0) invert(1);opacity:.6;}
  .starkey-skin .pk-media .phslot small{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.68rem;background:#fff;border:1px dashed var(--sk-edge);padding:3px 8px;color:#8a8d90;}
  .starkey-skin .pk-media.dark .phslot small{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3);color:#dbe7ee;}
  .starkey-skin .pk-media.noimg img.pk-prodimg{display:none;}
  .starkey-skin .pk-media:not(.noimg) .phslot{display:none;}

  /* Product section bands */
  .starkey-skin .pk-prod{padding:clamp(3.5rem,7vw,6.5rem) 0;}
  .starkey-skin .pk-prod.band{background:var(--sk-surface);}
  .starkey-skin .pk-prod.dark{background:linear-gradient(160deg,#2c3438,var(--sk-shark));}
  .starkey-skin .pk-prod.dark h2,.starkey-skin .pk-prod.dark .lead{color:#fff;}
  .starkey-skin .pk-prod.dark p{color:#cfd6da;}
  .starkey-skin .pk-prod .modeltag{display:inline-block;background:transparent;color:var(--sk-blue);font-weight:700;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;padding:0;margin-bottom:12px;}
  .starkey-skin .pk-prod.dark .modeltag{color:var(--sk-gold);}
  .starkey-skin .pk-prod h2{margin:0 0 14px;}
  .starkey-skin .pk-prod .pk-spec{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0 22px;}
  .starkey-skin .pk-prod .pk-spec span{display:inline-flex;align-items:center;gap:7px;background:var(--sk-surface);border:1px solid var(--sk-edge);color:var(--sk-ink);border-radius:999px;font-weight:600;font-size:.8rem;padding:7px 14px;}
  .starkey-skin .pk-prod.dark .pk-spec span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#fff;}
  .starkey-skin .pk-prod .pk-spec span svg{width:15px;height:15px;color:var(--sk-blue);}
  .starkey-skin .pk-prod.dark .pk-spec span svg{color:var(--sk-gold);}
  .starkey-skin .pk-prod.dark .pk-media.dark{background:linear-gradient(150deg,#3a4448,var(--sk-shark));}
  .starkey-skin .pk-prod.dark .subchips span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#fff;}
  .starkey-skin .subchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
  .starkey-skin .subchips span{font-size:.74rem;font-weight:700;color:var(--sk-ink);background:var(--sk-surface);border:1px solid var(--sk-edge);padding:6px 14px;border-radius:999px;}

  @media (max-width:900px){
    .starkey-skin .pk-split{grid-template-columns:1fr;gap:26px;}
    .starkey-skin .pk-split.alt .copy{order:0;}
    .starkey-skin .pk-media{min-height:280px;}
  }