/* Desktop reading scale, informed by the six retained B2B references.
   Mobile compositions and the existing content/interaction remain intact. */
@media (min-width: 901px) {
  html:has(body.home-page), html:has(body.offline-page) { scroll-padding-top: 24px; }
  .home-page section[id], .offline-page section[id] { scroll-margin-top: 0; }
  .home-page .header, .offline-page .header {
    position: relative; inset: auto; min-height: 76px;
    padding: 14px max(32px, calc((100% - 1120px) / 2)); gap: 24px;
  }
  .home-page .header .wordmark, .offline-page .header .wordmark { font-size: 28px; }
  .home-page .header nav, .offline-page .header nav { gap: 26px; font-size: 16px; }
  .home-page .section-width, .home-page .services,
  .offline-page .sf-wrap { width: min(1120px, calc(100% - 80px)); }

  .home-page .hero { height: 490px; min-height: 0; max-height: none; }
  .home-page .hero-copy {
    position: absolute; left: max(40px, calc((100% - 1120px) / 2)); top: 50%;
    transform: translateY(-50%); max-width: 53%; padding: 0; margin-left: 0;
  }
  .home-page .hero h1 { font-size: clamp(36px, 3.2vw, 46px); line-height: 1.45; }
  .home-page .hero-copy p { font-size: 17px; line-height: 1.85; margin: 20px 0 26px; }
  .home-page .hero .pill { min-width: 208px; min-height: 52px; padding: 12px 24px; }
  .home-page .hero .pill > span { display: none; }

  .home-page .movie { padding: 40px 0 16px; }
  .home-page .services { padding: 40px 0 56px; }
  .home-page .section-heading {
    display: flex; align-items: center; justify-content: space-between;
    gap: 32px; margin-bottom: 28px; text-align: left;
  }
  .home-page .section-heading h2 { font-size: 36px; line-height: 1.25; }
  .home-page .section-heading h2:after { display: none; }
  .home-page .section-heading > p { font-size: 17px; line-height: 1.7; }
  .home-page .home-service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
  .home-page .service-card, .home-page .service-card + .service-card {
    display: flex; flex-direction: column; min-width: 0; height: auto;
    margin: 0; border: 1px solid #dce3ef; border-radius: 12px;
    background: #fff; overflow: hidden; scroll-margin-top: 24px;
  }
  .home-page .service-card .photo,
  .home-page #offline-service .offline-photo,
  .home-page #influencer-service .influencer-photo {
    width: 100%; height: 250px; flex: 0 0 250px; aspect-ratio: auto;
    border-radius: 0; background: #edf2fa;
  }
  .home-page #offline-service .offline-photo img { object-fit: cover; object-position: 50% 45%; }
  .home-page #influencer-service .influencer-photo img { object-fit: contain; }
  .home-page .service-card .service-copy {
    display: flex; flex: 1; flex-direction: column; align-items: flex-start;
    justify-content: flex-start; width: 100%; height: auto; margin: 0;
    padding: 22px 26px 24px; text-align: left; background: #fff;
  }
  .home-page .service-copy .service-number { font-size: 14px; margin: 0 0 8px; }
  .home-page .service-copy h3 { font-size: 23px; line-height: 1.45; margin: 0 0 12px; }
  .home-page .service-copy > p:not(.service-number) { font-size: 16px; line-height: 1.75; }
  .home-page .service-copy .service-tags { font-size: 14px !important; line-height: 1.65 !important; margin: 10px 0 18px; }
  .home-page .service-copy .service-detail-button { margin-top: auto; width: 190px; min-height: 54px; }

  .home-page .about { min-height: 0; padding: 48px 40px; }
  .home-page .about-content {
    display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px;
    width: min(1120px, 100%); max-width: none; text-align: left;
  }
  .home-page .about .small-label { grid-column: 1; font-size: 20px; line-height: 1.4; margin-bottom: 12px; }
  .home-page .about h2 { grid-column: 1; grid-row: 2 / 4; font-size: 34px; margin: 0; line-height: 1.45; }
  .home-page .about-content > p:not(.small-label) { grid-column: 2; grid-row: 2; font-size: 16px; line-height: 1.85; }
  .home-page .about .section-action { grid-column: 2; grid-row: 3; justify-self: start; min-width: 208px; margin-top: 20px; }
  .home-page .about-collage { opacity: .12; }
  .home-page .news { grid-template-columns: 230px minmax(0, 1fr); gap: 48px; padding: 56px 0; }
  .home-page .news-heading h2 { font-size: 36px; }
  .home-page .news-heading p { font-size: 18px; margin-top: 12px; }
  .home-page .news-intro { font-size: 16px; line-height: 1.8; margin-bottom: 22px; }
  .home-page .news-item { padding-block: 18px; }
  .home-page .news-item h3 { font-size: 17px; line-height: 1.65; }
  .home-page .news .section-action { min-width: 208px; margin-top: 22px; }
  .home-page .contact { min-height: 0; padding: 44px 40px; }
  .home-page .contact-content {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 48px;
    width: min(1120px, 100%); max-width: none; text-align: left;
  }
  .home-page .contact .small-label { grid-column: 1; font-size: 20px; }
  .home-page .contact h2 { grid-column: 1; font-size: 32px; line-height: 1.45; margin: 0; }
  .home-page .contact h2 br { display: none; }
  .home-page .contact-content > p:not(.small-label) { grid-column: 1; font-size: 16px; max-width: none; margin: 0; }
  .home-page .contact .pill { grid-column: 2; grid-row: 1 / 4; align-self: center; min-width: 230px; margin: 0; }
  .home-page .contact-art { display: none; }

  .offline-page .sf-section, .offline-page .sf-demographics { padding-block: 56px; }
  .offline-page main h2 { font-size: 32px; line-height: 1.45; }
  .offline-page .sf-hero-poster { padding: 40px 0; background: #073c83; }
  .offline-page .sf-hero-poster > .sf-wrap {
    width: min(1120px, calc(100% - 80px));
    grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: center;
  }
  .offline-page .sf-hero-poster-copy { padding: 0; text-align: left; }
  .offline-page .sf-hero-mobile-title, .offline-page .sf-hero-mobile-description,
  .offline-page .sf-hero-poster-visual, .offline-page .sf-hero-poster-network { display: none !important; }
  .offline-page .sf-hero-desktop-title, .offline-page .sf-hero-desktop-description,
  .offline-page .sf-hero-desktop-visual { display: block !important; }
  .offline-page .sf-hero-poster-media { display: block; }
  .offline-page main .sf-hero-poster h1 { font-family: SFDesktopHeadline, "Hiragino Kaku Gothic ProN", sans-serif; font-size: clamp(35px, 3.15vw, 44px); font-weight: 900; letter-spacing: -.035em; line-height: 1.4; margin-bottom: 20px; text-align: left; }
  .offline-page .sf-hero-desktop-line { display: block; }
  .offline-page .sf-hero-desktop-line + span { margin-top: 8px; }
  .offline-page .sf-hero-desktop-title strong { font: inherit; white-space: nowrap; }
  .offline-page .sf-hero-desktop-title small { font: inherit; font-size: .66em; white-space: nowrap; }
  .offline-page .sf-hero-desktop-description { font-size: 16px; line-height: 1.85; margin: 0 0 24px; font-weight: 500; color: #fff; text-align: left; }
  .offline-page .sf-hero-desktop-description > span { display: block; }
  .offline-page .sf-hero-poster .sf-hero-poster-cta { width: auto; min-width: 266px; min-height: 54px; padding: 13px 24px; font-size: 16px; }
  .offline-page .sf-button > span[aria-hidden] { display: none; }
  .offline-page .sf-hero-desktop-photo { margin: 0; overflow: hidden; border: 1px solid #ffffff70; border-radius: 12px; background: #dcecff; }
  .offline-page .sf-hero-desktop-photo img { width: 100%; height: auto; aspect-ratio: 1.6; object-fit: cover; }
  .offline-page .sf-hero-desktop-services { display: flex; gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
  .offline-page .sf-hero-desktop-services li { display: flex; align-items: center; justify-content: center; color: #fff; background: #1256d4; flex: 1; flex-direction: row; gap: 6px; padding: 8px 4px; border-radius: 6px; font-size: 14px; line-height: 1.5; white-space: nowrap; }
  .offline-page .sf-hero-desktop-icon { width: 20px; height: 20px; flex: 0 0 20px; background: none; }
  .offline-page .sf-hero-desktop-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

  .offline-page .sf-intro-video > .sf-wrap { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 48px; max-width: 1120px; }
  .offline-page .sf-intro-head { display: block; }
  .offline-page .sf-intro-video h2 { font-size: 32px; margin-bottom: 20px; }
  .offline-page .sf-intro-head > p { font-size: 16px; line-height: 1.85; }
  .offline-page .sf-intro-head > p br { display: none; }
  .offline-page .sf-movie-preview { width: 100%; margin: 0; }
  .offline-page .sf-movie-screen { border: 0; border-radius: 12px; box-shadow: none; }
  .offline-page .sf-movie-play { font-size: 16px; padding: 12px 20px; }
  .offline-page .sf-network-v43 { padding-block: 48px; }
  .offline-page .sf-network-v43 > .sf-wrap { display: grid; grid-template-columns: 1fr 1.1fr; align-items: center; gap: 56px; max-width: 1120px; }
  .offline-page .sf-network-v43 h2 { font-size: 32px; line-height: 1.5; text-align: left; margin: 0; }
  .offline-page .sf-network-diagram { max-width: 420px; }
  .offline-page .sf-network-scale { width: 44%; box-shadow: 0 0 0 8px var(--sf-tint); }
  .offline-page .sf-network-scale-number strong { font-size: 58px; }
  .offline-page .sf-network-scale-number span { font-size: 17px; }
  .offline-page .sf-network-scale .sf-network-scale-areas { font-size: 14px; padding-top: 7px; margin-top: 9px; }
  .offline-page .sf-network-scale-areas strong { font-size: 27px; }
  .offline-page .sf-network-node figcaption { font-size: 14px; padding: 4px 8px; }

  .offline-page .sf-demographics > .sf-wrap { display: grid; grid-template-columns: 1fr 1.75fr; gap: 28px 32px; max-width: 1120px; }
  .offline-page .sf-demographics-heading { grid-column: 1; grid-row: 1; align-self: center; }
  .offline-page .sf-demographics h2 { font-size: 32px; }
  .offline-page .sf-demographics-photo { grid-column: 2; grid-row: 1; margin: 0; }
  .offline-page .sf-demographics-photo img { height: 190px; aspect-ratio: auto; object-fit: contain; object-position: right center; }
  .offline-page .sf-demographics-group { margin-top: 0; min-width: 0; }
  .offline-page .sf-demographics-gender { grid-column: 1; grid-row: 2; }
  .offline-page .sf-demographics-age { grid-column: 2; grid-row: 2; }
  .offline-page .sf-demographics-traits-group { grid-column: 1 / -1; grid-row: 3; }
  .offline-page .sf-demographics h3 { font-size: 19px; margin-bottom: 14px; gap: 12px; }
  .offline-page .sf-demographics dt { font-size: 16px; }
  .offline-page .sf-demographics dd strong { font-size: 34px; }
  .offline-page .sf-demographics dd > span { font-size: 20px; }
  .offline-page .sf-demographics-genders { gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .offline-page .sf-demographics-genders > div { padding: 18px 12px; gap: 12px; }
  .offline-page .sf-demographics-genders svg { width: 32px; height: 32px; }
  .offline-page .sf-demographics-ages > div { padding: 8px; }
  .offline-page .sf-demographics-agebar { height: 32px; margin-top: 18px; }
  .offline-page .sf-demographics-agebar > span { font-size: 14px; }
  .offline-page .sf-demographics-traits-group ul { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .offline-page .sf-demographics-traits li { font-size: 16px; gap: 12px; padding: 14px 18px; }
  .offline-page .sf-demographics-traits svg { width: 26px; height: 26px; }

  .offline-page .sf-services-v55.sf-wrap { width: min(1120px, calc(100% - 80px)); padding-block: 56px; }
  .offline-page .sf-services-v55 > h2 { font-size: 32px; line-height: 1.45; text-align: left; margin-bottom: 28px; }
  .offline-page .sf-services-v55 > h2 br { display: none; }
  .offline-page .sf-services-v55 .sf-service-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .offline-page .sf-services-v55 .sf-service-row {
    grid-template-columns: clamp(100px, 10vw, 140px) minmax(0, 1fr);
    column-gap: 20px; row-gap: 14px; padding: 22px; border-radius: 12px; box-shadow: none;
  }
  .offline-page .sf-service-purpose { justify-self: start; padding: 5px 12px; font-size: 14px; }
  .offline-page .sf-service-art { align-self: center; }
  .offline-page .sf-services-v55 .sf-service-text { padding: 0; }
  .offline-page .sf-services-v55 .sf-service-text h3 { font-size: 21px; line-height: 1.45; margin-bottom: 10px; }
  .offline-page .sf-services-v55 .sf-service-text p { font-size: 16px; line-height: 1.75; }
  .offline-page .sf-cases-v54 .sf-section-head { text-align: left; margin-bottom: 28px; }
  .offline-page .sf-cases-v54 .sf-section-head h2 { font-size: 32px; }
  .offline-page .sf-cases-v54 .sf-case-grid { gap: 24px; }
  .offline-page .sf-cases-v54 .sf-case { padding: 16px; box-shadow: none; border-radius: 12px; }
  .offline-page .sf-cases-v54 .sf-case-photo { height: 190px; aspect-ratio: auto; }
  .offline-page .sf-cases-v54 .sf-case h3 { font-size: 21px; text-align: left; margin: 16px 0 14px; }
  .offline-page .sf-cases-v54 .sf-case h3:after { left: 0; transform: none; }
  .offline-page .sf-cases-v54 .sf-case dl > div { padding: 8px 0; font-size: 16px; }
  .offline-page .sf-process-v67 { padding: 48px 0; }
  .offline-page .sf-process-v67 h2 { font-size: 32px; text-align: left; }
  .offline-page .sf-process-v67 h2 > span { display: inline; }
  .offline-page .sf-process-v67 .sf-process-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .offline-page .sf-process-v67 .sf-process-card-body { display: flex; flex-direction: column; }
  .offline-page .sf-process-v67 .sf-process-card-body p { font-size: 16px; }
  .offline-page .sf-process-v67 .sf-process-art { width: 180px; }
  .offline-page .off-faq.sf-wrap {
    display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 0 48px;
    width: min(1120px, calc(100% - 80px)); max-width: 1120px;
    padding: 56px 0; margin: 0 auto; background: transparent;
  }
  .offline-page .off-faq .sf-section-head { grid-column: 1; grid-row: 1 / span 9; text-align: left; margin: 0; }
  .offline-page .off-faq .sf-section-head h2 { font-size: 30px; }
  .offline-page .off-faq-item { grid-column: 2; margin-bottom: 8px; }
  .offline-page .off-faq-item summary { min-height: 0; padding: 16px 12px; font-size: 16px; line-height: 1.75; }
  .offline-page .off-faq-item summary > span:first-child { width: 32px; height: 32px; font-size: 18px; line-height: 32px; }
  .offline-page .off-faq-item .off-question { display: block; font-size: 16px; }
  .offline-page .off-faq-item .off-phrase { display: inline; }
  .offline-page .off-faq-item .off-answer { font-size: 16px; line-height: 1.85; }
  .offline-page .sf-contact-v44 { padding: 44px 40px; border-radius: 0; }
  .offline-page .sf-contact-v44 .sf-contact-copy {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 48px;
    width: min(1120px, 100%); max-width: none; text-align: left;
  }
  .offline-page .sf-contact-v44 .sf-contact-brand { grid-column: 1; margin: 0; font-size: 18px; }
  .offline-page .sf-contact-v44 h2 { grid-column: 1; font-size: 30px; }
  .offline-page .sf-contact-v44 h2 > span { display: inline; }
  .offline-page .sf-contact-v44 .sf-contact-description { grid-column: 1; font-size: 16px; margin: 0; }
  .offline-page .sf-contact-v44 .sf-contact-description > span { display: inline; }
  .offline-page .sf-contact-v44 .sf-button { grid-column: 2; grid-row: 1 / 4; align-self: center; width: 276px; min-height: 54px; font-size: 16px; }
}
