/* ═══════════════════════════════════════════════════════
    MOBILE RESPONSIVE REFINEMENT — STRICT PATCH ONLY
    Replaces / extends the existing @media blocks.
    Desktop layout: UNTOUCHED.
    ═══════════════════════════════════════════════════════ */

  /* ══════════════════════════════════════════
    FIX 7 — GLOBAL: let sections breathe on mobile
    Overrides forced min-height: 100svh / min-height: 120svh
    ONLY at mobile breakpoints.
    ══════════════════════════════════════════ */
  @media (max-width: 680px) {
    /* All "world" sections: drop forced full-screen height */
    .world,
    #one, #two, #three, #four, #five, #six, #seven {
      min-height: unset !important;
      height: auto !important;
    }

    /* FIX 8 — OVERFLOW: kill horizontal scroll globally */
    html, body {
      overflow-x: hidden !important;
      max-width: 100vw;
    }
    * { max-width: 100%; }

    /* ══════════════════════════════════════════
      FIX 1 — HERO SECTION
      ══════════════════════════════════════════ */
    #one {
      position: relative;
      /* Give section enough height for the absolutely-positioned name */
      min-height: 100svh !important; /* hero still needs full viewport */
      padding-bottom: 80px;
    }

    /* Push name block down so it clears the nav and status bar */
    .hero-name-wrap {
      left: 3% !important;
      width: 94% !important;
      top: 52% !important;          /* slightly lower than 50% */
      transform: translateY(-50%) !important;
    }

    /* Smaller, no-clip typography */
    .hn-manu {
      font-size: clamp(3.8rem, 19vw, 7.5rem) !important;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: clip;
    }
    .hn-rejimon {
      font-size: clamp(3.2rem, 16vw, 6.5rem) !important;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: clip;
    }

    /* Status / coord — keep visible but tuck tighter */
    .f-status {
      top: 56px !important;
      left: 16px !important;
      font-size: .42rem !important;
    }
    .f-coord {
      top: 56px !important;
      right: 12px !important;
      font-size: .42rem !important;
    }

    /* HUD — shrink further on very narrow screens */
    .hero-hud {
      right: 8px !important;
      bottom: 16px !important;
      min-width: 150px !important;
      padding: 10px 12px !important;
    }
    .hh-k { font-size: .4rem !important; min-width: 42px !important; }
    .hh-v { font-size: .56rem !important; }

    /* Scroll cue — keep visible */
    .scroll-cue { left: 16px !important; bottom: 16px !important; }

    /* ══════════════════════════════════════════
      FIX 2 — BUILDING INTELLIGENCE SECTION
      ══════════════════════════════════════════ */
    #two {
      display: flex !important;
      flex-direction: column !important;
      padding-bottom: 40px;
    }

    /* Each word block: relative flow, generous but asymmetric spacing */
  .id-word-building {
    position: relative !important;
    left: 0 !important;
    top: auto !important;

    font-size: clamp(3.2rem, 14vw, 6.5rem) !important;

    padding: 60px 18px 0 18px !important;
    margin: 0 !important;

    line-height: .9 !important;

    width: 100% !important;

    overflow: visible !important;
    white-space: normal !important;

    transform: none !important;
  }

    .id-word-intelligence {
      position: relative !important;
      left: auto !important; top: auto !important;
      font-size: clamp(2.4rem, 10.5vw, 5rem) !important;
      /* preserve the original slight right-indent feel */
      padding: 8px 18px 0 7% !important;
      margin: 0 !important;
      line-height: .9 !important;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: clip;
    }

    .id-word-into {
      position: relative !important;
      left: auto !important; top: auto !important;
      font-size: clamp(1.7rem, 6.5vw, 3.2rem) !important;
      padding: 10px 18px 24px 5% !important;
      margin: 0 !important;
      line-height: .9 !important;
    }

    /* Stats row: horizontal scroll-free flex wrap */
    .id-stats {
      position: relative !important;
      right: auto !important; top: auto !important;
      display: flex !important;
      flex-direction: row !important;
      flex-wrap: wrap !important;
      gap: 0 !important;
      padding: 0 18px 24px !important;
    }
    .ist { flex: 1 1 40%; }
    .ist-mid { margin-left: 0 !important; }

    /* Body copy */
    .id-body {
      position: relative !important;
      right: auto !important; bottom: auto !important;
      width: 96% !important;
      padding: 12px 18px 28px !important;
    }

    /* Prevent environmental ghost number overflow */
    .ide-number { display: none !important; }

    /* ══════════════════════════════════════════
      FIX 3 — LEXAI SECTION
      ══════════════════════════════════════════ */
    #three {
      display: flex !important;
      flex-direction: column !important;
      min-height: unset !important;
      padding-bottom: 40px;
    }

    .lex-name-zone {
      position: relative !important;
      left: auto !important; top: auto !important;
      /* breathing room from section top */
      padding: 70px 18px 12px !important;
      max-width: 100% !important;
      overflow: visible !important;
      left: 0 !important;
      padding-left: 65px !important;
    }

    .lex-nm{
    display:block !important;
    position:relative !important;
    left:auto !important;
    font-size:clamp(4rem,17vw,9rem) !important;
    width:auto !important;
    max-width:92vw !important;
    overflow:visible !important;
    white-space:nowrap !important;
    line-height:.88 !important;
    transform:none !important;
    margin:0 !important;
    letter-spacing:-0.06em !important;
    }
    .lex-sub  { font-size: .88rem !important; }
    .lex-tagline { font-size: .42rem !important; }

    /* lex-nodes already hidden at ≤1100px — confirm */
    .lex-nodes { display: none !important; }

    /* ══════════════════════════════════════════
      FIX 4 — TERMINALS / PANELS
      ══════════════════════════════════════════ */

    /* LexAI terminal */
    .lex-terminal {
      position: relative !important;
      right: auto !important; bottom: auto !important;
      width: 96% !important;
      margin: 12px auto 0 !important;
      box-sizing: border-box;
      overflow: hidden;
    }

    /* LexAI vector viz */
    .lex-vec {
      position: relative !important;
      right: auto !important; top: auto !important;
      width: 96% !important;
      margin: 0 auto 12px !important;
      box-sizing: border-box;
    }

    /* LexAI source link */
    .lex-src {
      position: relative !important;
      left: auto !important; bottom: auto !important;
      display: inline-block !important;
      margin: 0 18px 20px !important;
    }

    /* LexAI strip */
    .lex-strip {
      position: relative !important;
      padding: 10px 18px !important;
      flex-wrap: wrap !important;
      gap: 8px !important;
    }

    /* Tech Stack terminal */
    .sk-terminal {
      position: relative !important;
      left: auto !important; right: auto !important; top: auto !important;
      width: 96% !important;
      margin: 0 auto 16px !important;
      max-height: 320px !important;
      box-sizing: border-box;
      overflow: hidden;
    }

    /* Contact form panel */
    .ct-form-wrap {
      position: relative !important;
      right: auto !important; top: auto !important;
      width: 96% !important;
      margin: 16px auto 32px !important;
      padding: 18px 16px !important;
      box-sizing: border-box;
    }

    /* Inputs inside form: prevent iOS zoom (font-size ≥ 16px) */
    .cff input,
    .cff textarea {
      font-size: 16px !important;
    }

    /* Hero HUD: already handled above */

    /* ══════════════════════════════════════════
      FIX 5 — WHERE IT BEGAN SECTION
      ══════════════════════════════════════════ */
    #six {
      display: flex !important;
      flex-direction: column !important;
      padding-bottom: 40px;
    }

  .exp-where {
    position: relative !important;

    left: 0 !important;
    top: auto !important;

    font-size: clamp(3.2rem, 15vw, 6.5rem) !important;

    padding: 64px 18px 0 18px !important;

    line-height: .88 !important;

    width: 100% !important;

    overflow: visible !important;
    white-space: normal !important;

    transform: none !important;
  }

    /* "it began." — preserve right-indent rhythm */
    .exp-began {
      position: relative !important;
      left: auto !important; top: auto !important;
      font-size: clamp(2.4rem, 11vw, 4.8rem) !important;
      padding: 6px 18px 20px 6% !important;
      line-height: .88 !important;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: clip;
    }

    .exp-entry {
      position: relative !important;
      right: auto !important; top: auto !important;
      transform: none !important;
      width: 96% !important;
      padding: 0 18px !important;
      margin: 0 auto 20px !important;
    }

    .exp-quote {
      position: relative !important;
      left: auto !important; bottom: auto !important;
      padding: 0 18px 36px !important;
      font-size: .88rem !important;
    }

    /* hide large ghost year to prevent overflow */
    .exp-ghost-yr { display: none !important; }
    .exp-ghost-mo { display: none !important; }

    /* ══════════════════════════════════════════
      FIX 6 — CONTACT SECTION
      ══════════════════════════════════════════ */
    #seven {
      display: flex !important;
      flex-direction: column !important;
      padding-bottom: 60px;
      overflow: hidden;
    }

    /* Marquee — clamp tighter, give it fixed height */
    .ct-mq {
      max-height: 60px !important;
      overflow: hidden !important;
      flex-shrink: 0;
    }
    .ct-mtrack {
      font-size: clamp(1.6rem, 7vw, 3rem) !important;
      padding: 0 !important;
      /* keep vertical centering inside the clamped container */
      line-height: 60px !important;
    }

    /* Title zone: relative, below marquee */
    .ct-title-zone {
      position: relative !important;
      left: auto !important; top: auto !important;
      /* add margin-top to breathe from marquee */
      padding: 28px 18px 0 !important;
      margin-top: 8px !important;
    }
    .ctt-l1, .ctt-l3 { font-size: clamp(2.4rem, 11vw, 4.5rem) !important; }
    .ctt-l2           { font-size: clamp(2rem, 10vw, 4rem) !important; }

    /* Contact links */
    .ct-links {
      position: relative !important;
      left: auto !important; bottom: auto !important;
      width: 96% !important;
      margin: 24px auto 0 !important;
    }

    /* Contact form already handled in FIX 4 */

    /* ══════════════════════════════════════════
      PROJECTS — ensure no overflow on mobile
      ══════════════════════════════════════════ */
    .proj-scene {
      padding: 48px 18px 48px !important;
      overflow: hidden;
    }
    .ps-num-bg { display: none !important; }
    .ps-title  { font-size: clamp(2rem, 8vw, 3.2rem) !important; }
    .psv-frame, .psv-term { overflow: hidden; }

    /* Skills columns: stack vertically */
    .sk-cols {
      position: relative !important;
      grid-template-columns: 1fr !important;
    }
    .skc { border-right: none !important; border-top: 1px solid var(--rim) !important; }
    .skc:first-child { border-top: none !important; }
    .skc-0, .skc-1, .skc-2 { padding: 26px 18px 22px !important; }

    .sk-env-title {
      position: relative !important;
      left: auto !important; top: auto !important;
      padding: 64px 18px 14px !important;
    }
    .sket-line1 { font-size: clamp(3.2rem, 13vw, 7rem) !important; }
    .sket-line2 { font-size: clamp(2.8rem, 11vw, 6rem) !important; }

    .sk-rule { display: none !important; }

    /* ══════════════════════════════════════════
      FOOTER
      ══════════════════════════════════════════ */
    #foot { padding: 26px 18px 18px !important; overflow: hidden; }
    .ft-ghost {
      font-size: clamp(4rem, 15vw, 9rem) !important;
      white-space: nowrap;
      overflow: hidden;
    }
    .ft-bottom { flex-direction: column !important; gap: 5px !important; }

    /* NAV */
    #n-status { display: none !important; }
    .n-hello  { padding: 5px 10px !important; font-size: .5rem !important; }
  }

  /* ══════════════════════════════════════════
    FIX — VERY SMALL PHONES (≤390px)
    additional tightening on top of 680 rules
    ══════════════════════════════════════════ */
  @media (max-width: 390px) {
    .hn-manu    { font-size: clamp(3rem, 20vw, 5rem) !important; }
    .hn-rejimon { font-size: clamp(2.6rem, 17vw, 4.4rem) !important; }
    .hero-hud   { display: none !important; }

    .id-word-building    { font-size: clamp(2.8rem, 13vw, 5rem) !important; }
    .id-word-intelligence{ font-size: clamp(2rem, 10vw, 3.8rem) !important; }
    .id-word-into        { font-size: clamp(1.5rem, 6vw, 2.5rem) !important; }

    .lex-nm { font-size: clamp(3.2rem, 16vw, 7rem) !important; }

    .exp-where  { font-size: clamp(2.8rem, 14vw, 5.2rem) !important; }
    .exp-began  { font-size: clamp(2.2rem, 10vw, 4rem) !important; }

    .ctt-l1, .ctt-l3 { font-size: clamp(2rem, 12vw, 3.5rem) !important; }
    .ctt-l2          { font-size: clamp(1.8rem, 11vw, 3rem) !important; }

    .ct-mtrack { font-size: clamp(1.4rem, 7vw, 2.4rem) !important; }

    .ps-title { font-size: clamp(1.8rem, 8vw, 2.8rem) !important; }
  }