/* Tablet compositions and compact desktop Owner layout.
 * All other responsive rules stay inside the tablet media query; the Owner
 * poster bridges through 1359px before returning to the full desktop canvas.
 */
@media (min-width: 768px) and (max-width: 1024px) {
  :root { --tablet-gutter: 40px; --tablet-content: calc(100% - 80px); }
  body { font-size: 16px; }
  .front-page, .owner-media-section, .owner-company-section {
    --ism-sp-edge: var(--tablet-gutter);
    --ism-sp-content: calc(100% - 80px);
  }
  .section__inner, .design-container, .owner-social__inner { width: var(--tablet-content); }
  .site-header__inner { padding-inline: 32px; }
  .site-nav__inner { width: min(640px, calc(100% - 80px)); }
  .site-nav__list a { min-height: 64px; }
  .site-nav__label { font-size: 18px; }
  .site-nav__sub-label { font-size: 12px; }
  .front-page .ism-section-label.ism-section-label { font-size: 23px; }
  .front-page .feature-button { width: min(100%, 380px); min-width: 0; min-height: 56px; padding: 15px 28px; font-size: 15px; }

  /* Hero: desktop-sized masked artwork, with the touch navigation and one CTA. */
  body.home .front-page .hero,
  body.home .front-page .hero .hero__stage { height: clamp(680px, 82svh, 880px); min-height: 0; }
  body.home .front-page .hero .hero__stage { width: 100%; margin: 0; }
  body.home .front-page .hero .hero__eyebrow { top: 160px; left: var(--tablet-gutter); font-size: 16px; }
  body.home .front-page .hero h1 { top: 215px; left: var(--tablet-gutter); width: calc(100% - 80px); font-size: clamp(30px, 4vw, 40px); line-height: 1.65; }
  body.home .front-page .hero .hero__visual.hero__mask {
    top: auto; right: -8vw; bottom: clamp(107px, calc(240px - 13vw), 140px); left: auto;
    width: min(70vw, 520px); height: auto; min-height: 0; aspect-ratio: 1215.59 / 646.41;
    margin: 0;
  }
  body.home .front-page .hero .hero__actions {
    inset: auto auto 66px var(--tablet-gutter); width: 350px; height: auto;
  }
  body.home .front-page .hero .hero__actions .button { min-height: 58px; font-size: 16px; }
  body.home .front-page .hero .hero-scroll-down { inset: auto 40px 30px auto; }
  body.home .front-page .hero.hero--sp-version2 .hero__sp-wordmark { top: 315px; font-size: 60px; }
  body.home .front-page .hero.hero--sp-version2 .hero__sp-subtitle { top: 382px; }
  body.home .front-page .hero.hero--sp-version2 .visual-reservation { inset: auto auto 66px 40px; width: 350px; }
  .front-page .campaign-section { padding: 64px 0; }
  .front-page .campaign-section__inner { width: min(680px, var(--tablet-content)); }

  /* Concept: retain the layered collage, place the reading beside it. */
  .front-page .concept-section { height: auto; min-height: 0; padding: 88px 0; }
  .front-page .concept-section__stage {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center;
    gap: 36px; width: var(--tablet-content); height: auto; min-height: 440px; margin: 0 auto;
  }
  .front-page .concept-section__visual { position: relative; inset: auto; grid-area: 1 / 1; order: 0; width: 100%; height: 420px; margin: 0; transform: none; }
  .front-page .concept-section__panel--water { inset: 0 0 auto auto; width: 75%; height: 270px; }
  .front-page .concept-section__panel--pink { inset: auto auto 0 0; width: 80%; height: 250px; }
  .front-page .concept-section__panel { z-index: 0; }
  .front-page .concept-section__photo { inset: 60px auto auto 8%; z-index: 2; width: 78%; height: 300px; object-fit: cover; }
  .front-page .concept-section__content { display: block; position: static; grid-area: 1 / 2; order: 0; width: 100%; }
  .front-page .concept-section__content > .concept-section__label,
  .front-page .concept-section__title,
  .front-page .concept-section__lead,
  .front-page .concept-section__body,
  .front-page .concept-section__more { position: relative; inset: auto; width: auto; height: auto; margin: 0 0 22px; }
  .front-page .concept-section__title { font-size: 42px; line-height: 1.3; }
  .front-page .concept-section__lead { font-size: 20px; line-height: 1.8; }
  .front-page .concept-section__body, .front-page .concept-section__body p { font-size: 14px; line-height: 2; }
  .front-page .concept-section__more { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }
  .front-page .concept-section__rule, .front-page .concept-section__water-line { display: none; }

  /* Studio cards keep horizontal dragging, with two readable cards in view. */
  .front-page .studio-section { height: auto; min-height: 0; padding: 80px 0; }
  .front-page .studio-section__canvas { width: var(--tablet-content); height: auto; min-height: 0; margin: 0 auto; }
  .front-page .studio-section__head { position: relative; inset: auto; width: calc(100% - 110px); }
  .front-page .studio-section__chapter { font-size: 23px; }
  .front-page .studio-section__head h2 { font-size: 28px; }
  .front-page .studio-section__head > p { font-size: 14px; line-height: 1.8; }
  .front-page .studio-section__head h2,
  .front-page .studio-section__head > p,
  .front-page .studio-section__head > p:not(.studio-section__chapter) { position: static; inset: auto; width: auto; height: auto; margin: 0 0 16px; }
  .front-page .studio-section__title-row { display: flex; align-items: center; justify-content: space-between; }
  .front-page .studio-section--marquee-hidden .studio-section__canvas { height: auto; min-height: 0; }
  .front-page .studio-section__count { top: 0; right: 0; left: auto; }
  .front-page .studio-section__count strong { font-size: 64px; }
  .front-page .studio-section__controls { position: static; display: flex; margin-left: 20px; }
  .front-page .studio-section__nav { width: 44px; height: 44px; }
  .front-page .studio-panorama.studio-panorama--cards {
    position: relative; inset: auto; width: 100%; height: auto; margin: 32px 0;
    padding: 12px 0 24px; gap: 20px; scroll-padding: 0; transform: none;
  }
  .front-page .studio-panorama--cards .studio-pickup-card {
    flex: 0 0 calc((100% - 20px) / 2); width: calc((100% - 20px) / 2); min-width: 0;
    height: auto; min-height: 410px; padding: 28px 24px 80px;
  }
  .front-page .studio-pickup-card__address,
  .front-page .studio-pickup-card__access { font-size: 13px; }
  .front-page .studio-section__list-cta { position: static; width: 100%; margin: 20px 0 0; transform: none; text-align: center; }
  .front-page .studio-section__progress { display: none; }

  /* Lesson: keep tap-to-expand and the live photo, in a balanced two-column view. */
  .front-page .lesson-section { height: auto; min-height: 0; padding: 80px 0; }
  .front-page .lesson-section__canvas {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); grid-template-rows: auto auto 1fr auto;
    gap: 20px 36px; width: var(--tablet-content); height: auto; min-height: 0; margin: 0 auto;
  }
  .front-page .lesson-section__copy { grid-column: 1 / -1; grid-row: 1; }
  .front-page .lesson-section__label, .front-page .lesson-section__copy h2 { position: static; width: auto; margin: 0 0 20px; }
  .front-page .lesson-section__copy h2 { font-size: 27px; line-height: 1.7; }
  .front-page .lesson-selected { position: relative; inset: auto; grid-column: 2; grid-row: 2 / 4; width: 100%; height: 330px; margin: 0; }
  .front-page .lesson-selected__photo { position: absolute; inset: 32px auto auto 0; width: 92%; height: 255px; margin: 0; object-fit: cover; }
  .front-page .lesson-selected__water { inset: 0 0 auto auto; width: 80%; height: 300px; }
  .front-page .lesson-selected__ribbon, .front-page .lesson-selected__curve { display: none; }
  .front-page .lesson-section__concern { position: static; grid-column: 1; grid-row: 2; width: auto; margin: 0; padding: 0 0 12px; font-size: 14px; transform: none; }
  .front-page .lesson-list { position: static; grid-column: 1; grid-row: 3; width: 100%; margin: 0; }
  .front-page .lesson-list__item { min-height: 54px; padding-block: 16px; }
  .front-page .lesson-list__item:not(.is-open) { min-height: 54px; padding-block: 14px; }
  .front-page .lesson-list__item,
  .front-page .lesson-list__item:not(.is-open) { padding-top: 32px; }
  .front-page .lesson-list__item strong { font-size: 15px; line-height: 1.7; white-space: normal; }
  .front-page .lesson-list__item small { font-size: 13px; line-height: 1.8; }
  .front-page .lesson-section__cta { position: static; grid-column: 1 / -1; grid-row: 4; width: 100%; margin: 24px 0 0; transform: none; justify-content: center; }

  /* Trial: two rows of steps, keeping the pictures and sequence legible. */
  .front-page .trial-section, .lesson-page .lesson-trial-section { height: auto; padding: 80px 0; }
  .front-page .trial-section__canvas, .lesson-page .trial-section__canvas { width: var(--tablet-content); height: auto; margin: 0 auto; }
  .front-page .trial-section h2, .lesson-page .lesson-trial-section h2 { font-size: 30px; }
  .front-page .trial-section__lead, .lesson-page .trial-section__lead { font-size: 15px; line-height: 1.8; }
  .front-page .trial-flow, .lesson-page .trial-flow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 32px; width: 100%; margin: 36px 0; }
  .front-page .trial-flow__item, .lesson-page .trial-flow__item { width: 100%; height: auto; min-height: 130px; grid-template-columns: 100px minmax(0, 1fr); }
  .front-page .trial-flow__item img, .lesson-page .trial-flow__item img { width: 100px; height: 100px; object-fit: cover; }
  .front-page .trial-flow__label, .lesson-page .trial-flow__label { font-size: 18px; }
  .front-page .trial-flow__item p, .lesson-page .trial-flow__item p { font-size: 13px; line-height: 1.8; }
  .front-page .trial-flow__item { grid-template-columns: 90px 26px minmax(0, 1fr); gap: 8px 12px; }
  .front-page .trial-flow__item img { grid-area: 1 / 1 / 3 / 2; width: 90px; height: 90px; }
  .front-page .trial-flow__item > strong { grid-area: 1 / 2; margin: 0; font-size: 15px; }
  .front-page .trial-flow__item .trial-flow__label { grid-area: 1 / 3; font-size: 16px; line-height: 1.65; margin: 0; }
  .front-page .trial-flow__item > p:last-child { grid-area: 2 / 2 / 3 / 4; font-size: 13px; line-height: 1.8; }
  .lesson-page .trial-flow__item { display: flex; flex-direction: column; gap: 14px; }
  .lesson-page .trial-flow__item img { width: 100%; height: 190px; }
  .lesson-page .trial-flow__meta { margin: 0; }
  .front-page .trial-section__cta .button, .lesson-page .trial-section__cta .button { font-size: 15px; min-height: 54px; }
  .front-page .trial-section__cta { margin-top: 32px; }

  /* Media and editorial blocks use natural heights and comfortable card sizes. */
  .front-page .media-section { height: auto; min-height: 0; padding: 80px 0; }
  .front-page .media-section__inner { width: var(--tablet-content); height: auto; min-height: 0; margin: 0 auto; }
  .front-page .media-section__intro { position: relative; padding-right: 120px; }
  .front-page .media-section__eyebrow,
  .front-page .media-section__intro h2,
  .front-page .media-section__intro > p:not(.media-section__eyebrow) { position: static; width: auto; margin: 0 0 16px; }
  .front-page .media-section__intro h2 { font-size: 28px; }
  .front-page .media-section__intro > p:not(.media-section__eyebrow) { font-size: 14px; line-height: 1.9; }
  .front-page .media-section__arrows { inset: auto 0 0 auto; }
  .front-page .media-track { position: relative; inset: auto; width: 100%; height: auto; gap: 28px; margin: 36px 0 0; padding-bottom: 16px; }
  .front-page .media-card { flex: 0 0 calc((100% - 56px) / 3); width: calc((100% - 56px) / 3); height: auto; min-height: 0; }
  .front-page .media-card__visual { width: 100%; height: 250px; object-fit: contain; }
  .front-page .media-card__body { width: 100%; }
  .front-page .media-card__body h3 { font-size: 15px; line-height: 1.7; }
  .front-page .media-card__body p { font-size: 13px; }
  .front-page .feature-section { height: auto; min-height: 0; aspect-ratio: auto; padding: 80px 0; }
  .front-page .feature-section .feature-block { width: var(--tablet-content); }
  .front-page .feature-eyebrow { margin-bottom: 32px; }
  .front-page .feature-eyebrow__ja { font-size: 16px; }
  .front-page .feature-block__cols { display: block; width: 100%; }
  .front-page .feature-section .feature-block__text { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 36px; width: 100%; max-width: none; margin: 0; text-align: left; }
  .front-page .feature-section .feature-block__heading { grid-column: 2; grid-row: 1; margin: 0; font-size: 25px; line-height: 1.65; }
  .front-page .feature-section .feature-block__media { grid-column: 1; grid-row: 1 / 3; width: 100%; max-width: none; height: auto; margin: 0; align-self: center; }
  .front-page .feature-section .feature-block__media img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
  .front-page .feature-section .feature-block__lead { grid-column: 2; grid-row: 2; width: 100%; margin: 0; font-size: 14px; line-height: 2; }
  .front-page .feature-block__cta { margin-top: 36px; text-align: center; }
  .front-page .franchise-section .feature-block__heading,
  .front-page .franchise-section .feature-block__lead { grid-column: 1; }
  .front-page .franchise-section .feature-block__media { grid-column: 2; }
  .front-page .column-section { height: auto; padding: 80px 0; }
  .front-page .column-section > .section__inner { width: var(--tablet-content); }
  .front-page .column-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; }
  .front-page .column-layout__main, .front-page .column-layout__side { width: 100%; }
  .front-page .article-card--main .article-card__image { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
  .front-page .article-card--main h3 { font-size: 21px; line-height: 1.7; }
  .front-page .column-layout .article-card--compact { display: block; min-height: 105px; height: auto; }
  .front-page .column-layout .article-card--compact > a { display: grid; grid-template-columns: 100px minmax(0, 1fr); align-items: start; gap: 16px; width: 100%; min-height: 105px; height: auto; padding: 16px 0; }
  .front-page .column-layout .article-card--compact::before { display: none; }
  .front-page .column-layout .article-card--compact .article-card__image { position: static; width: 100px; height: 80px; object-fit: cover; }
  .front-page .column-layout .article-card--compact .article-card__body { position: static; width: 100%; margin: 0; padding: 0; }
  .front-page .column-layout .article-card--compact h3 { font-size: 14px; line-height: 1.65; max-height: 4.95em; }
  .front-page .article-card__meta { font-size: 12px; }

  /* Company: a proper table instead of a narrow phone canvas. */
  .front-page .company-section { height: auto; min-height: 0; padding: 80px 0; }
  .front-page .company-section__canvas { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 40px; width: var(--tablet-content); height: auto; min-height: 0; margin: 0 auto; }
  .front-page .company-section__left, .front-page .company-section__main { position: static; width: 100%; }
  .front-page .company-section__left > p, .front-page .company-section__brand,
  .front-page .company-section__main h2, .front-page .company-section dl,
  .front-page .company-section__link { position: static; width: 100%; height: auto; margin: 0 0 24px; transform: none; }
  .front-page .company-section__brand { display: block; margin-top: 36px; }
  .front-page .company-section__brand img { width: 120px; height: auto; }
  .front-page .company-section__main h2 { font-size: 28px; }
  .front-page .company-section dl > div { grid-template-columns: 100px minmax(0, 1fr); width: 100%; padding-block: 16px; gap: 12px; }
  .front-page .company-section dt, .front-page .company-section dd { font-size: 13px; line-height: 1.85; overflow-wrap: anywhere; }
  .front-page .company-section__link { display: inline-flex; width: auto; min-height: 44px; font-size: 14px; }
  .owner-social__links { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .site-footer__inner { width: var(--tablet-content); grid-template-columns: 180px minmax(0, 1fr); gap: 48px; padding: 64px 0 40px; }
  .site-footer__links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  .site-footer__bottom { width: var(--tablet-content); }

  /* Fixed pages: share a two-column opening, retain each page's layered imagery. */
  .design-page .design-hero { min-height: 0; }
  .design-page .design-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 36px; width: var(--tablet-content); height: auto; min-height: 0; padding: 140px 0 80px; }
  .design-page .design-hero__copy { display: block; position: relative; width: 100%; }
  .design-page .design-hero h1 { font-size: 64px; margin: 0 0 28px; }
  .design-page .design-hero__lead { position: static; width: 100%; font-size: 24px; line-height: 1.8; margin: 0 0 24px; }
  .concept-page .design-hero__lead-line--tagline { font-size: 15px; white-space: normal; }
  .design-page .design-hero__body { position: static; width: 100%; font-size: 14px; line-height: 2; margin: 0 0 28px; }
  .design-page .design-hero__cta { position: static; width: 100%; margin: 24px 0 0; }
  .design-page .design-hero__cta .button { width: 100%; min-width: 0; min-height: 54px; font-size: 14px; }
  .design-page .design-hero__visual { position: relative; inset: auto; width: 100%; height: 410px; margin: 0; }
  .design-page .design-hero__main-image { position: absolute; inset: 32px auto auto 0; width: 90%; height: 330px; object-fit: cover; }
  .design-page .design-hero__detail-image { inset: auto 0 0 auto; width: 125px; height: 125px; }
  .design-page .design-hero__visual::before { width: 110%; height: 110%; inset: -5%; }
  .design-page .design-orb--d { width: 44vw; height: 44vw; left: auto; right: 0; }
  .design-page .design-section { padding-block: 80px; }

  .concept-page .concept-about__grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 36px; align-items: center; }
  .concept-page .concept-about__media { height: 440px; }
  .concept-page .concept-about__main { width: 90%; height: 340px; object-fit: cover; }
  .concept-page .concept-about__sub { width: 70%; height: 210px; bottom: 0; }
  .concept-page .concept-about__watermark { top: -60px; font-size: 60px; }
  .concept-page .concept-about__copy h2 { font-size: 25px; line-height: 1.7; }
  .concept-page .concept-about__lead { font-size: 19px; margin: 24px 0; }
  .concept-page .concept-about__paragraph, .concept-page .concept-about__principle-text { font-size: 13px; line-height: 1.8; }
  .concept-page .concept-about__principle-label { font-size: 15px; }
  .concept-page .concept-method__item { grid-template-columns: 80px minmax(0, 1fr); gap: 28px; }
  .concept-page .concept-method__content h3 { font-size: 26px; }
  .concept-page .concept-method__content p { font-size: 15px; line-height: 2; }
  .concept-page .concept-philosophy__intro { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; }
  .concept-page .concept-philosophy__principle { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; }
  .concept-page .concept-philosophy__body, .concept-page .concept-philosophy__intro-text { font-size: 15px; line-height: 2; }
  .concept-page .concept-philosophy > .design-container { width: var(--tablet-content); }
  .concept-page .concept-philosophy__intro { width: 100%; margin-inline: 0; }
  .concept-page .concept-philosophy__studio-image { width: 100%; height: 240px; object-fit: cover; }
  .concept-page .concept-philosophy__principles { display: grid; grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr); align-items: stretch; gap: 10px; width: 100%; max-width: none; margin: 48px 0 24px; }
  .concept-page .concept-philosophy__principle { display: block; min-height: 480px; height: auto; padding: 28px 24px 120px; }
  .concept-page .concept-philosophy__principle-copy { width: 100%; padding: 0; }
  .concept-page .concept-philosophy__principle h3 { font-size: 26px; }
  .concept-page .concept-philosophy__principle-image { width: 110px; height: 110px; }
  .concept-page .concept-philosophy__cross { position: static; grid-area: 1 / 2; align-self: center; width: 24px; margin: 0; transform: none; }
  .concept-page .concept-philosophy__principle--professional { grid-area: 1 / 1; }
  .concept-page .concept-philosophy__principle--hospitality { grid-area: 1 / 3; }
  .concept-page .concept-philosophy__fusion { width: 100%; min-height: 310px; padding: 40px; }
  .concept-page .concept-philosophy__promise { font-size: 14px; line-height: 2; }

  .studio-page .studio-space__gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .studio-page .studio-space__gallery img:nth-child(n) { width: 100%; height: 260px; grid-column: auto; }
  .studio-page .studio-space__gallery img:first-child { grid-column: 1 / -1; height: 360px; }
  .studio-page .studio-filter__button { flex: 0 1 auto; min-height: 44px; padding-inline: 20px; }
  .studio-page .studio-grid--directory.studio-panorama--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .studio-page .studio-pickup-card { width: 100%; min-width: 0; height: auto; min-height: 400px; }
  .studio-page .design-trial__grid { grid-template-columns: 1fr; }
  .studio-page .design-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .lesson-page .lesson-sequence__item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; }
  .lesson-page .lesson-sequence__copy { padding: 0; }
  .lesson-page .lesson-sequence__copy h3 { font-size: 26px; }
  .lesson-page .lesson-sequence__item img:not(.lesson-sequence__water) { width: 100%; height: 300px; object-fit: cover; }
  .lesson-page .lesson-sequence__description, .lesson-page .lesson-sequence__note { font-size: 14px; line-height: 2; }
  .lesson-page .lesson-sequence { height: auto; min-height: 0; padding: 80px 0; overflow: visible; }
  .lesson-page .lesson-sequence .design-container { width: var(--tablet-content); height: auto; min-height: 0; margin: 0 auto; }
  .lesson-page .lesson-sequence__heading h2 { position: static; width: 100%; max-width: none; font-size: 28px; line-height: 1.7; }
  .lesson-page .lesson-sequence__heading > .lesson-sequence__intro { display: block; margin: 28px 0 0; }
  .lesson-page .lesson-sequence__list { position: static; display: grid; width: 100%; margin: 48px 0 0; gap: 48px; }
  .lesson-page .lesson-sequence__item,
  .lesson-page .lesson-sequence__item:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; padding: 0 0 32px; }
  .lesson-page .lesson-sequence__copy { display: block; order: 0; }
  .lesson-page .lesson-sequence__item:nth-of-type(even) .lesson-sequence__copy { order: 2; }
  .lesson-page .lesson-sequence__copy > span { font-size: 20px; margin-bottom: 16px; }
  .lesson-page .lesson-sequence__copy h3 { font-size: 23px; white-space: normal; overflow: visible; margin-bottom: 18px; }
  .lesson-page .lesson-sequence__copy p { max-height: none; white-space: normal; overflow: visible; font-size: 14px; line-height: 1.9; }
  .lesson-page .lesson-sequence__item img:not(.lesson-sequence__water),
  .lesson-page .lesson-sequence__item:first-child img:not(.lesson-sequence__water) { position: static; display: block; width: 100%; height: 260px; transform: none; border-radius: 4px; }
  .lesson-page .lesson-ba__intro { left: 40px; width: var(--tablet-content); }
  .lesson-page .lesson-ba__eyebrow { font-size: 56px; }
  .lesson-page .lesson-ba__stage { right: 40px; width: var(--tablet-content); height: calc(100% - 230px); min-height: 0; }
  .lesson-page .lesson-ba__photos { display: flex; align-items: center; justify-content: center; gap: 40px; height: calc(100% - 48px); min-height: 0; }
  .lesson-page .lesson-ba__photo { position: relative; inset: auto; flex: 0 1 auto; width: auto; max-width: 44%; height: 100%; min-height: 0; aspect-ratio: 3 / 4; margin: 0; }
  .lesson-page .lesson-ba__photo img { object-fit: contain; }
  .lesson-page .lesson-ba__arch-arrow { width: 35%; left: 32.5%; top: -52px; }

  .owner-page .owner-hero { min-height: 0; padding: 110px 0 80px; }
  .owner-page .owner-hero__card { width: var(--tablet-content); height: 660px; }
  .owner-page .owner-hero .owner-hero__card picture { position: absolute; inset: 0 0 0 auto; width: 46%; }
  .owner-page .owner-hero .owner-hero__card img { object-fit: cover; object-position: center top; }
  .owner-page .owner-hero__veil { background: linear-gradient(90deg, #f8f7f4 46%, rgba(248,247,244,.2) 65%, transparent); }
  .owner-page .owner-hero__copy { inset: 145px auto auto 64px; width: 43%; }
  .owner-page .owner-hero h1 { font-size: 60px; margin-bottom: 24px; }
  .owner-page .owner-hero__message { max-width: none; font-size: 14px; line-height: 1.9; }
  .owner-page .owner-hero__signature { top: auto; bottom: 85px; left: 45%; width: 160px; }
  .owner-page .owner-hero--secondary { padding-top: 40px; }
  .owner-page .owner-hero.owner-hero--secondary .owner-hero__card picture { inset: 0 auto 0 0; }
  .owner-page .owner-hero.owner-hero--secondary .owner-hero__card img { object-fit: cover; object-position: center top; }
  .owner-page .owner-hero--secondary .owner-hero__veil { background: linear-gradient(270deg, #f8f7f4 46%, rgba(248,247,244,.2) 65%, transparent); }
  .owner-page .owner-hero--secondary .owner-hero__copy { inset: 80px 64px auto auto; width: 43%; }
  .owner-page .owner-hero--secondary .owner-hero__message { font-size: 14px; line-height: 1.9; }
  .owner-page .owner-profile__grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); width: var(--tablet-content); gap: 36px; align-items: center; }
  .owner-page #profile-ryo .owner-profile__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 36px; }
  .owner-page .owner-profile--reverse .owner-profile__grid > img,
  .owner-page .owner-profile--reverse .owner-profile__grid > picture { width: 100%; grid-area: auto; margin: 0; }
  .owner-page .owner-profile--reverse .owner-profile__copy { width: 100%; grid-area: auto; }
  .owner-page .owner-hero.owner-hero--secondary .owner-hero__card { width: var(--tablet-content); }
  .owner-page .owner-profile__grid > img, .owner-page .owner-profile__grid > picture > img { width: 100%; height: 450px; object-fit: cover; object-position: center top; }
  .owner-page .owner-profile__copy > p, .owner-page .owner-profile__roles { font-size: 14px; line-height: 1.9; }
  .owner-page .owner-achievement__inner { width: var(--tablet-content); }
  .owner-page .owner-achievement__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  .owner-page .owner-achievement__copy p { font-size: 14px; line-height: 1.9; }
  .owner-page .owner-message__inner { width: min(660px, var(--tablet-content)); margin-inline: auto; }
  .owner-page .owner-message__inner h3 { font-size: 25px; line-height: 1.8; }
  .owner-page .owner-message__body, .owner-page .owner-message__story { font-size: 15px; line-height: 2.2; }
  .owner-page .owner-message__section-image { width: 260px; height: 360px; object-fit: cover; }

}

/* Keep tablet and compact desktop on one SP poster layout until the full
 * desktop canvas has enough room at 1360px. */
@media (min-width: 768px) and (max-width: 1359px) {
  .front-page {
    --tablet-content: calc(100% - clamp(80px, 10vw, 128px));
  }

  .front-page .owner-section--pinned {
    --owner-tablet-mesh-top: 61px;
    --owner-tablet-owner2-shift: 0px;
    --owner-sp-bg-height: clamp(480px, 74svh, 570px);
    height: calc(var(--owner-tablet-content-height, 1000px) + 100svh);
    min-height: 0;
    margin: clamp(24px, 4svh, 36px) 0 0;
    padding: 0;
    overflow: visible;
  }

  .front-page .owner-section--pinned .owner-section__sticky {
    position: sticky;
    top: var(--owner-tablet-sticky-top, var(--header-height));
    width: 100%;
    height: auto;
    min-height: 0;
    overflow: visible;
    padding-bottom: 32px;
  }

  .front-page .owner-section--pinned .owner-section__slides {
    position: relative;
    display: grid;
    width: 100%;
    height: auto;
    min-height: 0;
  }

  .front-page .owner-section--pinned .owner-section__slide {
    position: relative;
    inset: auto;
    grid-area: 1 / 1;
    height: auto;
    min-width: 0;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 520ms ease, visibility 0s linear 520ms;
  }

  .front-page .owner-section--pinned .owner-section__slide.is-active {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition-delay: 0s;
  }

  .front-page .owner-section--pinned.owner-scroll-reduced-motion .owner-section__slide {
    transition: none;
  }

  .front-page .owner-section--pinned .owner-section__stage,
  .front-page .owner-section--pinned .owner-section__slide--secondary .owner-section__stage {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: 640px;
    gap: 0;
    width: 100%;
    height: 640px;
    min-height: 0;
    margin: 0 auto;
    padding: 0;
    overflow: visible;
    background: transparent;
  }

  .front-page .owner-section--pinned .owner-section__stage::before {
    display: none;
    top: 64px;
    left: 50%;
    width: calc(100% / var(--owner-sp-fit, 1));
    height: var(--owner-sp-mesh-height, var(--owner-sp-bg-height));
    transform: translateX(-50%);
  }

  .front-page .owner-section--pinned .owner-section__copy {
    display: contents;
  }

  .front-page .owner-section--pinned .owner-section__slide .owner-section__label {
    position: static;
    inset: auto;
    display: block;
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    z-index: 4;
    width: auto;
    margin: 0 0 0 clamp(16px, 4vw, 48px);
    transform: translateY(-22px);
    font-size: 0.8rem;
    line-height: 1.4;
  }

  @media (max-width: 1024px) {
    .front-page .owner-section--pinned .owner-section__slide .owner-section__label {
      transform: none;
    }
  }

  .front-page .owner-section--pinned .owner-section__greeting {
    position: static;
    inset: auto;
    display: block;
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    z-index: 4;
    width: auto;
    margin: 129px 0 0 clamp(16px, 6vw, 72px);
    font-size: 1rem;
    line-height: 1.5;
  }

  .front-page .owner-section--pinned .owner-section__copy h2 {
    position: static;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    z-index: 4;
    width: auto;
    height: 220px;
    margin: 0 clamp(28px, 7.5vw, 90px) 0 0;
    font-size: 1.38rem;
    font-weight: 400;
    line-height: 1.45;
    letter-spacing: 0.08em;
    writing-mode: vertical-rl;
    transform: translateY(8px);
  }

  .front-page .owner-section--pinned .owner-section__bio-panel {
    position: absolute;
    top: 392px;
    left: 50%;
    grid-area: auto;
    transform: translateX(-50%);
    display: block;
    width: min(100%, 940px);
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 18px 20px 6px;
    background: transparent;
    font-size: 0.8rem;
    line-height: 1.8;
  }

  .front-page .owner-section--pinned .owner-section__bio-panel p,
  .front-page .owner-section--pinned .owner-section__bio-panel .owner-section__body {
    position: static;
    width: 100%;
    max-width: none;
    margin: 0 0 clamp(14px, 2svh, 20px);
    font-size: 0.8rem;
    line-height: 1.8;
  }

  .front-page .owner-section--pinned .owner-section__bio-panel > .owner-section__body {
    width: fit-content;
    max-width: 100%;
    margin: 0 auto calc(clamp(14px, 2svh, 20px) + 6px);
    text-align: left;
  }

  .front-page .owner-section--pinned .owner-section__bio-panel > p:last-child {
    margin-bottom: 0;
    line-height: 1.65;
  }

  .front-page .owner-section--pinned .owner-section__portrait {
    position: absolute;
    inset: 45px auto auto 50%;
    grid-area: auto;
    z-index: 2;
    display: block;
    width: min(46%, 185px);
    height: auto;
    max-height: none;
    margin: 0;
    object-fit: contain;
    object-position: center bottom;
    transform: translateX(-50%);
  }

  .front-page .owner-section--pinned .owner-section__signature-art {
    position: absolute;
    /* Both portraits end at 45px + approximately 294px. */
    top: 339px;
    right: auto;
    bottom: auto;
    left: 50%;
    grid-area: auto;
    z-index: 5;
    display: block;
    width: min(92%, 420px);
    height: auto;
    max-width: none;
    margin: 0;
    clip-path: none;
    transform: translate(-50%, -50%) rotate(-10deg);
    transform-origin: center center;
  }

  .front-page .owner-section--pinned .owner-section__signature-art--ryo {
    width: min(80%, 350px);
  }

  .front-page .owner-section--pinned .owner-section__vertical-copy {
    display: none;
  }

  .front-page .owner-section--pinned .owner-section__slide--secondary .owner-section__portrait {
    position: absolute;
    inset: 45px auto auto 50%;
    grid-area: auto;
    z-index: 2;
    display: block;
    width: min(46%, 168px);
    height: auto;
    max-height: none;
    margin: 0;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center bottom;
    transform: translateX(-50%);
  }

  .front-page .owner-section--pinned .owner-section__slide--secondary .owner-section__bio-panel {
    top: 388px;
  }

  .front-page .owner-section--pinned .owner-section__slide--secondary .owner-section__bio-panel > .owner-section__body {
    margin-bottom: calc(clamp(14px, 2svh, 20px) + 13px);
  }

  .front-page .owner-section--pinned.is-owner2-active .owner-section__slide--secondary .owner-section__stage {
    transform: translateY(var(--owner-tablet-owner2-shift));
  }

  .front-page .owner-section--pinned.is-owner2-active .owner-section__sticky > .owner-section__mesh {
    top: calc(var(--owner-sp-mesh-top, var(--owner-tablet-mesh-top)) + var(--owner-tablet-owner2-shift));
  }

  .front-page .owner-section--pinned.is-owner2-active .owner-section__credit--common {
    transform: translateY(var(--owner-tablet-owner2-shift));
  }

  .front-page .owner-section--pinned .owner-section__slide:first-child .owner-section__stage {
    margin: 0 auto;
  }

  .front-page .owner-section--pinned .owner-section__credit--common {
    position: relative;
    inset: auto;
    display: flex;
    width: min(520px, var(--tablet-content));
    margin: 15px auto 0;
    transform: none;
  }

  .front-page .owner-section__mesh {
    display: block;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .4;
  }

  .front-page .owner-section--pinned .owner-section__sticky > .owner-section__mesh {
    position: absolute;
    top: var(--owner-sp-mesh-top, var(--owner-tablet-mesh-top));
    left: calc(50% - 50vw);
    z-index: 0;
    display: block;
    width: 100vw;
    height: var(--owner-sp-mesh-height, var(--owner-sp-bg-height));
    max-width: none;
    object-fit: cover;
    opacity: 0.82;
    transform: none;
    pointer-events: none;
  }

  .front-page .owner-section--pinned .owner-section__slides {
    position: relative;
    z-index: 1;
  }

  .front-page .owner-section__progress {
    display: none;
  }
}

/* When one profile is taller than the space below the header (landscape
 * phones), main.js adds .owner-story-flow: stack both profiles unpinned and
 * give each its own mesh band instead of the shared pinned one. */
@media (min-width: 768px) and (max-width: 1359px) {
  .front-page .owner-section--pinned.owner-story-flow {
    height: auto;
  }

  .front-page .owner-section--pinned.owner-story-flow .owner-section__sticky {
    position: relative;
    top: auto;
  }

  .front-page .owner-section--pinned.owner-story-flow .owner-section__slides {
    row-gap: 48px;
  }

  .front-page .owner-section--pinned.owner-story-flow .owner-section__slide,
  .front-page .owner-section--pinned.owner-story-flow .owner-section__slide.is-active {
    z-index: 1;
    grid-area: auto;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition: none;
  }

  .front-page .owner-section--pinned.owner-story-flow .owner-section__sticky > .owner-section__mesh {
    display: none;
  }

  .front-page .owner-section--pinned.owner-story-flow .owner-section__stage::before {
    content: "";
    position: absolute;
    top: var(--owner-tablet-mesh-top, 61px);
    left: 50%;
    z-index: -1;
    display: block;
    width: 100vw;
    height: var(--owner-sp-mesh-height, var(--owner-sp-bg-height));
    background: url("../images/owner-mesh.svg") center / cover no-repeat;
    opacity: 0.82;
    transform: translateX(-50%);
    pointer-events: none;
  }
}

/* Keep Owner 1's SP portrait at its natural ratio as the card widens. */
@media (max-width: 1024px) {
.owner-page .owner-hero.owner-hero:first-child .owner-hero__card {
  background: #f8f7f4;
}

.owner-page .owner-hero.owner-hero:first-child .owner-hero__card picture {
  position: absolute;
  inset: 0 0 0 auto;
  display: flex;
  justify-content: flex-end;
  width: min(100%, 440px);
  height: 100%;
}

.owner-page .owner-hero.owner-hero:first-child .owner-hero__card img {
  flex: none;
  width: auto;
  max-width: none;
  height: 100%;
  object-fit: contain;
  object-position: right center;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 36%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 36%, #000 100%);
}
}

/* Match the SP scroll cue position and type size on tablet. */
@media (min-width: 768px) and (max-width: 1024px) {
  body.home .front-page .hero,
  body.home .front-page .hero .hero__stage {
    height: calc(clamp(680px, 82svh, 880px) + 43px);
  }

  body.home .front-page .hero .hero__visual.hero__mask,
  body.home .front-page .hero.hero--sp-version2 .hero__visual.hero__mask {
    bottom: calc(clamp(107px, calc(240px - 13vw), 140px) + 43px);
    right: -8vw;
    width: clamp(460px, calc(54.6875vw + 40px), 600px);
  }

  body.home .front-page .hero .hero__actions {
    bottom: 109px;
  }

  body.home .front-page .hero .hero-scroll-down {
    position: absolute;
    top: auto;
    right: auto;
    bottom: 12px;
    left: 50%;
    display: inline-flex;
    gap: 8px;
    font-size: 14px;
    font-weight: 400;
    transform: translateX(-50%);
  }

  body.home .front-page .hero .hero-scroll-down__label {
    color: #8c8c8c;
    background: none;
    -webkit-text-fill-color: #8c8c8c;
  }

  body.home .front-page .hero .hero-scroll-down__line {
    height: 34px;
  }
}

/* Keep CTA width content-led on narrow tablets instead of viewport-led. */
@media (min-width: 601px) and (max-width: 767px) {
  .button,
  .feature-button {
    width: fit-content;
    max-width: 100%;
    justify-self: center;
  }

  .front-page .hero__actions .button--primary {
    width: fit-content;
    justify-self: start;
  }

  .front-page .feature-button {
    width: fit-content;
  }

  .front-page .method-section__features .method-section__cta .feature-button {
    width: fit-content;
    min-width: 0;
  }

  .front-page .owner-section--pinned .owner-section__credit--common {
    width: max-content;
    min-width: 0;
    max-width: min(100%, 520px);
    flex: 0 0 auto;
    justify-self: center;
    align-self: center;
  }
}

/* Compact lesson desktop composition, including the 767px boundary. */
@media (min-width: 767px) and (max-width: 1024px) {
  .front-page .lesson-section { height: auto; min-height: 0; padding: 80px 0; }
  .front-page .lesson-section__canvas {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto 1fr;
    gap: 32px 28px; width: calc(100% - 64px); height: auto; min-height: 0; margin: 0 auto;
  }
  .front-page .lesson-section__copy { position: static; grid-column: 1; grid-row: 1; width: auto; }
  .front-page .lesson-section__label { position: static; margin: 0 0 22px; }
  .front-page .lesson-section__copy h2 { position: static; width: auto; margin: 0; font-size: clamp(20px, 2.35vw, 24px); line-height: 1.65; }
  .front-page .lesson-section__concern { position: static; grid-column: 2; grid-row: 1; align-self: end; justify-self: center; width: auto; margin: 0 0 16px; padding: 6px 8px; font-size: 13px; white-space: normal; transform: none; }
  .front-page .lesson-list { position: static; grid-column: 1; grid-row: 2; width: 100%; margin: 0; }
  .front-page .lesson-list__item,
  .front-page .lesson-list__item:not(.is-open) { grid-template-columns: 30px minmax(0, 1fr) 18px; grid-template-rows: auto auto; min-height: 78px; padding: 16px 10px; border: 1px solid transparent; border-bottom-color: #dbcfc7; }
  .front-page .lesson-list__item + .lesson-list__item { margin-top: 22px; }
  .front-page .lesson-list__item.is-active,
  .front-page .lesson-list__item:hover,
  .front-page .lesson-list__item:focus-visible { border-color: rgba(191, 224, 242, .75); border-radius: 10px; background: linear-gradient(90deg, rgba(252,219,224,.82), rgba(245,232,250,.76), rgba(214,240,252,.82)); }
  .front-page .lesson-list__number { grid-column: 1; grid-row: 1 / 3; align-self: center; }
  .front-page .lesson-list__item strong { grid-column: 2; grid-row: 1; font-size: 14px; line-height: 1.7; }
  .front-page .lesson-list__item small { display: block; grid-column: 2; grid-row: 2; font-size: 11px; line-height: 1.8; }
  .front-page .lesson-list__arrow { display: block; grid-column: 3; grid-row: 1 / 3; align-self: center; }
  .front-page .lesson-selected { position: relative; inset: auto; grid-column: 2; grid-row: 2; width: 100%; height: auto; min-height: 620px; margin: 0; transform: none; }
  .front-page .lesson-selected__water { inset: 32px auto auto 17%; width: 72%; height: 215px; }
  .front-page .lesson-selected__ribbon { display: block; inset: 70px auto auto -2%; width: 48%; height: 380px; }
  .front-page .lesson-selected__number { display: block; position: absolute; inset: 0 0 auto auto; margin: 0; color: #e3b3a9; font: 100px/.72 var(--font-serif-en); }
  .front-page .lesson-selected__photo { inset: 82px auto auto 8%; width: 87%; height: 320px; }
  .front-page .lesson-selected__curve { display: block; inset: 370px auto auto 2%; width: 96%; height: 95px; }
  .front-page .lesson-selected__detail { display: block; position: absolute; inset: 445px auto auto 11%; width: 80%; }
  .front-page .lesson-selected__detail > span { position: absolute; top: 0; left: -24px; color: #6ec2f5; }
  .front-page .lesson-selected__detail h3 { display: block; margin: 0 0 10px; font-size: 20px; line-height: 1.5; }
  .front-page .lesson-selected__detail p { position: static; width: auto; max-height: none; margin: 0 0 10px; font-size: 12px; line-height: 1.9; }
  .front-page .lesson-selected__detail a { display: block; padding-top: 13px; border-top: 3px solid #dbcfc7; color: #c98f85; font-size: 16px; font-weight: 500; letter-spacing: .2em; text-align: right; }
  .front-page .lesson-section__cta { display: none; }
}

/* Reservation CTA dimensions; the front-page hero keeps its own sizing. */
body :is(
  .design-page .design-hero .design-hero__cta,
  .trial-section__cta,
  .lesson-voices__cta,
  .campaign-section__cta,
  .price-section__cta
) .button.button--primary {
  width: 280px;
  min-width: 280px;
  max-width: 280px;
  height: 50px;
  min-height: 50px;
  max-height: 50px;
  flex-shrink: 0;
}

@media (max-width: 1024px) {
  body :is(
    .design-page .design-hero .design-hero__cta,
    .trial-section__cta,
    .lesson-voices__cta,
    .campaign-section__cta,
    .price-section__cta
  ) .button.button--primary {
    width: 310px;
    min-width: 310px;
    max-width: 310px;
  }
}

/* Fill the Home Column/footer mobile breakpoint gap. */
@media (min-width: 601px) and (max-width: 767px) {
  .footer-link-group--no-heading { padding-top: 36px; }
  body.home .front-page .column-section { width: 100%; height: 1200px; min-height: 1200px; padding: 0px; overflow: hidden; }
  body.home .front-page .column-section .section__inner { position: relative; width: 375px; max-width: 100%; height: 1200px; margin: 0px auto; transform: translateY(-27px); }
  body.home .front-page .column-section__head { position: static; display: block; width: auto; margin: 0px; }
  body.home .front-page .column-section .section-heading { position: static; max-width: none; }
  body.home .front-page .column-section .section-heading__eyebrow { position: absolute; top: 86px; left: 28px; margin: 0px; font-size: 0.62rem; }
  body.home .front-page .column-section .section-heading__title { position: absolute; top: 120px; left: 28px; margin: 0px; font-size: 1.42rem; }
  body.home .front-page .column-section .section-heading__description { position: absolute; top: 194px; left: 28px; width: 319px; max-height: 48px; margin: 0px; overflow: hidden; font-size: 0.62rem; line-height: 1.8; }
  body.home .front-page .column-layout { position: absolute; top: 266px; left: 28px; display: block; width: 319px; margin: 0px; }
  body.home .front-page .article-card--main .article-card__image, body.home .front-page .article-card--main .article-card__image-placeholder { width: 319px; height: 169px; min-height: 0px; object-fit: cover; }
  body.home .front-page .article-card--main .media-placeholder__label { right: 14px; bottom: 12px; font-size: 0.72rem; letter-spacing: 0.06em; }
  body.home .front-page .article-card--main .article-card__body { padding: 14px 0px 0px; }
  body.home .front-page .article-card--main .article-card__meta { font-size: 0.45rem; }
  body.home .front-page .article-card--main h3 { margin: 7px 0px; font-size: 0.72rem; line-height: 1.55; }
  body.home .front-page .article-card--main p:not(.article-card__meta) { display: none; }
  body.home .front-page .article-card__more { font-size: 0.55rem; }
  body.home .front-page .column-layout__side { display: grid; margin-top: 20px; gap: 0px; }
  body.home .front-page .article-card--compact a { position: relative; display: block; width: 319px; height: 80px; padding: 10px 110px 10px 46px; border-top: 1px solid rgb(221, 212, 206); }
  body.home .front-page .article-card--compact::before { counter-increment: column-side 1; position: absolute; left: 0px; color: rgb(215, 157, 149); font-family: var(--font-serif-en); }
  body.home .front-page .column-layout__side { counter-reset: column-side 1; }
  body.home .front-page .article-card--compact .article-card__image, body.home .front-page .article-card--compact .article-card__image-placeholder { position: absolute; top: 10px; right: 0px; width: 99px; height: 60px; min-height: 0px; object-fit: cover; }
  body.home .front-page .article-card--compact .media-placeholder__label { right: 6px; bottom: 4px; font-size: 0.4rem; letter-spacing: 0.02em; }
  body.home .front-page .article-card--compact .article-card__body { display: block; }
  body.home .front-page .article-card--compact .article-card__meta { font-size: 0.4rem; }
  body.home .front-page .article-card--compact h3 { margin: 5px 0px 0px; font-size: 0.56rem; line-height: 1.5; }
  body.home .front-page .article-card--compact .article-card__more { display: none; }
  body.home .front-page .article-card--compact { position: relative; }
  body.home .front-page .back-issues { position: absolute; top: 840px; left: 28px; width: 319px; margin: 0px; }
  body.home .front-page .back-issues h3 { margin: 0px 0px 14px; font-size: 0.88rem; }
  body.home .front-page .back-issues__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 0px; }
  body.home .front-page .article-card--mini .article-card__image, body.home .front-page .article-card--mini .article-card__image-placeholder { width: 100%; height: 52px; min-height: 0px; object-fit: cover; }
  body.home .front-page .article-card--mini .media-placeholder__label { right: 6px; bottom: 4px; font-size: 0.4rem; letter-spacing: 0.02em; }
  body.home .front-page .article-card--mini .article-card__body { padding-top: 5px; }
  body.home .front-page .article-card--mini h3 { margin: 3px 0px 0px; font-size: 0.45rem; line-height: 1.5; }
  body.home .front-page .article-card--mini .article-card__more { display: none; }
  body.home .front-page .column-section__head > .text-link { position: absolute; top: 1122px; left: 63px; width: 250px; min-height: 46px; justify-content: center; border: 1px solid rgb(201, 151, 142); border-radius: 24px; font-size: 0.7rem; }
  .site-footer { position: relative; width: 100%; height: 780px; min-height: 780px; overflow: hidden; background: rgb(247, 242, 237); color: rgb(117, 108, 103); }
  .site-footer__inner { position: relative; display: block; width: calc(100% - 56px); max-width: 319px; height: 720px; margin: 0px auto; padding: 60px 0px 0px; }
  .footer-brand { color: rgb(217, 160, 152); font-family: var(--font-serif-en); font-size: 1.55rem; font-weight: 400; }
  .site-footer__brand p { width: 100%; margin: 25px 0px 0px; font-size: 0.68rem; line-height: 1.9; }
  .site-footer__links { position: absolute; top: 208px; left: 0px; display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 38px 26px; }
  .footer-link-group { min-width: 0px; }
  .footer-link-group h2 { margin: 0px 0px 16px; color: rgb(75, 69, 65); font-size: 0.94rem; font-weight: 400; }
  .footer-link-group li + li { margin-top: 8px; }
  .footer-link-group a { font-size: 0.68rem; overflow-wrap: anywhere; }
  .footer-link-group:nth-child(3) { grid-column: 1; }
  .footer-link-group__fallback { display: none; }
  .site-footer__bottom { position: absolute; right: auto; bottom: 15px; left: 50%; width: calc(100% - 56px); max-width: 319px; margin: 0px; padding: 14px 0px 0px; border-top: 0px; font-size: 0.5rem; text-align: center; transform: translateX(-50%); }
  body.home .front-page .article-card--compact::before { content: counter(column-side, decimal-leading-zero); }
  body.home .front-page .column-layout .article-card--main .article-card__meta { font-size: 0.82rem; }
  body.home .front-page .column-layout .article-card--main h3 { font-size: 1.25rem; line-height: 1.6; }
  body.home .front-page .column-layout .article-card--main .article-card__more { font-size: 0.85rem; }
  body.home .front-page .column-layout .article-card--compact .article-card__meta { font-size: 0.72rem; }
  body.home .front-page .column-layout .article-card--compact h3 { font-size: 0.98rem; line-height: 1.6; }
  body.home .front-page .back-issues h3 { font-size: 1.2rem; line-height: 1.5; }
  body.home .front-page .back-issues .article-card__meta { font-size: 0.72rem; line-height: 1.55; }
  body.home .front-page .back-issues .article-card--mini h3 { font-size: 0.95rem; line-height: 1.6; }
  body.home .front-page .column-layout .article-card--main .article-card__body { padding-top: 12px; }
  body.home .front-page .column-layout .article-card--main h3 { margin: 5px 0px 7px; }
  body.home .front-page .column-layout .article-card--main .article-card__more { margin-top: 8px; }
  body.home .front-page .column-layout__side { margin-top: 24px; }
  body.home .front-page .column-layout .article-card--compact a { height: 104px; padding: 10px 110px 10px 46px; }
  body.home .front-page .column-layout .article-card--compact .article-card__image, body.home .front-page .column-layout .article-card--compact .article-card__image-placeholder { top: 10px; height: 60px; }
  body.home .front-page .column-layout .article-card--compact h3 { margin-top: 4px; }
  body.home .front-page .back-issues { top: 920px; }
  body.home .front-page .back-issues h3 { margin-bottom: 12px; }
  body.home .front-page .back-issues__grid { gap: 18px; }
  body.home .front-page .back-issues .article-card--mini .article-card__body { padding-top: 6px; }
  body.home .front-page .column-section { --column-sp-edge: clamp(24px, 7.4667vw, 28px); --column-sp-content: min(319px, calc(100vw - var(--column-sp-edge) - var(--column-sp-edge))); width: 100%; height: auto; min-height: 0px; padding: 96px 0px 56px; overflow: hidden; }
  body.home .front-page .column-section .section__inner { position: relative; width: var(--column-sp-content); max-width: none; height: auto; margin: 0px auto; transform: none; }
  body.home .front-page .column-section__head { position: static; display: block; width: auto; height: auto; min-height: 0px; margin: 0px 0px 30px; }
  body.home .front-page .column-section .section-heading { position: static; max-width: none; }
  body.home .front-page .column-section .section-heading__eyebrow { position: static; margin: 0px 0px 12px; font-size: 0.7rem; line-height: 1.5; letter-spacing: 0.08em; }
  body.home .front-page .column-section .section-heading__title { position: static; margin: 0px; font-size: 1.6rem; font-weight: 400; line-height: 1.35; }
  body.home .front-page .column-layout { position: static; display: block; width: auto; height: auto; margin: 0px; }
  body.home .front-page .column-layout__main { width: auto; margin: 0px; }
  body.home .front-page .article-card--main a { display: block; }
  body.home .front-page .article-card--main .article-card__image, body.home .front-page .article-card--main .article-card__image-placeholder { width: 100%; height: auto; min-height: 0px; aspect-ratio: 16 / 9; object-fit: cover; }
  body.home .front-page .article-card--main .article-card__body { padding: 12px 0px 0px; }
  body.home .front-page .column-layout .article-card--main .article-card__meta { margin: 0px 0px 8px; font-size: 0.7rem; line-height: 1.5; }
  body.home .front-page .column-layout .article-card--main h3 { margin: 0px 0px 10px; font-size: 1rem; line-height: 1.6; }
  body.home .front-page .column-layout .article-card--main .article-card__more { margin-top: 0px; font-size: 0.78rem; line-height: 1.5; }
  body.home .front-page .column-layout__side { display: grid; width: auto; margin: 32px 0px 0px; gap: 0px; }
  body.home .front-page .column-layout .article-card--compact a { position: relative; display: block; width: 100%; height: 86px; padding: 10px 110px 10px 46px; border-top: 1px solid rgb(221, 212, 206); overflow: hidden; }
  body.home .front-page .column-layout .article-card--compact::before { left: 0px; top: 11px; line-height: 1.4; }
  body.home .front-page .column-layout .article-card--compact .article-card__image, body.home .front-page .column-layout .article-card--compact .article-card__image-placeholder { position: absolute; top: 10px; right: 0px; width: 99px; height: 60px; min-height: 0px; object-fit: cover; }
  body.home .front-page .column-layout .article-card--compact .article-card__body { display: block; }
  body.home .front-page .column-layout .article-card--compact .article-card__meta { margin: 0px 0px 6px; font-size: 0.6rem; line-height: 1.4; }
  body.home .front-page .column-layout .article-card--compact h3 { max-height: 2.9em; margin: 0px; overflow: hidden; font-size: 0.72rem; line-height: 1.45; }
  body.home .front-page .column-layout .article-card--compact .article-card__more { display: none; }
  body.home .front-page .back-issues { position: static; width: auto; margin: 44px 0px 0px; padding: 0px; }
  body.home .front-page .back-issues h3 { position: static; margin: 0px 0px 14px; padding: 0px; font-size: 1rem; line-height: 1.4; }
  body.home .front-page .back-issues__grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 22px 16px; margin: 0px; }
  body.home .front-page .back-issues .article-card--mini { height: auto; }
  body.home .front-page .back-issues .article-card--mini a { display: block; }
  body.home .front-page .back-issues .article-card--mini .article-card__image, body.home .front-page .back-issues .article-card--mini .article-card__image-placeholder { display: block; width: 100%; height: auto; aspect-ratio: 1.8 / 1; min-height: 0px; object-fit: cover; }
  body.home .front-page .back-issues .article-card--mini .article-card__body { padding-top: 6px; }
  body.home .front-page .back-issues .article-card--mini .article-card__meta { margin: 0px 0px 3px; font-size: 0.62rem; line-height: 1.4; }
  body.home .front-page .back-issues .article-card--mini h3 { max-height: 4.35em; margin: 0px; overflow: hidden; font-size: 0.72rem; line-height: 1.45; }
  body.home .front-page .back-issues .article-card--mini .article-card__more { display: none; }
  body.home .front-page .column-section .section-heading__eyebrow { font-size: 1rem; }
}

/* Two shared footer layouts: mobile through 1024px, desktop above it. */
.site-footer .footer-brand { justify-content: center; }
.site-footer .footer-brand__logo { margin-inline: auto; }
.site-footer .site-footer__links { text-align: left; }

@media (max-width: 1024px) {
  .site-footer {
    position: relative;
    width: 100%;
    height: 780px;
    min-height: 780px;
    padding: 0;
    overflow: hidden;
    background: #f7f2ed;
    color: #756c67;
  }
  .site-footer .site-footer__inner {
    position: relative;
    display: block;
    width: calc(100% - 56px);
    max-width: 319px;
    height: 720px;
    min-height: 0;
    margin: 0 auto;
    padding: 60px 0 0;
  }
  .site-footer .site-footer__brand { justify-content: center; align-items: center; }
  .site-footer .footer-brand { margin-inline: auto; }
  .site-footer .footer-brand__logo { width: min(100%, 220px); }
  .site-footer .site-footer__links {
    position: absolute;
    top: 208px;
    left: 50%;
    width: max-content;
    max-width: 100%;
    display: grid;
    grid-template-columns: repeat(2, max-content);
    gap: 38px 40px;
    transform: translateX(-50%);
  }
  .site-footer .footer-link-group { min-width: 0; }
  .site-footer .footer-link-group h2 { margin: 0 0 16px; color: #4b4541; font-size: .94rem; font-weight: 400; }
  .site-footer .footer-link-group--no-heading { padding-top: 36px; }
  .site-footer .footer-link-group ul { display: block; }
  .site-footer .footer-link-group li + li { margin-top: 8px; }
  .site-footer .footer-link-group a { font-size: .68rem; overflow-wrap: anywhere; }
  .site-footer .footer-link-group:nth-child(3) { grid-column: 1; }
  .site-footer .footer-link-group__fallback { display: none; }
  .site-footer .site-footer__bottom {
    position: absolute;
    right: auto;
    bottom: 15px;
    left: 50%;
    width: calc(100% - 56px);
    max-width: 319px;
    margin: 0;
    padding: 14px 0 0;
    border: 0;
    font-size: .5rem;
    text-align: center;
    transform: translateX(-50%);
  }
}

@media (min-width: 1025px) {
  .site-footer { height: 560px; padding: 0; background: #f7f4ef; color: #70665f; }
  .site-footer .site-footer__inner {
    display: grid;
    grid-template-columns: minmax(260px, 380px) minmax(0, 1fr);
    gap: clamp(40px, 6vw, 86px);
    width: min(1280px, calc(100% - 80px));
    max-width: 1280px;
    min-height: 420px;
    margin: 0 auto;
    padding: 75px 0 58px;
  }
  .site-footer .site-footer__links {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    gap: clamp(32px, 5vw, 70px);
    width: max-content;
    margin-inline: auto;
  }
  .site-footer .footer-link-group h2 { margin: 8px 0 26px; color: #2f2a27; font-size: 1.125rem; font-weight: 400; }
  .site-footer .footer-link-group ul { display: grid; gap: 8px; }
  .site-footer .footer-link-group a { color: #70665f; font-size: .875rem; line-height: 1.6; }
  .site-footer .footer-link-group__fallback { display: none; }
  .site-footer .site-footer__bottom {
    width: min(1280px, calc(100% - 80px));
    max-width: 1280px;
    margin: 0 auto;
    padding-top: 24px;
    color: #8b817b;
    font-family: var(--font-serif-en);
    font-size: .75rem;
    text-align: center;
  }
}

@media (min-width: 1025px) {
  .owner-page .company-section.owner-company { margin-bottom: 0; }
  .owner-page .owner-company-section { padding-bottom: 80px; background: #fff; }
}

/* Owner Company uses the existing phone composition through 767px. */
@media (min-width: 601px) and (max-width: 767px) {
  .owner-page .owner-company-section .company-section { width: 100%; height: 720px; min-height: 720px; padding: 0px; overflow: hidden; background: rgb(255, 255, 255); }
  .owner-page .owner-company-section .company-section__canvas { position: relative; display: block; width: 100%; height: 720px; min-height: 720px; margin: 0px; padding: 0px; border: 0px; }
  .owner-page .owner-company-section .company-section__left { position: static; width: auto; min-height: 0px; }
  .owner-page .owner-company-section .company-section__left > p { position: absolute; top: 98px; left: 28px; margin: 0px; font-size: 0.66rem; }
  .owner-page .owner-company-section .company-section__left > span { position: absolute; top: 128px; left: 28px; font-size: 1.18rem; }
  .owner-page .owner-company-section .company-section__brand { position: absolute; top: 154px; left: 225px; z-index: 2; width: 100px; height: 82px; margin: 0px; }
  .owner-page .owner-company-section .company-section__brand img { width: 100px; height: 82px; object-fit: contain; }
  .owner-page .owner-company-section .company-section__main { position: static; width: auto; padding: 0px; border: 0px; }
  .owner-page .owner-company-section .company-section h2 { position: absolute; top: 208px; left: 28px; margin: 0px; font-size: 1.55rem; }
  .owner-page .owner-company-section .company-section__statement { position: absolute; top: 274px; left: 28px; width: 319px; max-height: 54px; margin: 0px; overflow: hidden; font-size: 0.68rem; line-height: 1.9; }
  .owner-page .owner-company-section .company-section dl { position: absolute; top: 354px; left: 28px; width: 319px; margin: 0px; }
  .owner-page .owner-company-section .company-section dl div { display: grid; height: 58px; grid-template-columns: 78px 1fr; gap: 10px; align-items: center; padding: 0px; border-bottom: 1px solid rgb(226, 218, 213); }
  .owner-page .owner-company-section .company-section dt { font-size: 0.64rem; }
  .owner-page .owner-company-section .company-section dd { margin: 0px; font-size: 0.62rem; }
  .owner-page .owner-company-section .company-section__location--desktop { display: none; }
  .owner-page .owner-company-section .company-section__location--mobile { display: inline; }
  .owner-page .owner-company-section .company-section__link { position: absolute; top: 624px; left: 28px; width: 190px; margin: 0px; padding-bottom: 10px; border-bottom: 1px solid rgb(215, 163, 154); font-size: 0.85rem; }
  .owner-page .owner-company-section .company-section__canvas { background: none; }
  .owner-page .owner-company-section .company-section, .owner-page .owner-company-section .company-section__canvas { height: 1080px; min-height: 1080px; }
  .owner-page .owner-company-section .company-section dl div { height: auto; min-height: 0px; align-items: start; padding: 8px 0px; }
  .owner-page .owner-company-section .company-section dt { font-size: 0.68rem; line-height: 1.6; }
  .owner-page .owner-company-section .company-section dd { font-size: 0.72rem; line-height: 1.7; }
  .owner-page .owner-company-section .company-section__link { top: 1010px; }
  .owner-page .owner-company-section .company-section, .owner-page .owner-company-section .company-section__canvas { height: 1080px; min-height: 1080px; }
  .owner-page .owner-company-section .company-section__left > p { font-size: 1rem; }
}

/* Keep the outer Company canvas unruled; retain the table row dividers. */
.owner-page .company-section.owner-company,
.owner-page .owner-company-section .company-section__canvas {
  border-top: 0;
  border-bottom: 0;
}

@media (max-width: 767px) {
  .owner-page .company-section.owner-company { margin-bottom: 0; }
  .owner-page .owner-company-section { padding-bottom: 80px; background: #fff; }
}

/* Center the existing 375px Company composition without moving its contents. */
@media (max-width: 767px) {
  .front-page .company-section__canvas,
  .owner-page .owner-company-section .company-section__canvas {
    width: 375px;
    margin-inline: calc((100% - 375px) / 2);
  }
}

/* Concept: keep the collage beside the text between SP and the 1360px PC composition. */
@media (min-width: 601px) and (max-width: 767px), (min-width: 1025px) and (max-width: 1359px) {
  .front-page .concept-section { height: auto; min-height: 0; padding: 88px 0; }
  .front-page .concept-section__stage {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center;
    gap: 36px; width: min(calc(100% - 80px), 1200px); height: auto; min-height: 0; margin: 0 auto;
  }
  .front-page .concept-section__visual { position: relative; inset: auto; grid-area: 1 / 1; order: 0; width: 100%; height: 420px; min-height: 0; margin: 0; transform: none; }
  .front-page .concept-section__panel--water { inset: 0 0 auto auto; width: 75%; height: 270px; }
  .front-page .concept-section__panel--pink { inset: auto auto 0 0; width: 80%; height: 250px; }
  .front-page .concept-section__panel { z-index: 0; }
  .front-page .concept-section__photo { inset: 60px auto auto 8%; z-index: 2; width: 78%; height: 300px; object-fit: cover; }
  .front-page .concept-section__script { display: none; }
  .front-page .concept-section__content { display: block; position: static; grid-area: 1 / 2; order: 0; width: 100%; min-height: 0; }
  .front-page .concept-section__content > .concept-section__label,
  .front-page .concept-section__title,
  .front-page .concept-section__lead,
  .front-page .concept-section__body,
  .front-page .concept-section__more { position: relative; inset: auto; width: auto; height: auto; margin: 0 0 22px; }
  .front-page .concept-section__title { font-size: 42px; line-height: 1.3; }
  .front-page .concept-section__title span { font-size: 1.3em; }
  .front-page .concept-section__lead { font-size: 20px; line-height: 1.8; }
  .front-page .concept-section__body, .front-page .concept-section__body p { font-size: 14px; line-height: 2; }
  .front-page .concept-section__more { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 0; font-size: 14px; }
  .front-page .concept-section__rule, .front-page .concept-section__water-line { display: none; }
}

@media (min-width: 601px) and (max-width: 767px) {
  .front-page .concept-section { padding: 72px 0; }
  .front-page .concept-section__stage { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 24px; }
  .front-page .concept-section__visual { height: 340px; }
  .front-page .concept-section__panel--water { height: 220px; }
  .front-page .concept-section__panel--pink { height: 200px; }
  .front-page .concept-section__photo { top: 48px; height: 240px; }
  .front-page .concept-section__title { font-size: 34px; }
  .front-page .concept-section__lead { font-size: 16px; }
  .front-page .concept-section__body, .front-page .concept-section__body p { font-size: 12.5px; line-height: 1.9; word-break: auto-phrase; }
}

@media (min-width: 1025px) and (max-width: 1359px) {
  .front-page .concept-section { padding: 110px 0; }
  .front-page .concept-section__stage { gap: 64px; }
  .front-page .concept-section__visual { height: 540px; }
  .front-page .concept-section__panel--water { height: 350px; }
  .front-page .concept-section__panel--pink { height: 320px; }
  .front-page .concept-section__photo { top: 76px; height: 390px; }
  .front-page .concept-section__title { font-size: 56px; }
  .front-page .concept-section__lead,
  .front-page .concept-section__lead p:nth-child(2) { font-size: clamp(20px, 1.8vw, 24px); }
  .front-page .concept-section__body, .front-page .concept-section__body p { font-size: 15px; }
}

/* The SP body excerpt (first three lines) should not carry over to tablets. */
@media (min-width: 768px) and (max-width: 1024px) {
  .front-page .concept-section__body p:nth-child(n + 4) { display: block; }
}

/* Media: no top rule on the section frame. */
.front-page .media-section__inner { border-top: 0; }

/* Media between tablet and the 1360px PC layout: arrows side by side, PC-sized card text. */
@media (min-width: 1025px) and (max-width: 1359px) {
  .front-page .media-section__arrows { display: flex; gap: 8px; }
  .front-page .media-section__arrows button { width: 56px; height: 56px; }
  .front-page .media-card__body { padding: 16px 18px 18px; }
  .front-page .media-card h3 { margin: 0 0 2px; font-family: var(--font-sans); font-size: 1rem; font-weight: 500; line-height: 1.5; }
  .front-page .media-card p { margin: 0; color: #c78578; font-family: var(--font-serif-en); font-size: .8125rem; font-style: italic; line-height: 1.4; }
}

@media (min-width: 601px) and (max-width: 767px) {
  .front-page .media-track .media-card h3 { font-size: 14px; line-height: 1.5; }
  .front-page .media-track .media-card p { font-size: 11px; line-height: 1.5; }
}

/* Owner profile: the fixed 500px + 650px PC columns overflow below 1360px. */
@media (min-width: 1025px) and (max-width: 1359px) {
  .owner-page .owner-profile__grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(40px, 5vw, 72px); }
  .owner-page .owner-profile--reverse .owner-profile__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
  .owner-page .owner-profile__grid > img,
  .owner-page .owner-profile__grid > picture > img { max-width: 100%; height: auto; aspect-ratio: 394 / 567; }
  .owner-page .owner-profile__grid > picture { display: block; min-width: 0; }
  .owner-page .owner-profile__copy { min-width: 0; }
}
