/* Graphite's long-form suite page. White ground, photographic landscapes, real objects. */
body[data-page="home"]{--muted:#616970}
.chapter-wrap{width:min(1160px,100%);padding-inline:clamp(24px,5vw,64px);margin-inline:auto}
.skip-link{position:fixed;top:8px;left:12px;z-index:100;background:#fff;padding:12px 20px;transform:translateY(-150%)}
.skip-link:focus{transform:none}
a:focus-visible,summary:focus-visible{outline:2px solid #39728e;outline-offset:7px;border-radius:2px}
body[data-page="home"] nav{background:rgba(255,255,255,.94)}
body[data-page="home"] nav .wrap{max-width:1160px}
body[data-page="home"] .hero.staged{padding-bottom:110px}
body[data-page="home"] .hero .berg{opacity:.12}
.dome .cel{color:inherit;text-decoration:none}
.dome .cel:focus-visible{outline-offset:-22px}
.layer-nav{position:sticky;top:66px;z-index:30;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-block:1px solid #eef0f1}
.layer-nav .chapter-wrap{display:flex;align-items:center;justify-content:space-between;gap:26px;min-height:66px;overflow:auto;scrollbar-width:none}
.layer-nav a{position:relative;flex:none;display:block;padding:22px 0;font-size:13px;color:#70777b;text-decoration:none;transition:color .2s}
.layer-nav a:hover,.layer-nav a[aria-current]{color:#111}
.layer-nav a[aria-current]::after{content:"";position:absolute;inset:auto 0 0;height:2px;background:#111}
.suite-intro{text-align:center;padding:170px 0 90px}
.suite-intro h2{font-size:clamp(42px,5vw,68px);font-weight:500;line-height:1.04;letter-spacing:-.055em}
.suite-intro p{margin-top:24px;font-size:20px;line-height:1.5}
.chapter{padding:100px 0 130px;scroll-margin-top:132px;isolation:isolate;overflow:hidden}
.chapter-stage{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:36px;min-height:480px}
.service-name{font-size:18px;font-weight:550;letter-spacing:-.02em;display:flex;align-items:center;gap:16px;margin-bottom:27px}
.service-name span{font-size:12px;font-weight:400;color:#646c72;letter-spacing:0}
.chapter h2{font-size:clamp(42px,4.9vw,65px);font-weight:500;line-height:1.06;letter-spacing:-.052em}
.chapter-intro{max-width:39ch;margin-top:28px;font-size:18px;line-height:1.65;color:#5f6870}
.chapter-link{display:inline-flex;gap:26px;align-items:center;margin-top:28px;text-decoration:none;font-size:14px;font-weight:500;border-bottom:1px solid #bcc2c5;padding-bottom:6px;transition:gap .25s}
.chapter-link:hover{gap:36px}
.planned{display:inline-block;color:#71787e;font-size:12px;margin-top:28px}
.chapter-object{margin:0;display:grid;place-items:center;filter:drop-shadow(0 32px 26px rgba(29,51,65,.18))}
.service-art{width:min(100%,440px);height:auto;aspect-ratio:1;object-fit:contain}
.service-art[class*="icon-"]{mask-size:100% 100%;mask-repeat:no-repeat}
.service-art.icon-moraine{mask-image:url('../img/service-concepts/moraine-mask.svg')}
.service-art.icon-ablation{mask-image:url('../img/service-concepts/ablation-mask.svg')}
.service-art.icon-tarn{mask-image:url('../img/service-concepts/tarn-mask.svg')}
.chapter-landscape{position:relative;height:360px;overflow:hidden;margin-top:-60px;z-index:0;mask-image:linear-gradient(transparent,#000 35%,#000 78%,transparent)}
.chapter-landscape img{width:100%;height:100%;object-fit:cover;object-position:center 60%}
.chapter-explanation{display:grid;grid-template-columns:1.05fr 1fr;column-gap:100px;row-gap:34px;margin-top:46px}
.chapter-body{font-size:18px;line-height:1.7;color:#535d64;max-width:43ch}
.chapter-points{display:grid;gap:25px}
.chapter-points h3{font-size:15px;font-weight:550;letter-spacing:-.02em;margin-bottom:6px}
.chapter-points p{font-size:14px;line-height:1.65;max-width:40ch}
.name-story{grid-column:1/-1;max-width:520px;margin-top:4px;font-size:13px}
.name-story summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:22px;width:fit-content;color:#535d64;padding-block:8px}
.name-story summary::-webkit-details-marker{display:none}
.name-story summary::after{content:'+';font-size:19px;font-weight:300}
.name-story[open] summary::after{content:'−'}
.name-story p{padding-top:10px;line-height:1.7;color:#626d74}
/* Moraine: a photograph and memory object within a broad, soft-edged landscape. */
.chapter--memory .chapter-stage{display:flex;flex-direction:column;text-align:center;gap:20px}
.chapter--memory .service-name,.chapter--still .service-name{justify-content:center}
.chapter--memory .chapter-intro,.chapter--still .chapter-intro{margin-inline:auto}
.chapter--memory .chapter-object{width:370px;max-width:85vw;margin-bottom:-140px}
.chapter--memory .chapter-landscape{height:470px;margin:0;mask-image:linear-gradient(transparent,#000 45%,#000 70%,transparent)}
.chapter--memory .chapter-landscape img{object-position:center 43%}
/* Ablation: reverse the emphasis, with the thaw flowing below the object. */
.chapter--melt .chapter-copy{order:2}
.chapter--melt .chapter-object{order:1}
.chapter--melt .service-art{width:410px}
.chapter--melt .chapter-landscape{margin-top:-40px;height:380px}
.chapter--melt .chapter-landscape img{object-position:center 62%}
/* Col: an open panorama, with the tag suspended above the mountain pass. */
.chapter--passage .chapter-stage{display:block;min-height:350px}
.chapter--passage .chapter-copy{max-width:650px}
.chapter--passage .chapter-object{position:absolute;right:7%;bottom:-160px;width:300px;transform:rotate(9deg)}
.chapter--passage .chapter-landscape{height:460px;margin-top:20px;mask-image:linear-gradient(transparent,#000 25%,#000 78%,transparent)}
.chapter--passage .chapter-landscape img{object-position:center 70%;transform:scale(1.15)}
/* Névé: compacted ice as a vertical photographic window. */
.chapter--archive .chapter-stage{min-height:620px;grid-template-columns:1fr 1.1fr}
.chapter--archive .chapter-copy{order:2}
.chapter--archive .chapter-object{order:1;align-self:end;margin-bottom:60px}
.chapter--archive .chapter-landscape{position:absolute;top:100px;left:max(0px,calc((100vw - 1160px)/2));width:43%;height:620px;margin:0;z-index:-1;opacity:.48;mask-image:radial-gradient(ellipse,#000 15%,transparent 70%)}
.chapter--archive .chapter-landscape img{object-position:35% center}
.chapter--archive .chapter-explanation{margin-top:90px}
/* Tarn: a still, centered composition with a low horizon. */
.chapter--still .chapter-stage{display:flex;flex-direction:column;text-align:center;gap:0}
.chapter--still .chapter-object{width:460px;max-width:90vw;margin-bottom:-200px;position:relative}
.chapter--still .chapter-landscape{height:350px;margin-top:50px;opacity:.6;mask-image:linear-gradient(transparent,#000 50%,transparent)}
.chapter--still .chapter-landscape img{object-position:left 60%}
.connections{text-align:center;padding:150px 0 180px;border-top:1px solid #edf0f2}
.connections h2,.quiet-close h2{font-size:clamp(44px,5.6vw,76px);font-weight:500;line-height:1.04;letter-spacing:-.05em}
.connection-intro{font-size:18px;max-width:52ch;margin:30px auto 0;line-height:1.7}
.connection-line{display:flex;align-items:center;justify-content:center;gap:clamp(24px,4vw,64px);margin-top:80px}
.connection-line a{text-decoration:none;font-size:16px}
.connection-line a span{display:block;font-size:12px;color:#6a747b;margin-top:8px}
.connection-line>span{color:#a6afb5}
.quiet-close{text-align:center;padding:130px 0 0;overflow:hidden}
.quiet-close p{font-size:18px;line-height:1.65;margin-top:30px}
.quiet-close>img{width:100%;height:450px;object-fit:cover;object-position:center 65%;margin-top:70px;mask-image:linear-gradient(transparent,#000 50%)}
body[data-page="home"] footer{background:#fff;color:#111;padding:55px 0 30px}
body[data-page="home"] footer .big{display:none}
body[data-page="home"] footer .links{margin-top:0;flex-wrap:wrap}
body[data-page="home"] footer .links a{color:#535d64}
body[data-page="home"] footer .rule{color:#6a747b;border-color:#e9edef}
@media(prefers-reduced-motion:no-preference){
 @supports(animation-timeline:view()){
  .chapter-landscape img{animation:landscape-pass linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
  @keyframes landscape-pass{from{transform:scale(1.08) translateY(3%)}to{transform:scale(1.08) translateY(-3%)}}
 }
}
@media(max-width:760px){
 body[data-page="home"] nav .lk{display:none}
 .layer-nav .chapter-wrap{justify-content:flex-start;gap:30px;min-height:58px}
 .layer-nav a{font-size:12px;padding-block:19px}
 .suite-intro{padding:100px 0 35px}
 .suite-intro p{font-size:17px}
 .chapter{padding:80px 0 75px;scroll-margin-top:125px}
 .chapter-stage{display:flex;flex-direction:column;align-items:stretch;min-height:0;gap:35px}
 .chapter-copy{order:0!important}
 .chapter-object{order:1!important;width:290px;max-width:90%;margin-inline:auto}
 .service-art,.chapter--melt .service-art{width:100%}
 .service-name{font-size:17px;margin-bottom:22px;flex-wrap:wrap;gap:12px}
 .chapter h2{font-size:clamp(36px,9vw,54px)}
 .chapter-intro{font-size:16px;margin-top:24px}
 .chapter-landscape{height:250px;margin-top:-50px}
 .chapter-explanation{grid-template-columns:1fr;gap:30px;margin-top:24px}
 .chapter-body{font-size:16px}
 .chapter-points{grid-template-columns:1fr 1fr;gap:24px}
 .chapter-points h3{font-size:14px}
 .chapter-points p{font-size:13px}
 .chapter--memory .chapter-object{width:280px;margin-bottom:-100px}
 .chapter--memory .chapter-landscape{height:310px;margin-inline:0}
 .chapter--melt .chapter-landscape{height:270px;margin-top:-30px}
 .chapter--passage .chapter-stage{display:flex;min-height:0}
 .chapter--passage .chapter-object{position:static;width:230px;margin-bottom:-100px;align-self:center}
 .chapter--passage .chapter-landscape{height:290px;margin-top:0}
 .chapter--archive .chapter-stage{min-height:0;display:flex}
 .chapter--archive .chapter-object{align-self:center;margin-bottom:20px}
 .chapter--archive .chapter-landscape{top:340px;left:0;width:100%;height:380px}
 .chapter--archive .chapter-explanation{margin-top:70px}
 .chapter--still .chapter-stage{align-items:center}
 .chapter--still .chapter-object{width:320px;margin-bottom:-140px}
 .chapter--still .chapter-landscape{height:260px;margin-top:0}
 .connections{padding:95px 0}
 .connection-intro{font-size:16px}
 .connection-line{display:grid;grid-template-columns:1fr 1fr;gap:36px 20px;margin-top:50px;text-align:left}
 .connection-line>span{display:none}
 .quiet-close{padding-top:90px}
 .quiet-close p{font-size:16px}
 .quiet-close>img{height:280px}
 body[data-page="home"] .hero.staged{padding-bottom:70px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.chapter-landscape img{animation:none}.chapter-link{transition:none}}

/* Override legacy paragraph opacity so body copy retains accessible contrast. */
.chapter p,.suite-intro p,.connections p,.quiet-close p{opacity:1}