/* TAEKO mobile responsive overrides — injected after inline-styled desktop design */
@media (max-width: 860px){
  html, body { overflow-x: clip !important; }
  img, video, iframe, svg { max-width: 100% !important; height: auto; }

  /* all inline multi-column grids collapse to 1 column */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* typography scale-down (inline px can't use !important, so these win) */
  h1 { font-size: clamp(30px, 8.6vw, 40px) !important; line-height: 1.12 !important; }
  h2 { font-size: clamp(24px, 6.6vw, 32px) !important; line-height: 1.18 !important; }
  h3 { font-size: clamp(19px, 5vw, 24px) !important; }

  /* common wide paddings tighten */
  [style*="padding: 0px 40px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding: 0 40px"]   { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding: 100px"]    { padding-top: 56px !important; padding-bottom: 56px !important; }
  [style*="padding: 90px"]     { padding-top: 52px !important; padding-bottom: 52px !important; }
  [style*="padding: 80px"]     { padding-top: 48px !important; padding-bottom: 48px !important; }

  /* desktop nav hidden; hamburger takes over */
  header nav { display: none !important; }
  .taeko-burger { display: inline-flex !important; }

  /* header row keeps logo left / burger right */
  header > div, header { flex-wrap: nowrap !important; }

  /* hero rows / two-col flex sections wrap */
  [style*="display: flex"][style*="gap: 60px"],
  [style*="display: flex"][style*="gap: 70px"],
  [style*="display: flex"][style*="gap: 80px"] { flex-wrap: wrap !important; }

  /* stats rows etc. */
  [style*="min-width: 0px"] { min-width: 0 !important; }

  /* footer columns stack */
  footer [style*="display: grid"] { grid-template-columns: 1fr !important; }
}

/* hamburger button (hidden on desktop) */
.taeko-burger{
  display:none; align-items:center; justify-content:center;
  width:42px; height:42px; border:1px solid rgba(10,30,56,.18);
  border-radius:9px; background:#fff; cursor:pointer; flex-shrink:0;
}
.taeko-burger span{ display:block; width:18px; height:2px; background:#0A1E38; position:relative; }
.taeko-burger span::before,.taeko-burger span::after{
  content:""; position:absolute; left:0; width:18px; height:2px; background:#0A1E38;
}
.taeko-burger span::before{ top:-6px; } .taeko-burger span::after{ top:6px; }

/* mobile panel */
#taeko-mnav{
  position:fixed; inset:0; background:#06162B; z-index:9999;
  padding:26px 26px 40px; overflow-y:auto; display:none;
}
#taeko-mnav.open{ display:block; }
#taeko-mnav .mn-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:26px; }
#taeko-mnav .mn-close{
  width:40px; height:40px; border:1px solid rgba(255,255,255,.2); border-radius:9px;
  background:transparent; color:#fff; font-size:20px; cursor:pointer; line-height:1;
}
#taeko-mnav a{
  display:block; color:#E8EEF5; text-decoration:none;
  font-family:'Barlow Condensed',sans-serif; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; font-size:20px; padding:13px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
#taeko-mnav a.mn-sub{
  font-family:'Inter',sans-serif; text-transform:none; letter-spacing:.02em;
  font-size:15px; color:#9FB2C7; padding:10px 0 10px 16px; font-weight:500;
}
#taeko-mnav a:active{ color:#F26F21; }

/* desktop: keep nav+toggle grouped right (toggle moved out of nav by JS) */
@media (min-width: 861px){
  header nav { margin-left: auto; margin-right: 26px; }
}

/* ===== intro splash: metallic sheen -> fly-through ===== */
#taeko-intro{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#06162B,#0F2A47);overflow:hidden;}
#taeko-intro .tk-wrap{position:relative;padding:18px 30px;
  animation:tkFly 1.05s cubic-bezier(.55,0,.85,.36) 1.5s forwards;}
#taeko-intro .tk-logo{position:relative;display:block;}
#taeko-intro img{height:52px;width:auto;display:block;opacity:0;transform:scale(.9) translateY(10px);filter:blur(3px);
  animation:tkIn .8s cubic-bezier(.2,.7,.2,1) .15s forwards;}
#taeko-intro .tk-glow{position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(78deg,transparent 42%,rgba(255,255,255,.95) 50%,transparent 58%);
  background-size:260% 100%;background-position:135% 0;background-repeat:no-repeat;
  -webkit-mask:url("assets/taeko-white.png") center/contain no-repeat;
  mask:url("assets/taeko-white.png") center/contain no-repeat;
  animation:tkSheen .8s ease-in-out 1.0s 1 forwards;}
#taeko-intro.bgout{animation:tkBg .5s ease .55s forwards;}
@keyframes tkIn{to{opacity:1;transform:scale(1) translateY(0);filter:blur(0);}}
@keyframes tkSheen{0%{opacity:1;background-position:135% 0;}90%{opacity:1;}100%{opacity:0;background-position:-35% 0;}}
@keyframes tkFly{0%{transform:scale(1);opacity:1;}75%{opacity:1;}100%{transform:scale(16);opacity:0;}}
@keyframes tkBg{to{opacity:0;visibility:hidden;}}

/* ===== client marquee ===== */
.taeko-mq{overflow:hidden;position:relative;margin-top:26px;}
.taeko-mq::before,.taeko-mq::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none;}
.taeko-mq::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0));}
.taeko-mq::after{right:0;background:linear-gradient(-90deg,#fff,rgba(255,255,255,0));}
.taeko-mq-track{display:flex;align-items:center;gap:52px;width:max-content;animation:taekoMq 34s linear infinite;will-change:transform;}
.taeko-mq:hover .taeko-mq-track{animation-play-state:paused;}
.taeko-mq-track span{white-space:nowrap;}
@keyframes taekoMq{to{transform:translateX(-50%);}}

/* desktop: services dropdown on hover (listener lost in prerender -> pure CSS) */
@media (min-width: 861px){
  header nav span:hover > #taeko-svc-dd,
  #taeko-svc-dd:hover { opacity: 1 !important; visibility: visible !important; }
}