/* 베이비빌리 광고센터 — 공통 스타일 */

/* fonts/ 폴더가 없으면 CDN 사본으로 넘어간다 */
@font-face{ font-family:"Pretendard"; font-weight:400; font-style:normal; font-display:swap; src:url("../fonts/Pretendard-Regular.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/static/woff2/Pretendard-Regular.woff2") format("woff2"); }
@font-face{ font-family:"Pretendard"; font-weight:500; font-style:normal; font-display:swap; src:url("../fonts/Pretendard-Medium.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/static/woff2/Pretendard-Medium.woff2") format("woff2"); }
@font-face{ font-family:"Pretendard"; font-weight:600; font-style:normal; font-display:swap; src:url("../fonts/Pretendard-SemiBold.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/static/woff2/Pretendard-SemiBold.woff2") format("woff2"); }
@font-face{ font-family:"Pretendard"; font-weight:700; font-style:normal; font-display:swap; src:url("../fonts/Pretendard-Bold.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/static/woff2/Pretendard-Bold.woff2") format("woff2"); }
@font-face{ font-family:"Pretendard"; font-weight:800; font-style:normal; font-display:swap; src:url("../fonts/Pretendard-ExtraBold.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/static/woff2/Pretendard-ExtraBold.woff2") format("woff2"); }

