/* Inside Semicon — Mobile Pro v1
   Additive responsive layer only. Desktop (>=901px) is untouched. */

@media (max-width: 900px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  body { -webkit-text-size-adjust: 100%; }
  img, svg, video, iframe { max-width: 100%; }
  input, select, textarea, button { max-width: 100%; }

  .page-width { width: calc(100% - 28px) !important; }

  /* Premium compact mobile header + horizontally scrollable primary navigation. */
  .site-header { height: auto !important; min-height: 72px; position: sticky; top: 0; z-index: 1000; backdrop-filter: blur(14px); }
  .site-header .header-inner {
    width: 100% !important;
    height: auto !important;
    min-height: 72px;
    padding: 10px 14px 0;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    grid-template-areas: "brand actions" "nav nav";
    gap: 8px 10px;
  }
  .site-header .brand { grid-area: brand; transform: none !important; }
  .site-header .brand > span { font-size: 22px !important; line-height: .78 !important; }
  .site-header .brand small { font-size: 6px !important; margin-top: 6px !important; }
  .site-header .header-actions { grid-area: actions; display: flex !important; align-items: center; justify-content: flex-end; }
  .site-header .search-btn { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.55); }
  .site-header .main-nav {
    grid-area: nav;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center;
    width: calc(100% + 28px);
    margin-left: -14px;
    padding: 0 14px 9px;
    gap: 6px !important;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-width: none;
    white-space: nowrap;
    height: auto !important;
    scroll-snap-type: x proximity;
  }
  .site-header .main-nav::-webkit-scrollbar { display: none; }
  .site-header .main-nav > a,
  .site-header .main-nav > details > summary {
    flex: 0 0 auto;
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 11px !important;
    display: inline-flex !important;
    align-items: center;
    border: 1px solid #ddd6ce;
    border-radius: 999px;
    background: #fbf8f3;
    font-size: 9px !important;
    font-weight: 850 !important;
    scroll-snap-align: start;
  }
  .site-header .main-nav > a.active,
  .site-header .main-nav > details > summary.active { background: var(--yellow); border-color: #d8bd45; }
  .site-header .main-nav > a.active:after { display: none !important; }
  .site-header .nav-more { flex: 0 0 auto; position: relative; }
  .site-header .nav-more-menu { position: fixed !important; top: 112px !important; left: 14px !important; right: 14px !important; width: auto !important; max-height: calc(100vh - 135px); overflow-y: auto; transform: none !important; z-index: 1200 !important; }
  .site-header .member-nav-access-v2 { display: flex !important; flex: 0 0 auto; gap: 6px !important; }
  .site-header .member-nav-access-v2 a.member-login-v2,
  .site-header .member-nav-access-v2 a.member-join-v2 { min-height: 34px !important; height: 34px !important; padding: 0 11px !important; font-size: 9px !important; border-radius: 999px !important; }

  /* Market strips stay useful without stealing vertical space. */
  .market-gujarat-shell .market-wrap { padding: 4px 0 !important; }
  .market-gujarat-shell .market-card,
  .market-gujarat-shell .india-card-row { min-height: 58px !important; grid-template-columns: 92px minmax(0,1fr) !important; padding: 0 8px !important; border-radius: 11px !important; }
  .market-gujarat-shell .region-block { gap: 5px !important; }
  .market-gujarat-shell .region-block strong { font-size: 12px !important; }
  .market-gujarat-shell .map-mark { width: 30px !important; height: 30px !important; }

  /* Shared layout safety. */
  main, section, article, aside, form { min-width: 0; }
  .hero-grid, .content-row, .newsletter { grid-template-columns: 1fr !important; }
  .hero-copy { padding: 22px 14px 16px !important; }
  .hero-copy h1 { font-size: clamp(42px, 13vw, 58px) !important; line-height: .92 !important; margin: 18px 0 14px !important; }
  .hero-copy p { font-size: 13px !important; }
  .hero-actions { flex-wrap: wrap; }
  .hero-actions > * { min-height: 44px; }
  .hero-right { grid-template-columns: 1fr !important; padding: 0 14px !important; }
  .signal-grid { grid-template-columns: 1fr 1fr !important; }
  .daily-card { height: auto !important; min-height: 300px; padding: 24px !important; }
  .daily-card h2 { font-size: 36px !important; margin: 34px 0 22px !important; }

  .snapshot, .feature-grid, .content-row, .latest-section, .ecosystem-section, .newsletter {
    margin-left: 14px !important; margin-right: 14px !important;
  }
  .snapshot { grid-template-columns: 1fr 1fr !important; }
  .feature-grid, .latest-grid, .ecosystem-grid { grid-template-columns: 1fr 1fr !important; }
  .content-row { gap: 14px !important; }
  .story-image, .top-story { min-height: 340px !important; }
  .story-copy { left: 18px !important; right: 18px; bottom: 18px !important; width: auto !important; }
  .story-copy h2 { font-size: 24px !important; }
  .latest-image { height: 160px !important; }
  .newsletter { padding: 25px 20px !important; gap: 18px !important; }
  .newsletter form { min-width: 0; }
  .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 26px !important; }

  /* Generic card/form/table protection used across intelligence pages. */
  table { max-width: 100%; }
  .table-responsive, .table-wrap, .data-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  button, .btn, a[class*="btn"] { touch-action: manipulation; }
  input, select, textarea { font-size: 16px; } /* prevents iOS focus zoom */

  /* Marketplace */
  .mp { overflow-x: hidden; }
  .mp .mp-hero, .mp .mp-detail, .mp .mp-split, .mp .mp-form-grid { grid-template-columns: 1fr !important; }
  .mp .mp-grid { grid-template-columns: 1fr 1fr !important; }
  .mp .mp-hero-main { min-height: 0 !important; }
  .mp .mp-actions .mp-btn { min-height: 46px; }

  /* Media */
  .mm-actions-strip, .mm-search-top { grid-template-columns: 1fr !important; }
  .mm-row { grid-auto-columns: min(82vw, 310px) !important; }
}

