/* CarmaDeal mobile polish — preserves the approved desktop system while
   rebuilding narrow layouts around touch, scanability, and safe proportions. */

@media (max-width: 760px) {
  :root {
    --cde-radius: 17px;
    --cde-shadow: 0 14px 38px rgba(3, 12, 25, .12);
  }

  html { overflow-x: hidden; }
  body { overflow-x: clip; }
  img, svg, video, canvas { max-width: 100%; }
  input, select, textarea, button { font-size: 16px !important; }

  /* Shared navigation */
  .cdh-in {
    width: calc(100% - 28px) !important;
    min-height: 64px !important;
    gap: 10px !important;
  }
  .cdh-brand { font-size: 1.08rem !important; gap: 7px !important; }
  .cdh-mark, .cdh-mark svg { width: 23px !important; height: 23px !important; }
  .cdh-actions { gap: 8px !important; }
  .cdh-cta { min-height: 38px !important; padding: 0 12px !important; font-size: .78rem !important; }
  .cdh-burger { width: 42px !important; height: 42px !important; border-radius: 12px !important; }
  .cdh.cdh-open .cdh-nav {
    inset: 64px 0 auto !important;
    padding: 14px !important;
    gap: 6px !important;
    border-radius: 0 0 20px 20px;
    box-shadow: 0 24px 60px rgba(0,0,0,.28) !important;
  }
  .cdh.cdh-open .cdh-nav a {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    border-radius: 12px;
    background: rgba(255,255,255,.055);
    font-size: .95rem;
    opacity: 1;
  }

  /* Shared footer — keep desktop-like grouping without a very tall link stack */
  .cdf-in { width: calc(100% - 32px) !important; padding: 42px 0 24px !important; }
  .cdf-grid { grid-template-columns: 1fr 1fr !important; gap: 30px 18px !important; }
  .cdf-brand { grid-column: 1 / -1; }
  .cdf-brand p { max-width: 34rem !important; font-size: .92rem !important; }
  .cdf-col h3 { margin-bottom: 10px !important; }
  .cdf-links { gap: 8px !important; }
  .cdf-links a { font-size: .9rem !important; line-height: 1.35; }
  .cdf-legal { margin-top: 30px !important; padding-top: 16px !important; }

  /* Common content surfaces */
  body:has(.cdh) .card,
  body:has(.cdh) .panel,
  body:has(.cdh) .policy-card,
  body:has(.cdh) .chart-card,
  body:has(.cdh) .stat-callout > div {
    border-radius: 17px !important;
    box-shadow: 0 10px 28px rgba(7,20,38,.065) !important;
  }
  body:has(.cdh) .card,
  body:has(.cdh) .panel,
  body:has(.cdh) .policy-card { padding: 18px !important; }
  body:has(.cdh) table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 13px; }
  body:has(.cdh) th, body:has(.cdh) td { white-space: nowrap; }

  /* Homepage header */
  .cde-home header.site {
    min-height: 64px;
    padding: 10px 14px !important;
    align-items: center;
  }
  .cde-home header.site .head-left {
    width: 100%;
    min-width: 0;
    justify-content: space-between;
    gap: 10px !important;
  }
  .cde-home header.site .brand { flex: 0 1 auto; min-width: 0; }
  .cde-home header.site .brand-name { font-size: 1.05rem; }
  .cde-home header.site .brand-mark svg { width: 25px; height: 25px; }
  .cde-home header.site .nav-toggle {
    min-width: 44px;
    min-height: 42px;
    padding: 0 11px;
    border-radius: 12px;
    justify-content: center;
    color: #fff !important;
  }
  .cde-home header.site .head-nav {
    left: 12px !important;
    right: 12px !important;
    top: calc(100% + 4px) !important;
    padding: 10px !important;
    border-radius: 16px;
    background: #0b1b2f !important;
    box-shadow: 0 24px 60px rgba(0,0,0,.3);
  }
  .cde-home header.site .head-nav a {
    min-height: 47px;
    display: flex;
    align-items: center;
    padding: 0 13px;
    border-radius: 11px;
    color: #fff !important;
    background: rgba(255,255,255,.05);
  }
  .cde-home #authSlot .g-signin,
  .cde-home #authSlot .g-btn { display: none !important; }

  /* Homepage hero */
  #screen-input .e2-wrap { width: calc(100% - 32px) !important; }
  #screen-input .e2-hero {
    min-height: 790px !important;
    border-radius: 0 0 24px 24px;
  }
  #screen-input .e2-hero-media img { object-position: 59% center !important; transform: none !important; }
  #screen-input .e2-hero-media:after {
    background: linear-gradient(180deg,rgba(4,12,24,.78) 0%,rgba(4,12,24,.4) 44%,rgba(4,12,24,.9) 100%) !important;
  }
  #screen-input .e2-hero-content { padding: 52px 0 300px !important; }
  #screen-input .e2-hero-copy { max-width: 32rem; }
  #screen-input .e2-eyebrow { font-size: 10px; letter-spacing: .11em; }
  #screen-input .e2-hero h1 {
    font-size: clamp(42px, 13vw, 54px) !important;
    line-height: .96 !important;
    margin: 20px 0 18px !important;
    letter-spacing: -.055em !important;
  }
  #screen-input .e2-hero h1 br { display: none; }
  #screen-input .e2-hero-copy > p { font-size: 15.5px !important; line-height: 1.55; max-width: 31rem; }
  #screen-input .e2-proofline {
    display: flex !important;
    flex-direction: column;
    gap: 10px !important;
    margin-top: 22px !important;
    font-size: 11.5px !important;
  }
  #screen-input .e2-analysis-dock {
    bottom: 18px !important;
    width: calc(100% - 28px) !important;
    grid-template-columns: 1fr !important;
    border-radius: 18px !important;
  }
  #screen-input .e2-dock-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 13px 15px !important;
  }
  #screen-input .e2-dock-intro small { margin: 0; }
  #screen-input .e2-dock-intro b { margin: 0; font-size: 15px; }
  #screen-input .e2-dock-input { padding: 13px 14px 10px !important; }
  #screen-input .e2-input-shell { height: 51px !important; padding: 0 13px !important; }
  #screen-input .e2-dock-meta { flex-direction: column; gap: 4px !important; margin-top: 7px !important; }
  #screen-input .e2-dock-action { padding: 0 14px 14px !important; }
  #screen-input .e2-primary { min-height: 50px; font-size: 14px !important; }

  /* Homepage sections */
  #screen-input .e2-manual-shell { padding-top: 18px !important; }
  #screen-input .e2-manual-shell .form-card { padding: 18px !important; }
  #screen-input .e2-signal { padding: 58px 0 42px !important; }
  #screen-input .e2-signal-grid { gap: 30px !important; }
  #screen-input .e2-display { font-size: clamp(34px, 10vw, 42px) !important; line-height: 1.02 !important; }
  #screen-input .e2-signal-copy { gap: 22px !important; }
  #screen-input .e2-signal-copy p { font-size: 14.5px !important; line-height: 1.55; }

  #screen-input .e2-decision-stage { padding: 12px 0 62px !important; }
  #screen-input .e2-decision-frame {
    min-height: 0 !important;
    padding: 270px 12px 12px;
    border-radius: 20px !important;
  }
  #screen-input .e2-decision-frame > img { height: 300px !important; object-position: 42% center !important; }
  #screen-input .e2-decision-frame:after {
    height: 300px;
    bottom: auto;
    background: linear-gradient(180deg,rgba(5,15,29,.18),rgba(5,15,29,.94)) !important;
  }
  #screen-input .e2-decision-caption {
    top: 22px !important;
    left: 20px !important;
    right: 20px !important;
    bottom: auto !important;
  }
  #screen-input .e2-decision-caption h2 { font-size: 29px !important; max-width: 12ch; }
  #screen-input .e2-decision-caption p { font-size: 12px !important; max-width: 34ch; }
  #screen-input .v3preview {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    width: 100% !important;
    margin: 0 !important;
  }
  #screen-input .v3preview .v3pcard { border-radius: 16px !important; }
  #screen-input .e2-report-head { padding: 15px !important; }
  #screen-input .e2-verdict { grid-template-columns: 96px 1fr !important; }
  #screen-input .e2-score { padding: 18px 9px !important; }
  #screen-input .e2-score strong { font-size: 40px !important; }
  #screen-input .e2-report-data { padding: 16px !important; }
  #screen-input .e2-metric-grid { gap: 11px !important; }
  #screen-input .e2-metric b { font-size: 14px !important; }

  #screen-input .e2-editorial { padding: 64px 0 !important; }
  #screen-input .e2-editorial-head { margin-bottom: 30px !important; }
  #screen-input .e2-story { min-height: 350px !important; border-radius: 18px !important; }
  #screen-input .e2-story.small { min-height: 240px !important; }
  #screen-input .e2-story-copy { left: 19px !important; right: 19px !important; bottom: 18px !important; }
  #screen-input .e2-story-copy h3 { font-size: 24px !important; }
  #screen-input .e2-story.small .e2-story-copy h3 { font-size: 20px !important; }

  #screen-input .e2-tools { padding: 62px 0 !important; }
  #screen-input .e2-tools-head { margin-bottom: 26px !important; }
  #screen-input .e2-tool-card { border-radius: 18px !important; }
  #screen-input .e2-tool-image { height: 220px !important; }
  #screen-input .e2-tool-body { padding: 21px !important; }
  #screen-input .e2-tool-body h3 { font-size: 24px !important; }

  #screen-input .e2-proof { padding-bottom: 62px !important; }
  #screen-input .e2-proof-panel { border-radius: 20px !important; }
  #screen-input .e2-proof-media { min-height: 260px !important; }
  #screen-input .e2-proof-copy { padding: 28px 22px !important; }
  #screen-input .e2-proof-copy h2 { font-size: 33px !important; }
  #screen-input .e2-proof-list { grid-template-columns: 1fr !important; }

  #screen-input .e2-journal { padding: 62px 0 !important; }
  #screen-input .e2-journal-card { min-height: 0 !important; border-radius: 20px !important; }
  #screen-input .e2-journal-media { min-height: 260px !important; }
  #screen-input .e2-journal-copy { padding: 28px 22px !important; }
  #screen-input .e2-journal-copy h2 { font-size: 31px !important; }

  /* Community Wisdom and History Analyzer */
  body:has(#cwGate) main,
  body:has(#hraGate) main { padding: 382px 0 58px !important; }
  body:has(#cwGate) main:before,
  body:has(#hraGate) main:before { height: 350px !important; background-position: 58% center; }
  body:has(#cwGate) main > h1,
  body:has(#hraGate) main > h1 {
    top: 62px !important;
    left: 18px !important;
    right: 18px !important;
    font-size: clamp(38px, 11vw, 46px) !important;
    max-width: 12ch;
  }
  body:has(#cwGate) main > .lede,
  body:has(#hraGate) main > .lede {
    top: 168px !important;
    left: 18px !important;
    right: 18px !important;
    font-size: 14.5px !important;
    line-height: 1.55;
  }
  body:has(#cwGate) main > *:not(h1):not(.lede),
  body:has(#hraGate) main > *:not(h1):not(.lede) { width: calc(100% - 28px) !important; }
  body:has(#cwGate) #cwGate,
  body:has(#hraGate) #hraGate { margin-top: -48px !important; }
  body:has(#cwGate) .panel,
  body:has(#hraGate) .panel { padding: 18px !important; margin-bottom: 18px !important; }
  body:has(#cwGate) form,
  body:has(#hraGate) form { grid-template-columns: 1fr !important; gap: 12px !important; }
  body:has(#cwGate) button[type=submit],
  body:has(#hraGate) button[type=submit] { width: 100%; min-height: 50px; }

  /* FAQ */
  .cde-faq .site-header { padding: 10px 14px !important; }
  .cde-faq .hero { background-position: 60% center !important; }
  .cde-faq .hero-inner { padding: 58px 0 54px !important; }
  .cde-faq .hero h1 { font-size: clamp(38px, 11vw, 46px) !important; line-height: 1 !important; }
  .cde-faq .hero p { font-size: 15px !important; line-height: 1.55; }
  .cde-faq #faq-search { width: 100%; min-height: 52px; box-shadow: 0 14px 36px rgba(0,0,0,.22) !important; }
  .cde-faq .page-shell { width: calc(100% - 28px) !important; padding-top: 34px !important; }
  .cde-faq .category-nav {
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto;
    padding: 8px !important;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .cde-faq .category-nav a,
  .cde-faq .category-nav button { flex: 0 0 auto; min-height: 42px; scroll-snap-align: start; }
  .cde-faq .faq-item { border-radius: 15px !important; }

  /* Blog and guide pages */
  body:has(.idx-head) .idx-head { padding: 62px 16px 58px !important; background-position: 60% center !important; }
  body:has(.idx-head) .idx-head h1 { font-size: clamp(38px, 11vw, 46px) !important; line-height: 1 !important; }
  body:has(.idx-head) .idx-head .sub { font-size: 15px !important; line-height: 1.55; }
  body:has(.idx-head) .post-grid { width: calc(100% - 28px) !important; margin-top: -24px !important; gap: 16px !important; }
  body:has(.idx-head) .post-card { border-radius: 17px !important; }
  body:has(.idx-head) .post-card img,
  body:has(.idx-head) .post-card.featured img { height: 220px !important; min-height: 220px !important; }

  body:has(.crumb-band) .crumb-band,
  body:has(.blog-hero) .blog-hero { padding: 58px 16px 50px !important; }
  body:has(.crumb-band) .art-title { font-size: clamp(35px, 10vw, 44px) !important; }
  body:has(.crumb-band) .wrap-narrow { width: calc(100% - 30px) !important; padding-top: 30px !important; }
  body:has(.crumb-band) article p { font-size: 16px !important; line-height: 1.72; }
  body:has(.crumb-band) article h2 { font-size: 25px !important; margin-top: 40px !important; }
  body:has(.crumb-band) article h3 { font-size: 20px !important; }
  body:has(.crumb-band) article table { display: block; overflow-x: auto; }

  /* Legal, methodology, and SEO pages */
  body:has(.page-hero) .page-hero { margin-bottom: 34px !important; padding: 58px 0 50px !important; background-position: 60% center !important; }
  body:has(.page-hero) .page-hero h1 { font-size: clamp(36px, 10.5vw, 45px) !important; line-height: 1 !important; }
  body:has(.page-hero) .page-hero .container,
  body:has(.page-hero) .container { width: calc(100% - 30px) !important; }
  body:has(.page-hero) .policy-card { padding: 20px !important; }
  body:has(.page-hero) .prose { padding-bottom: 48px !important; }
  body:has(.page-hero) .prose h2 { font-size: 24px !important; margin-top: 40px !important; }

  body:has(.section-title) .hero { padding: 58px 18px 50px !important; background-position: 60% center !important; }
  body:has(.section-title) .hero h1 { font-size: clamp(38px, 11vw, 46px) !important; line-height: 1 !important; }
  body:has(.section-title) > .container > section:not(.hero) { width: calc(100% - 28px) !important; padding: 38px 0 !important; }
  body:has(.section-title) .card { padding: 18px !important; }

  /* Sample report */
  .cde-sample-report .shell { padding: 0 14px 58px !important; }
  .cde-sample-report header.site {
    margin-bottom: 24px !important;
    padding: 12px 14px !important;
    align-items: center;
    gap: 10px;
  }
  .cde-sample-report .header-note { display: none; }
  .cde-sample-report .verdict { padding: 20px !important; }
  .cde-sample-report #reportBody .card { padding: 18px !important; border-radius: 17px !important; }
  .cde-sample-report #reportBody table { display: block; overflow-x: auto; }

  /* Garage, account, and auth */
  .cde-home .g-modal {
    width: calc(100% - 24px) !important;
    max-height: calc(100dvh - 24px);
    overflow-y: auto;
    padding: 22px 18px !important;
    border-radius: 19px !important;
  }
  .cde-home .g-modal h2 { font-size: 24px !important; }
  .cde-home #screen-dashboard,
  .cde-home #screen-deal { width: calc(100% - 28px); padding: 32px 0 58px !important; }
  .cde-home .g-head h1 { font-size: 31px !important; }
  .cde-home .g-card { padding: 17px !important; border-radius: 17px !important; }
  .cde-home .g-grid,
  .cde-home .g-stats { grid-template-columns: 1fr !important; }
}

@media (max-width: 520px) {
  .cdh-cta { display: none !important; }
  .cdf-grid { grid-template-columns: 1fr 1fr !important; }
  #screen-input .e2-hero { min-height: 770px !important; }
  #screen-input .e2-analysis-dock { width: calc(100% - 20px) !important; }
  #screen-input .e2-verdict { grid-template-columns: 88px 1fr !important; }
  #screen-input .e2-report-data { padding: 14px !important; }
  #screen-input .e2-metric-grid { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 380px) {
  .cdf-grid { grid-template-columns: 1fr !important; }
  .cdf-brand { grid-column: auto; }
  #screen-input .e2-hero h1 { font-size: 40px !important; }
  #screen-input .e2-analysis-dock { width: calc(100% - 16px) !important; }
  #screen-input .e2-verdict { grid-template-columns: 1fr !important; }
  #screen-input .e2-score { border-right: 0 !important; border-bottom: 1px solid var(--e2-line) !important; }
}