:root{
  /* brand palette — fixed to these 4 hex values only */
  --brand:#2D7CD2;       /* 기본 블루 — Billy Blue 900 (공식 디자인 시스템) */
  --brand-light:#EAF1F8; /* 라이트 블루 */
  --warm-light:#FFEBE0;  /* 웜 라이트 */
  --warm-dark:#905737;   /* 웜 다크 */

  /* 텍스트/버튼용 블루 — #2D7CD2는 흰 글씨 대비 4.26:1로 AA 미달이라 살짝 어둡게 (흰색 5.28:1, 라이트블루 위 4.64:1) */
  --brand-strong:#296DB8;

  --bg:#FFFFFF;
  --surface:#FFFFFF;
  --surface-alt:var(--brand-light);
  --ink:#1B2430;         /* 본문 — 흰색 15.6:1 */
  --muted:#55697E;       /* 보조 텍스트 — 흰색 5.66:1, 라이트블루 4.97:1 */
  --accent:var(--brand-strong);
  --accent-ink:var(--brand-strong);
  --accent-2:var(--brand-strong);
  --accent-2-soft:var(--brand-light);
  --on-accent:#FFFFFF;   /* accent 배경 위 글자 */
  --border:color-mix(in srgb, var(--brand) 20%, white);
  --rail:color-mix(in srgb, var(--brand) 28%, white);
  --hero-1:#1F4C82;
  --hero-2:var(--brand);
  --shadow: 0 3px 17px 6px rgba(0,0,0,.15); /* 공식 디자인 시스템 Shadow L */
  color-scheme: light;

  /* type scale — BabyBilly Web Design System (Pretendard) */
  --fs-h1:24px;   --lh-h1:1.4;   /* Headline1 · Bold */
  --fs-h2:21px;   --lh-h2:1.4;   /* Headline2 · Regular/Bold */
  --fs-h3:17px;   --lh-h3:1.4;   /* Headline3 · Regular/Bold */
  --fs-sub1:13px; --lh-sub1:1.3; /* Subtitle1 */
  --fs-sub2:11px; --lh-sub2:1.2; /* Subtitle2 */
  --fs-body1:17px;--lh-body1:1.6;/* Body text1 */
  --fs-body2:14px;--lh-body2:1.6;/* Body text2 */
  --fs-overline:13px; --lh-overline:1.4; /* Overline · Regular */
  --fs-caption:11px; --lh-caption:1.4;   /* Caption — 8px는 웹에서 판독 불가라 11px로 */

  /* button — BabyBilly Web Design System */
  --btn-lg-h:44px; --btn-lg-radius:24px; --btn-lg-pad:12px 13px 12px 18px; --btn-lg-gap:10px;
  --btn-md-h:28px; --btn-md-radius:17px; --btn-md-pad:4px 8px 4px 14px;  --btn-md-gap:10px;
  --btn-sm-h:24px; --btn-sm-radius:17px; --btn-sm-pad:4px 4px 3px 10px;  --btn-sm-gap:10px;
}
/* warm section theme — swap the active ink/surface pair to the peach + brown combo */
.theme-warm{
  --ink:var(--warm-dark);
  --muted:#7C5A44;       /* 흰색 6.17:1, 웜라이트 5.35:1 */
  --surface-alt:var(--warm-light);
  --accent:var(--warm-dark);
  --accent-ink:var(--warm-dark);
  --accent-2:var(--warm-dark);
  --accent-2-soft:var(--warm-light);
  --border:color-mix(in srgb, var(--warm-dark) 22%, white);
  --rail:color-mix(in srgb, var(--warm-dark) 30%, white);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0E1A26; --surface:#132537; --surface-alt:#173049; --ink:#D9E7F5; --muted:#93ABC4;
    --accent:#6FA3DE; --accent-ink:#D9E7F5; --accent-2:#6FA3DE; --accent-2-soft:#1E3A54; --on-accent:#0E1A26;
    --border:#254764; --rail:#2C5170;
    --hero-1:#12233A; --hero-2:#1F4C82;
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 28px -12px rgba(0,0,0,.5);
    color-scheme: dark;
  }
  .theme-warm{
    --ink:#EBD3C2; --muted:#C9A78E; --surface-alt:#3A2318;
    --accent:#D3A583; --accent-ink:#EBD3C2; --accent-2:#D3A583; --accent-2-soft:#3A2318; --on-accent:#2A1810;
    --border:#4A2E20; --rail:#5A3A28;
  }
}
:root[data-theme="dark"]{
  --bg:#0E1A26; --surface:#132537; --surface-alt:#173049; --ink:#D9E7F5; --muted:#93ABC4;
  --accent:#6FA3DE; --accent-ink:#D9E7F5; --accent-2:#6FA3DE; --accent-2-soft:#1E3A54; --on-accent:#0E1A26;
  --border:#254764; --rail:#2C5170;
  --hero-1:#12233A; --hero-2:#1F4C82;
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 28px -12px rgba(0,0,0,.5);
  color-scheme: dark;
}
:root[data-theme="dark"] .theme-warm{
  --ink:#EBD3C2; --muted:#C9A78E; --surface-alt:#3A2318;
  --accent:#D3A583; --accent-ink:#EBD3C2; --accent-2:#D3A583; --accent-2-soft:#3A2318; --on-accent:#2A1810;
  --border:#4A2E20; --rail:#5A3A28;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--bg); color:var(--ink);
  font-family:"Pretendard","Apple SD Gothic Neo",-apple-system,sans-serif;
  font-variant-numeric:tabular-nums;
  font-size:var(--fs-body2); line-height:var(--lh-body2); -webkit-font-smoothing:antialiased;
  word-break:keep-all; overflow-wrap:break-word;
}
img{ max-width:100%; }
[hidden]{ display:none !important; }
::selection{ background:var(--accent); color:var(--on-accent); }
a{ color:inherit; }
h1,h2,h3{ text-wrap:balance; margin:0; letter-spacing:-.01em; font-weight:700; }
h1{ font-size:var(--fs-h1); line-height:var(--lh-h1); }
h2{ font-size:var(--fs-h2); line-height:var(--lh-h2); }
h3{ font-size:var(--fs-h3); line-height:var(--lh-h3); }
.subtitle1{ font-size:var(--fs-sub1); line-height:var(--lh-sub1); }
.subtitle2{ font-size:var(--fs-sub2); line-height:var(--lh-sub2); }
.body1{ font-size:var(--fs-body1); line-height:var(--lh-body1); }
.body2{ font-size:var(--fs-body2); line-height:var(--lh-body2); }
.caption{ font-size:var(--fs-caption); line-height:var(--lh-caption); }
.num{ font-variant-numeric:tabular-nums; font-weight:600; }
.wrap{ max-width:1040px; margin:0 auto; padding:0 28px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:var(--fs-overline); line-height:var(--lh-overline); font-weight:400;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-2);
}
.eyebrow::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--accent); flex:none; }