@media (max-width: 620px) {
  .page-width { width: calc(100% - 22px) !important; }
  .site-header .header-inner { padding-left: 11px; padding-right: 11px; }
  .site-header .main-nav { width: calc(100% + 22px); margin-left: -11px; padding-left: 11px; padding-right: 11px; }
  .site-header .nav-more-menu { left: 11px !important; right: 11px !important; }

  .signal-grid, .snapshot, .feature-grid, .latest-grid, .ecosystem-grid { grid-template-columns: 1fr !important; }
  .signal-card { min-height: 138px !important; }
  .snapshot, .feature-grid, .content-row, .latest-section, .ecosystem-section, .newsletter { margin-left: 11px !important; margin-right: 11px !important; }
  .snapshot-item { border-left: 0 !important; border-top: 1px solid var(--line); }
  .feature-card { min-height: 112px !important; padding: 16px !important; }
  .latest-image { height: 190px !important; }
  .section-title-row { align-items: flex-start !important; gap: 10px; }
  .section-title-row h2 { font-size: 23px !important; }
  .newsletter h2 { font-size: 24px !important; }
  .newsletter form { display: grid !important; grid-template-columns: 1fr; gap: 7px; background: transparent !important; padding: 0 !important; }
  .newsletter input, .newsletter button { min-height: 46px; border-radius: 9px; }
  .footer-grid { grid-template-columns: 1fr !important; gap: 22px !important; }

  .mp .mp-grid, .mp .mp-stats { grid-template-columns: 1fr !important; }
  .mp .mp-hero-main, .mp .mp-formhead, .mp .mp-form, .mp .mp-detail-media, .mp .mp-detail-body { padding: 20px 16px !important; }
  .mp .mp-banner { align-items: flex-start !important; flex-direction: column !important; }
  .mp .mp-btn { width: 100%; }

  .breaking-item { grid-template-columns: 92px minmax(0,1fr) !important; }
}

@media (max-width: 390px) {
  .site-header .brand > span { font-size: 20px !important; }
  .hero-copy h1 { font-size: 40px !important; }
  .story-copy h2 { font-size: 21px !important; }
  .breaking-item { grid-template-columns: 82px minmax(0,1fr) !important; gap: 9px !important; }
}

