:root{color-scheme:light;--ink:#111313;--muted:#555;--line:#d7d7d7}
*{box-sizing:border-box}html,body{margin:0}body{background:white;color:var(--ink);-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit}button:focus-visible{outline:2px solid #222;outline-offset:4px}
.page{max-width:1660px;margin:auto;padding:0 clamp(30px,5.25vw,90px);min-height:100vh;display:flex;flex-direction:column}
.top{height:77px;display:flex;align-items:flex-start;justify-content:flex-end;padding-top:27px}.top nav{display:flex;gap:43px}.top button{border:0;background:none;cursor:pointer;text-transform:uppercase;letter-spacing:.15em;font:11px Arial,Helvetica,sans-serif;padding:2px}
.intro{display:grid;grid-template-columns:minmax(0,1.78fr) minmax(250px,.72fr);gap:40px;align-items:end;padding:44px 0 49px}.eyebrow{font:12px/1.65 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.22em;color:#525252;margin:0}.hairline{width:57px;height:1px;background:#444;margin:20px 0 47px}.identity h1{margin:0;font:400 clamp(43px,5.25vw,82px)/1.10 Arial,Helvetica,sans-serif;letter-spacing:.18em;text-transform:uppercase}.identity h1 span{display:block;white-space:nowrap}.identity h1 span:last-child{margin-top:5px;letter-spacing:.24em}.tagline{font:normal clamp(25px,3vw,46px)/1.15 Georgia,'Times New Roman',serif;letter-spacing:-.025em;margin:25px 0 0}.statement{border-left:1px solid #a8a8a8;padding:0 0 0 38px;margin-bottom:66px}.statement p{font:normal clamp(20px,1.65vw,26px)/1.28 Georgia,'Times New Roman',serif;margin:0;max-width:320px}
.frames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.frames figure{margin:0;aspect-ratio:2.34;overflow:hidden;background:#ddd}.frames img{width:100%;height:100%;display:block;object-fit:cover}
.sections{border-top:1px solid var(--line);margin-top:70px;padding-top:39px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.section{position:relative;display:flex;align-items:flex-start;flex-direction:column;gap:0;text-align:left;border:0;background:transparent;cursor:pointer;min-height:165px;padding:0 35px 0 9%}.section+ .section{border-left:1px solid var(--line)}.section-title{font:normal 29px/1.2 Georgia,'Times New Roman',serif}.section-line{width:33px;height:1px;background:#777;margin:17px 0 17px}.section-summary{font:normal 17px/1.45 Georgia,'Times New Roman',serif;color:#656565}.section-arrow{font:25px/1 Arial,sans-serif;margin-top:13px}.section:hover .section-title{text-decoration:underline;text-underline-offset:5px}
.foot{display:flex;justify-content:space-between;margin-top:auto;padding:37px 0 19px;color:#888;font:10px Arial,sans-serif}
dialog{border:1px solid #d8d8d4;box-shadow:0 22px 90px #0002;width:min(540px,calc(100% - 32px));padding:0}dialog::backdrop{background:#15151566}.dialog-content{position:relative;padding:56px 45px 60px}.dialog-kicker{font:10px Arial,sans-serif;letter-spacing:.2em;color:#777}.dialog-content h2{font:normal 35px Georgia,serif}.dialog-content>p:last-child{font:17px/1.65 Georgia,serif}.close{position:absolute;right:20px;top:14px;border:0;background:none;font-size:32px;cursor:pointer}
@media(min-width:1700px){.intro{padding-bottom:65px}.sections{margin-top:80px}}
@media(max-width:1100px){.page{padding:0 45px}.intro{grid-template-columns:minmax(0,1.5fr) minmax(240px,.8fr)}.identity h1{font-size:clamp(40px,5vw,60px)}.statement{margin-bottom:45px;padding-left:25px}.sections{margin-top:50px}.section{padding-left:7%}}
@media(max-width:700px){.page{padding:0 22px}.top{height:66px;padding-top:23px}.top nav{gap:20px}.top button{font-size:10px}.intro{grid-template-columns:1fr;gap:25px;padding:30px 0 32px}.eyebrow{font-size:10px}.hairline{margin:15px 0 34px}.identity h1{font-size:clamp(27px,6.7vw,46px);letter-spacing:.13em}.identity h1 span:last-child{letter-spacing:.20em}.tagline{font-size:clamp(24px,5vw,35px);margin-top:20px}.statement{margin:5px 0 0;padding-left:19px}.statement p{font-size:19px;max-width:300px}.frames{gap:7px}.frames figure{aspect-ratio:1.1}.sections{margin-top:36px;padding-top:30px;gap:10px}.section{padding:0 6px 0 0;min-height:142px}.section+.section{border:0}.section-title{font-size:19px}.section-line{margin:13px 0}.section-summary{font-size:12px}.section-arrow{font-size:22px}.foot{padding-top:28px}}
@media(max-width:390px){.identity h1{font-size:26px}.section-title{font-size:17px}.section-summary{font-size:11px}}

/* Morning Road: panoramic artwork integrated into the ORIGINAL page. */
body,.page{background:#fff}
.intro{padding-top:23px;padding-bottom:22px}
/* The artwork is a deliberately shallow band: cropping occurs in CSS, not in the asset. */
.panorama{position:relative;height:clamp(290px,31vw,425px);margin:0 calc(-1 * clamp(30px,5.25vw,90px));overflow:hidden;pointer-events:none}
.panorama img{display:block;position:absolute;width:105.5%;height:auto;max-width:none;left:0;top:50%;transform:translateY(-52.5%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 84%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 84%,transparent 100%);
}
.sections{border-top:0;margin-top:52px;padding-top:14px}
@media(min-width:1700px){.intro{padding-top:23px;padding-bottom:22px}.sections{margin-top:45px}}
@media(max-width:1100px){.panorama{margin:0 -45px;height:clamp(280px,36vw,390px)}.panorama img{width:104.5%}.sections{margin-top:38px}}
@media(max-width:700px){.intro{padding-top:20px;padding-bottom:14px}.panorama{margin:0 -22px;height:220px}.panorama img{width:165%;left:-44%;top:50%;transform:translateY(-50.5%)}.sections{margin-top:26px;padding-top:8px}}

/* Compact single-screen desktop layout. Original white version retained. */
@media (min-width:701px) {
  .page { min-height:100vh; min-height:100dvh; }
  .top {height:53px; padding-top:19px; flex-shrink:0;}
  .intro {padding-top:8px; padding-bottom:12px;}
  .tagline {margin-top:16px;}
  .statement {margin-bottom:35px;}
  .panorama {height:clamp(195px, calc(100dvh - 500px), 355px);}
  .sections {margin-top:30px; padding-top:8px;}
  .section {min-height:113px;}
  .section-line {margin:12px 0 12px;}
  .foot {padding-top:10px; padding-bottom:13px;}
}
@media (min-width:701px) and (max-height:760px) {
  .top {height:44px; padding-top:13px;}
  .intro {padding-top:4px; padding-bottom:7px;}
  .identity h1 {font-size:clamp(40px,4.5vw,69px);}
  .tagline {font-size:clamp(25px,2.7vw,40px); margin-top:10px;}
  .statement {margin-bottom:25px;}
  .panorama {height:clamp(185px, calc(100dvh - 440px), 285px);}
  .sections {margin-top:22px; padding-top:4px;}
  .section {min-height:100px;}
  .foot {padding-top:7px; padding-bottom:10px;}
}
/* On mobile keep the original natural scroll rather than shrink readability. */

/* Optical spacing adjustment: move only text, never the panorama crop. */
@media (min-width:701px) {
  .intro > .identity, .intro > .statement { position:relative; top:-18px; }
  .sections { transform:translateY(-16px); }
}
@media (max-width:700px) {
  /* Maintain legible, natural mobile spacing. */
}
