/* shared header: logo and spacing, loaded after each page stylesheet */
.logo .mk{width:auto;height:46px;border:0;background:none;border-radius:0;display:block}
.logo .mk img{height:100%;width:auto;display:block}
.head.scrolled .logo .mk{height:42px}
.logo span span{letter-spacing:.14em}
.head .btn{white-space:nowrap;padding-left:22px;padding-right:22px}
nav ul{gap:26px}
@media (max-width:1240px){nav ul{gap:18px}nav a{font-size:.8rem}.logo span span{font-size:.58rem;letter-spacing:.1em}}
@media (max-width:620px){.logo .mk{height:42px}.logo b{font-size:1.1rem}}
/* tablet: use the menu button below 1100px so the header never overflows */
@media (max-width:1100px){
  nav{position:fixed;inset:84px 0 0 0;background:rgba(245,249,253,.98);backdrop-filter:blur(18px);display:none;padding:14px 28px 50px;overflow-y:auto}
  nav.open{display:block}
  nav ul{flex-direction:column;gap:0}
  nav li{border-bottom:1px solid var(--line)}
  nav a{display:block;padding:19px 0;font-size:1rem}
  nav a::after{display:none}
  .burger{display:grid}
  .head-cta{display:none}
}
@media (max-width:620px){nav{inset:74px 0 0 0}}

/* mobile and tablet: bottom navigation bar replaces the three-line menu button */
.dock{display:none}
@media (max-width:1100px){
  .burger,nav{display:none!important}
  .head-cta{display:block}
  .head .head-cta .btn{height:42px;padding:0 20px;border-radius:999px;background:var(--sun);color:var(--navy);font-weight:700;box-shadow:none;display:inline-flex;align-items:center}
  body{padding-bottom:calc(98px + env(safe-area-inset-bottom,0px))}
  .dock{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom,0px));width:min(calc(100% - 28px),560px);height:68px;background:var(--navy);border-radius:22px;box-shadow:0 14px 30px -10px rgba(10,44,85,.6);z-index:88}
  .dock a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#aebfd6;font-size:.66rem;font-weight:600;letter-spacing:.02em;padding:0;text-transform:none;transition:color .2s}
  .dock a svg{width:22px;height:22px;fill:currentColor}
  .dock a[aria-current]{color:#fff}
  .dock a[aria-current]::before{content:"";position:absolute;top:7px;width:22px;height:3px;background:var(--sun);border-radius:2px}
  .dock a:active{transform:scale(.96)}
  .wapp{bottom:calc(96px + env(safe-area-inset-bottom,0px));right:14px}
}
@media (max-width:620px){.head-cta .wide{display:none}.head .head-cta .btn{padding:0 18px}}
@media (max-width:620px){
  .head .wrap{padding-left:14px;padding-right:14px;gap:10px}
  .head .head-cta .btn::after{display:none}
  .logo .mk{height:36px}
  .logo{gap:7px}
  .logo b{font-size:1.02rem}
  .logo span span{font-size:.5rem;letter-spacing:.05em}
}
@media (max-width:360px){.logo span span{display:none}}

/* ---- footer ---- */
.foot{background:#071d3b;color:rgba(255,255,255,.82);padding:34px 0 30px;text-align:center}
.foot .wrap{display:grid;gap:18px;justify-items:center}
.foot-name{font-size:.95rem}
.foot-name b{font-family:var(--display);font-weight:500;font-size:1.25rem;color:#fff;display:block;letter-spacing:.01em}
.foot-name span{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--green)}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-size:.92rem;color:rgba(255,255,255,.88);transition:color .2s}
.foot-links a:hover{color:var(--sun)}
.foot-copy{font-size:.8rem;color:rgba(255,255,255,.6)}

/* ---- balanced headings: no lone last word ---- */
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}

/* ---- phone: bigger tap targets and slightly larger small text ---- */
@media (max-width:760px){
  a[href^="tel:"],a[href^="mailto:"]{display:inline-block;padding:11px 0}
  .botbar a[href^="tel:"],.botbar a[href^="mailto:"]{display:flex;padding:0}
  .botbar a,.botbar span{min-height:44px}
  .ct-info a{display:inline-flex;align-items:center;min-height:44px}
  .logo{min-height:44px}
  .more-btn{min-height:44px}
  .dots button{position:relative}
  .dots button::after{content:"";position:absolute;inset:-18px -4px}
  .eye,p.eye{font-size:.8rem}
  label{font-size:.82rem}
  .pj .vl,.pj .st,.pj li b,.pjh .st{font-size:.82rem}
  .ct-info b,.cl b,.cl{font-size:.82rem}
  .dock a{font-size:.72rem}
}

/* phone: larger touch area for the remaining short links, without changing layout */
@media (max-width:760px){
  .ans a,dd a{position:relative}
  .ans a::after,dd a::after{content:"";position:absolute;inset:-13px -6px}
}