@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--ink:#25201b;--rust:#9b3024;--line:#8a55454a;--paper:#e9ded0;--serif:Georgia,serif;--sans:"DM Sans",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper) url(assets/paper.jpg) center top / 950px auto;font:16px/1.6 var(--sans)}
img{display:block;max-width:100%}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid #c35344;outline-offset:5px}
.shell{width:min(1320px,calc(100% - 96px));margin-inline:auto}
header{min-height:79px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:15px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font:600 13px/1.12 var(--sans)}
.brand img{object-fit:contain}
nav{display:flex;gap:clamp(14px,4vw,50px);font-size:13px;font-weight:600}
nav a{text-decoration:none}
nav a:hover,.contact-links a:hover{color:#e77562}
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero-inner{position:relative;display:grid;grid-template-columns:1.12fr 1fr;min-height:clamp(590px,52vw,810px);align-items:center}
.hero-copy{z-index:2;padding:40px 0 65px}
.eyebrow,.band,.chapter-number,dt,.footer-note{font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase}
.eyebrow{color:var(--rust)}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.04}
h1{font-size:clamp(62px,8vw,128px);letter-spacing:-.01em;margin:20px 0 24px}
h1 em{color:var(--rust);font-weight:400}
.intro{max-width:33ch;font-size:17px;margin:0 0 28px}
.button{display:inline-flex;align-items:center;gap:24px;text-decoration:none;padding:9px 0;border-bottom:1px solid var(--rust);font-weight:700}
.button:hover{color:var(--rust)}
.portrait{align-self:end;position:relative;z-index:1}
.portrait img{width:100%;max-height:720px;object-fit:contain;object-position:bottom}
.hero-art{position:absolute;inset:0;pointer-events:none}
.hero-art img{position:absolute}
@keyframes sun-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:no-preference){.sun{animation:sun-spin 60s linear infinite;transform-origin:center}}
.sun{width:min(36vw,540px);right:13%;top:10%;opacity:.88}
.bamboo{width:min(31vw,450px);height:105%;object-fit:contain;object-position:right top;right:-5%;top:-7%;opacity:.8}
.mountains{width:64%;right:-8%;bottom:-15%;opacity:.56;mix-blend-mode:multiply}
.band{background:#26201d;color:#f5eae0}
.band .shell{display:flex;justify-content:space-between;gap:10px;padding:15px 0}
.work,.reviews,.about{padding-top:clamp(60px,8vw,112px);padding-bottom:clamp(60px,8vw,112px)}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:35px}
.section-head img{width:min(20%,180px)}
h2{font-size:clamp(47px,7vw,104px);letter-spacing:-.04em}
.chapter{display:grid;grid-template-columns:minmax(200px,1fr) 3.35fr;gap:30px;padding:32px 0;border-top:1px solid var(--line)}
.chapter:last-child{border-bottom:1px solid var(--line)}
.chapter-number{color:var(--rust);display:block;margin-bottom:15px}
h3{font-size:clamp(34px,3.8vw,60px);letter-spacing:-.025em}
.chapter p{max-width:25ch;font-size:14px}
.gallery{display:grid;gap:clamp(8px,1.8vw,24px);align-items:start}
.graphic{grid-template-columns:repeat(3,minmax(0,1fr))}
.products{grid-template-columns:repeat(5,minmax(0,1fr))}
.comparison{grid-template-columns:repeat(2,minmax(0,1fr));max-width:590px}
.motion{max-width:970px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:580px){.motion{grid-template-columns:repeat(2,minmax(0,1fr))}}
.video-card{margin:0}
.video-card video{display:block;width:100%;height:auto}
.print{display:block;min-width:0;background:#f8f1e7;padding:8px;box-shadow:1px 5px 12px #44241628;text-decoration:none;transition:transform .22s}
.graphic .print:nth-child(2),.products .print:nth-child(4){transform:rotate(1.4deg)}
.products .print:nth-child(2),.comparison .print:nth-child(1){transform:rotate(-1.3deg)}
.gallery .print:is(:hover,:focus-within){transform:translateY(-4px) rotate(0)}
.print img{width:100%;aspect-ratio:3/4;object-fit:contain}
.print span{display:block;padding:8px 4px 3px;font-size:12px;font-weight:600;overflow-wrap:anywhere}
.reviews{position:relative;isolation:isolate;overflow:hidden;background:#bb6f5412}
.blossom{position:absolute;z-index:-1;right:-10%;top:-8%;width:min(57vw,700px);opacity:.24;pointer-events:none}
.quotes{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;margin-top:30px}
blockquote{margin:0;padding:23px;border-top:1px solid var(--line);background:#f6ede3c9}
blockquote p{font:clamp(21px,2.4vw,32px)/1.12 var(--serif);margin:0 0 15px}
cite{font-size:12px;font-style:normal;color:var(--rust);overflow-wrap:anywhere}
.about{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,7vw,100px);align-items:center}
.about h2{font-size:clamp(40px,5.4vw,83px)}
.about p{max-width:48ch;font-size:18px}

dl{display:grid;gap:12px;margin-top:25px}
dl div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;border-top:1px solid var(--line);padding-top:10px}
dt{color:var(--rust);font-size:13px;letter-spacing:.12em}
dd{margin:0;font-size:17px}
footer{background:#211d1b;color:#f5eae0;padding:29px 0 16px}
footer h2{font-size:clamp(34px,5vw,64px)}
footer .eyebrow{color:#f0846e;margin:12px 0 2px}
.contact-links{display:flex;flex-wrap:wrap;gap:4px 22px}.contact-links a{overflow-wrap:anywhere;text-underline-offset:4px}
.footer-note{display:flex;justify-content:space-between;gap:12px;margin-top:20px;padding-top:10px;border-top:1px solid #ffffff40}
dialog{width:min(820px,calc(100% - 26px));max-height:94dvh;background:var(--paper);border:1px solid var(--line);color:var(--ink);padding:14px}
dialog::backdrop{background:#1d1714df}
.dialog-bar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:12px}
.dialog-bar h2{font-size:clamp(25px,5vw,42px)}
.dialog-bar button{background:none;border:1px solid var(--line);cursor:pointer;width:38px;height:38px;flex-shrink:0}
dialog>[hidden]{display:none}
dialog>video{display:block;margin:auto;width:100%;max-height:76dvh}
.play-animation{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 4px;font-size:12px;text-decoration:none}
.play-animation:hover{color:var(--rust)}
.play-animation span{padding:0;font-size:10px}
dialog>img{margin:auto;width:100%;height:76dvh;object-fit:contain}
@media(max-width:820px){.shell{width:calc(100% - 36px)}.chapter{grid-template-columns:1fr}.chapter h3 br{display:none}.chapter p{max-width:none}.hero-inner{min-height:510px}.products{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:580px){header{min-height:65px}nav{gap:13px}.brand img{width:28px;height:34px}.hero-inner{display:block;min-height:0}.hero-copy{position:relative;padding:35px 0 8px}.hero h1{font-size:clamp(45px,12vw,69px)}.portrait{width:min(82%,365px);margin:8px auto 0}.sun{width:64%;right:7%;top:auto;bottom:13%}.bamboo{top:auto;bottom:0;height:63%;width:44%}.mountains{width:92%;bottom:-6%}.band .shell{font-size:9px;letter-spacing:.09em}.quotes,.about{grid-template-columns:1fr}.quotes{gap:12px}.print span{font-size:11px}.footer-note{letter-spacing:.06em}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.print{transition:none}}
