/* Approved mobile refinement. Desktop styles and the original vector stay intact. */

@media (max-width:1100px) {
  /* Reserve the same header row whether the navigation is open or closed.
     The original flex-wrap shrank this row when the navigation appeared. */
  .header-inner {
    --mobile-header-row:66px;
    display:grid; grid-template-columns:minmax(0,1fr) 72px;
    grid-template-rows:var(--mobile-header-row) auto;
    align-items:center; gap:0; padding:0;
    min-height:var(--mobile-header-row);
  }
  .header-inner .brand { grid-column:1; grid-row:1; justify-self:start; }
  .header-inner .menu-toggle {
    grid-column:2; grid-row:1; align-self:center; justify-self:end;
    display:grid; grid-template-columns:20px 28px;
    align-items:center; justify-content:start; gap:8px;
    box-sizing:border-box; width:72px; height:44px; min-height:44px;
    margin:0; padding:0 0 0 16px; border:0; border-radius:0;
    background:none; color:#1a4076;
    font-family:'Temco Sans','Malgun Gothic',sans-serif;
    font-size:15px; font-weight:600; line-height:1.4;
  }
  .header-inner .menu-label { width:28px; white-space:nowrap; text-align:right; }
  .header-inner #main-nav {
    grid-column:1 / -1; grid-row:2; margin:0;
    max-height:calc(100svh - var(--mobile-header-row) - 1px);
    overflow-y:auto; overscroll-behavior:contain;
  }

  /* Three actual equal strokes: 2px high, 20px wide, separated by 5px. */
  .menu-lines {
    display:flex; flex-direction:column; justify-content:space-between;
    flex:0 0 20px; width:20px; height:16px;
    background:none; border:0; box-shadow:none;
  }
  .menu-lines > span {
    display:block; flex:none; width:100%; height:2px;
    margin:0; padding:0; border:0; background:currentColor;
  }
  .menu-lines::after { content:none; display:none; }
  .menu-lines { position:relative; }
  .menu-lines > svg {
    display:block; position:absolute; left:50%; top:50%;
    transform:translate(-50%,-50%); max-width:none; overflow:visible;
  }

  /* Approved comparison: keep only the title beam and close the unused gap. */
  .c3-light-rule { display:none; }
  .c3-description { margin-top:26px; }

  /* Carry the approved PC title light into mobile at a restrained scale. */
  .c3-series { position:relative; isolation:isolate; }
  .c3-series::before {
    content:''; position:absolute; pointer-events:none; z-index:-1;
    left:-14px; right:-14px; bottom:0; height:1.5px;
    background:linear-gradient(90deg,transparent 0%,#087cd670 8%,#c5f3ff 24%,#42c4ff 45%,#138de082 74%,transparent 100%);
    box-shadow:0 0 6px 1px #219dff99,0 0 15px 2px #1275dd66;
  }
  .c3-series::after {
    content:''; position:absolute; pointer-events:none; z-index:-2;
    left:-20px; right:-20px; bottom:-9px; height:20px;
    background:radial-gradient(ellipse at 35% 50%,#72d7ff75 0%,#0877da47 28%,#0571ca18 53%,transparent 74%);
    filter:blur(4px);
  }

  /* Use the same photographic reflections as PC, with a shorter mobile fade. */
  .c3-reflection { display:none; }
  .c3-photo::before {
    content:''; position:absolute; pointer-events:none;
    left:0; right:auto; top:-2px; bottom:auto;
    width:100%; height:136.36364%; border-radius:0;
    background:var(--mobile-floor-reflection) 0 0 / 100% 100% no-repeat;
    mask-image:linear-gradient(to bottom,#000 0%,#000 65%,transparent 88%);
    filter:none; transform:none; opacity:.85; z-index:-1;
  }
  .module-1 { --mobile-floor-reflection:url('assets/m74c-floor-reflection.svg'); }
  .module-2 { --mobile-floor-reflection:url('assets/m74-floor-reflection.svg'); }
  .module-3 { --mobile-floor-reflection:url('assets/m74p-floor-reflection.svg'); }
  .module-4 { --mobile-floor-reflection:url('assets/m74r-floor-reflection.svg'); }
  .c3-photo::after { content:none; }
  .c3-photo > img { transform:translateY(-2px); filter:drop-shadow(0 2px 1px #0004); }
  /* Keep photographs fixed. Align each label's M/7 boundary to the front
     bottom corner at about 54.5% of the photographed width. The descriptions
     travel with the model names, preserving their shared centre. */
  .module-1 { --caption-glyph-factor:.4786; }
  .module-2 { --caption-glyph-factor:.1318; }
  .module-3 { --caption-glyph-factor:.42935; }
  .module-4 { --caption-glyph-factor:.43342; }
  .c3-product figcaption {
    --caption-model-size:25px;
    transform:translateX(calc(4.5% + var(--caption-glyph-factor) * var(--caption-model-size)));
  }
  /* Match the selected PC model-label font; retain mobile sizes and alignment. */
  .c3-lineup .c3-product figcaption strong {
    font-family:'Temco Sans',sans-serif; font-weight:650;
    letter-spacing:-.025em; transform:none;
  }
}
@media (max-width:700px) {
  .header-inner { --mobile-header-row:60px; }
  .c3-product figcaption { --caption-model-size:23px; }
}