/* =========================================================
   Aroha — METHOD (FINAL REFERENCE)
   Page-specific rules; global.css remains unchanged.
========================================================= */
.page-method { background: #fff; }
.page-method main { overflow: clip; }
.page-method .method-label,
.page-method .method-overline {
    display: block; font: 600 10px/1.5 var(--font-body);
    letter-spacing: .29em; text-transform: uppercase; color: inherit;
}
.page-method h1,.page-method h2 {
    margin: 0; font-family: var(--font-heading); font-weight: 400;
    line-height: .93; letter-spacing: -.032em;
}
.page-method h2 { font-size: clamp(49px,5.15vw,86px); }
.page-method p { margin: 0 0 17px; font: 400 13px/1.72 var(--font-body); }
.page-method p:last-child { margin-bottom: 0; }
.page-method .method-deck { margin: 19px 0 24px; font-weight: 600; color: inherit; }
.page-method .method-label { margin-bottom: 25px; }
.page-method em { font-family: var(--font-heading); font-style: italic; font-weight: 400; }
.page-method .method-hero-art,
.page-method .method-sunrise-art,
.page-method .method-macrocosm-art,
.page-method .method-material-art,
.page-method .method-ancient-art { position: relative; overflow: hidden; background: var(--color-white); }
.page-method .method-hero-art img,
.page-method .method-sunrise-art img,
.page-method .method-macrocosm-art img,
.page-method .method-material-art img,
.page-method .method-ancient-art img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* HERO — title lives ON the image composition, not a second separate block */
.method-hero { position: relative; height: clamp(390px,42vw,690px); background: #eeeae4; }
.method-hero-art { position: absolute !important; inset: 0; }
.method-hero-title { position: relative; height: 100%; display: flex; justify-content: center; align-items: flex-start; padding-top: clamp(40px,4vw,72px); text-align: center; }
.method-hero h1 { font-size: clamp(67px,7.8vw,129px); line-height: .78; }
.method-hero h1 em { font-style: normal; }

/* WHITE INTRODUCTION */
.method-introduction { padding: clamp(56px,6vw,105px) 0 clamp(65px,7vw,120px); background: #fff; }
.method-introduction-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(60px,10vw,175px); align-items: start; }
.method-overline { margin-top: 6px !important; }
.method-introduction-copy { max-width: 710px; }
.method-introduction-statement { margin-top: 30px !important; font-weight: 600 !important; }

/* SUNRISE — THREE VERTICAL PANELS */
.method-sunrise { background: var(--color-paper); }
.method-sunrise-grid { display: grid; grid-template-columns: 1.05fr .8fr .9fr; }
.method-sunrise-panel { min-width: 0; padding: clamp(55px,6vw,103px) clamp(22px,3.15vw,55px) clamp(55px,6vw,103px); border-left: 1px solid var(--color-border); }
.method-sunrise-panel:first-child { border-left: 0; padding-left: 0; }
.method-sunrise-panel:last-child { padding-right: 0; }
.method-sunrise h2 { font-size: clamp(50px,5.3vw,90px); }
.method-rhythm { padding-top: clamp(105px,11vw,180px); }
.method-rhythm > p:not(.rhythm-explanation) { margin-bottom: 8px; font-weight: 500; }
.method-rhythm .rhythm-explanation { margin-top: 36px; }
.method-sunrise-art { width: 100%; height: clamp(170px,16vw,255px); background: #eae6df; }
.method-sunrise-note { margin-top: clamp(40px,5vw,80px) !important; font-weight: 600 !important; }

/* MACROCOSM — LARGE IMAGE LEFT, EDITORIAL TEXT RIGHT */
.method-macrocosm { display: grid; grid-template-columns: 1fr 1fr; background: #fff; min-height: 570px; }
.method-macrocosm-art { min-height: 570px; }
.method-macrocosm-content { align-self: center; padding: clamp(70px,8vw,135px) clamp(40px,8vw,150px); }
.method-macrocosm-content h2 { font-size: clamp(48px,5.3vw,90px); }
.method-macrocosm-content p { max-width: 525px; }

/* PAIRED EDITORIAL PANELS */
.method-twin { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.method-twin-panel { min-width: 0; padding: clamp(80px,9vw,150px) clamp(35px,7vw,125px); }
.method-twin-panel h2 { font-size: clamp(49px,5.1vw,89px); }
.method-twin-panel > p { max-width: 555px; }
.method-circadian { background: var(--color-paper); }
.method-psychoacoustics { background: var(--color-earth-dark); color: #fff; }
.method-psychoacoustics p { color: rgba(255,255,255,.84); }

/* MATERIAL — IMAGE LEFT */
.method-material { display: grid; grid-template-columns: 1fr 1fr; min-height: 580px; background: #fff; }
.method-material-art { min-height: 580px; }
.method-material-content { align-self: center; padding: clamp(70px,8vw,145px) clamp(40px,8vw,150px); }
.method-material-content p { max-width: 545px; }

/* BIOPHILIA — TWO COLUMNS WITH HAIRLINE */
.method-biophilia { background: var(--color-paper); }
.method-biophilia-grid { display: grid; grid-template-columns: 1fr 1fr; }
.method-biophilia-intro,.method-biophilia-scope { padding: clamp(75px,8.5vw,145px) clamp(30px,5vw,90px); }
.method-biophilia-intro { padding-left: 0; }
.method-biophilia-scope { border-left: 1px solid var(--color-border); padding-right: 0; }
.method-biophilia-intro p { max-width: 500px; }
.method-biophilia-scope > p:first-child { margin-bottom: 23px; }
.method-list { padding: 0; margin: 0; list-style: none; counter-reset: method; }
.method-list-two { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 25px; row-gap: 12px; }
.method-list li { counter-increment: method; display: grid; grid-template-columns: 27px minmax(0,1fr); column-gap: 9px; font: 400 12px/1.5 var(--font-body); }
.method-list li::before { content: counter(method) ' /'; font-size: 10px; color: var(--color-text-muted); }
.method-biophilia-statement { margin-top: 34px !important; font-weight: 600 !important; }

/* FIVE SENSES + MOVEMENT — ONE CONTINUOUS DARK BAND */
.method-twin-dark { background: var(--color-earth-dark); color: #fff; }
.method-twin-dark .method-twin-panel { padding-top: clamp(75px,8vw,135px); padding-bottom: clamp(80px,9vw,150px); }
.method-twin-dark p { color: rgba(255,255,255,.82); }
.method-twin-dark .method-deck { color: #fff; }
.method-movement h2 { white-space: nowrap; }

/* ANCIENT WISDOM — TEXT LEFT, ONE COMPLETE VISUAL RIGHT */
.method-ancient { background: var(--color-paper); overflow: hidden; }
.method-ancient-grid { min-height: 450px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(30px,5vw,90px); }
.method-ancient-content { padding: clamp(65px,7vw,125px) 0; }
.method-ancient-content h2 { font-size: clamp(51px,5.8vw,100px); white-space: nowrap; }
.method-ancient-content p { max-width: 640px; }
.method-ancient-art { align-self: stretch; min-height: 450px; background: transparent !important; }

/* TABLET */
@media (max-width: 1050px) {
    .method-sunrise-panel { padding-left: 22px; padding-right: 22px; }
    .method-macrocosm-content,.method-material-content { padding: 65px 45px; }
    .method-twin-panel { padding: 85px 50px; }
    .method-biophilia-intro,.method-biophilia-scope { padding-top: 85px; padding-bottom: 85px; }
    .method-biophilia-scope { padding-left: 35px; }
    .method-ancient-content h2 { white-space: normal; }
}

/* MOBILE */
@media (max-width: 700px) {
    .page-method h2 { font-size: clamp(47px,11vw,69px); }
    .page-method p { font-size: 12px; line-height: 1.75; }
    .page-method .method-label,.page-method .method-overline { font-size: 9px; }
    .method-hero { height: 345px; }
    .method-hero-title { padding-top: 42px; }
    .method-hero h1 { font-size: clamp(58px,12vw,84px); }
    .method-introduction { padding: 65px 0 75px; }
    .method-introduction-grid { grid-template-columns: 1fr; gap: 27px; }
    .method-sunrise-grid { grid-template-columns: 1fr; }
    .method-sunrise-panel,.method-sunrise-panel:first-child,.method-sunrise-panel:last-child { padding: 48px 0; border-left: 0; border-bottom: 1px solid var(--color-border); }
    .method-sunrise-panel:last-child { border-bottom: 0; }
    .method-sunrise h2 { font-size: clamp(49px,11vw,72px); }
    .method-rhythm { padding-top: 48px; }
    .method-sunrise-art { height: 210px; }
    .method-sunrise-note { margin-top: 26px !important; }
    .method-macrocosm,.method-material { grid-template-columns: 1fr; }
    .method-macrocosm-art,.method-material-art { min-height: 310px; }
    .method-macrocosm-content,.method-material-content { padding: 67px var(--page-gutter); }
    .method-macrocosm-content h2,.method-material-content h2 { font-size: clamp(47px,10vw,67px); }
    .method-twin { grid-template-columns: 1fr; }
    .method-twin-panel { padding: 75px var(--page-gutter); }
    .method-twin-panel h2 { font-size: clamp(49px,11vw,72px); }
    .method-biophilia-grid { grid-template-columns: 1fr; }
    .method-biophilia-intro { padding: 75px 0 40px; }
    .method-biophilia-scope { border-left: 0; border-top: 1px solid var(--color-border); padding: 45px 0 75px; }
    .method-list-two { column-gap: 15px; }
    .method-list li { font-size: 11px; }
    .method-movement h2 { white-space: normal; }
    .method-ancient-grid { grid-template-columns: 1fr; gap: 0; }
    .method-ancient-content { padding: 75px 0 40px; }
    .method-ancient-content h2 { font-size: clamp(47px,10.5vw,70px); }
    .method-ancient-art { min-height: 300px; }
}

@media (prefers-reduced-motion: reduce) {
    .page-method * { scroll-behavior: auto; }
}