/* nav */
header.site-header{
  position:sticky; top:0; z-index:30;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.navrow{ display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1040px; margin:0 auto; gap:20px; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:18.5px; text-decoration:none; flex:none; color:var(--ink); }
.brand .mark-wrap{
  width:34px; height:34px; border-radius:10px; flex:none;
  background:#fff; border:1px solid var(--border); box-shadow:var(--shadow);
  display:flex; align-items:center; justify-content:center; padding:5px;
}
.brand .mark{ width:100%; height:100%; object-fit:contain; display:block; }
nav.links{ display:flex; gap:6px; font-size:var(--fs-sub1); line-height:var(--lh-sub1); color:var(--ink); flex:1; }
.navitem{ position:relative; }
.navitem > a, .navitem > button.navtrigger{
  display:flex; align-items:center; gap:5px;
  background:none; border:none; font:inherit; color:var(--ink); cursor:pointer;
  padding:10px 10px; border-radius:8px; text-decoration:none;
}
.navitem > a:hover, .navitem > button.navtrigger:hover{ color:var(--accent-2); background:var(--surface-alt); }
.navitem.active > a{ color:var(--accent-2); font-weight:600; }
.navtrigger .chev{ font-size:10px; transition:transform .15s ease; }
.navitem[data-open="true"] .navtrigger .chev{ transform:rotate(180deg); }
.dropdown{
  position:absolute; top:calc(100% + 6px); left:0; min-width:230px;
  background:var(--surface); border:1px solid var(--border); border-radius:12px;
  box-shadow:var(--shadow); padding:8px; display:none; flex-direction:column; gap:2px;
}
.navitem[data-open="true"] .dropdown{ display:flex; }
.dropdown a{
  display:block; padding:10px 12px; border-radius:8px; font-size:var(--fs-sub1); line-height:var(--lh-sub1); color:var(--ink); text-decoration:none;
}
.dropdown a:hover{ background:var(--surface-alt); }
.dropdown a.active{ background:var(--surface-alt); font-weight:600; }
.dropdown a .sub{ display:block; font-size:var(--fs-sub2); line-height:var(--lh-sub2); color:var(--muted); margin-top:2px; }

/* button — BabyBilly Web Design System: 3 styles (primary / line / secondary) x 3 sizes (lg/md/sm) */
.cta{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--btn-lg-gap);
  background:var(--accent); color:var(--on-accent); border:1.5px solid transparent;
  padding:var(--btn-lg-pad); height:var(--btn-lg-h); border-radius:var(--btn-lg-radius);
  font-weight:600; font-size:var(--fs-sub1); line-height:var(--lh-sub1);
  text-decoration:none; cursor:pointer; box-shadow:var(--shadow);
  transition:transform .15s ease;
}
.cta:hover{ transform:translateY(-1px); }
.cta.ghost{ background:transparent; color:var(--ink); box-shadow:none; border:1.5px solid var(--border); }
.cta.secondary{ background:#252B33; color:#fff; box-shadow:none; border-color:transparent; } /* grayscale 800/900 variant */
.cta.md{ height:var(--btn-md-h); padding:var(--btn-md-pad); border-radius:var(--btn-md-radius); gap:var(--btn-md-gap); font-size:var(--fs-sub2); line-height:var(--lh-sub2); }
.cta.sm{ height:var(--btn-sm-h); padding:var(--btn-sm-pad); border-radius:var(--btn-sm-radius); gap:var(--btn-sm-gap); font-size:var(--fs-sub2); line-height:var(--lh-sub2); }
.cta:focus-visible, a:focus-visible, button:focus-visible, summary:focus-visible{
  outline:2px solid var(--accent-2); outline-offset:2px;
}
.navcta{ display:flex; gap:10px; align-items:center; flex:none; }

.hamburger{
  display:none; flex:none; width:38px; height:38px; align-items:center; justify-content:center;
  background:none; border:1px solid var(--border); border-radius:8px; cursor:pointer; font-size:18px; color:var(--ink);
}
@media (max-width:860px){
  .navrow{ flex-wrap:wrap; padding:14px 16px; }
  .hamburger{ display:flex; }
  .navcta .cta{ padding:8px 14px; height:36px; font-size:13px; }
  nav.links{
    display:none; flex-direction:column; width:100%; order:10; flex:none;
    padding-top:14px; margin-top:14px; border-top:1px solid var(--border); gap:2px;
  }
  .navrow.mobile-open nav.links{ display:flex; }
  .navitem{ width:100%; }
  .navitem > a, .navitem > button.navtrigger{ width:100%; padding:12px 10px; font-size:15px; justify-content:space-between; }
  .dropdown{ position:static; box-shadow:none; border:none; padding:2px 0 6px 14px; min-width:0; background:none; }
}

/* page header (subpages) */
.page-header{ padding:64px 0 40px; border-bottom:1px solid var(--border); }
.page-header .crumb{ font-size:13px; color:var(--muted); margin-bottom:14px; }
.page-header .crumb a{ text-decoration:none; }
.page-header .crumb a:hover{ color:var(--ink); }
.page-header h1{ font-size:var(--fs-h1); line-height:var(--lh-h1); margin-top:10px; }
.page-header p{ color:var(--muted); font-size:var(--fs-body1); line-height:var(--lh-body1); max-width:56ch; margin:14px 0 0; }

section{ padding:64px 0; }
.section-head{ max-width:56ch; margin-bottom:40px; }
.section-head h2{ font-size:var(--fs-h2); line-height:var(--lh-h2); margin-top:14px; }
.section-head p{ color:var(--muted); font-size:var(--fs-body2); line-height:var(--lh-body2); margin:12px 0 0; }

/* cards / chips (shared) */
.chip-grid{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{ font-size:var(--fs-sub1); padding:10px 16px; border-radius:11px; background:var(--surface-alt); border:1px solid var(--border); color:var(--ink); }
#industries .chip{ border-radius:999px; background:var(--bg); box-shadow:0 6px 14px -6px rgba(0,0,0,.18); }
.chip.more{ color:var(--muted); }

/* faq */
.faq{ border-top:1px solid var(--border); }
details{ border-bottom:1px solid var(--border); padding:20px 0; }
summary{ cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; font-weight:700; font-size:var(--fs-h3); line-height:var(--lh-h3); }
summary::-webkit-details-marker{ display:none; }
summary::after{ content:"+"; font-size:20px; color:var(--accent-2); flex:none; transition:transform .2s ease; }
details[open] summary::after{ transform:rotate(45deg); }
details p{ margin:14px 0 0; color:var(--muted); font-size:var(--fs-body2); line-height:var(--lh-body2); max-width:64ch; }

/* promo callout (shared across pages) */
.promo{ background:var(--surface-alt); border:1px solid var(--border); border-radius:18px; padding:24px 28px; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.promo b{ display:block; font-size:var(--fs-h3); line-height:var(--lh-h3); }
.promo span{ display:block; font-size:var(--fs-body2); line-height:var(--lh-body2); color:var(--muted); margin-top:6px; }

/* insight article */
.article-header{ padding:56px 0 32px; border-bottom:1px solid var(--border); }
.article-header .tag{ font-size:var(--fs-sub2); line-height:var(--lh-sub2); font-weight:700; color:var(--accent-2); text-transform:uppercase; letter-spacing:.06em; }
.article-header h1{ font-size:var(--fs-h1); line-height:var(--lh-h1); margin-top:12px; }
.article-header .meta{ font-size:var(--fs-sub1); line-height:var(--lh-sub1); color:var(--muted); margin-top:14px; }
.article-body{ max-width:68ch; margin:0 auto; padding:48px 0 40px; font-size:var(--fs-body1); line-height:1.85; color:var(--ink); }
.article-body p{ margin:0 0 1.4em; }
.article-body h2{ font-size:var(--fs-h3); line-height:var(--lh-h3); margin:1.8em 0 .6em; }
.article-body .callout{ background:var(--surface-alt); border:1px solid var(--border); border-radius:14px; padding:18px 22px; font-size:var(--fs-body2); line-height:var(--lh-body2); color:var(--muted); margin:2em 0; }
.article-nav{ max-width:68ch; margin:0 auto; display:flex; justify-content:space-between; padding:24px 28px 64px; border-top:1px solid var(--border); font-size:var(--fs-sub1); line-height:var(--lh-sub1); }
.article-nav a{ text-decoration:none; color:var(--accent-2); font-weight:600; }

footer.site-footer{ border-top:1px solid var(--border); padding:32px 0; }
.footrow{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; font-size:var(--fs-sub1); line-height:var(--lh-sub1); color:var(--muted); }
.footrow .steps{ display:flex; gap:14px; flex-wrap:wrap; }
.footrow nav{ display:flex; gap:16px; flex-wrap:wrap; }
.footrow nav a{ text-decoration:none; }
.footrow nav a:hover{ color:var(--ink); }

/* insight reports (lead-gen) */
.report-cover{
  position:relative; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden;
  background:linear-gradient(155deg, var(--brand-strong) 0%, #1F4C82 100%); color:#fff; border-radius:16px; padding:22px 22px 20px;
}
.report-cover::after{ content:""; position:absolute; right:-40px; bottom:-40px; width:150px; height:150px; border-radius:50%; background:rgba(255,255,255,.12); }
.report-cover .rc-label{ font-size:11.5px; font-weight:700; letter-spacing:.08em; opacity:.9; }
.report-cover .rc-year{ font-size:38px; font-weight:800; line-height:1; margin-top:10px; }
.report-cover .rc-title{ position:relative; z-index:1; font-size:17px; font-weight:700; line-height:1.4; margin-top:18px; }
.report-card{ display:flex; flex-direction:column; gap:14px; background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:14px 14px 20px; text-decoration:none; color:inherit; transition:transform .15s ease, box-shadow .15s ease; }
.report-card:hover{ transform:translateY(-2px); box-shadow:var(--shadow); }
.report-card .report-cover{ min-height:190px; }
.report-card .rc-body{ padding:0 8px; }
.report-card .rc-tag{ font-size:11.5px; font-weight:700; color:var(--accent-2); }
.report-card h3{ font-size:var(--fs-h3); line-height:var(--lh-h3); margin:6px 0 6px; color:var(--ink); }
.report-card p{ font-size:13.5px; color:var(--ink); margin:0; }
.report-card .rc-more{ display:inline-block; margin-top:14px; font-size:13.5px; font-weight:600; color:var(--accent-2); }
.soon-box{ margin-top:36px; background:var(--surface-alt); border:1px solid var(--border); border-radius:16px; padding:22px 24px; }
.soon-box b{ display:block; font-size:15px; color:var(--ink); margin-bottom:6px; }
.soon-box p{ font-size:13px; color:var(--ink); margin:0 0 12px; }
.soon-box ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.soon-box li{ font-size:12.5px; color:var(--ink); background:var(--bg); border:1px solid var(--border); border-radius:999px; padding:6px 12px; }
.report-layout{ display:grid; grid-template-columns:1fr 320px; gap:48px; align-items:start; padding:48px 28px 64px; }
.report-main h2{ font-size:var(--fs-h3); line-height:var(--lh-h3); margin:1.8em 0 .7em; color:var(--ink); }
.report-main h2:first-child{ margin-top:0; }
.report-main p, .report-main li{ font-size:var(--fs-body1); line-height:1.8; color:var(--ink); }
.report-main p{ margin:0 0 1.2em; }
.report-main ul{ margin:0 0 1.2em; padding-left:1.2em; }
.report-main li{ margin-bottom:.4em; }
.report-side{ position:sticky; top:96px; display:flex; flex-direction:column; gap:14px; }
.report-side .report-cover{ min-height:250px; }
.report-side .cta{ width:100%; }
.report-side .side-note{ font-size:12.5px; color:var(--muted); margin:0; text-align:center; }
@media (max-width:860px){
  .report-layout{ grid-template-columns:1fr; gap:28px; }
  .report-side{ position:static; order:-1; }
  .report-side .report-cover{ min-height:190px; }
}

/* report covers (banner images) */
.report-grid{ display:grid; grid-template-columns:1fr; gap:24px; }
.rc-img{ display:block; width:100%; height:auto; aspect-ratio:1400/531; border-radius:12px; }
.report-hero{ padding:32px 28px 0; }
.report-hero .rc-img{ border-radius:16px; }
.report-side .side-card-box{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:22px; display:flex; flex-direction:column; gap:12px; box-shadow:var(--shadow); }
.report-side .side-card-box b{ font-size:16px; line-height:1.4; color:var(--ink); }
.report-side .side-card-box span.sub{ font-size:13px; color:var(--ink); }
@media (max-width:860px){ .report-hero{ padding-top:20px; } .report-layout{ padding-top:28px; } }

/* report body (ported from Notion) */
.report-main .rp-headline{ font-size:var(--fs-h2); line-height:var(--lh-h2); font-weight:800; color:var(--ink); margin:0 0 18px; }
.report-main blockquote.rp-quote{ margin:22px 0; padding:16px 20px; border-left:4px solid var(--brand); background:var(--surface-alt); border-radius:0 12px 12px 0; font-size:var(--fs-body1); line-height:1.7; color:var(--ink); font-weight:600; }
.report-main ul.rp-list{ list-style:none; padding:0; margin:0 0 1.2em; }
.report-main ul.rp-list li{ margin-bottom:.6em; }
.report-main ul.rp-list li .rp-sub{ display:block; padding-left:1.6em; font-size:var(--fs-body2); line-height:1.7; color:var(--ink); }
.report-main .rp-lead{ font-size:var(--fs-body1); line-height:1.8; color:var(--ink); margin:0 0 1.2em; }

/* ===== header v2: full-width bar, brand + tagline left, large nav right, 광고문의 block ===== */
header.site-header .navrow{
  max-width:none; margin:0; height:88px; padding:0 clamp(20px, 3.2vw, 48px);
  display:flex; align-items:center; justify-content:flex-start; flex-wrap:nowrap; gap:28px;
}
header.site-header .brand{ gap:12px; font-size:21px; letter-spacing:-.02em; white-space:nowrap; }
/* logo: no box behind it, just the transparent wordmark */
header.site-header .brand .mark-wrap{ width:auto; height:auto; padding:0; border:0; border-radius:0; background:none; box-shadow:none; display:block; margin:0; }
header.site-header .brand .mark{ width:auto; height:44px; object-fit:contain; display:block; }
header.site-header .brand-name{ font-weight:600; }
header.site-header .brand-bar{ color:var(--border); font-weight:300; font-size:22px; margin:0 -2px; }
header.site-header .brand-sub{ font-weight:500; font-size:16px; color:var(--muted); letter-spacing:-.01em; }
header.site-header nav.links{ margin-left:auto; flex:none; align-items:center; gap:6px; font-size:20px; line-height:1.3; font-weight:500; }
header.site-header .navitem > a,
header.site-header .navitem > button.navtrigger{ font-size:20px; font-weight:500; padding:12px 18px; border-radius:12px; }
header.site-header .navitem.active > a,
header.site-header .navitem.active > button.navtrigger{ color:var(--accent-2); font-weight:500; }
header.site-header .navitem > a.nav-cta{
  background:var(--brand-strong); color:#fff; padding:13px 30px; margin-left:10px; border-radius:999px;
  transition:background-color .18s ease, transform .18s ease;
}
header.site-header .navitem > a.nav-cta:hover{ background:#1F4C82; color:#fff; transform:translateY(-1px); }
header.site-header .dropdown{ left:auto; right:0; min-width:260px; }
header.site-header .dropdown a{ font-size:16px; font-weight:500; padding:11px 14px; }
@media (max-width:1180px){ header.site-header .brand-bar, header.site-header .brand-sub{ display:none; } }
@media (max-width:1000px){
  header.site-header nav.links{ font-size:18px; }
  header.site-header .navitem > a, header.site-header .navitem > button.navtrigger{ font-size:18px; padding:10px 12px; }
}
@media (max-width:860px){
  header.site-header .navrow{ height:auto; min-height:68px; flex-wrap:wrap; padding:12px 16px; gap:12px; }
  header.site-header .brand{ font-size:18px; }
  header.site-header .hamburger{ margin-left:auto; }
  header.site-header nav.links{ margin-left:0; align-items:stretch; }
  header.site-header .navitem > a, header.site-header .navitem > button.navtrigger{ font-size:17px; padding:14px 10px; }
  header.site-header .navitem > a.nav-cta{ margin:10px 0 4px; justify-content:center; padding:15px 20px; }
  header.site-header .dropdown{ left:0; right:auto; }
  header.site-header .dropdown a{ font-size:15px; }
}

/* header dropdowns: open on hover (and keyboard focus), fade and slide in smoothly */
header.site-header .dropdown{
  display:flex; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-8px);
  transition:opacity .22s ease, transform .26s cubic-bezier(.2,.7,.2,1), visibility 0s linear .26s;
}
header.site-header .dropdown::before{ content:""; position:absolute; left:0; right:0; top:-14px; height:14px; }
header.site-header .navitem[data-open="true"] .dropdown,
header.site-header .navitem[data-dropdown]:hover .dropdown,
header.site-header .navitem[data-dropdown]:has(.navtrigger:focus-visible) .dropdown{
  opacity:1; visibility:visible; pointer-events:auto; transform:none;
  transition:opacity .22s ease, transform .26s cubic-bezier(.2,.7,.2,1), visibility 0s;
}
header.site-header .navitem[data-dropdown]:hover .navtrigger .chev{ transform:rotate(180deg); }
header.site-header .navitem[data-dropdown]:hover > .navtrigger{ color:var(--accent-2); background:var(--surface-alt); }
@media (max-width:860px){
  header.site-header .dropdown{ display:none; opacity:1; visibility:visible; pointer-events:auto; transform:none; transition:none; }
  header.site-header .navitem[data-open="true"] .dropdown{ display:flex; }
  header.site-header .navitem[data-dropdown]:hover .dropdown{ display:none; }
  header.site-header .navitem[data-dropdown][data-open="true"]:hover .dropdown{ display:flex; }
  header.site-header .dropdown::before{ display:none; }
  header.site-header .brand .mark{ height:36px; }
}
@media (prefers-reduced-motion: reduce){ header.site-header .dropdown{ transition:none; transform:none; } }

/* desktop scale: the layout looks best at a 90% browser zoom, so render at 90% by default (phones and tablets stay at 100%) */
@media (min-width:901px){ html{ zoom:.9; } }