/* Layout: editorial, full-bleed renders and loops, paper sections with technical "drawing" details, one anodised-black band */
:root{
  --paper:#f6f5f2; --stone:#ebe9e4; --ink:#121413; --ink-soft:#363b38; --mute:#5f6461;
  --black:#0f1110; --black-2:#181b19; --on-black:#eceae5; --on-black-soft:#c9cbc7;
  --green:#0c5c48; --green-lite:#86c0ad; --bronze:#9a7b55;
  --hair:rgba(18,20,19,.16); --hair-dark:rgba(236,234,229,.18);
  --serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:Manrope,"Helvetica Neue",Arial,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img,video{display:block;max-width:100%}
a{color:inherit}
.gut{padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
.wrap{max-width:1320px;margin:0 auto}
.label{font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;text-wrap:balance;letter-spacing:-.01em}
h2{font-size:clamp(36px,5vw,64px);line-height:1.05}
h3{font-size:clamp(28px,3.2vw,40px);line-height:1.1}
em{font-style:italic}
p{margin:0}
.btn{display:inline-flex;align-items:center;gap:12px;padding:16px 28px;font:500 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border:1px solid currentColor;transition:background .3s,color .3s,border-color .3s}
.btn--solid{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn--solid:hover,.btn--solid:focus-visible{background:var(--green);border-color:var(--green)}
.btn--ghost:hover,.btn--ghost:focus-visible{background:var(--paper);color:var(--ink)}
.btn--line{border:0;padding:0 0 6px;border-bottom:1px solid currentColor}
.btn .arr{display:inline-block;width:22px;height:1px;background:currentColor;position:relative}
.btn .arr::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
:focus-visible{outline:1px solid var(--green-lite);outline-offset:4px}

/* detail motifs: drawing corner marks + dimension line */
.marks{position:relative}
.marks::before,.marks::after{content:"";position:absolute;width:18px;height:18px;border-color:currentColor;opacity:.55;pointer-events:none;z-index:3}
.marks::before{top:14px;left:14px;border-top:1px solid;border-left:1px solid}
.marks::after{bottom:14px;right:14px;border-bottom:1px solid;border-right:1px solid}
.dim{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.dim::before,.dim::after{content:"";flex:1;height:1px;background:currentColor;opacity:.5}
.dim i{font-style:normal;white-space:nowrap}
.tick{display:inline-block;width:1px;height:9px;background:currentColor;opacity:.5;vertical-align:middle}

.ribbon{background:var(--green);color:#fff;text-align:center;font-size:12px;letter-spacing:.06em;padding:8px 16px}

/* utility + header */
.util{background:var(--black);color:var(--on-black-soft);font-size:12px;letter-spacing:.06em}
.util .wrap{display:flex;justify-content:space-between;gap:16px;padding-block:9px;flex-wrap:wrap}
.util span+span::before{content:"·";margin:0 10px;opacity:.6}
.util .lang b{color:var(--on-black);font-weight:600}
.head{position:absolute;left:0;right:0;z-index:5;color:#fff}
.head .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:24px}
.logo{display:block;width:190px;color:#fff}
.logo svg{width:100%;height:auto;display:block}
.nav{display:flex;gap:26px;align-items:center}
.dd{position:relative}
.ddm{position:absolute;left:-18px;top:100%;padding-top:14px;display:none;min-width:270px;z-index:10}
.ddm::before{content:"";position:absolute;inset:14px 0 0;background:rgba(15,17,16,.92);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12)}
.ddm a{position:relative;display:block;padding:11px 18px;font-size:12px!important;letter-spacing:.08em!important;text-transform:none!important;border:0!important}
.ddm a:hover{background:rgba(255,255,255,.08)}
.dd:hover .ddm,.dd:focus-within .ddm{display:block}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;width:40px;height:40px;display:grid;place-content:center;gap:7px;border:1px solid rgba(255,255,255,.5)}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary span{display:block;width:18px;height:1px;background:#fff}
.mpanel{position:absolute;right:0;top:50px;width:min(86vw,340px);max-height:75vh;overflow:auto;background:var(--black);border:1px solid rgba(255,255,255,.12);padding:18px 22px;display:grid;gap:2px}
.mpanel b{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--green-lite);margin-top:12px;font-weight:600}
.mpanel a{text-decoration:none;padding:7px 0;font-size:16px}
.nav a{text-decoration:none;font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;opacity:.9;padding-bottom:4px;border-bottom:1px solid transparent}
.nav a:hover{border-color:currentColor}
.head .cta .btn{padding:12px 20px;color:#fff}
@media (max-width:1180px){.nav{display:none}.mnav{display:block}.head .cta{display:none}}

/* hero */
.hero{position:relative;min-height:min(94vh,940px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--black)}
.hero video,.hero .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,11,.6) 0%,rgba(10,12,11,0) 26%,rgba(10,12,11,0) 48%,rgba(10,12,11,.82) 100%)}
.hero .wrap{position:relative;z-index:2;width:100%;padding-block:0 64px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:48px;align-items:end}
.hero h1{font-size:clamp(46px,7.4vw,112px);line-height:.98}
.hero .side{display:grid;gap:24px;justify-items:start;max-width:440px}
.hero .side p{font-size:17px;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.45)}
.hero .btns{display:flex;flex-wrap:wrap;gap:14px}
.hero .btn--solid{background:#fff;color:var(--ink);border-color:#fff}
.hero .btn--solid:hover{background:var(--green);color:#fff;border-color:var(--green)}
.badge{display:inline-flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:9px 14px;border:1px solid rgba(255,255,255,.4);background:rgba(15,17,16,.35);backdrop-filter:blur(6px)}
.badge b{color:#f1c86b;letter-spacing:.18em;font-weight:500}
.hero .meta{position:absolute;z-index:2;right:max(24px,env(safe-area-inset-right,0px));top:120px;writing-mode:vertical-rl;font-size:11px;letter-spacing:.3em;text-transform:uppercase;opacity:.8}
.hero .scroll{position:absolute;z-index:2;left:50%;bottom:18px;width:1px;height:44px;background:rgba(255,255,255,.5);overflow:hidden}
.hero .scroll::after{content:"";position:absolute;left:0;top:-44px;width:1px;height:44px;background:#fff;animation:sc 2.4s ease-in-out infinite}
@keyframes sc{to{top:44px}}
.vtoggle{position:absolute;z-index:3;right:max(24px,env(safe-area-inset-right,0px));bottom:20px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.5);background:rgba(15,17,16,.35);color:#fff;cursor:pointer;font-size:11px}
@media (max-width:860px){.hero .wrap{grid-template-columns:1fr;gap:26px;padding-block-end:56px}.hero .meta{display:none}}

/* statement + icons */
.statement .wrap{padding-block:clamp(80px,11vw,150px) 0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);gap:48px}
.statement .label{color:var(--green);padding-top:14px}
.statement p.big{font-family:var(--serif);font-size:clamp(28px,3.6vw,48px);line-height:1.22;max-width:24ch}
.statement p.big em{color:var(--green)}
.figures{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:56px}
.figures div{padding:0 24px 0 0;display:grid;gap:10px;align-content:start}
.figures div+div{padding-left:24px;border-left:1px solid var(--hair)}
.figures b{font-family:var(--serif);font-weight:400;font-size:clamp(36px,4vw,54px);line-height:1;white-space:nowrap}
.figures span{font-size:14px;color:var(--ink-soft);max-width:24ch}
.icons{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:12px;margin-top:72px;padding-block:40px clamp(72px,9vw,120px);border-top:1px solid var(--hair)}
.icons figure{margin:0;display:grid;justify-items:center;gap:12px;text-align:center}
.icons svg{width:58px;height:58px;color:var(--green)}
.icons figcaption{font-size:12px;letter-spacing:.06em;color:var(--ink-soft);line-height:1.35;max-width:14ch}
@media (max-width:1000px){.icons{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:32px}}
@media (max-width:860px){.statement .wrap{grid-template-columns:1fr;gap:20px}.figures{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:36px}.figures div:nth-child(3){padding-left:0;border-left:0}}

/* collections */
.coll-head .wrap{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap;padding-block:72px 48px;border-top:1px solid var(--hair)}
.coll-head .label{color:var(--green);display:block;margin-bottom:18px}
.piece{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);min-height:640px}
.piece:nth-of-type(even){grid-template-columns:minmax(0,1fr) minmax(0,1.55fr)}
.piece:nth-of-type(even) .pic{order:2}
.piece .pic{position:relative;overflow:hidden;background:var(--stone);color:#fff}
.piece .pic img,.piece .pic video{width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.piece:hover .pic img{transform:scale(1.03)}
.plate{position:absolute;z-index:3;left:18px;bottom:18px;display:flex;gap:14px;align-items:center;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#fff;background:rgba(15,17,16,.55);backdrop-filter:blur(6px);padding:9px 14px}
.plate b{font-weight:600}
.piece .txt{display:flex;flex-direction:column;justify-content:center;gap:22px;padding:56px clamp(28px,5vw,88px)}
.piece .txt .no{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--bronze)}
.piece .txt .label{color:var(--mute)}
.piece .txt p{color:var(--ink-soft);max-width:42ch}
.piece .spec{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding-top:18px;border-top:1px solid var(--hair)}
.piece .spec span{display:inline-flex;align-items:center;gap:8px}
.piece .spec span::before{content:"";width:5px;height:5px;border:1px solid var(--green);transform:rotate(45deg)}
.piece .more .arr{display:inline-block;width:26px;height:1px;background:currentColor;position:relative}
.piece .more .arr::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.piece .more{color:var(--green);font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;text-decoration:none;display:inline-flex;gap:12px;align-items:center}
.piece.duo .pic{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--paper)}
.piece.duo .pic > div{position:relative;overflow:hidden}
@media (max-width:900px){.piece,.piece:nth-of-type(even){grid-template-columns:1fr;min-height:0}.piece:nth-of-type(even) .pic{order:0}.piece .pic{aspect-ratio:4/3}.piece .txt{padding:40px 24px 64px}}

/* tested */
.tested{background:var(--stone)}
.tested .wrap{padding-block:clamp(80px,10vw,130px);display:grid;gap:48px}
.th{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px 48px;align-items:end}
.th .label{grid-column:1/-1;color:var(--green)}
.th p{color:var(--ink-soft);max-width:44ch}
.tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--hair);border:1px solid var(--hair)}
.tgrid > div{background:var(--paper);padding:32px 30px;display:grid;gap:14px;align-content:start}
.tgrid svg{width:46px;height:46px;color:var(--green)}
.tgrid .mark{width:46px;height:46px;border:1.5px solid var(--green);border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-weight:500;font-size:20px;color:var(--green)}
.tgrid b{font-family:var(--serif);font-weight:500;font-size:26px;line-height:1.15}
.tgrid ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tgrid li{font-size:15px;color:var(--ink-soft);padding-left:18px;position:relative}
.tgrid li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border:1px solid var(--green);transform:rotate(45deg)}
.tgrid .note{font-size:13px;color:var(--mute);font-style:italic}
.tgrid a{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;color:var(--green);text-decoration:none;display:inline-flex;gap:12px;align-items:center;margin-top:6px}
.tgrid .arr{display:inline-block;width:24px;height:1px;background:currentColor;position:relative}
.tgrid .arr::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
@media (max-width:900px){.th{grid-template-columns:1fr}.tgrid{grid-template-columns:1fr}}
/* resources */
.res .wrap{padding-block:clamp(64px,8vw,100px) 0;display:grid;gap:22px}
.res .label{color:var(--green)}
.rgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid var(--hair)}
.rgrid a{display:grid;gap:6px;padding:24px 22px;text-decoration:none;border-left:1px solid var(--hair);align-content:start;transition:background .3s}
.rgrid a:first-child{border-left:0}
.rgrid a:hover{background:var(--stone)}
.rgrid svg{width:40px;height:40px;color:var(--green);margin-bottom:8px}
.rgrid b{font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.15}
.rgrid i{font-style:normal;font-size:13px;color:var(--ink-soft)}
@media (max-width:1000px){.rgrid{grid-template-columns:1fr 1fr}.rgrid a{border-top:1px solid var(--hair)}.rgrid a:nth-child(odd){border-left:0}}
/* quick links + audience bar + projects */
.quick{border-bottom:1px solid var(--hair);background:var(--paper)}
.quick .wrap{display:flex;gap:6px 28px;flex-wrap:wrap;padding-block:18px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.quick a{text-decoration:none;padding-bottom:3px;border-bottom:1px solid transparent}
.quick a:hover{border-color:currentColor}
.quick .all{margin-left:auto;color:var(--green)}
.aud-bar .wrap{padding-block:44px 0;display:grid;gap:16px}
.aud-bar .label{color:var(--mute)}
.tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--hair)}
.tabs a{display:grid;gap:4px;padding:20px 22px;text-decoration:none;border-left:1px solid var(--hair);transition:background .3s}
.tabs a:first-child{border-left:0}
.tabs a:hover{background:var(--stone)}
.tabs b{font-family:var(--serif);font-weight:500;font-size:23px}
.tabs i{font-style:normal;font-size:13px;color:var(--ink-soft)}
@media (max-width:860px){.tabs{grid-template-columns:1fr 1fr}.tabs a:nth-child(3){border-left:0}.tabs a:nth-child(n+3){border-top:1px solid var(--hair)}.quick .all{margin-left:0}}
.projects .wrap{padding-block:clamp(80px,10vw,130px) 0}
.prow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.prow a{display:grid;gap:6px;text-decoration:none;align-content:start}
.prow img{width:100%;aspect-ratio:3/4;object-fit:cover;margin-bottom:10px;transition:filter .4s}
.prow a:hover img{filter:brightness(.88)}
.prow .tag{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze);font-weight:600}
.prow b{font-family:var(--serif);font-weight:500;font-size:24px;line-height:1.15}
.prow i{font-style:normal;font-size:14px;color:var(--ink-soft)}
@media (max-width:900px){.prow{grid-template-columns:1fr 1fr}}
/* all products + news */
.allp .wrap,.news .wrap{padding-block:clamp(80px,10vw,130px) 0}
.news .wrap{padding-bottom:clamp(80px,10vw,130px)}
.ah{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:end;justify-content:space-between;margin-bottom:40px}
.ah .label{color:var(--green);width:100%}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pgrid a{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;color:#fff;text-decoration:none;background:var(--black)}
.pgrid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.72;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),opacity .5s}
.pgrid a:hover img{transform:scale(1.04);opacity:.6}
.pgrid span{position:absolute;left:0;right:0;bottom:0;padding:22px 24px;display:grid;gap:6px;background:linear-gradient(180deg,rgba(10,12,11,0),rgba(10,12,11,.85))}
.pgrid b{font-family:var(--serif);font-weight:500;font-size:26px;line-height:1.15}
.pgrid i{font-style:normal;font-size:14px;opacity:.9}
.nlist{border-top:1px solid var(--hair)}
.nlist a{display:grid;grid-template-columns:160px 1fr 40px;gap:24px;align-items:center;padding:24px 0;border-bottom:1px solid var(--hair);text-decoration:none}
.nlist .d{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze);font-weight:600}
.nlist b{font-family:var(--serif);font-weight:500;font-size:26px;line-height:1.2}
.nlist .arr{width:30px;height:1px;background:currentColor;position:relative;justify-self:end;transition:width .3s}
.nlist .arr::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.nlist a:hover .arr{width:40px}
.nlist a:hover b{color:var(--green)}
@media (max-width:900px){.pgrid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.pgrid{grid-template-columns:1fr}.nlist a{grid-template-columns:1fr 30px}.nlist .d{grid-column:1/-1}}
/* silence */
.silence{background:var(--black);color:var(--on-black)}
.silence .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);padding-block:clamp(88px,11vw,150px);align-items:center}
.silence .label{color:var(--green-lite)}
.silence h2 em{color:var(--green-lite)}
.silence p{color:var(--on-black-soft);max-width:46ch}
.silence .db div{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:center;padding:22px 0;border-top:1px solid var(--hair-dark)}
.silence .db b{font-family:var(--serif);font-weight:400;font-size:52px;line-height:1;white-space:nowrap}
.silence .db span{font-size:15px;color:var(--on-black-soft)}
.bar{height:2px;background:var(--hair-dark);margin-top:10px;position:relative}
.bar i{position:absolute;left:0;top:0;bottom:0;background:var(--green-lite)}
.silence figure{margin:0;color:#fff}
.silence figure img{width:100%;aspect-ratio:4/5;object-fit:cover}
.silence figcaption{font-size:12px;color:var(--on-black-soft);margin-top:12px;letter-spacing:.06em}
@media (max-width:900px){.silence .wrap{grid-template-columns:1fr}.silence .db div{grid-template-columns:130px 1fr}.silence .db b{font-size:40px}}

/* details */
.details .wrap{padding-block:clamp(88px,11vw,150px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(40px,6vw,96px)}
.details .label{color:var(--green)}
.details ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair)}
.details li{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:24px 0;border-bottom:1px solid var(--hair)}
.details li b{font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.2}
.details li span{color:var(--ink-soft);font-size:15px}
.brands{margin-top:30px;display:flex;flex-wrap:wrap;gap:12px 0;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft)}
.brands span{padding:0 16px;border-left:1px solid var(--hair)}
.brands span:first-child{padding-left:0;border-left:0}
.swatches{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:34px}
.sw{display:grid;gap:8px;font-size:11px;letter-spacing:.08em;color:var(--ink-soft);line-height:1.3}
.sw i{display:block;aspect-ratio:3/4;border:1px solid var(--hair)}
.sw-black{background:linear-gradient(135deg,#2a2c2b,#0d0e0e 60%,#1d1f1e)}
.sw-mill{background:linear-gradient(135deg,#d9dad7,#a9aba8 45%,#e6e7e4 60%,#b4b6b3)}
.sw-bronze{background:linear-gradient(135deg,rgba(146,108,66,.85),rgba(92,68,44,.75))}
.sw-fluted{background:repeating-linear-gradient(90deg,#dfe3e0 0 6px,#c4cac6 6px 8px,#eef1ef 8px 12px)}
.sw-frost{background:linear-gradient(180deg,#f2f3f2,#dfe2e0)}
.sw-ral{background:conic-gradient(from 200deg,#6b2d2a,#b28b5a,#3d5a4f,#2e3a4f,#6b2d2a)}
@media (max-width:900px){.details .wrap{grid-template-columns:1fr}.details li{grid-template-columns:1fr;gap:6px}.swatches{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* origin */
.origin{border-top:1px solid var(--hair);background:var(--stone)}
.origin .wrap{padding-block:clamp(72px,9vw,120px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);gap:48px}
.origin .label{color:var(--green);padding-top:14px}
.origin .big{font-family:var(--serif);font-size:clamp(28px,3.4vw,44px);line-height:1.25;max-width:26ch}
.origin .big em{color:var(--green)}
.origin .steps{grid-column:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-top:20px;border-top:1px solid var(--hair)}
.origin .steps div{padding:16px 14px 0 0;font-size:13px;color:var(--ink-soft);line-height:1.4}
.origin .steps b{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:20px;color:var(--bronze);margin-bottom:4px}
.origin .creds{grid-column:2;display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.origin .creds span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--hair);padding:8px 12px}
@media (max-width:860px){.origin .wrap{grid-template-columns:1fr;gap:20px}.origin .steps,.origin .creds{grid-column:1}.origin .steps{grid-template-columns:1fr 1fr}}

/* voices */
.voices .wrap{padding-block:clamp(88px,10vw,140px);display:grid;gap:40px;justify-items:center;text-align:center}
.voices .stars{color:var(--bronze);letter-spacing:.3em;font-size:15px}
.voices blockquote{margin:0;font-family:var(--serif);font-size:clamp(26px,3.3vw,44px);line-height:1.25;max-width:30ch;min-height:4.2em}
.voices blockquote::before{content:"“";display:block;font-size:90px;line-height:.6;color:var(--bronze);margin-bottom:10px}
.voices cite{font-style:normal;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}
.voices .dots{display:flex;gap:10px}
.voices .dots button{width:34px;height:2px;border:0;padding:0;background:var(--hair);cursor:pointer}
.voices .dots button[aria-current="true"]{background:var(--ink)}
.voices .quote{transition:opacity .6s}

/* audiences */
.aud{display:grid;grid-template-columns:1fr 1fr}
.aud a{position:relative;min-height:520px;display:flex;align-items:flex-end;color:#fff;text-decoration:none;overflow:hidden;background:var(--black)}
.aud img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;transition:opacity .6s,transform 1.4s cubic-bezier(.2,.7,.2,1)}
.aud a:hover img{opacity:.42;transform:scale(1.03)}
.aud .in{position:relative;z-index:2;padding:48px clamp(28px,4vw,64px);display:grid;gap:16px;max-width:560px}
.aud .in svg{width:52px;height:52px;color:#fff}
.aud .in p{color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.aud .in .btn--line{justify-self:start;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:500}
@media (max-width:860px){.aud{grid-template-columns:1fr}.aud a{min-height:440px}}

/* contact */
.contact .wrap{padding-block:clamp(96px,12vw,170px);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:56px;align-items:end}
.contact h2 em{color:var(--green)}
.contact .lines{display:grid;gap:22px;font-size:15px}
.contact .lines b{display:block;font-family:var(--serif);font-weight:500;font-size:30px}
.contact .btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}
@media (max-width:860px){.contact .wrap{grid-template-columns:1fr}}

footer{background:var(--black);color:var(--on-black-soft);font-size:14px}
footer .top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px;padding-block:72px 48px}
footer .flogo{width:200px;color:var(--on-black)}
footer h4{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--on-black);margin:0 0 16px;font-weight:600}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
footer a{text-decoration:none}
footer a:hover{color:var(--on-black)}
footer .bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-block:22px;border-top:1px solid var(--hair-dark);font-size:12px}
@media (max-width:860px){footer .top{grid-template-columns:1fr 1fr}footer .top>div:first-child{grid-column:1/-1}}

.reveal{animation:rise 1s cubic-bezier(.2,.7,.2,1) both}
.d2{animation-delay:.3s}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

@media (max-width:700px){
 body{font-size:17px;line-height:1.7}
 .label{font-size:13px;letter-spacing:.16em}
 h2{font-size:40px;line-height:1.1}
 h3{font-size:32px}
 .hero h1{font-size:48px;line-height:1.02}
 .hero::after{background:linear-gradient(180deg,rgba(10,12,11,.6) 0%,rgba(10,12,11,.15) 30%,rgba(10,12,11,.55) 55%,rgba(10,12,11,.9) 100%)}
 .logo{width:150px}
 .head .cta .btn{padding:10px 14px;font-size:11px;letter-spacing:.12em;white-space:nowrap}
 .statement p.big{font-size:30px;line-height:1.3}
 .figures span,.piece .txt p,.details li span,.silence .db span,.silence p{font-size:16px}
 .figures b{font-size:36px}
 .icons figcaption{font-size:13px}
 .piece .spec{font-size:13px;letter-spacing:.08em}
 .details li b{font-size:26px}
 .voices blockquote{font-size:28px;line-height:1.35;min-height:0}
 .voices cite,.btn{font-size:13px}
 .contact .lines b{font-size:26px}
 .util .hide-s{display:none}
 .util span+span::before{content:none}
}

/* ===== Subpages ===== */
.nav a[aria-current="page"]{border-bottom:1px solid currentColor}
.phero{position:relative;min-height:min(74vh,720px);display:flex;align-items:flex-end;color:#fff;background:var(--black);overflow:hidden}
.phero>img,.phero>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,11,.62) 0%,rgba(10,12,11,.18) 32%,rgba(10,12,11,.84) 100%)}
.phero .wrap{position:relative;z-index:2;width:100%;padding-top:120px;padding-bottom:64px}
.phero h1{font-size:clamp(44px,7vw,96px);line-height:1;margin:16px 0 22px;max-width:16ch}
.phero p{max-width:58ch;font-size:18px;color:#e9e8e3}
.phero .label{color:#d9d7d1}
.crumbs{font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:34px}
.crumbs a{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}.crumbs a:hover{opacity:.8}
.crumbs span{opacity:.6;margin:0 6px}
.phero.short{min-height:min(56vh,520px)}
.phero.plain{background:var(--black-2)}

.subnav{position:sticky;top:0;z-index:30;background:rgba(246,245,242,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--hair)}
.subnav .wrap{display:flex;gap:17px;overflow-x:auto;scrollbar-width:none;padding:16px 0}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{flex:none;font-size:13px;font-weight:600;letter-spacing:.01em;text-transform:none;text-decoration:none;color:var(--ink-soft);padding-bottom:4px;border-bottom:1px solid transparent}
.subnav a:hover,.subnav a.on{color:var(--ink);border-bottom-color:var(--ink)}

.intro{padding:110px 0 90px}
.intro .wrap{display:grid;grid-template-columns:1fr 1.5fr;gap:80px;align-items:start}
.intro .big{font-family:var(--serif);font-size:clamp(28px,3.2vw,42px);line-height:1.2;color:var(--ink)}
.intro .big em{color:var(--green)}
.intro .cols{display:grid;gap:18px;color:var(--ink-soft);font-size:17px}

/* overview grid of systems */
.ovr{padding:0 0 100px}
.ovr .grid{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;background:var(--hair);border:1px solid var(--hair)}
.ovr a{background:var(--paper);text-decoration:none;display:grid;grid-template-rows:auto 1fr;transition:background .3s}
.ovr a:hover{background:#fff}
.ovr .im{aspect-ratio:4/3;overflow:hidden}
.ovr img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.ovr a:hover img{transform:scale(1.04)}
.ovr .t{padding:20px 22px 24px;display:grid;gap:6px;align-content:start}
.ovr .t i{font-style:normal;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.ovr .t b{font-family:var(--serif);font-weight:500;font-size:24px;line-height:1.15}
.ovr .t span{font-size:14px;color:var(--ink-soft)}
.ovr .t .db{margin-top:8px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}

/* system section */
.sys{padding:110px 0;border-top:1px solid var(--hair);scroll-margin-top:60px}
.sys .wrap{display:grid;grid-template-columns:1.15fr 1fr;gap:72px;align-items:start}
.sys:nth-of-type(even) .gal{order:2}
.gal{position:sticky;top:76px;display:grid;gap:10px}
.gmain{margin:0;color:#fff;aspect-ratio:4/3;overflow:hidden;background:var(--stone)}
.gmain img{width:100%;height:100%;object-fit:cover;transition:opacity .35s}
.gthumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px}
.gthumbs .gth{all:unset;cursor:pointer;aspect-ratio:1;overflow:hidden;outline:1px solid transparent;outline-offset:2px;opacity:.72;transition:opacity .3s}
.gthumbs .gth:hover,.gthumbs .gth[aria-pressed="true"]{opacity:1;outline-color:var(--ink)}
.gthumbs .gth:focus-visible{outline:1px solid var(--green)}
.gthumbs img{width:100%;height:100%;object-fit:cover}
.stxt{display:grid;gap:22px;align-content:start}
.stxt .no{font-family:var(--serif);font-size:15px;font-style:italic;color:var(--bronze)}
.stxt .label{color:var(--mute)}
.stxt h2{font-size:clamp(36px,4.2vw,58px)}
.facts{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--hair)}
.facts li{display:grid;gap:2px;padding:14px 14px 14px 0;border-bottom:1px solid var(--hair)}
.facts li:nth-child(odd){padding-right:20px;border-right:1px solid var(--hair)}
.facts li:nth-child(even){padding-left:20px}
.facts b{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.facts span{font-family:var(--serif);font-size:22px;line-height:1.2;color:var(--ink)}
.facts li.hl span{color:var(--green)}
.sbody{display:grid;gap:14px;color:var(--ink-soft);font-size:16.5px}
.specs{margin:6px 0 0;display:grid;grid-template-columns:1fr;border:1px solid var(--hair);background:#fbfaf8}
.specs>div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:11px 18px;border-bottom:1px solid var(--hair);font-size:14px}
.specs>div:last-child{border-bottom:0}
.specs dt{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);padding-top:2px}
.specs dd{margin:0;color:var(--ink)}
.specs-h{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);margin-top:8px;display:flex;align-items:center;gap:12px}
.specs-h::after{content:"";flex:1;height:1px;background:var(--hair)}
.snote{font-size:14px;color:var(--ink-soft);border-left:2px solid var(--bronze);padding:4px 0 4px 16px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--hair);padding:7px 11px;color:var(--ink-soft);background:#fbfaf8}
.chips span.ce{border-color:var(--green);color:var(--green)}
.sctas{display:flex;flex-wrap:wrap;gap:26px;align-items:center;margin-top:10px}
.sbody ul{margin:0;padding-left:18px;display:grid;gap:6px}

/* dark variant section */
.dark{background:var(--black);color:var(--on-black)}
.dark .sbody,.dark .intro .cols{color:var(--on-black-soft)}
.dark h2,.dark .big{color:var(--on-black)}

/* cta band */
.cband{background:var(--black);color:var(--on-black);padding:100px 0}
.cband .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:end}
.cband h2{margin:14px 0 18px}
.cband h2 em{color:var(--green-lite)}
.cband p{color:var(--on-black-soft);max-width:52ch;font-size:17px}
.cband .label{color:var(--on-black-soft)}
.cband .btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:flex-end}
.cband .btn--solid{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.cband .btn--solid:hover{background:var(--green-lite);border-color:var(--green-lite)}

/* generic blocks */
.blk{padding:100px 0}
.blk.tight{padding:70px 0}
.blk .head2{display:grid;grid-template-columns:1fr 1.3fr;gap:60px;align-items:end;margin-bottom:56px}
.blk .head2 p{color:var(--ink-soft);font-size:17px}
.blk .head2 .label{display:block;margin-bottom:14px;color:var(--mute)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.card{display:grid;gap:14px;align-content:start;text-decoration:none}
.card .im{aspect-ratio:16/10;overflow:hidden;background:var(--stone)}
.card .im img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.card:hover .im img{transform:scale(1.04)}
.card .im.contain{background:#fff}
.card .im.contain img{object-fit:contain;padding:18px}
.card h3{font-size:28px}
.card p{color:var(--ink-soft);font-size:15.5px}
.card i{font-style:normal;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.card ul{margin:0;padding-left:18px;color:var(--ink-soft);font-size:15px;display:grid;gap:4px}

.tbl{width:100%;border-collapse:collapse;font-size:14px;background:#fbfaf8;border:1px solid var(--hair)}
.tbl th{text-align:left;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);width:42%;padding:10px 16px;border-bottom:1px solid var(--hair);vertical-align:top}
.tbl td{padding:10px 16px;border-bottom:1px solid var(--hair)}

/* references */
.rfilter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:36px}
.rfilter button{all:unset;cursor:pointer;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:10px 16px;border:1px solid var(--hair);color:var(--ink-soft)}
.rfilter button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.rfilter button:focus-visible{outline:1px solid var(--green)}
.rgal{columns:3 320px;column-gap:24px}
.rgal figure{break-inside:avoid;margin:0 0 24px;background:#fff;border:1px solid var(--hair)}
.rgal figure[hidden]{display:none}
.rgal img{width:100%;height:auto}
.rgal figcaption{padding:16px 18px 18px;font-size:14.5px;color:var(--ink-soft);display:grid;gap:6px}
.rgal figcaption b{font-family:var(--serif);font-size:21px;font-weight:500;color:var(--ink)}
.rgal figcaption a{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--green);text-decoration:none;margin-top:4px}

/* team */
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.team figure{margin:0;display:grid;gap:12px}
.team img{aspect-ratio:4/5;object-fit:cover;width:100%;filter:grayscale(1) contrast(1.05);transition:filter .5s}
.team figure:hover img{filter:none}
.team b{font-family:var(--serif);font-size:22px;font-weight:500}
.team span{display:block;font-size:13px;color:var(--mute);letter-spacing:.04em}
.team a{font-size:14px;color:var(--ink-soft)}

.addr{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--hair);border:1px solid var(--hair)}
.addr>div{background:var(--paper);padding:30px 28px;display:grid;gap:8px;align-content:start}
.addr .label{color:var(--mute);margin-bottom:6px}
.addr b{font-family:var(--serif);font-size:24px;font-weight:500}
.addr p{color:var(--ink-soft);font-size:15px}

/* quote form (concept) */
.qform{display:grid;grid-template-columns:1fr 1fr;gap:18px;background:#fff;border:1px solid var(--hair);padding:36px}
.qform label{display:grid;gap:6px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.qform input,.qform select,.qform textarea{font:400 16px/1.4 var(--sans);color:var(--ink);background:var(--paper);border:1px solid var(--hair);padding:13px 14px;letter-spacing:0;text-transform:none;border-radius:0}
.qform input:focus,.qform select:focus,.qform textarea:focus{outline:1px solid var(--green);border-color:var(--green)}
.qform .full{grid-column:1/-1}
.qform textarea{min-height:120px;resize:vertical}
.qform .note{font-size:13px;color:var(--mute);letter-spacing:0;text-transform:none;font-weight:400}
.qform .ok{grid-column:1/-1;background:var(--stone);padding:16px;font-size:14px;color:var(--ink)}

/* list rows (news, downloads, jobs) */
.rows{border-top:1px solid var(--hair)}
.rows a,.rows .row{display:grid;grid-template-columns:200px 1fr auto;gap:36px;align-items:center;padding:26px 0;border-bottom:1px solid var(--hair);text-decoration:none}
.rows img{aspect-ratio:4/3;object-fit:cover;width:100%}
.rows b{font-family:var(--serif);font-size:28px;font-weight:400;line-height:1.15;display:block;margin-bottom:6px}
.rows p{color:var(--ink-soft);font-size:15px}
.rows i{font-style:normal;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);display:block;margin-bottom:8px}
.rows .arr{display:inline-block;width:30px;height:1px;background:currentColor;position:relative;transition:width .3s}
.rows .arr::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.rows a:hover .arr{width:46px}
.rows.noimg a,.rows.noimg .row{grid-template-columns:1fr auto}
.dl{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.dl .box{border:1px solid var(--hair);background:#fbfaf8;padding:30px;display:grid;gap:14px;align-content:start}
.dl .box h3{font-size:28px}
.dl .box ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair)}
.dl .box li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--hair);font-size:15px}
.dl .box li a{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--green);text-decoration:none;white-space:nowrap}
.dl .box li span{color:var(--ink-soft)}
.lock{font-size:12px;color:var(--mute)}

/* article */
.art{padding:90px 0}
.art .wrap{max-width:820px}
.art h2{font-size:clamp(30px,3.4vw,44px);margin:44px 0 16px}
.art p,.art li{font-size:17.5px;color:var(--ink-soft);margin:0 0 14px}
.art ul{padding-left:20px;margin:0 0 16px}
.art figure{margin:34px 0}
.art .facts{margin:24px 0}

/* machines */
.mlist{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}
.mlist .m{display:grid;gap:14px;align-content:start;border-top:1px solid var(--ink);padding-top:22px}
.mlist .m img{aspect-ratio:16/10;object-fit:cover;width:100%;background:#fff}
.mlist .m img.fk{aspect-ratio:1200/543;background:#e9e9e9}
.mlist .m h3{font-size:30px}
.mlist ul{margin:0;padding-left:18px;color:var(--ink-soft);font-size:15px;display:grid;gap:4px}

.voice-grid{columns:3 300px;column-gap:24px}
.voice-grid blockquote{break-inside:avoid;margin:0 0 24px;background:#fff;border:1px solid var(--hair);padding:26px 26px 22px;display:grid;gap:14px}
.voice-grid blockquote p{font-family:var(--serif);font-size:21px;line-height:1.35;color:var(--ink)}
.voice-grid cite{font-style:normal;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.voice-grid .st{color:var(--bronze);letter-spacing:.2em;font-size:13px}

.reveal{opacity:1}

@media (max-width:1000px){
  .ovr .grid{grid-template-columns:repeat(2,1fr)}
  .sys .wrap,.intro .wrap,.cband .wrap,.blk .head2{grid-template-columns:1fr;gap:40px}
  .sys:nth-of-type(even) .gal{order:0}
  .gal{position:static}
  .cards,.team{grid-template-columns:repeat(2,1fr)}
  .addr{grid-template-columns:1fr}
  .cband .btns{justify-content:flex-start}
  .mlist,.dl{grid-template-columns:1fr}
}
@media (max-width:700px){
  .phero .wrap{padding-bottom:44px}
  .phero p{font-size:17px}
  .intro{padding:70px 0 56px}
  .sys{padding:70px 0}
  .blk{padding:70px 0}
  .ovr .grid{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr}
  .facts li:nth-child(odd){border-right:0;padding-right:0}
  .facts li:nth-child(even){padding-left:0}
  .specs>div{grid-template-columns:1fr;gap:2px}
  .cards{grid-template-columns:1fr}
  .team{grid-template-columns:repeat(2,1fr);gap:18px}
  .qform{grid-template-columns:1fr;padding:22px}
  .rows a,.rows .row{grid-template-columns:96px 1fr;gap:18px}
  .rows .arr{display:none}
  .rows b{font-size:22px}
  .sbody,.intro .cols{font-size:17px}
}

body.solid .head{position:relative;background:var(--black)}
body.solid .crumbs{color:var(--mute)}

/* gallery video */
.gmain video{width:100%;height:100%;object-fit:cover;display:block}
.gmain video[hidden],.gmain img[hidden]{display:none}
.gthumbs .gth{position:relative}
.gthumbs .isv span{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:15px;background:rgba(10,12,11,.28);text-shadow:0 1px 6px rgba(0,0,0,.5)}

/* green spec icons, as on the original pages */
.gspec{display:grid;grid-template-columns:repeat(4,1fr);gap:26px 12px;padding:30px 0 26px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin:4px 0 2px}
.gspec>div{display:grid;justify-items:center;align-content:start;text-align:center;gap:12px}
.gspec i{width:76px;height:76px;border:1.5px solid var(--green);border-radius:50%;display:grid;place-items:center;color:var(--green);background:#fff;transition:background .35s,color .35s}
.gspec>div:hover i{background:var(--green);color:#fff}
.gspec svg{width:42px;height:42px;fill:currentColor}
.gspec p{margin:0;display:grid;gap:3px;max-width:15ch}
.gspec b{font:600 10.5px/1.35 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.gspec span{font-family:var(--serif);font-size:21px;line-height:1.1;color:var(--green);white-space:nowrap}
.gspec em{font-style:normal;font-size:13.5px;line-height:1.4;color:var(--ink-soft)}
@media (max-width:700px){
  .gspec{grid-template-columns:repeat(2,1fr);gap:18px 14px}
  .gspec>div{grid-template-columns:58px 1fr;justify-items:start;text-align:left;align-items:center}
  .gspec i{width:58px;height:58px}.gspec svg{width:32px;height:32px}
  .gspec em{font-size:14px}.gspec b{font-size:11px}.gspec span{font-size:20px}
}

/* catalogue drawings */
.cfs{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.cf{display:grid;gap:8px;background:#fff;border:1px solid var(--hair);padding:14px;text-decoration:none;transition:border-color .3s}
.cf:hover{border-color:var(--green)}
.cf img{width:100%;height:150px;object-fit:contain}
.cf span{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.card .im img{display:block}
@media (max-width:1000px){.cards .card[style*="span 3"]{grid-column:auto!important}}

/* slow zoom on still page heroes */
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.08)}}
.phero>img{animation:kb 22s ease-in-out infinite alternate;transform-origin:60% 50%}
@media (prefers-reduced-motion:reduce){.phero>img{animation:none}}

.pmeta{position:absolute;z-index:3;right:max(24px,env(safe-area-inset-right,0px));top:120px;writing-mode:vertical-rl;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#fff;opacity:.85}
@media (max-width:700px){.pmeta{writing-mode:horizontal-tb;top:auto;bottom:14px;right:16px;left:16px;font-size:10px;letter-spacing:.18em;text-align:right}}

/* back navigation */
.subnav .sn-ov{color:var(--green);border-right:1px solid var(--hair);padding-right:22px}
.backbtn,.topbtn{position:fixed;z-index:40;bottom:22px;display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#fff;text-decoration:none;font:600 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:14px 18px;box-shadow:0 8px 24px rgba(0,0,0,.18);transition:background .3s,opacity .3s,transform .3s}
.backbtn{left:max(22px,env(safe-area-inset-left,0px))}
.topbtn{right:max(22px,env(safe-area-inset-right,0px));padding:14px 16px}
.backbtn:hover,.topbtn:hover{background:var(--green)}
.backbtn span{font-size:15px}
body:not(.scrolled) .backbtn,body:not(.scrolled) .topbtn{opacity:0;transform:translateY(12px);pointer-events:none}
@media (max-width:700px){.backbtn,.topbtn{bottom:14px;padding:12px 14px;font-size:11px}.backbtn{left:14px}.topbtn{right:14px}}

.ddm a.ddh{font-size:10.5px!important;font-weight:700;letter-spacing:.2em!important;text-transform:uppercase!important;color:var(--green-lite);padding-top:14px;border-top:1px solid rgba(255,255,255,.14)!important;margin-top:6px}
.ddm a.ddh:first-child{border-top:0!important;margin-top:0;padding-top:12px}
.mpanel a.ddh{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--green-lite)}

/* one menu only: header follows on scroll */
body.scrolled .head{position:fixed;top:0;background:rgba(15,17,16,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 6px 24px rgba(0,0,0,.18);animation:hd .35s ease both}
body.scrolled .head .wrap{padding-block:12px}
@keyframes hd{from{transform:translateY(-100%)}to{transform:none}}

/* flat menu like the original site */
.nav{gap:24px!important}
.nav>a,.nav .dd>a{white-space:nowrap;font-size:11.5px!important;letter-spacing:.12em!important}
.head .cta .btn{white-space:nowrap}
.nav .dd{display:flex;align-items:center}.nav>a,.nav .dd>a{line-height:1.6}

/* architect area */
.logingrid{display:grid;grid-template-columns:1fr 1.4fr;gap:32px;align-items:start}
.lbox{display:grid;gap:16px;background:var(--stone);padding:34px}
.lbox h2{font-size:clamp(32px,3.4vw,46px)}
.lbox .label{color:var(--mute)}
.lbox p{color:var(--ink-soft)}
.lform{grid-template-columns:1fr}
.qform a.note{color:var(--mute)}
.ptabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:46px}
.ptabs a{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:12px 18px;border:1px solid var(--hair);background:#fff}
.ptabs a:hover{border-color:var(--green);color:var(--green)}
.ptabs a.out{margin-left:auto;background:none;border-color:transparent;color:var(--mute)}
.pbox{padding:46px 0;border-top:1px solid var(--hair);scroll-margin-top:90px}
.pbox .head2{margin-bottom:30px}
.dlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair)}
.dlist li{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 0;border-bottom:1px solid var(--hair)}
.dlist li>span{display:grid;gap:3px}
.dlist b{font-family:var(--serif);font-size:21px;font-weight:500}
.dlist em{font-style:normal;font-size:13px;color:var(--mute)}
.dlist .sysl{font-size:12px;color:var(--green)}
.dlist .cdl{flex:none;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#fff;background:var(--green);padding:11px 16px}
.dlist .cdl:hover{background:var(--ink)}
.cnote{position:fixed;left:50%;bottom:80px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 18px;font-size:14px;z-index:60}
.phero.plain{background:linear-gradient(135deg,#0f1110,#183a31)}
@media (max-width:900px){.logingrid{grid-template-columns:1fr}.ptabs a.out{margin-left:0}.lbox{padding:22px}}

/* login roles */
.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--hair);border:1px solid var(--hair);margin-bottom:36px}
.roles button{all:unset;cursor:pointer;background:var(--paper);padding:22px 24px;display:grid;gap:4px;transition:background .3s}
.roles button b{font-family:var(--serif);font-size:24px;font-weight:500}
.roles button span{font-size:13.5px;color:var(--mute)}
.roles button[aria-selected="true"]{background:var(--green);color:#fff}
.roles button[aria-selected="true"] span{color:#cfe5dc}
.roles button:focus-visible{outline:2px solid var(--green);outline-offset:-2px}
/* manual viewer */
.mview{display:grid;grid-template-columns:300px 1fr;gap:28px;align-items:start;margin-bottom:20px}
.mdocs{display:grid;gap:8px;position:sticky;top:90px}
.mdocs .label{color:var(--mute);margin-bottom:6px}
.mdoc{all:unset;cursor:pointer;display:grid;gap:3px;padding:14px 16px;border:1px solid var(--hair);background:#fff}
.mdoc b{font-family:var(--serif);font-size:19px;font-weight:500}
.mdoc span{font-size:12.5px;color:var(--mute)}
.mdoc[aria-pressed="true"]{border-color:var(--green);box-shadow:inset 3px 0 0 var(--green)}
.mpage{display:grid;gap:12px}
.mbar{display:flex;align-items:center;gap:16px;background:var(--ink);color:#fff;padding:10px 14px}
.mbar .mtitle{font-family:var(--serif);font-size:20px;font-weight:400;flex:1}
.mbar .mnum{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#cfcdc7}
.mctl{display:flex;gap:6px}
.mctl button{all:unset;cursor:pointer;width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.3)}
.mctl button:hover{background:rgba(255,255,255,.12)}
.mctl .cdl{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#fff;background:var(--green);padding:10px 14px}
.mimg{margin:0;background:#fff;border:1px solid var(--hair);box-shadow:0 18px 40px rgba(0,0,0,.08)}
.mimg img{width:100%;height:auto}
.mthumbs{display:flex;gap:8px;overflow-x:auto}
.mthumbs button{all:unset;cursor:pointer;flex:none;width:120px;border:1px solid var(--hair);background:#fff;opacity:.7}
.mthumbs button[aria-pressed="true"]{opacity:1;outline:2px solid var(--green)}
.mthumbs img{width:100%;display:block}
@media (max-width:900px){.roles{grid-template-columns:1fr}.mview{grid-template-columns:1fr}.mdocs{position:static}}

.lockrow{display:flex;align-items:center;gap:16px;border:1px solid var(--hair);background:#fbfaf8;padding:16px 18px;margin-top:6px}
.lockrow .lk{font-size:18px;filter:grayscale(1)}
.lockrow>div{flex:1;display:grid;gap:2px}
.lockrow b{font-size:14px}
.lockrow span{font-size:13px;color:var(--mute)}

/* one consistent label style under the icons */
.gspec b{font:400 13.5px/1.4 var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--ink-soft)!important}
.gspec span{font-size:19px!important}

/* tidy icon grid: one-line labels, aligned rows */
.gspec>div{grid-template-rows:auto auto}
.gspec p{min-height:3.1em;align-content:start;max-width:none!important}
.gspec b,.gspec em{white-space:nowrap}
.gspec b{font:400 13.5px/1.4 var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--ink-soft)!important}
.gspec em{font-size:13.5px!important;color:var(--ink-soft)!important}

/* value in the same type as the label */
.gspec span{font:600 13.5px/1.4 var(--sans)!important;color:var(--green)!important;letter-spacing:0!important}
@media (max-width:700px){.gspec p{min-height:0}}

/* one hero height on every subpage */
.phero,.phero.short{min-height:min(66vh,640px)}
/* partner page */
.pmodel ul{margin:4px 0 8px;padding-left:18px;display:grid;gap:7px;color:var(--ink-soft);font-size:15px}
.pmodel{background:#fff;border:1px solid var(--hair);padding:26px}
.dark .card h3{color:var(--on-black)}.dark .card p{color:var(--on-black-soft)}.dark .card i{color:var(--green-lite)}.dark .card a{color:var(--green-lite)}
.faqs{border-top:1px solid var(--hair)}
.faq{border-bottom:1px solid var(--hair);padding:18px 0}
.faq summary{cursor:pointer;font-family:var(--serif);font-size:23px;list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--sans);color:var(--green);font-size:22px}
.faq[open] summary::after{content:"–"}
.faq p{margin-top:10px;color:var(--ink-soft);max-width:70ch}
.figures b{white-space:nowrap}
.ovr .grid.g3{grid-template-columns:repeat(3,1fr)}@media (max-width:1000px){.ovr .grid.g3{grid-template-columns:repeat(2,1fr)}}@media (max-width:700px){.ovr .grid.g3{grid-template-columns:1fr}.figures b{white-space:normal}}
.dark .head2 p{color:var(--on-black-soft)}.dark .head2 .label{color:var(--green-lite)}.dark .head2 h2{color:var(--on-black)}
@media (max-width:700px){.gspec b,.gspec em{white-space:normal}.gspec>div,.gspec p{min-width:0}.piece>*{min-width:0}}
.catl{display:flex;flex-direction:column;gap:6px;margin-top:4px}.catl a{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--green);text-decoration:none;border-bottom:1px solid currentColor;align-self:flex-start;padding-bottom:2px}

.frange{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--hair);border:1px solid var(--hair)}
.fcat{background:var(--paper);padding:26px 24px;display:grid;gap:12px;align-content:start}
.fcat h3{font-size:26px}
.fcat ul{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:14px;color:var(--ink-soft)}
.fcat li{padding-left:14px;position:relative}.fcat li::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:5px;border:1px solid var(--green);transform:rotate(45deg)}
.fcat a{font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--green);text-decoration:none}
@media (max-width:1000px){.frange{grid-template-columns:repeat(2,1fr)}}@media (max-width:700px){.frange{grid-template-columns:1fr}}

.fnew{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:start;padding:44px 0;border-top:1px solid var(--hair)}
.fnew .fimg{display:grid;gap:12px}
.fnew .fimg img{width:100%;background:#fff;border:1px solid var(--hair)}
.fnew .ftxt{display:grid;gap:14px}
.fnew h3{font-size:clamp(28px,3vw,40px)}
.fnew p{color:var(--ink-soft)}
.fnew .catl{flex-direction:row;gap:20px;flex-wrap:wrap}
.fvid video{width:100%;display:block;background:#000;aspect-ratio:854/652}
@media (max-width:900px){.fnew{grid-template-columns:1fr;gap:24px}}
section[id]{scroll-margin-top:84px}
.artfig{margin:0 0 36px;max-width:880px}.artfig img{width:100%;height:auto;display:block}

.vrows{display:grid;gap:56px}
.vrow{display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:40px;align-items:center}
.vrow:nth-child(even){grid-template-columns:1fr minmax(220px,340px)}.vrow:nth-child(even) .vvid{order:2}
.vvid{margin:0;aspect-ratio:9/16;background:#111;overflow:hidden}.vvid video{width:100%;height:100%;object-fit:cover;display:block}
.vtxt h3{font:400 clamp(26px,3vw,36px)/1.15 var(--serif);margin:0 0 10px}.vtxt p{margin:0 0 20px;max-width:52ch}
.vimgs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:22px}.vimgs img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.vmore{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:64px}
@media(max-width:760px){.vrow,.vrow:nth-child(even){grid-template-columns:1fr}.vrow:nth-child(even) .vvid{order:0}.vvid{max-width:340px}.vmore{grid-template-columns:repeat(2,1fr)}}
.vimgs{max-width:560px}.vrow{align-items:center}

.fdrop{display:grid;gap:8px}.flab{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.fzone{display:grid!important;gap:6px!important;place-items:center;text-align:center;padding:28px 18px;border:1px dashed var(--green);background:var(--paper);cursor:pointer;transition:background .2s}
.fzone:hover,.fzone.drag{background:var(--stone)}.fzone input{position:absolute;width:1px;height:1px;opacity:0}
.fzone b{font:500 16px/1.3 var(--sans);color:var(--green);letter-spacing:0;text-transform:none}.fzone span{font:400 13px/1.5 var(--sans);color:var(--mute);letter-spacing:0;text-transform:none}
.flist{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:14px}.flist li{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--hair);padding:6px 0}.flist li span{color:var(--mute)}
.team{align-items:start}
.roof .card .im{aspect-ratio:4/5}.roof .card .im img{filter:saturate(.85)}.roof .cards{gap:28px}

.qform .fpriv{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-soft);text-transform:none;letter-spacing:0}.qform .fpriv input{width:auto;margin-top:3px;accent-color:var(--green)}.qform .err{outline:2px solid #b3261e;outline-offset:1px}.qform button[disabled]{opacity:.6;cursor:wait}