/* ===== Inside Semicon Mobile Pro v2 polish =====
   Cross-browser responsive layer for modern Android/Chrome, iPhone/iPad/Safari,
   Samsung Internet, Edge and other standards-based browsers. No backend changes. */

@media (max-width: 900px) {
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { width: 100%; }
  :where(h1,h2,h3,p,a,span,strong,small) { overflow-wrap: anywhere; }

  /* Home: readable story cards instead of desktop image-overlay collisions. */
  .top-story { min-height: 0 !important; overflow: hidden !important; }
  .top-story .story-image { min-height: 0 !important; height: auto !important; display: flex !important; flex-direction: column !important; background: var(--paper, #f7f3ed) !important; }
  .top-story .story-image > img { position: relative !important; inset: auto !important; width: 100% !important; height: clamp(210px, 58vw, 330px) !important; object-fit: cover !important; display: block !important; }
  .top-story .story-overlay { display: none !important; }
  .top-story .story-copy { position: relative !important; inset: auto !important; left: auto !important; right: auto !important; bottom: auto !important; width: 100% !important; padding: 18px !important; color: var(--ink, #111) !important; background: var(--paper, #f7f3ed) !important; }
  .top-story .story-copy h2 { color: var(--ink, #111) !important; font-size: clamp(22px, 6.3vw, 30px) !important; line-height: 1.05 !important; }
  .top-story .story-copy p { color: #5f5a55 !important; font-size: 13px !important; line-height: 1.45 !important; }
  .top-story .story-badge { position: absolute !important; top: 14px !important; left: 14px !important; z-index: 3; }

  .latest-card { overflow: hidden !important; }
  .latest-card .latest-image { position: relative !important; }
  .latest-card .latest-body { position: relative !important; color: var(--ink, #111) !important; background: var(--paper, #f7f3ed) !important; }
  .latest-card .latest-body h3, .latest-card .latest-body p { color: inherit !important; text-shadow: none !important; }

  /* Shared intelligence page heroes: keep editorial impact without clipping. */
  .india-main h1, .gj-main h1, .an-main h1,
  .research-hero-main h1 {
    font-size: clamp(40px, 11vw, 66px) !important;
    line-height: .93 !important;
    letter-spacing: -.045em !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
  .india-main p, .gj-main p, .an-main p, .research-hero-main p {
    font-size: clamp(15px, 4.2vw, 20px) !important;
    line-height: 1.5 !important;
  }
  .india-main, .gj-main, .an-main, .research-hero-main { padding: clamp(24px, 7vw, 44px) !important; }
  .india-stats, .gj-stats, .an-stats, .research-stats { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .india-stat, .gj-stat, .an-stat, .research-stat { min-width: 0 !important; min-height: 150px !important; padding: 20px !important; }

  /* Analytics: only the chart scrolls, never the whole page. */
  .an-trend-wrap { width: 100% !important; max-width: 100% !important; overflow-x: auto !important; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
  .an-trend { min-width: 620px !important; }

  /* Events: replace compressed desktop row with a true mobile card. */
  .ev-submit.ev-submit-dark { grid-template-columns: 1fr !important; min-height: 0 !important; padding: 24px 20px !important; gap: 22px !important; }
  .ev-submit.ev-submit-dark h2 { font-size: clamp(34px, 10vw, 54px) !important; overflow-wrap: normal !important; word-break: normal !important; }
  .ev-submit-btn.ev-submit-btn-card { width: 100% !important; min-width: 0 !important; }
  .ev-row { grid-template-columns: 1fr !important; min-height: 0 !important; overflow: hidden !important; }
  .ev-date { min-height: 58px !important; justify-content: flex-start !important; border-right: 0 !important; border-bottom: 1.5px solid var(--ink) !important; padding: 14px 18px !important; font-size: 17px !important; }
  .ev-row-content { padding: 16px 18px !important; align-items: flex-start !important; }
  .ev-row-thumb { width: 86px !important; height: 64px !important; flex: 0 0 86px !important; }
  .ev-open { margin: 0 18px 18px !important; justify-self: start !important; }

  /* Marketplace: hero/title must never extend beyond phone viewport. */
  .mp { width: 100% !important; max-width: 100% !important; overflow-x: clip !important; }
  .mp .mp-hero, .mp .mp-shell, .mp .mp-hero-main { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
  .mp .mp-hero-main { padding: 26px 20px !important; }
  .mp h1 { font-size: clamp(38px, 10.5vw, 58px) !important; line-height: .94 !important; overflow-wrap: normal !important; word-break: normal !important; }
  .mp .mp-pill { max-width: 100% !important; white-space: normal !important; }
  .mp .mp-trust { gap: 12px !important; }
  .mp .mp-searchbox { width: 100% !important; }
  .mp .mp-stats { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .mp .mp-stat { min-width: 0 !important; }

  /* Member/auth pages already work well; just protect iOS zoom/safe areas. */
  .member-shell, .member-card, .member-auth-card { max-width: 100% !important; }
}

@media (max-width: 620px) {
  /* Consistent safe gutters on compact Android/iPhone widths. */
  .india-shell, .gj-shell, .an-shell, .research-shell, .ev-shell { width: calc(100% - 22px) !important; max-width: 100% !important; }
  .india-main h1, .gj-main h1, .an-main h1, .research-hero-main h1 { font-size: clamp(38px, 12vw, 52px) !important; }
  .india-main, .gj-main, .an-main, .research-hero-main { padding: 24px 20px !important; }
  .india-stat, .gj-stat, .an-stat, .research-stat { min-height: 132px !important; padding: 16px !important; }
  .india-stat strong, .gj-stat strong, .an-stat strong, .research-stat strong { font-size: clamp(34px, 11vw, 52px) !important; }

  .ev-row-content { display: grid !important; grid-template-columns: 76px minmax(0,1fr) !important; gap: 12px !important; }
  .ev-row-thumb { width: 76px !important; height: 58px !important; flex-basis: 76px !important; }

  .mp { padding-left: 11px !important; padding-right: 11px !important; }
  .mp .mp-hero-main { padding: 22px 16px !important; }
  .mp h1 { font-size: clamp(36px, 11.5vw, 48px) !important; }
  .mp .mp-stats { grid-template-columns: 1fr 1fr !important; }
  .mp .mp-stat { min-height: 118px !important; padding: 16px !important; }
  .mp .mp-stat strong { font-size: 32px !important; }

  .executive-item { grid-template-columns: 56px minmax(0,1fr) !important; gap: 12px !important; }
  .executive-item .exec-icon { width: 56px !important; height: 56px !important; }
}

@media (max-width: 430px) {
  .hero-copy h1 { font-size: clamp(38px, 11.5vw, 48px) !important; }
  .hero-actions { display: grid !important; grid-template-columns: 1fr !important; }
  .hero-actions > * { width: 100% !important; justify-content: center !important; }
  .india-stats, .gj-stats, .an-stats, .research-stats { gap: 10px !important; }
  .ev-head { align-items: flex-start !important; }
  .ev-row-content { grid-template-columns: 68px minmax(0,1fr) !important; }
  .ev-row-thumb { width: 68px !important; height: 54px !important; }
}

/* Tablet polish: portrait iPad/Android tablets keep two-column density. */
@media (min-width: 621px) and (max-width: 900px) {
  .signal-grid, .feature-grid, .latest-grid, .ecosystem-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .mp .mp-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .ev-featured { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}

/* Safe-area support for notched iPhones/iPads; harmless elsewhere. */
@supports (padding: max(0px)) {
  @media (max-width: 900px) {
    .site-header .header-inner { padding-left: max(11px, env(safe-area-inset-left)); padding-right: max(11px, env(safe-area-inset-right)); }
  }
}

/* ===== Inside Semicon Mobile Pro v3 — final phone/tablet QA ===== */
@media (max-width: 480px) {
  /* Long editorial words must fit 320–480px Android/iPhone viewports. */
  .mp h1 {
    font-size: clamp(30px, 9.25vw, 42px) !important;
    line-height: .96 !important;
    letter-spacing: -.05em !important;
    max-width: 100% !important;
  }
  .mp .mp-hero-main { padding: 22px 16px !important; overflow: hidden !important; }
  .mp .mp-pill { font-size: clamp(10px, 3.1vw, 12px) !important; padding: 7px 10px !important; }
  .mp .mp-lead { font-size: 16px !important; line-height: 1.48 !important; }
  .mp .mp-trust { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }

  .ev-submit.ev-submit-dark { padding: 24px 20px !important; overflow: hidden !important; }
  .ev-submit.ev-submit-dark h2 {
    font-size: clamp(30px, 9.4vw, 42px) !important;
    line-height: .96 !important;
    letter-spacing: -.045em !important;
    max-width: 100% !important;
  }
  .ev-submit-badge { max-width: 100% !important; white-space: normal !important; line-height: 1.25 !important; }
  .ev-submit.ev-submit-dark p { font-size: 13px !important; line-height: 1.5 !important; }
  .ev-submit-btn.ev-submit-btn-card { min-height: 72px !important; }

  .india-main h1, .gj-main h1, .an-main h1, .research-hero-main h1 {
    font-size: clamp(34px, 10.4vw, 46px) !important;
    line-height: .95 !important;
  }
}

@media (min-width: 481px) and (max-width: 900px) {
  /* Tablet header: keep navigation usable instead of squeezing desktop controls. */
  .site-header .header-inner {
    grid-template-columns: minmax(150px, .55fr) auto !important;
    grid-template-areas: "brand actions" "nav nav" !important;
  }
  .site-header .main-nav {
    width: calc(100% + 28px) !important;
    margin-left: -14px !important;
    overflow-x: auto !important;
    justify-content: flex-start !important;
  }
  .site-header .main-nav > a,
  .site-header .main-nav > details > summary,
  .site-header .member-nav-access-v2 a.member-login-v2,
  .site-header .member-nav-access-v2 a.member-join-v2 {
    flex: 0 0 auto !important;
  }

  /* Market rows intentionally swipe horizontally on tablets rather than clip. */
  .market-gujarat-shell { overflow: hidden !important; }
  .market-gujarat-shell .market-card,
  .market-gujarat-shell .india-card-row {
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  /* Give the two top utility cards breathing room at portrait tablet widths. */
  .gujarat-promo-feedback-wrap,
  .gujarat-feedback-grid,
  .top-utility-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (min-width: 621px) and (max-width: 820px) {
  .hero-copy h1 { font-size: clamp(50px, 8vw, 66px) !important; }
  .page-width { width: calc(100% - 32px) !important; }
}

/* ================================================================
   V4 FINAL TABLET QA FIX
   Based on 768px portrait QA: keep Gujarat + experience cards from
   competing for the same row. Phone and desktop behaviour unchanged.
   ================================================================ */
@media (min-width: 621px) and (max-width: 900px) {
  .market-gujarat-shell .gujarat-experience-cluster {
    width: 100% !important;
    height: auto !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    min-width: 0 !important;
  }

  .market-gujarat-shell .gujarat-experience-cluster > .gujarat-semicon-card,
  .market-gujarat-shell .gujarat-experience-cluster > .site-experience-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .market-gujarat-shell .gujarat-experience-cluster > .gujarat-semicon-card {
    height: 150px !important;
    min-height: 150px !important;
    max-height: none !important;
  }

  .market-gujarat-shell .gujarat-experience-cluster > .site-experience-card {
    height: auto !important;
    min-height: 132px !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  .market-gujarat-shell .site-experience-title,
  .market-gujarat-shell .site-feedback-response-text,
  .market-gujarat-shell .site-feedback-response-small {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

/* ==========================================================
   V5 — surgical desktop QA fix
   Keep the Home MarketPlace title inside its existing card.
   Mobile/tablet rules above remain unchanged.
   ========================================================== */
@media (min-width: 901px) {
  .marketplace-home-card .mp-home-title {
    font-size: clamp(34px, 2.45vw, 46px) !important;
    line-height: .94 !important;
    letter-spacing: -.045em !important;
    max-width: 100% !important;
    white-space: nowrap !important;
  }
}