/* Wider studio composition. Mobile keeps the existing step-by-step layout. */
@media (min-width: 1000px) {
  body.hero-page:has(#step-studio:not(.hidden)),
  html:has(body.hero-page #step-studio:not(.hidden)) {
    position: static;
    height: auto;
    min-height: 100svh;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: auto;
  }
  body:has(#step-studio:not(.hidden)) > main {
    max-width: none;
    padding: 0;
  }
  body.hero-page #step-studio {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    min-height: 100svh;
    overflow: visible;
    max-width: 1480px; margin: 0 auto;
    padding: 42px 5vw 100px;
    background: #f4f1eb;
  }
  body.hero-page #step-studio::before { content: none; }
  body.hero-page #step-studio .studio-copy {
    width: 100%; max-width: 760px; min-height: 0;
    padding: 0; margin: 0 auto 28px; text-align: center;
  }
  body.hero-page #step-studio .studio-copy .look-brand { justify-content: center; }
  body.hero-page #step-studio .studio-copy .script { width: min(132px, 36vw); }
  body.hero-page #step-studio .studio-copy .studio-name { margin-left: 0; }
  body.hero-page #step-studio .studio-copy .rule { margin: 24px auto 18px; width: 48px; }
  body.hero-page #step-studio .studio-line {
    font: 400 clamp(42px, 4.2vw, 66px)/1.12 'Playfair Display', Georgia, serif;
    letter-spacing: -.045em; text-transform: none; max-width: none;
  }
  body.hero-page #step-studio .home-back { left: -50px; top: 7px; }
  body.hero-page #step-studio .types {
    flex: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 18px;
    margin-top: 20px;
  }
  body.hero-page #step-studio .types :is(a,button) {
    height: auto;
    min-height: 260px;
    aspect-ratio: 1.33;
    border-radius: 8px;
    transition: transform .2s ease, box-shadow .2s ease;
  }
  body.hero-page #step-studio .types :is(a,button):hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 35px #18222b30;
  }
  body.hero-page #step-studio .types b { font-size: 18px; letter-spacing: .13em; }
  body.hero-page #step-studio .types small { font-size: 11px; }
  body.hero-page #step-studio .types .cap { padding: 50px 22px 20px; }
  body.hero-page #step-studio #discovery-studio { width: 100%; }

  body:has(#step-looks:not(.hidden)) > main,
  body:has(#step-poses:not(.hidden)) > main,
  body:has(#step-capture:not(.hidden)) > main,
  body:has(#step-styling:not(.hidden)) > main,
  body:has(#step-preview:not(.hidden)) > main,
  body:has(#step-pricing:not(.hidden)) > main {
    width: min(100%, 1480px);
    max-width: 1480px;
    padding: 42px 5vw 100px;
  }
  body:has(#step-looks:not(.hidden)) #wordmark,
  body:has(#step-poses:not(.hidden)) #wordmark,
  body:has(#step-styling:not(.hidden)) #wordmark { display: none; }
  #step-looks .look-head, #step-poses .look-head, #step-styling .look-head {
    max-width: 760px;
    margin: 0 auto 28px;
  }
  body:not(.hero-page) .look-head .back {
    background: transparent;
    color: #18222b;
    border: 1px solid #b7a88f;
    border-radius: 6px;
    box-shadow: none;
  }
  body:not(.hero-page) .look-head .back:hover { background: #e9e4dc; }
  #step-looks .look-title, #step-poses .look-title, #step-styling .look-title {
    font: 400 clamp(42px, 4.2vw, 66px)/1.12 'Playfair Display', Georgia, serif;
    letter-spacing: -.045em;
    text-transform: none;
  }
  #step-looks .looks, #step-poses .poses {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    max-width: 1320px;
    margin-inline: auto;
  }
  #step-looks .looks :is(a,button), #step-poses .poses button {
    aspect-ratio: 1.25;
    border-radius: 8px;
    transition: transform .2s ease, box-shadow .2s ease;
  }
  #step-looks .looks :is(a,button):hover, #step-poses .poses button:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 30px #18222b29;
  }
  #step-looks .looks b, #step-poses .poses button b { font-size: 17px; }
  #step-looks .looks .cap { padding: 48px 22px 20px; }
  #step-poses .poses button { padding: 20px; }
  #step-poses .poses button.pose-on { border: 2px solid #8b6838; box-shadow: inset 0 0 0 2px #8b6838; }
  #step-poses #pose-create { display: block; width: min(100%, 420px); margin: 34px auto 0; }

  #step-capture {
    display: grid;
    grid-template-columns: minmax(290px, .65fr) minmax(0, 1.35fr);
    gap: 0 48px;
    align-items: start;
    margin-top: 32px;
  }
  #step-capture .file-btn, #step-capture .shot-notes, #step-capture #capture-continue, #step-capture #status { grid-column: 1; }
  #step-capture .capture-poses { grid-column: 2; grid-row: 1 / span 5; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
  #step-capture .file-btn { min-height: 66px; border-radius: 8px; }
  #step-capture .shot-notes { line-height: 1.7; }
  #step-capture .capture-poses img, #step-capture .capture-poses .signature-preview { border-radius: 8px; }
  #step-capture #capture-continue { margin-top: 8px; }

  #step-styling { max-width: 940px; margin-inline: auto; }
  #step-styling .style-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
  #step-styling .style-tiles button { min-height: 170px; border-radius: 8px; }
  #step-styling #styling-next { display: block; width: min(100%, 440px); margin: 26px auto 0; }
  #step-preview .pose-results { --result-columns: 3; gap: 24px; max-width: 1320px; }
  #step-preview .pose-results[data-count="1"] figure { width: min(100%, 430px); }
  #step-preview .pose-results[data-count="3"], #step-preview .pose-results[data-count="4"] { --result-columns: 3; }
  #step-pricing { max-width: 1180px; width: 100%; }
  #step-pricing .quality-options { gap: 24px; margin: 34px 0; }
  #step-pricing .quality-card { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1fr); gap: 22px; padding: 20px; border-radius: 8px; }
  #step-pricing .quality-photo img { height: 330px; object-fit: cover; border-radius: 5px; }
  #step-pricing .quality-title { margin-top: 4px; }
  #step-pricing #pricing-continue { max-width: 500px; }
  body:has(#step-looks:not(.hidden)) .site-footer,
  body:has(#step-poses:not(.hidden)) .site-footer,
  body:has(#step-capture:not(.hidden)) .site-footer,
  body:has(#step-styling:not(.hidden)) .site-footer,
  body:has(#step-pricing:not(.hidden)) .site-footer { position: static; }

  body:has(#images-gallery) > main,
  body:has(.plans) > main.experience,
  body:has(#photo-list) > main {
    width: min(100%, 1480px);
    max-width: 1480px;
    padding: 38px 5vw 100px;
  }
  body:has(#images-gallery) .gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
  body:has(#images-gallery) .gallery figure { padding: 14px; border: 1px solid var(--editorial-line); border-radius: 8px; background: #fffdfa; }
  body:has(#images-gallery) .gallery img { border-radius: 5px; }
  body:has(#images-gallery) .gallery .image-download { border-radius: 6px; }
  body:has(#photo-list) .photo-list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
  body:has(#photo-list) .quality-option { max-width: 760px; }
  body:has(#photo-list) #queue, body:has(#photo-list) #to-pricing { max-width: 760px; }
}
@media (min-width: 1000px) and (max-width: 1199px) {
  body:has(#images-gallery) .gallery { grid-template-columns: repeat(3, minmax(0,1fr)); }
  #step-pricing .quality-card { grid-template-columns: 1fr; }
  #step-pricing .quality-photo img { height: 240px; }
}
@media (prefers-reduced-motion: reduce) {
  #step-looks .looks :is(a,button), #step-poses .poses button, body.hero-page #step-studio .types :is(a,button) { transition: none; }
}
@media(min-width:1000px){
  #step-looks,#step-poses,#step-styling{position:relative}
  #step-looks .look-head,#step-poses .look-head,#step-styling .look-head{position:static}
  body :is(#look-back,#pose-back,#styling-back){top:0;left:0}
  body.hero-page #step-studio .studio-copy{padding-left:0;position:static}
  body.hero-page #step-studio #studio-back{top:42px;left:5vw;right:auto;transform:none}
}
