/*
 * WS-003 | DESKTOP ART DIRECTION V1 | 2026-10-16
 *
 * CEO design contract: PC is NOT a scaled phone. Use the available canvas,
 * remove accidental narrow/left-aligned columns and dead space, retain
 * intentional reading line-lengths, align full-width blocks, and keep short
 * PC-only headlines on one line where they actually fit.
 *
 * Scope: desktop >=1081px ONLY. The previous iPhone Safari LOG04 PASS,
 * 320-1024px typography, mobile layouts and mobile breakpoints stay untouched.
 * This stylesheet must load AFTER mobile-copy-legibility.css.
 */
@media screen and (min-width:1081px) {
  :root {
    --desktop-gutter:clamp(28px,3.3vw,76px);
    --desktop-content-max:2200px;
    --desktop-copy-measure:80ch;
  }

  /* Meaningful outer gutters only: internal panels fill the desktop canvas. */
  .route-select .section-heading,
  .profile-world .section-heading,
  .logs-world .section-heading,
  .contact-world .section-heading,
  .activity-media .section-heading {
    box-sizing:border-box;
    width:100%;
    max-width:var(--desktop-content-max);
    margin-inline:auto;
  }

  /* PROFILE: the old 1240px status panel left the whole right side unused.
     Keep identity on the left; use the wide right column for actual prose. */
  .profile-world .status-screen {
    box-sizing:border-box;
    width:100%;
    max-width:var(--desktop-content-max);
    margin-inline:auto;
    padding:clamp(36px,3.2vw,72px);
    display:grid;
    grid-template-columns:minmax(230px,.40fr) minmax(0,1fr);
    grid-template-rows:auto;
    column-gap:clamp(42px,5vw,118px);
    align-items:start;
  }
  .profile-world .status-screen > .profile-identity {
    grid-column:1;
    grid-row:1;
    min-width:0;
  }
  .profile-world .status-screen > .profile-story {
    grid-column:2;
    grid-row:1;
    min-width:0;
    max-width:none;
  }
  .profile-world .profile-story > p,
  .profile-world .profile-story blockquote {
    max-width:var(--desktop-copy-measure);
    word-break:normal;
    overflow-wrap:break-word;
    text-wrap:wrap;
  }
  .profile-world .experience-map {
    box-sizing:border-box;
    width:100%;
    max-width:var(--desktop-content-max);
    margin-inline:auto;
  }
  .profile-world .exp-reading {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:clamp(16px,2vw,36px);
  }

  /* LOGS: headline and the log console should share the same desktop grid. */
  .logs-world .log-console {
    box-sizing:border-box;
    width:100%;
    max-width:var(--desktop-content-max);
    margin-inline:auto;
  }
  .logs-world .log-entry {
    grid-template-columns:minmax(118px,170px) minmax(0,1fr);
  }
  .logs-world .log-content {
    min-width:0;
  }
  .logs-world .log-content > p {
    max-width:var(--desktop-copy-measure);
    word-break:normal;
    overflow-wrap:break-word;
    text-wrap:wrap;
  }

  /* NOTE: the old 1120px max-width and left-side placement caused the huge
     empty right half visible in the CEO Mac recording. */
  .note-gate {
    box-sizing:border-box;
    width:100%;
    max-width:none;
    padding-inline:var(--desktop-gutter);
  }
  .note-gate > .section-heading,
  .note-gate > .note-board {
    box-sizing:border-box;
    width:100%;
    max-width:var(--desktop-content-max);
    margin-inline:auto;
  }
  .note-gate > .section-heading {
    margin-bottom:clamp(28px,2.8vw,52px);
  }
  .note-gate .section-heading > p:last-child {
    max-width:var(--desktop-copy-measure);
  }
  .note-gate > .note-board {
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(420px,.95fr);
    gap:clamp(20px,2.2vw,44px);
    align-items:stretch;
  }
  .note-gate .note-realm {
    min-width:0;
    padding:clamp(22px,2.3vw,46px);
  }
  .note-gate .note-route {
    grid-template-columns:72px minmax(0,1fr);
    gap:12px 20px;
  }
  .note-gate .note-route-body,
  .note-gate .note-realm-head {
    min-width:0;
    max-width:none;
  }
  .note-gate .note-route-body > p {
    max-width:var(--desktop-copy-measure);
  }
  /* Article rows: thumbnail beside title and CTA. A full-width 16:9
     under every title made the index a stack of phone-sized banners. */
  .note-gate .note-link {
    grid-template-columns:168px minmax(0,1fr);
    grid-template-areas:"eye copy" "eye cta";
    align-items:center;
    column-gap:16px;
    row-gap:6px;
  }
  .note-gate .note-eye,
  .note-gate .note-realm-paid .note-eye {
    grid-area:eye;
    width:168px;
    height:94px;
    max-height:94px;
    aspect-ratio:auto;
    object-fit:cover;
  }
  .note-gate .note-realm-paid .note-eye {object-fit:contain;}
  .note-gate .note-copy {grid-area:copy;}
  .note-gate .note-cta {grid-area:cta;}

  /* Editorial headings: desktop has width for one meaningful headline row.
     Mobile's authored wrapping and font sizes remain untouched. */
  .profile-world .section-heading h1.editorial-hero-title,
  .profile-world .section-heading h2.editorial-hero-title,
  .logs-world .section-heading h1.editorial-hero-title,
  .logs-world .section-heading h2.editorial-hero-title,
  .note-gate .section-heading h2.editorial-hero-title {
    display:flex;
    flex-wrap:nowrap;
    gap:.34em;
    align-items:baseline;
    justify-content:flex-start;
    width:100%;
    max-width:none;
    font-size:clamp(2.35rem,3vw,4rem);
    line-height:1.22;
    letter-spacing:-.045em;
    text-wrap:nowrap;
  }
  .profile-world .section-heading h1.editorial-hero-title > .headline-line,
  .profile-world .section-heading h2.editorial-hero-title > .headline-line,
  .logs-world .section-heading h1.editorial-hero-title > .headline-line,
  .logs-world .section-heading h2.editorial-hero-title > .headline-line,
  .note-gate .section-heading h2.editorial-hero-title > .headline-line {
    display:inline-block;
    flex:0 0 auto;
    width:auto;
    max-width:none;
    white-space:nowrap;
    font-size:inherit;
  }

  /* HOME: center ONE headline row; the actual signal + reel should occupy
     a balanced full-width two-column editorial grid. */
  .social-pickup,
  .activity-media {
    box-sizing:border-box;
    width:calc(100% - 2 * var(--desktop-gutter));
    max-width:var(--desktop-content-max);
    margin-inline:auto;
    padding-inline:0;
  }
  .social-pickup .section-heading.centered {
    width:100%;
    max-width:none;
    text-align:center;
    margin-inline:auto;
  }
  .social-pickup .section-heading h2 {
    display:flex;
    align-items:baseline;
    justify-content:center;
    flex-wrap:nowrap;
    gap:.2em;
    max-width:none;
    font-size:clamp(2.5rem,3.2vw,4.5rem);
    line-height:1.25;
  }
  .social-pickup .section-heading h2 > .phrase {
    display:inline-block;
    width:auto;
    max-width:none;
    white-space:nowrap;
  }
  .social-pickup-grid {
    display:grid;
    width:100%;
    grid-template-columns:minmax(0,1.14fr) minmax(340px,.86fr);
    align-items:start;
    justify-content:stretch;
    column-gap:clamp(32px,5vw,112px);
  }
  .social-pickup-copy {
    min-width:0;
    width:100%;
  }
  .social-pickup-copy > p {
    max-width:var(--desktop-copy-measure);
    word-break:normal;
    text-wrap:wrap;
  }
  .social-pickup .vertical-reel {
    box-sizing:border-box;
    width:min(100%,460px);
    max-width:460px;
    justify-self:center;
  }
  .social-pickup-footnote {
    width:100%;
    max-width:none;
  }
  .home-contact-teaser {
    box-sizing:border-box;
    width:calc(100% - 2 * var(--desktop-gutter));
    max-width:var(--desktop-content-max);
    padding-inline:clamp(38px,4.2vw,96px);
  }
  .home-contact-teaser h2 {
    max-width:none;
    font-size:clamp(2.15rem,3vw,4rem);
  }
  .home-contact-teaser > p:not(.area-label) {
    max-width:var(--desktop-copy-measure);
  }

  /* LOGS social cards: three balanced columns instead of a phone-like strip. */
  .activity-media .section-heading h2 {
    display:flex;
    flex-wrap:nowrap;
    align-items:baseline;
    gap:.3em;
    font-size:clamp(2.25rem,2.85vw,3.9rem);
  }
  .activity-media .section-heading h2 > .phrase {
    display:inline-block;
    white-space:nowrap;
  }
  .activity-media .reel-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:clamp(18px,2.5vw,46px);
    justify-items:center;
  }
  .activity-media .vertical-reel {
    box-sizing:border-box;
    width:min(100%,440px);
  }

  /* B2B/B2C: widen actual service and decision modules without stretching
     paragraphs into unreadable, full-screen lines. */
  .business-world .world-copy,
  .individual-world .world-copy {
    box-sizing:border-box;
    width:100%;
    max-width:var(--desktop-content-max);
  }
  .business-world .world-copy > p,
  .individual-world .world-copy > p {
    max-width:var(--desktop-copy-measure);
  }
  #consultation-entry {
    box-sizing:border-box;
    width:100%;
    max-width:1700px;
    margin-inline:auto;
  }
  .route-select .world-map {
    width:min(100%,1360px);
    max-width:1360px;
  }
  .strategy-map,
  .field-system,
  .service-deck,
  .quest-map,
  .b2c-stage,
  .area-banner,
  .world-copy,
  .world-action {
    box-sizing:border-box;
    width:min(100%,var(--desktop-content-max));
    max-width:var(--desktop-content-max);
  }
  a.back-to-top {
    right:18px;
    bottom:54px;
  }
  .b2b-proof {
    box-sizing:border-box;
    width:calc(100% - 2 * var(--desktop-gutter));
    max-width:var(--desktop-content-max);
  }
  .line-product-showcase {
    box-sizing:border-box;
    width:calc(100% - 2 * var(--desktop-gutter));
    max-width:var(--desktop-content-max);
  }

  /* CONTACT / PRIVACY: desktop grids have room to breathe, while legal copy
     retains a sensible reading measure. */
  .info-page #contact.contact-world {
    box-sizing:border-box;
    width:calc(100% - 2 * var(--desktop-gutter));
    max-width:var(--desktop-content-max);
    margin-inline:auto;
    display:grid;
    grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
    column-gap:clamp(32px,4vw,92px);
    align-items:start;
    padding:clamp(48px,5vw,96px) clamp(24px,2.8vw,68px);
  }
  .info-page #contact .contact-copy,
  .info-page #contact .contact-form {
    min-width:0;
    max-width:none;
  }
  .info-page .privacy {
    box-sizing:border-box;
    width:calc(100% - 2 * var(--desktop-gutter));
    max-width:var(--desktop-content-max);
    margin-inline:auto;
  }
  .privacy .privacy-head,
  .privacy .privacy-list {
    width:100%;
    max-width:none;
  }
  .privacy .privacy-intro {
    width:100%;
    max-width:1100px;
  }

  /* Eighth public route: the standalone police-interview LINE landing.
     Keep its mobile-first conversion focus below 1081px, but use a
     deliberate wide two-column PC presentation instead of a 920px strip. */
  main#page-top {
    box-sizing:border-box;
    width:calc(100% - 2 * var(--desktop-gutter));
    max-width:1680px;
    padding:clamp(48px,5vw,90px) 0 86px;
  }
  #page-top .police-layout {
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    gap:clamp(24px,3vw,60px);
    align-items:stretch;
  }
  #page-top .police-layout > .panel {
    min-width:0;
    padding:clamp(28px,3vw,60px)!important;
    min-height:500px;
  }
  #page-top .police-layout > .police-aside {
    min-width:0;
    padding:clamp(28px,3vw,60px);
  }
}

/* At <=1080px, intentionally NO desktop overrides.
 * Protect PR#231's CEO iPhone Safari LOG04 Human PASS and the existing
 * mobile-specific panel/typography fixes.
 */