/*
 * noXcuses V0.7 mobile polish
 *
 * A final, mobile-only rhythm layer for editorial content. The Home app demo,
 * product scroll story, phone geometry, screenshots, avatars and animation
 * surfaces are intentionally outside this stylesheet's selector scope.
 */

@media (max-width: 560px) {
  /* Shared mobile editorial rhythm --------------------------------------- */
  body[data-page="home"] :where(
    .v3-loop-section,
    .v3-feature-section,
    .v3-coach-section,
    .v3-avatar-section,
    .v3-founder-section,
    .v3-faq-section
  ) > .container,
  body[data-page="features"] :where(
    .v3-inner-hero,
    .v3-details,
    .v3-principle-band,
    .nox-inline-cta
  ) > .container,
  body[data-page="pricing"] :where(
    .v3-inner-hero,
    .v3-pricing-main,
    .v3-price-proof,
    .v3-faq-section,
    .nox-inline-cta
  ) > .container,
  body[data-page="about"] :where(
    .v3-inner-hero,
    .v3-manifest,
    .v3-values-section,
    .v3-about-system,
    .v3-about-journey,
    .v3-founder-section,
    .v3-principle-band,
    .nox-inline-cta
  ) > .container,
  body[data-page="contact"] :where(.nox-page-hero, section[aria-labelledby="contact-status-title"]) > .container,
  body.legal-page :where(.legal-hero, .legal-section) > .container {
    width: calc(100% - 24px);
  }

  body[data-page="home"] :where(
    .v3-loop-section,
    .v3-feature-section,
    .v3-coach-section,
    .v3-avatar-section,
    .v3-founder-section
  ),
  body[data-page="pricing"] :where(.v3-pricing-main, .v3-price-proof),
  body[data-page="about"] :where(
    .v3-manifest,
    .v3-values-section,
    .v3-about-system,
    .v3-about-journey,
    .v3-founder-section
  ) {
    padding-block: 58px !important;
  }

  body[data-page="home"] :where(
    .v3-feature-section,
    .v3-avatar-section
  ) .v3-section-head,
  body[data-page="features"] .v3-details .v3-section-head,
  body[data-page="pricing"] .v3-price-proof .v3-section-head,
  body[data-page="about"] :where(.v3-values-section, .v3-about-journey) .v3-section-head {
    gap: 15px;
    margin-bottom: 28px;
  }

  body[data-page="home"] :where(
    .v3-feature-section,
    .v3-avatar-section,
    .v3-coach-section
  ) .v3-title,
  body[data-page="features"] .v3-details .v3-title,
  body[data-page="pricing"] :where(.v3-price-proof, .v3-faq-section) .v3-title,
  body[data-page="about"] :where(
    .v3-values-section,
    .v3-about-system,
    .v3-about-journey
  ) .v3-title {
    max-inline-size: none !important;
    font-size: clamp(2.1rem, 9.8vw, 2.85rem) !important;
    line-height: .99;
    text-wrap: balance;
  }

  body[data-page="home"] :where(
    .v3-feature-section,
    .v3-avatar-section,
    .v3-coach-section
  ) .section-lead,
  body[data-page="features"] .v3-section-head > p,
  body[data-page="pricing"] .v3-section-head > p,
  body[data-page="about"] :where(.v3-values-section, .v3-about-system) .section-lead,
  body[data-page="about"] .v3-section-head > p {
    max-inline-size: none !important;
    font-size: .95rem;
    line-height: 1.62;
    text-wrap: pretty;
  }

  /* Inner-page heroes: copy only; media geometry remains untouched. */
  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .v3-inner-hero {
    padding-block: 98px 34px;
  }

  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .v3-inner-hero-grid > .reveal:first-child {
    text-align: center;
  }

  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .v3-inner-hero .page-title {
    max-inline-size: none !important;
    margin-block: 12px 18px !important;
    font-size: clamp(2.65rem, 11.8vw, 3.45rem) !important;
    line-height: .97 !important;
    text-wrap: balance;
  }

  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .v3-inner-hero .page-lead {
    max-inline-size: none;
    font-size: .96rem;
    line-height: 1.61;
    text-wrap: pretty;
  }

  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .v3-inner-hero .v3-actions {
    gap: 10px;
    margin-top: 24px;
  }

  /* Home: denser editorial sections below the protected app showcase. */
  body[data-page="home"] .v3-loop-grid {
    gap: 11px;
  }

  body[data-page="home"] .v3-loop-grid article {
    padding: 21px;
  }

  body[data-page="home"] .v3-loop-grid article > span {
    margin-bottom: 19px;
    font-size: 2.5rem;
  }

  body[data-page="home"] .v3-loop-grid h3 {
    margin-block: 9px 7px;
    font-size: 1.3rem;
    text-wrap: balance;
  }

  body[data-page="home"] .v3-loop-grid p {
    font-size: .92rem;
    line-height: 1.56;
    text-wrap: pretty;
  }

  body[data-page="home"] .v3-feature-grid {
    gap: 13px;
  }

  body[data-page="home"] .v3-feature-card {
    padding: 19px;
  }

  body[data-page="home"] .v3-feature-card .card-number {
    margin-bottom: 15px;
  }

  body[data-page="home"] .v3-feature-card h3 {
    max-inline-size: none;
    margin-bottom: 8px;
    font-size: clamp(1.48rem, 7vw, 1.92rem);
    line-height: 1.02;
  }

  body[data-page="home"] .v3-feature-card p {
    font-size: .93rem;
    line-height: 1.58;
    text-wrap: pretty;
  }

  body[data-page="home"] .v3-coach-copy blockquote {
    margin-block: 21px;
    padding: 18px 0 18px 18px;
    font-size: 1.05rem;
    line-height: 1.5;
  }

  body[data-page="home"] .v3-tag-row {
    gap: 6px;
  }

  body[data-page="home"] .v3-avatar-controls h3 {
    margin-bottom: 10px;
    font-size: clamp(1.9rem, 9vw, 2.55rem);
    text-wrap: balance;
  }

  body[data-page="home"] .v3-avatar-controls p,
  body[data-page="home"] .v3-achievement-proof p:last-child {
    font-size: .93rem;
    line-height: 1.58;
    text-wrap: pretty;
  }

  body[data-page="home"] .v3-founder-card,
  body[data-page="about"] .v3-founder-card {
    gap: 18px;
    padding: 20px;
  }

  body:is([data-page="home"], [data-page="about"]) .v3-founder-card h2 {
    margin-block: 8px 12px;
    font-size: clamp(2.15rem, 10.5vw, 2.85rem);
    line-height: .98;
  }

  body:is([data-page="home"], [data-page="about"]) .v3-founder-card p {
    margin-block: 0;
    font-size: .94rem;
    line-height: 1.58;
    text-wrap: pretty;
  }

  body:is([data-page="home"], [data-page="about"]) .v3-founder-card strong {
    margin-top: 14px;
  }

  body:is([data-page="home"], [data-page="about"]) .v3-founder-card blockquote {
    padding-left: 18px;
    font-size: 1.08rem;
    line-height: 1.5;
  }

  body:is([data-page="home"], [data-page="pricing"]) .v3-faq-section {
    padding-block: 56px !important;
  }

  body:is([data-page="home"], [data-page="pricing"]) .v3-faq-grid {
    gap: 27px;
  }

  body:is([data-page="home"], [data-page="pricing"]) .v3-faq-grid .v3-title {
    max-inline-size: none;
    margin-bottom: 14px;
    font-size: clamp(2.1rem, 10vw, 2.8rem) !important;
    line-height: .98;
  }

  body:is([data-page="home"], [data-page="pricing"]) .v3-faq-grid .section-lead {
    max-inline-size: none;
    font-size: .94rem;
    line-height: 1.58;
  }

  body:is([data-page="home"], [data-page="pricing"]) .faq-item button {
    min-height: 0;
    padding-block: 19px;
    gap: 16px;
    font-size: .98rem;
    line-height: 1.35;
  }

  body:is([data-page="home"], [data-page="pricing"]) .faq-item > div p {
    padding-bottom: 19px;
    font-size: .92rem;
    line-height: 1.58;
    text-wrap: pretty;
  }

  body[data-page="home"] .v3-final-cta {
    padding-block: 54px;
  }

  body[data-page="home"] .v3-final-cta .container {
    width: calc(100% - 24px);
    gap: 17px;
  }

  body[data-page="home"] .v3-final-cta h2 {
    margin-block: 10px 22px;
    font-size: clamp(2.45rem, 11.8vw, 3.25rem);
    line-height: .93;
    text-wrap: balance;
  }

  /* Features: compact copy rhythm around unchanged visual demos. */
  body[data-page="features"] .v3-details {
    padding-block: 54px !important;
  }

  body[data-page="features"] .v3-details .v3-section-head {
    margin-bottom: 18px;
  }

  body[data-page="features"] .v3-detail-row,
  body[data-page="features"] .v3-avatar-detail-row {
    gap: 31px;
    padding-block: 52px;
  }

  body[data-page="features"] .v3-detail-copy h2 {
    max-inline-size: none;
    margin-block: 12px 14px;
    font-size: clamp(2.05rem, 9.7vw, 2.72rem);
    line-height: 1;
    text-wrap: balance;
  }

  body[data-page="features"] .v3-detail-copy > p {
    max-inline-size: none;
    font-size: .95rem;
    line-height: 1.6;
    text-wrap: pretty;
  }

  body[data-page="features"] #foto-ai-djup .v3-detail-copy h2 {
    max-inline-size: none !important;
    font-size: clamp(1.82rem, 8.4vw, 2.35rem) !important;
    line-height: 0.96;
    letter-spacing: -0.055em;
  }

  body[data-page="features"] #foto-ai-djup .v3-detail-copy h2 > span {
    display: block;
    white-space: nowrap;
  }

  body[data-page="features"] .plain-check--expanded {
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 20px;
  }

  body[data-page="features"] .plain-check--expanded li {
    padding-left: 24px;
    font-size: .92rem;
    line-height: 1.5;
  }

  body[data-page="features"] .v3-principle-band,
  body[data-page="about"] .v3-principle-band {
    padding-block: 56px;
  }

  body:is([data-page="features"], [data-page="about"]) .v3-principle-band .container {
    gap: 30px;
  }

  body:is([data-page="features"], [data-page="about"]) .v3-principle-band h2 {
    margin-block: 10px 14px;
    font-size: clamp(2.35rem, 11.2vw, 3.05rem);
    line-height: .96;
    text-wrap: balance;
  }

  body:is([data-page="features"], [data-page="about"]) .v3-principle-band p:last-child {
    max-width: none;
    font-size: .95rem;
    line-height: 1.58;
    text-wrap: pretty;
  }

  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .nox-inline-cta {
    padding-block: 50px;
  }

  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .nox-inline-cta .container {
    gap: 22px;
  }

  body:is([data-page="features"], [data-page="pricing"], [data-page="about"]) .nox-inline-cta h2 {
    font-size: clamp(2.05rem, 9.8vw, 2.72rem);
    line-height: 1;
    text-wrap: balance;
  }

  /* Pricing: concise offer and purchase clarity. */
  body[data-page="pricing"] .v3-pricing-grid {
    gap: 13px;
  }

  body[data-page="pricing"] :where(.v3-offer-card, .v3-clarity-card) {
    padding: 20px;
  }

  body[data-page="pricing"] .v3-offer-top {
    gap: 10px;
    padding-bottom: 18px;
  }

  body[data-page="pricing"] .v3-offer-top b {
    max-width: 54%;
    text-align: center;
  }

  body[data-page="pricing"] .v3-offer-brand {
    margin-block: 22px 19px;
  }

  body[data-page="pricing"] .v3-offer-brand h2 {
    font-size: clamp(1.95rem, 8.8vw, 2.55rem);
    line-height: 1;
    text-wrap: balance;
  }

  body[data-page="pricing"] .v3-offer-card > p {
    font-size: .94rem;
    line-height: 1.59;
    text-wrap: pretty;
  }

  body[data-page="pricing"] .v3-offer-columns {
    gap: 9px;
    margin-block: 20px;
  }

  body[data-page="pricing"] .v3-offer-columns ul {
    gap: 9px;
    margin-block: 0;
  }

  body[data-page="pricing"] .v3-offer-columns li {
    padding-left: 23px;
    font-size: .92rem;
    line-height: 1.45;
  }

  body[data-page="pricing"] .v3-clarity-card h2 {
    margin-block: 9px 17px;
    font-size: clamp(2rem, 9.2vw, 2.6rem);
  }

  body[data-page="pricing"] .v3-clarity-card article {
    grid-template-columns: 32px 1fr;
    gap: 10px;
    padding-block: 14px;
  }

  body[data-page="pricing"] .v3-clarity-card p {
    font-size: .88rem;
    line-height: 1.5;
    text-wrap: pretty;
  }

  /* About: editorial density without changing phones or avatar media. */
  body[data-page="about"] .v3-manifest-grid {
    gap: 16px;
  }

  body[data-page="about"] .v3-manifest-number {
    font-size: 4.8rem;
  }

  body[data-page="about"] .v3-manifest-grid h2 {
    margin-block: 10px 18px;
    font-size: clamp(2.15rem, 10.3vw, 2.85rem);
    line-height: .99;
    text-wrap: balance;
  }

  body[data-page="about"] .v3-manifest-grid p {
    margin-block: 0 14px;
    font-size: .95rem;
    line-height: 1.62;
    text-wrap: pretty;
  }

  body[data-page="about"] .v3-value-grid {
    gap: 11px;
  }

  body[data-page="about"] .v3-value-grid article {
    min-height: 0;
    padding: 20px;
  }

  body[data-page="about"] .v3-value-grid h3 {
    margin-block: 30px 10px;
    font-size: 1.32rem;
  }

  body[data-page="about"] .v3-value-grid p {
    font-size: .92rem;
    line-height: 1.56;
    text-wrap: pretty;
  }

  body[data-page="about"] .v3-about-system-grid {
    gap: 32px;
  }

  body[data-page="about"] .v3-role-cards {
    gap: 10px;
    margin-top: 20px;
  }

  body[data-page="about"] .v3-role-cards article {
    padding: 18px;
  }

  body[data-page="about"] .v3-role-cards strong {
    margin-block: 7px 4px;
  }

  body[data-page="about"] .v3-role-cards p {
    font-size: .91rem;
    line-height: 1.53;
    text-wrap: pretty;
  }

  body[data-page="about"] .v3-about-journey .v3-section-head {
    margin-bottom: 27px;
  }

  /* Contact: remove the legacy compact-hero height and tighten cards. */
  body[data-page="contact"] .nox-page-hero {
    min-height: 0 !important;
    padding-block: 98px 48px !important;
  }

  body[data-page="contact"] .nox-page-hero .page-title {
    max-inline-size: none !important;
    margin-block: 11px 17px !important;
    font-size: clamp(2.55rem, 11.7vw, 3.35rem) !important;
    line-height: .98 !important;
    text-wrap: balance;
  }

  body[data-page="contact"] .nox-page-hero .page-lead {
    max-inline-size: none;
    font-size: .96rem;
    line-height: 1.61;
    text-wrap: pretty;
  }

  body[data-page="contact"] section[aria-labelledby="contact-status-title"] {
    padding-block: 52px 66px !important;
  }

  body[data-page="contact"] .contact-grid,
  body[data-page="contact"] .contact-cards {
    gap: 11px;
  }

  body[data-page="contact"] :where(.contact-cards article, .contact-form) {
    padding: 20px !important;
  }

  body[data-page="contact"] .contact-cards article h2 {
    margin-block: 9px 8px;
    font-size: 1.3rem;
    line-height: 1.15;
    text-wrap: balance;
  }

  body[data-page="contact"] .contact-cards article p,
  body[data-page="contact"] .contact-form .form-note {
    font-size: .92rem;
    line-height: 1.57;
    text-wrap: pretty;
  }

  /* Legal pages: shorter, calmer and easier to scan on a phone. */
  body.legal-page .legal-hero {
    padding-block: 98px 42px !important;
  }

  body.legal-page .legal-hero h1 {
    max-width: none;
    margin-bottom: 16px;
    font-size: clamp(2.45rem, 11.2vw, 3.25rem) !important;
    line-height: .98 !important;
    text-wrap: balance;
  }

  body.legal-page .legal-hero > .container > p:not(.eyebrow) {
    max-width: none;
    font-size: .95rem;
    line-height: 1.58;
    text-wrap: pretty;
  }

  body.legal-page .legal-meta {
    gap: 8px;
    margin-top: 21px;
  }

  body.legal-page .legal-meta span {
    padding: 8px 10px;
    font-size: .64rem;
  }

  body.legal-page .legal-section {
    padding-block: 42px 64px !important;
  }

  body.legal-page .legal-layout {
    gap: 18px;
  }

  body.legal-page .legal-toc {
    gap: 6px;
    padding: 18px !important;
  }

  body.legal-page .legal-toc strong {
    margin-bottom: 9px;
  }

  body.legal-page .legal-toc a {
    padding-block: 8px;
    font-size: .79rem;
    line-height: 1.38;
  }

  body.legal-page .legal-document {
    padding: 20px !important;
    font-size: .93rem;
    line-height: 1.64;
  }

  body.legal-page .legal-document h2 {
    margin-top: 38px !important;
    padding-top: 7px;
    font-size: clamp(1.52rem, 7.6vw, 1.98rem) !important;
    line-height: 1.1;
    text-wrap: balance;
  }

  body.legal-page .legal-document h2:first-of-type {
    margin-top: 25px !important;
  }

  body.legal-page .legal-document p,
  body.legal-page .legal-document li {
    line-height: 1.64;
    text-wrap: pretty;
  }

  body.legal-page .legal-document ul {
    gap: 7px;
    padding-left: 19px;
  }

  body.legal-page .draft-notice {
    padding: 16px !important;
  }

  body.legal-page .legal-form {
    gap: 15px;
    margin-block: 22px 29px;
    padding: 18px !important;
  }

  body.legal-page .legal-form-heading {
    padding-bottom: 14px;
  }
}

@media (max-width: 560px) {
  /* Exact two-row mobile headlines: local sizing prevents hidden overflow. */
  body[data-page="home"] .v3-loop-section .v3-title {
    max-inline-size: none !important;
    font-size: clamp(1.4rem, 7.3vw, 3.35rem) !important;
  }

  body[data-page="home"] .v3-loop-section .v3-title > span {
    white-space: nowrap;
  }

  body[data-page="about"] .v3-about-hero .page-title {
    max-inline-size: none !important;
    font-size: clamp(1.85rem, 9.25vw, 3rem) !important;
    white-space: nowrap;
  }

  body[data-page="about"] .v3-principle-band .container > div > h2 {
    font-size: clamp(1.95rem, 9.7vw, 2.45rem) !important;
  }

  body[data-page="contact"] .nox-page-hero .page-title {
    max-inline-size: none !important;
    font-size: clamp(1.9rem, 9.8vw, 4rem) !important;
    white-space: nowrap;
  }

  body[data-page="health"] .nox-health-hero h1 {
    max-width: none;
    font-size: clamp(1.4rem, 7.2vw, 2.1rem) !important;
    white-space: nowrap;
  }
}