/* ============================================
   Design tokens — 永新光学 brand
   ============================================ */
:root{
  --brand-900:#0a2e57;   /* deep brand blue (titles) */
  --brand-700:#0071E3;   /* primary brand blue */
  --brand-500:#0071E3;   /* accent / links */
  --brand-300:#6e9bc8;
  --brand-100:#e6eef7;
  --brand-50:#f3f7fc;
  --paper:#f6efe1;       /* warm aged-paper cream */
  --paper-2:#faf5e9;
  --paper-line:#e8dec8;
  --ink:#1b2230;
  --ink-2:#000000;
  --muted:#6b7589;
  --line:#e4e8ef;
  --white:#ffffff;
  --shadow-sm:0 1px 2px rgba(10,46,87,.06);
  --shadow:0 8px 30px rgba(10,46,87,.08);
  --shadow-lg:0 20px 60px rgba(10,46,87,.12);
  --radius:4px;
  --maxw:1240px;
  --sans:"HarmonyOS_Sans_SC";
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{margin:0; font-family:var(--sans); color:var(--ink);font-size:18px; line-height:1.75; background:var(--white);-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:gray;}
img{max-width:100%; height:auto; display:block}
/*a{color:var(--brand-500); text-decoration:none; transition:color .2s}*/
/*a:hover{color:var(--brand-700)}*/
h1,h2,h3,h4{margin:0; line-height:1.3; letter-spacing:.01em}
p{margin:0 0 1em}
.container{max-width:var(--maxw); margin:0 auto; padding:0 32px}





/* ============================================
   1. Top Banner — 浅色泛黄
   ============================================ */
.banner{position:relative;background:radial-gradient(ellipse at 78% 40%, rgba(180,160,120,.10), transparent 60%),linear-gradient(180deg, #f5ecd6 0%, #efe5cb 100%);overflow:hidden;border-bottom:1px solid var(--paper-line);}
.banner::before{content:""; position:absolute; inset:0;background-image:repeating-linear-gradient(45deg, rgba(120,90,40,.025) 0 1px, transparent 1px 14px);pointer-events:none;}
.banner-grid{position:relative; z-index:1;display:grid; grid-template-columns: 1.15fr .85fr;gap:48px; align-items:center;padding: 96px 32px 104px; max-width:var(--maxw); margin:0 auto;}
.banner-eyebrow{display:inline-flex; align-items:center; gap:10px;font-size:14px; letter-spacing:.32em;color:var(--brand-700); text-transform:uppercase; font-weight:500;padding:6px 14px; background:rgba(255,255,255,.5);border:1px solid var(--paper-line); border-radius:calc(20px * var(--scale));}
.banner-eyebrow::before{content:""; width:24px; height:1px; background:var(--brand-700)}
.banner h1{font-size: max(calc(68px * var(--scale)), 24px);margin: 22px 0 14px; letter-spacing:.04em;}
.banner .subtitle{font-size:max(calc(22px * var(--scale)), 18px);color:var(--ink-2); margin: 0 0 24px; font-weight:500;letter-spacing:.08em;}
.banner .subtitle .dot{color:var(--brand-500); margin:0 10px; opacity:.7}
.banner .lede{line-height:2; color:var(--ink-2);max-width: 560px; margin-bottom:20px; text-align:justify; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300;}
.banner .lede .opener{display:block; font-size:19px;color:var(--brand-900); margin-bottom:10px; font-weight:600;letter-spacing:.06em;}

.banner-portrait{position:relative; aspect-ratio: 4/5;background:#e9dec3; border-radius:calc(20px * var(--scale)); overflow:hidden;box-shadow: var(--shadow-lg);}
.banner-portrait img{width:100%; height:100%; object-fit:cover; object-position:center 22%}
.banner-portrait::after{content:""; position:absolute; inset:0;background:linear-gradient(180deg, transparent 60%, rgba(10,46,87,.18));pointer-events:none;}
.portrait-caption{position:absolute; left:16px; bottom:14px; z-index:2;font-size:14px; color:#fff;letter-spacing:.18em; padding:6px 10px; background:rgba(10,46,87,.55);backdrop-filter:blur(2px);}

/* ============================================
   2. Sticky Nav — 四块跳转
   ============================================ */
.nav{position:sticky; top:0; z-index:50;background:rgba(255,255,255,.96);backdrop-filter: blur(8px);border-bottom:1px solid var(--line);}
.nav-inner{display:flex; align-items:center; justify-content:space-between;max-width:var(--maxw); margin:0 auto; padding: 0 32px;}
.nav-logo{color:var(--brand-900);font-weight:600; letter-spacing:.1em; padding:18px 0;}
.nav-logo small{display:block;font-size:10px; color:var(--muted); letter-spacing:.4em; font-weight:400; margin-top:2px}
.nav-links{display:flex; gap:8px; list-style:none; padding:0; margin:0}
.nav-links a{display:block; padding: 22px 18px; font-size:max(calc(16px * var(--scale)), 12px);color:var(--ink-2); font-weight:500; letter-spacing:.12em;position:relative; transition:color .2s;}
.nav-links a::after{content:""; position:absolute; left:18px; right:18px; bottom:0;height:2px; background:var(--brand-500); transform:scaleX(0);transform-origin:center; transition:transform .3s;}
.nav-links a:hover{color:var(--brand-700)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-links a.active{color:var(--brand-700)}
.nav-links a.active::after{transform:scaleX(1)}

/* ============================================
   Section base
   ============================================ */
section{padding: 112px 0; position:relative}
.sec-head{margin-bottom:64px; max-width:760px}
.sec-eyebrow{letter-spacing:.36em;color:var(--brand-500); text-transform:uppercase;margin-bottom:18px; display:flex; align-items:center; gap:14px;}
.sec-eyebrow::before{content:""; width:36px; height:1px; background:var(--brand-500)}
.sec-title{font-size:max(calc(48px * var(--scale)), 14px);margin: 0 0 18px; letter-spacing:.03em;}
.sec-deck{color:var(--ink-2); line-height:1.9; max-width:720px; text-align:justify}

/* heritage / paper sections */
.paper{ background: var(--paper); color: var(--ink); }
.paper .sec-eyebrow{ color:#8a6a2a }
.paper .sec-eyebrow::before{ background:#8a6a2a }
.paper .sec-title{ color: #2a2010 }
.paper-2{ background: var(--paper-2) }

/* ============================================
   3. 宁波帮 section
   ============================================ */
.ningbo{ background: var(--white); }
.ningbo-grid{display:grid; grid-template-columns: 1fr 1fr; gap:80px; align-items:center;}
.ningbo .sec-deck{line-height:2; text-align:justify;font-family: "HarmonyOS_Sans_SC_Light"; font-weight: 300;}
.ningbo .quote-mark{font-size:120px; line-height:.6;color:var(--brand-100); display:block; margin-bottom:-20px;}
.ningbo .ningbo-photo{position:relative; aspect-ratio:3/4; border-radius:calc(20px * var(--scale)); overflow:hidden;box-shadow: 0 24px 60px -28px rgba(20,40,80,.18), 0 2px 0 rgba(20,40,80,.04);}
.ningbo .ningbo-photo img{width:100%; height:100%; object-fit:contain; display:block;filter: contrast(1.04);}
.ningbo .ningbo-photo figcaption{position:absolute; right:14px; bottom:12px;font-size:14px; letter-spacing:.04em;color:rgba(20,40,80,.55);background:rgba(255,255,255,.86);padding:4px 10px; border-radius:calc(20px * var(--scale));backdrop-filter: blur(4px);}
.ningbo .ningbo-photo .seal{position:absolute; left:18px; top:18px;font-size:11px; letter-spacing:.32em;color:#fff; padding:6px 10px;background:var(--brand-900);border-radius:calc(20px * var(--scale));}

/* ============================================
   4. 先辈与家族 — Zeiss-style accordion
   ============================================ */
.family{ background: var(--paper); border-top:1px solid var(--paper-line); border-bottom:1px solid var(--paper-line); }
.accordion{ border-top:1px solid rgba(120,90,40,.25); }
details.acc{border-bottom:1px solid rgba(120,90,40,.25);background: transparent;}
details.acc > summary{list-style:none; cursor:pointer;display:flex; align-items:center; justify-content:space-between;padding: 30px 8px;font-size:max(calc(28px * var(--scale)), 14px);color:var(--brand-900); letter-spacing:.04em;transition: color .2s;outline:none;}
details.acc > summary::-webkit-details-marker{display:none}
details.acc > summary:hover{ color:#000 }
details.acc > summary .acc-num{font-size:13px; color:#8a6a2a;letter-spacing:.24em; font-weight:500; margin-right:18px;min-width:48px;}
details.acc > summary .acc-title{ flex:1 }
details.acc > summary .acc-chev{width:28px; height:28px; border:1.5px solid currentColor; border-radius:50%;display:flex; align-items:center; justify-content:center;color:var(--brand-700); transition: transform .3s, background .2s;margin-left:16px; flex-shrink:0;}
details.acc[open] > summary .acc-chev{ transform:rotate(45deg); background:var(--brand-700); color:#fff; border-color:var(--brand-700) }
details.acc > .acc-body{padding: 8px 8px 56px 66px;display:grid; grid-template-columns: 1fr 1.1fr; gap:56px; align-items:start;}
details.acc .acc-img{position:relative; aspect-ratio: 4/3; background:#d9c9a3; border-radius:calc(20px * var(--scale)); overflow:hidden;}
details.acc .acc-img img{ width:100%; height:100%; object-fit:cover }
details.acc .acc-img.placeholder{background:linear-gradient(135deg, #d6c5a0 0%, #b89c6a 100%);display:flex; align-items:center; justify-content:center;}
details.acc .acc-img.placeholder .ph-inner{color:rgba(60,40,10,.7); text-align:center; padding:20px;}
details.acc .acc-img.placeholder .ph-inner .icon{width:42px; height:42px; margin:0 auto 10px; opacity:.7;border:1.5px solid rgba(60,40,10,.5); border-radius:50%;display:flex; align-items:center; justify-content:center;}
details.acc .acc-img.placeholder .ph-title{font-size:14px; letter-spacing:.16em; margin-bottom:4px}
details.acc .acc-img.placeholder .ph-sub{font-size:11px; opacity:.7; letter-spacing:.08em}
details.acc .acc-img .img-cap{position:absolute; left:0; right:0; bottom:0; padding:8px 12px;background:linear-gradient(180deg, transparent, rgba(0,0,0,.6));color:#fff; font-size:12px; letter-spacing:.1em;}
details.acc .acc-text h4{font-size:20px; margin:0 0 6px; color:#2a2010; font-weight:600;}
details.acc .acc-text .acc-sub{font-size:12px; color:#8a6a2a;letter-spacing:.24em; margin-bottom:18px; display:block;}
details.acc .acc-text p{ color:#3a2f1c; font-size:max(calc(16px * var(--scale)), 12px); line-height:1.95; text-align:justify; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300; }
details.acc .acc-text .quote-line{color:#2a2010;border-left:2px solid #8a6a2a; padding-left:14px; margin:14px 0;font-weight:500;}

/* ============================================
   5. 传承与发展 — quote + accordion
   ============================================ */
.heritage{ background: var(--white); }
.heritage-quote{background: var(--paper-2);padding: 80px 60px; margin: 88px 0;border-left:3px solid #8a6a2a;position:relative;border-radius:calc(20px * var(--scale))}
.heritage-quote .q-mark{position:absolute; top:24px; right:48px;font-size:140px; line-height:.6;color:rgba(138,106,42,.18);}
.heritage-quote .q-text{font-size: max(calc(38px * var(--scale)), 16px);color:#2a2010; line-height:1.5; margin:0 0 24px; letter-spacing:.06em;}
.heritage-quote .q-cite{ font-size:max(calc(16px * var(--scale)), 12px); color:#8a6a2a;letter-spacing:.32em; display:flex; align-items:center; gap:14px;}
.heritage-quote .q-cite::before{ content:""; width:32px; height:1px; background:#8a6a2a }
.heritage-quote .q-para{margin-top:28px; padding-top:24px; border-top:1px dashed rgba(120,90,40,.35);color:#4a4030; line-height:1.95; max-width:780px;}

.heritage .accordion{ margin-top: 24px }
.heritage details.acc{ border-color: var(--line) }
.heritage details.acc > summary{ color: var(--brand-900) }
.heritage details.acc > summary .acc-num{ color: var(--brand-500) }
.heritage details.acc[open] > summary .acc-chev{ background: var(--brand-700); border-color: var(--brand-700); }
.heritage details.acc > .acc-body{ padding-left: 66px }
.heritage details.acc .acc-text h4{ color: var(--brand-900) }
.heritage details.acc .acc-text p{ color: var(--ink-2); text-align:justify }
.heritage details.acc .acc-img{ background: #d4dce7 }

/* ============================================
   6. 开放突破 — content blocks
   ============================================ */
.breakthrough{ background: var(--white); }
.bk-intro{ max-width:100%; margin-bottom:72px }
.bk-intro p{color:var(--ink-2); line-height:1.95 }

.bk-feature{display:grid; grid-template-columns: 1.05fr .95fr; gap:64px; align-items:center;margin-bottom: 88px;}
.bk-feature.reverse{ grid-template-columns: .95fr 1.05fr; direction:rtl }
.bk-feature.reverse > *{ direction:ltr }
.bk-feature .bk-img{aspect-ratio: 4/3; background:#d4dce7; border-radius:calc(20px * var(--scale)); overflow:hidden;position:relative; box-shadow:var(--shadow);}
.bk-feature .bk-img img{ width:100%; height:100%; object-fit:cover }
.bk-feature .bk-img.placeholder{background: linear-gradient(135deg, #cfd8e3 0%, #aebccd 100%);display:flex; align-items:center; justify-content:center;}
.bk-feature .bk-img.placeholder .ph-inner{color:rgba(255,255,255,.9); text-align:center; padding:24px;}
.bk-feature .bk-tag{color:var(--brand-500);letter-spacing:.32em; margin-bottom:14px; display:block;}
.bk-feature h3,.sec-head h3{font-size:max(calc(32px * var(--scale)), 14px);margin: 0 0 18px; color: var(--brand-900);}
.bk-feature p{color:var(--ink-2); line-height:1.9; margin-bottom:14px; text-align:justify; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300; }
.bk-feature .year{font-size:14px; color:var(--brand-700);letter-spacing:.18em; font-weight:600; margin-right:8px;}

.bk-list{display:grid; grid-template-columns: repeat(2, 1fr); gap:24px 40px;margin: 56px 0 0; padding: 0; list-style:none;}
.bk-list li{position:relative; padding-left:22px; color:var(--ink-2);line-height:1.85; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300;}
.bk-list li::before{content:""; position:absolute; left:0; top:14px; width:8px; height:1px;background:var(--brand-500);}

.timeline-strip{margin-top: 72px; padding: 40px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.timeline-strip h4{font-size:18px; letter-spacing:.18em; color:var(--brand-900);margin-bottom:28px;}
.tl-list{display:grid; grid-template-columns: repeat(4, 1fr); gap: 0; list-style:none;padding:0; margin:0;}
.tl-list li{padding: 0 18px; border-left:1px solid var(--brand-100);font-size:14px; color:var(--ink-2); line-height:1.7;}
.tl-list li:first-child{ border-left:none; padding-left:0 }
.tl-list .tl-year{display:block; font-size:24px; color:var(--brand-700);font-weight:600; margin-bottom:6px; letter-spacing:.04em;}

/* ============================================
   7. 深耕光学 — premium section
   ============================================ */
.optics{ background: var(--brand-50); }
.optics-hero{display:grid; grid-template-columns: 1fr 1fr; gap:72px; align-items:center;margin-bottom: 88px;}
.optics-hero h3{ font-size: max(calc(34px * var(--scale)), 16px); margin: 0 0 18px }
.optics-hero p{color:var(--ink-2); line-height:1.95; text-align:justify; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300; }
.optics-hero .optics-img{aspect-ratio: 4/3; background:#cdd6e2; border-radius:calc(20px * var(--scale)); overflow:hidden;box-shadow: var(--shadow);}
.optics-hero .optics-img img{ width:100%; height:100%; object-fit:cover }
.optics-hero .optics-img.placeholder{background: linear-gradient(135deg, #cfd8e3 0%, #b3c1d2 100%);display:flex; align-items:center; justify-content:center;}
.optics-hero .optics-img.placeholder .ph-inner{color:rgba(255,255,255,.9); text-align:center; padding:20px;font-size:13px; letter-spacing:.18em;}
/* 通用 optics-img：图片约束在容器内（填满+裁切），避免原图自然宽度撑破页面 */
.optics-img{ position:relative; overflow:hidden; border-radius:calc(20px * var(--scale)); background:#cdd6e2 }
.optics-img img{ width:100%; height:100%; object-fit:cover; display:block }
/* 荣誉照片角标 */
.photo-cap{position:absolute; left:14px; bottom:12px; z-index:2;font-size:max(calc(16px * var(--scale)), 12px); line-height:1.4;color:#fff; letter-spacing:.06em;padding:6px 11px; background:rgba(10,46,87,.62);backdrop-filter:blur(2px); border-radius:calc(20px * var(--scale));}
/* 荣誉照片网格：允许 grid 轨道收缩，防止大图撑出 1240 容器 */
.honor-photos > *{ min-width:0 }

.honors{margin-top: 88px;background: #fff;padding: 56px 44px;border: 1px solid var(--line);border-radius:calc(20px * var(--scale));}
.honors h3{ font-size:max(calc(34px * var(--scale)), 16px); margin-bottom: 12px }
.honors .sec-deck{ margin-bottom: 40px }
.honors-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
.honor-card{background:#fff; padding: 28px 22px; border:1px solid var(--line);border-top:2px solid var(--brand-500);border-radius:calc(20px * var(--scale)); transition: transform .25s, box-shadow .25s;}
.honor-card:hover{ transform: translateY(-3px); box-shadow: var(--shadow) }
.honor-card .h-year{font-size:max(calc(28px * var(--scale)), 16px); color:var(--brand-700);display:block; margin-bottom:15px; letter-spacing:.04em;}
.honor-card .h-title{ color:var(--ink); line-height:1.5; margin-bottom:10px }
.honor-card .h-desc{ font-size:max(calc(16px * var(--scale)), 12px); color:var(--muted); line-height:1.6; text-align:justify; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300; }

.charity{ margin-top: 96px; display:grid; grid-template-columns: 1.2fr .8fr; gap:64px; align-items:start }
.charary-text h3{ font-size:max(calc(34px * var(--scale)), 16px); margin-bottom:18px }
.charity-text p{color:var(--ink-2); line-height:1.95; margin-bottom:14px; text-align:justify; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300; }
.charity-imgs{ display:grid; grid-template-columns: 1fr 1fr; gap:14px }
.charity-imgs .ci{aspect-ratio: 4/5; background:#cdd6e2; border-radius:calc(20px * var(--scale)); overflow:hidden;box-shadow: var(--shadow-sm);}
.charity-imgs .ci img{ width:100%; height:100%; object-fit:cover }

.legacy-close{margin-top: 88px; padding: 48px 56px; background: var(--brand-900); color:#e6eef7;border-radius:calc(20px * var(--scale)); position:relative; overflow:hidden;}
.legacy-close::before{content:""; position:absolute; right:-80px; top:-80px; width:320px; height:320px;border-radius:50%; background: radial-gradient(circle, rgba(110,155,200,.25), transparent 70%);}
.legacy-close p{font-size: max(calc(20px * var(--scale)), 14px);line-height:1.95; margin:0; color:#f0f5fb; text-align:justify; font-family: "HarmonyOS_Sans_SC_Light";font-weight: 300;}
.legacy-close .sig{margin-top: 24px; font-size: max(calc(16px * var(--scale)), 12px); color:#9fb6cf;letter-spacing:.32em; display:flex; align-items:center; gap:14px;}
.legacy-close .sig::before{ content:""; width:32px; height:1px; background:#9fb6cf }



/* ============================================
   Scroll reveal
   ============================================ */
.reveal{ opacity:0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease }
.reveal.in{ opacity:1; transform:none }
.reveal.d1{ transition-delay:.1s } .reveal.d2{ transition-delay:.2s } .reveal.d3{ transition-delay:.3s }



@media screen and (max-width: 1440px) and (min-width: 1281px) {
  html,body{font-size:16px; }
}
@media screen and (max-width: 1280px) and (min-width: 997px) {
  html,body{font-size:12px;}
  h1 { font-size: max(calc(50px * var(--scale)), 14px); }
  h2 { font-size: max(calc(34px * var(--scale)), 14px); }
}
@media screen and (max-width: 1024px) {
  :root { --scale: 0.6; /* 可根据需求调整，比如0.55/0.65 */
      --font-size-16: 14px;
      --font-size-18: 14px;
  }
  html,body{font-size:12px;}
}



/* ============================================
   Responsive
   ============================================ */
@media (max-width: 960px){
  .container{ padding: 0 22px }
  .banner-grid{ grid-template-columns: 1fr; gap:40px; padding: 64px 22px 72px }
  .banner-portrait{ max-width: 360px; margin: 0 auto }
  .nav-inner{ padding: 0 18px }
  .nav-links a{ padding: 18px 12px; font-size:13px }
  .nav-links a::after{ left:12px; right:12px }
 
  .banner .lede{ width:100%; max-width:100%;}
  
  /* topnav mobile */
  /*.topnav-bar{ padding: 12px 18px; flex-wrap:wrap; }*/
  /*.topnav-logo{ margin-right: 16px }*/
  /*.topnav-logo img{ height: 36px }*/
  /*.topnav-menu{ gap:0; order:3; flex-basis:100%; overflow-x:auto; padding: 6px 0 4px; -webkit-overflow-scrolling:touch }*/
  /*.topnav-menu > li > a{ padding: 8px 14px; font-size:13.5px; white-space:nowrap }*/
  /*.topnav-tools{ margin-left:auto; gap:0 }*/
  /*.topnav-tools .lang span{ display:none }*/
  /*.topnav-sub-inner{ padding: 0 18px; overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch }*/
  /*.topnav-sub-inner a{ padding: 12px 14px; font-size:13px; white-space:nowrap }*/
  /*.topnav-sub-inner .sep{ display:none }*/
  /*.topnav-menu > li.has-sub > .topnav-sub{ display:none }*/
  
  
  section{ padding: 50px 0 }
  .sec-head{ margin-bottom:44px }
  .ningbo-grid, .optics-hero, .charity{ grid-template-columns: 1fr; gap:40px }
  details.acc > .acc-body{ grid-template-columns: 1fr; gap:28px; padding: 8px 8px 36px 24px }
  details.acc > summary{ padding: 22px 8px; font-size:18px }
  details.acc > summary .acc-num{ min-width:auto; margin-right:12px; font-size:11px }
  .bk-feature, .bk-feature.reverse{ grid-template-columns: 1fr; gap:32px; direction:ltr; margin-bottom:56px }
  .bk-list{ grid-template-columns: 1fr; gap:18px }
  .tl-list{ grid-template-columns: repeat(2, 1fr); gap:24px 0 }
  .tl-list li{ padding: 0 14px; border-left:none; border-top: 2px solid var(--brand-100); padding-top: 14px }
  .tl-list li:first-child{ border-top: 2px solid var(--brand-100); padding: 14px 14px 0 }
  .honors{ padding: 40px 28px }
  .honors-grid{ grid-template-columns: repeat(2, 1fr); }
  .heritage-quote{ padding: 48px 28px;}
  .heritage-quote .q-mark{ right: 20px; font-size: 90px }
  .legacy-close{ padding: 36px 28px }
  
  
  details.acc .acc-text h4{font-size:16px;}
  details.acc .acc-text .quote-line{font-size:14px;}
  /*.foot-top{ grid-template-columns: 1fr 1fr; gap: 32px }*/
  /*.foot-bottom{ flex-direction: column; align-items: flex-start; gap:12px }*/
}
@media (max-width: 540px){
  .nav-logo{font-size:16px;}
  .nav-logo small{ display:none }
  .nav-links a{ padding: 16px 8px; font-size:12px; letter-spacing:.06em }
  .honors{ padding: 32px 20px; margin-top:50px;}
  .honors-grid{ grid-template-columns: 1fr }
  .foot-top{ grid-template-columns: 1fr }
  .banner-grid{padding: 85px 22px 72px }
  .banner h1{ font-size: 32px }
  .banner-eyebrow{font-size:12px;}
  .banner .lede .opener{font-size:16px;}
  details.acc > summary{font-size:16px;}
  details.acc > summary .acc-num{letter-spacing:0;}
  .heritage-quote{margin:50px 0;}
  .optics-hero,.bk-intro{margin-bottom:50px;}
  .bk-feature .bk-tag,.sec-eyebrow,.legacy-close .sig{letter-spacing:0;}
  .charity{margin-top:50px;}
  .legacy-close{margin-top:60px;}
}

/* Focus visible */
:focus-visible{ outline: 2px solid var(--brand-500); outline-offset: 3px; border-radius:calc(20px * var(--scale)) }

/* selection */
::selection{ background: var(--brand-100); color: var(--brand-900) }