/* Kevin Miller portfolio: shared styles */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#0B0B0C;color:#F2F2F0;font-family:"Instrument Sans","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#F2F2F0;text-decoration:none}
a:hover{color:#8FB8FF}
img,video{max-width:100%}
.page{max-width:1440px;margin:0 auto;padding:0 64px;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);display:flex;flex-direction:column;min-height:100vh}
.skip-link{position:absolute;left:-9999px;top:8px;z-index:100;padding:10px 16px;background:#8FB8FF;color:#0B0B0C;border-radius:999px;font-weight:600}
.skip-link:focus{left:16px}
a:focus-visible,button:focus-visible,video:focus-visible{outline:2px solid #8FB8FF;outline-offset:4px;border-radius:6px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Current page in the main nav */
body[data-page="work"] header nav a[href="work.html"],
body[data-page="lead"] header nav a[href="leadership.html"],
body[data-page="about"] header nav a[href="about.html"]{color:#F2F2F0 !important}

/* Work filters */
.chip{font:inherit;font-size:15px;font-weight:500;padding:10px 18px;border-radius:999px;border:1px solid #3A3A3F;background:transparent;color:#F2F2F0;cursor:pointer}
.chip:hover{border-color:#8FB8FF;color:#8FB8FF}
.chip.is-active{background:#F2F2F0;border-color:#F2F2F0;color:#0B0B0C}
[data-tags][hidden]{display:none !important}

/* Click-to-play video: one consistent play button, player sized in pixels by site.js */
[data-embed],[data-video]{cursor:pointer}
[data-embed-box]{position:relative}
.play{position:relative;z-index:1;flex:none;display:block;width:72px;height:72px;border-radius:50%;background:var(--play-bg,#8FB8FF);box-shadow:0 6px 20px rgba(0,0,0,.35);transition:transform .15s ease}
.play::after{content:"";position:absolute;left:50%;top:50%;margin:-13px 0 0 -8px;border-top:13px solid transparent;border-bottom:13px solid transparent;border-left:22px solid var(--play-fg,#0B0B0C)}
[data-embed]:hover .play,[data-video]:hover .play{transform:scale(1.06)}
.player{position:absolute;top:0;left:0;width:100%;height:100%;max-width:none;border:0;margin:0;padding:0;z-index:5;background:#000;display:block;object-fit:contain}
.is-playing{cursor:default}
.is-playing > :not(.player){visibility:hidden}

/* ---------- Tablet ---------- */
@media (max-width:1100px){
  .page{padding-left:40px;padding-right:40px}
  h1{font-size:clamp(48px,8vw,96px) !important;letter-spacing:-2px !important}
  [style*="font-size: 104px"],[style*="font-size: 128px"],[style*="font-size: 112px"]{font-size:clamp(48px,8vw,96px) !important}
}

/* ---------- Mobile ---------- */
@media (max-width:820px){
  .page{padding-left:20px;padding-right:20px}
  header{flex-wrap:wrap;gap:16px;padding:20px 0 !important}
  header nav{flex-wrap:wrap;gap:16px 20px !important;font-size:14px !important}
  header nav a[style*="padding: 12px 22px"]{padding:10px 16px !important}

  h1{font-size:clamp(40px,11vw,60px) !important;line-height:1.04 !important;letter-spacing:-1.2px !important}
  h1,h2{overflow-wrap:break-word}
  h2{font-size:clamp(28px,8vw,40px) !important;line-height:1.1 !important;letter-spacing:-0.8px !important}
  h2[style*="font-size: 20px"]{font-size:20px !important}
  blockquote{font-size:24px !important}
  [style*="font-size: 72px"],[style*="font-size: 64px"],[style*="font-size: 56px"]{font-size:36px !important;line-height:1.15 !important;letter-spacing:-1px !important}
  [style*="font-size: 48px"],[style*="font-size: 44px"],[style*="font-size: 40px"]{font-size:26px !important;letter-spacing:-0.5px !important}
  [style*="font-size: 34px"],[style*="font-size: 32px"],[style*="font-size: 30px"]{font-size:22px !important;letter-spacing:-0.2px !important}
  [style*="font-size: 28px"]{font-size:21px !important}
  [style*="font-size: 96px"][style*="line-height: 0.6"]{font-size:64px !important}

  /* Collapse grids to one column (stats keep two) */
  [style*="grid-template-columns: repeat(12"],[style*="grid-template-columns: repeat(8"],[style*="grid-template-columns: repeat(3"],[style*="grid-template-columns: repeat(2"]{grid-template-columns:1fr !important;row-gap:28px !important}
  [style*="grid-template-columns: repeat(4"]{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:16px !important}
  [style*="grid-column:"]{grid-column:auto !important}
  [style*="text-align: right"]{text-align:left !important}

  /* Fixed-height media become fluid */
  [style*="height: "][style*="border-radius: 2"],[style*="height: "][style*="border-radius: 3"]{height:auto !important;aspect-ratio:4 / 3}
  [style*="height: 738px"],[style*="height: 875px"],[style*="height: 760px"],[style*="height: 680px"],[style*="height: 640px"],[style*="height: 400px"],[style*="background: #000000"][style*="height: "]{aspect-ratio:16 / 9 !important}
  [style*="height: 520px"]{aspect-ratio:4 / 5 !important}
  [style*="height: 320px"],[style*="height: 240px"]{aspect-ratio:16 / 10 !important}
  [style*="background: #F2F2F0"][style*="height: "],[style*="background: #E9E7EC"][style*="height: "]{aspect-ratio:auto !important;height:auto !important;padding:24px !important}
  [style*="background: #F2F2F0"] img{max-height:none !important}
  [style*="background: #E9E7EC"] img{max-height:420px;width:auto !important;margin:0 auto}
  [style*="height: 99px"]{height:68px !important;aspect-ratio:auto !important}

  /* Rows and sections */
  [style*="justify-content: space-between; align-items: flex-end"],[style*="justify-content: space-between; align-items: baseline; border-top"]{flex-direction:column;align-items:flex-start !important;gap:24px !important}
  [style*="justify-content: space-between; align-items: center; padding: 20px 0 48px"]{flex-direction:column;align-items:flex-start !important}
  [style*="display: flex; gap: 10px; font-size: 15px"]{flex-wrap:wrap}
  [style*="display: flex; gap: 14px"]{flex-wrap:wrap}
  footer,[style*="display: flex; justify-content: space-between; font-size: 14px"]{flex-direction:column;align-items:flex-start !important;gap:16px}
  footer > div{flex-wrap:wrap;gap:16px !important}
  [style*="grid-template-columns: 176px"],[style*="grid-template-columns: 64px"]{grid-template-columns:110px 1fr !important;gap:16px !important}
  [style*="grid-template-columns: 176px"] > :last-child{grid-column:2 !important}
  section[style*="padding: 64px"],section[style*="padding: 80px"],section[style*="padding: 96px 80px"]{padding:28px !important}
  [style*="padding: 120px 0"],[style*="padding: 128px 0"]{padding-top:64px !important;padding-bottom:64px !important}
  [style*="padding: 72px 0"]{padding-top:40px !important}
  [style*="margin: 120px 0"]{margin:64px 0 !important}
  [style*="padding: 40px; box-sizing"],[style*="padding: 32px; box-sizing"]{padding:16px !important}
  a[style*="padding: 36px 0"]{padding:24px 0 !important}
  a[style*="padding: 36px 0"]{flex-wrap:wrap;gap:6px 12px !important}
  a[style*="padding: 36px 0"] > span:first-child{width:100%;min-width:0 !important}
  a[style*="padding: 36px 0"] > span[style*="font-size: 44px"]{font-size:21px !important;letter-spacing:-0.3px !important;min-width:0}
  /* Video boxes: fluid and uniform */
  [style*="font-size: 14px; color: #9A9A96"]{white-space:nowrap}
  .page .media{height:auto !important;aspect-ratio:16 / 9 !important;padding:16px !important}
  .page .media.media--tall{aspect-ratio:4 / 5 !important}
  .play{width:56px;height:56px}
  .play::after{margin:-10px 0 0 -6px;border-top-width:10px;border-bottom-width:10px;border-left-width:17px}
  .page{overflow-x:clip}
}