@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/instrument-sans-400.ttf") format("truetype")}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:500;font-display:optional;src:url("assets/fonts/instrument-sans-500.ttf") format("truetype")}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/instrument-sans-600.ttf") format("truetype")}
/* Pressfreq catalog layout. The accent is sampled from the brand monogram. */
:root{--gallery-ink:#202322;--gallery-muted:#5c625f;--gallery-line:#e3e5e2;--gallery-accent:#0c4c52;--gallery-accent-hover:#083a3f;--gallery-surface:#f6f6f3;--site-width:1260px}
body{background:#fff;color:var(--gallery-ink);font-family:Arial,Helvetica,sans-serif}
::selection{background:#dbe9e7;color:var(--gallery-ink)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline-color:var(--gallery-accent)}
.header{height:78px;padding:0 4%;border-bottom:1px solid var(--gallery-line);max-width:none;margin:0}
.wordmark{font-size:28px;letter-spacing:-1px;font-weight:600}
.brand-dot{color:var(--gallery-accent)}
.header nav{font-size:14px;gap:26px;margin-left:auto;margin-right:42px}
.header-shop{color:var(--gallery-accent);border-color:transparent;font-size:14px}
.hero{display:grid;grid-template-columns:minmax(0,1fr) 320px;align-items:center;gap:80px;min-height:0;max-width:var(--site-width);margin:0 auto;padding:44px 5% 38px}
.hero-copy{padding:0;align-self:center}
.hero h1{font-size:clamp(38px,4.1vw,54px);line-height:1.1;font-weight:400;letter-spacing:-.025em;max-width:16ch}
.hero h1>span,.hero h1>span:last-child{display:inline}
.hero-intro{color:var(--gallery-muted);font-size:17px;line-height:1.5;max-width:36ch;margin:19px 0 23px}
.hero-footnote{color:var(--gallery-muted);font-size:13px;line-height:1.6;max-width:none;margin-top:16px}
.hero-stage{display:flex;align-items:center;justify-content:center;background:transparent;padding:0;min-height:0;overflow:visible}
.hero-stage:before{display:none}
.hero-artwork{width:245px;max-width:100%;transform:none}
.art-frame,.hero-frame,.gallery-frame,.story-print{padding:0;background:transparent;outline:1px solid #2023220a;box-shadow:0 1px 3px #2023220a}
.art-frame:after{display:none}
.hero-frame .art-paper{aspect-ratio:3/4}
.hero-motion{display:flex;width:fit-content;margin:13px auto 0;border-color:var(--gallery-line)!important}
.button{font-size:14px;padding:13px 18px;border-radius:0;gap:24px}
.button-dark,.button-light{background:var(--gallery-accent);color:#fff}
.button-dark:hover,.button-light:hover{background:var(--gallery-accent-hover);transform:none}
.section-shell{max-width:var(--site-width);margin-left:auto;margin-right:auto;padding:45px 5%}
.collection{padding-top:20px;padding-bottom:48px}
.section-heading{margin-bottom:25px;display:flex;align-items:center;justify-content:space-between}
.section-heading h2,.how h2,.story-copy h2,.process h2,.faq h2,.closing h2{font-size:25px;line-height:1.3;letter-spacing:normal;font-weight:400;color:var(--gallery-ink);max-width:none}
.art-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 22px;align-items:start}
.art-card:nth-child(even){padding-top:0}
.art-stage,.tone-slate,.tone-sand,.tone-stone,.tone-clay,.tone-sage,.tone-blue{background:var(--gallery-surface)}
.art-stage{min-height:0;height:300px;aspect-ratio:auto;padding:20px;display:flex;align-items:center;justify-content:center;overflow:clip}
.art-grid .gallery-frame{height:100%;width:100%;max-width:none;display:flex;align-items:center;justify-content:center;outline:none;box-shadow:none;transform:none}
.art-grid .art-paper{height:auto;width:min(100%,170px);max-width:100%;aspect-ratio:auto;outline:1px solid #2023220b;box-shadow:0 1px 3px #20232209}
.art-grid .art-paper img{width:100%;height:auto;object-fit:contain}
.art-card-3 .art-paper{width:min(89%,151px);aspect-ratio:auto}
.art-card-square{grid-column:span 2}
.art-card-square .art-stage{height:360px;min-height:0;aspect-ratio:auto;padding:28px}
.art-card-square .gallery-frame{max-width:none;width:100%;height:100%}
.art-card-square .art-paper{width:min(100%,300px);aspect-ratio:1}
.art-info{display:block;padding-top:14px}
.art-info h3{font-size:17px;line-height:1.4;letter-spacing:0;font-weight:400}
.art-shop{margin-left:0;margin-top:8px;white-space:nowrap;font-size:13px}
.art-shop,.text-link{color:var(--gallery-accent);border-color:#0c4c5270}
.text-link{font-size:14px}
.external-arrow{width:12px;height:12px;flex-basis:12px}
.art-grid .art-card .gallery-frame,.art-grid .art-card .art-stage:hover .gallery-frame{transform:none;transition:none}
.how{max-width:var(--site-width);margin:0 auto;padding:30px 5% 34px;border-top:1px solid var(--gallery-line);border-bottom:1px solid var(--gallery-line);display:grid;grid-template-columns:160px minmax(0,1fr);gap:30px}
.how .section-heading{margin:0;align-self:start}
.how h2{font-size:20px}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.step-number{display:none}
.steps h3{font-size:16px;font-weight:400;line-height:1.4;letter-spacing:0}
.steps p{font-size:14px;line-height:1.6;margin-top:8px;color:var(--gallery-muted)}
.studio-notes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:65px;max-width:var(--site-width);padding:48px 5%;margin:0 auto}
.story{display:block;min-height:0;margin:0;padding:0;max-width:none}
.story-copy{padding:0;align-self:auto}
.story-copy h2{font-size:22px;max-width:22ch}
.story-copy p{font-size:16px;line-height:1.65;max-width:38ch;margin:18px 0 22px;color:var(--gallery-muted)}
.process{display:flex;flex-direction:column;align-items:stretch;gap:22px;padding:0;margin:0;max-width:none}
.process h2{font-size:22px;max-width:none}
.process p{font-size:16px;line-height:1.65;max-width:52ch;margin:13px 0 15px;color:var(--gallery-muted)}
.process-detail{height:265px;width:100%;background:#f4f0e7}
.motion-button{font-size:12px;color:var(--gallery-ink);background:#fffffff0;border-color:#20232225;backdrop-filter:none}
.faq{padding-top:35px;padding-bottom:40px;border-top:1px solid var(--gallery-line);display:grid;grid-template-columns:230px minmax(0,1fr);gap:35px}
.faq h2{font-size:22px}
.faq details{border-color:var(--gallery-line)}
.faq summary{padding:18px 0;font-size:15px;line-height:1.5;font-weight:400}
.faq details p{font-size:15px;line-height:1.65;color:var(--gallery-muted)}
.closing{background:#fff;color:var(--gallery-ink);border-top:1px solid var(--gallery-line);max-width:var(--site-width);padding:28px 5%;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;text-align:left}
.closing h2{font-size:23px}
.button-light{margin:0}
.footer{max-width:none;border-top:1px solid var(--gallery-line);padding:25px 4%;gap:20px}
.footer>span{font-size:13px;color:var(--gallery-muted)}
.footer>div{font-size:14px}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .art-grid .art-card .gallery-frame{transition:transform 300ms cubic-bezier(.2,.65,.3,1)}
 .art-grid .art-card:hover .gallery-frame,.art-grid .art-card:focus-within .gallery-frame,.art-grid .art-card .art-stage:hover .gallery-frame{transform:translateY(-2px) rotate(-1deg)}
 .art-grid .art-card:nth-child(even):hover .gallery-frame,.art-grid .art-card:nth-child(even):focus-within .gallery-frame,.art-grid .art-card:nth-child(even) .art-stage:hover .gallery-frame{transform:translateY(-2px) rotate(1deg)}
}
@media(max-width:900px){
 .hero{grid-template-columns:minmax(0,1fr) 270px;gap:45px;padding-top:35px;padding-bottom:35px}.hero-artwork{width:225px}
 .art-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 25px}.art-stage{height:340px;padding:25px}
 .art-card-square{grid-column:auto}.art-card-square .art-stage{height:340px;padding:25px}
 .how{grid-template-columns:130px minmax(0,1fr);gap:20px}.steps{gap:20px}
 .studio-notes{gap:40px}.faq{grid-template-columns:180px minmax(0,1fr);gap:25px}
}
@media(max-width:760px){
 .header{height:70px;padding:0 6%}.wordmark{font-size:26px}.header nav{display:none}.header-shop{font-size:13px}
 .hero{grid-template-columns:1fr 145px;gap:22px;padding:30px 6%;min-height:0}
 .hero-copy{padding:0}.hero h1{font-size:34px;line-height:1.1;max-width:none;letter-spacing:-.025em}.hero-intro{font-size:15px;line-height:1.5;margin:15px 0 17px;max-width:none}
 .hero .button{font-size:13px;gap:12px;padding:11px 13px}.hero-footnote{font-size:12px;line-height:1.5;margin-top:13px}.hero-stage{padding:0;min-height:0}.hero-artwork{width:145px}.hero-motion{font-size:11px;padding:7px 10px;min-height:34px;margin-top:10px}
 .section-shell{padding:30px 6%}.collection{padding-top:5px;padding-bottom:30px}.section-heading{margin-bottom:20px}.section-heading h2{font-size:23px}
 .art-grid{gap:28px 15px}.art-stage,.art-card-square .art-stage{height:235px;padding:14px}.art-info{display:block;padding-top:11px}.art-info h3{font-size:16px}.art-shop{font-size:13px;margin-top:9px;min-height:0;gap:6px}.art-card-square .art-stage{height:190px}
 .how{display:block;padding:25px 6%}.how .section-heading{margin-bottom:22px}.how h2{font-size:22px}.steps{display:grid;grid-template-columns:1fr;gap:20px}.steps li{display:block}.steps h3{font-size:17px}.steps p{font-size:15px;max-width:44ch;margin-top:6px}
 .studio-notes{grid-template-columns:1fr;gap:35px;padding:35px 6%}.story{margin:0;min-height:0}.story-copy{padding:0}.story-copy h2,.process h2{font-size:23px;max-width:none}.story-copy p,.process p{font-size:16px;max-width:none}.story-copy p{margin:15px 0 18px}.process{padding:0;gap:18px}.process-detail{height:270px}
 .faq{display:block;padding-top:28px;padding-bottom:30px}.faq h2{font-size:23px;margin-bottom:16px}.faq summary{font-size:15px;min-height:58px}.faq details p{font-size:15px}
 .closing{padding:25px 6%;display:flex;flex-wrap:wrap;gap:18px}.closing h2{font-size:23px}.closing .button{font-size:13px;gap:18px;margin:0;padding:12px 16px}
 .footer{padding:24px 6%;display:grid;grid-template-columns:1fr auto;column-gap:12px;row-gap:14px}.footer .wordmark{font-size:25px}.footer>div{grid-column:2;grid-row:1;font-size:14px}.footer>span{grid-column:1/-1;grid-row:2;text-align:left;font-size:13px}
}
@media(max-width:500px){.hero{grid-template-columns:1fr;padding-bottom:25px;gap:22px}.hero h1{font-size:37px;max-width:13ch}.hero-intro{max-width:32ch}.hero-footnote{max-width:33ch}.hero-stage{justify-content:flex-start}.hero-artwork{width:180px}.hero-motion{margin-left:0}.art-stage{height:205px;padding:12px}.art-card-square .art-stage{height:165px;padding:12px}}
@media(max-width:370px){.hero h1{font-size:34px}.header-shop{font-size:12px}.art-grid{gap:24px 12px}.art-stage{height:185px;padding:12px}.art-card-square .art-stage{height:145px;padding:10px}.art-info h3{font-size:15px}.art-shop{font-size:12px}}
/* The hero uses the actual Woven geometry as one full-width drawing surface. */
.hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:490px;max-width:none;margin:0;padding:70px max(5%,calc((100vw - 1134px)/2));overflow:clip;background:#f4f0e7}
.hero-copy{position:relative;z-index:2;width:100%;max-width:570px;padding:0}
.hero h1{font-size:clamp(42px,4.7vw,64px);line-height:1.1;max-width:14ch;color:#172c2d}
.hero-intro{max-width:34ch;color:#364442}
.hero-footnote{max-width:37ch;color:#46534d}
.hero-stage{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;padding:0;min-height:0;pointer-events:none}
.hero-artwork{position:absolute;inset:0;width:100%;height:100%;max-width:none;transform:none}
.hero-frame{position:absolute;inset:0;width:100%;height:100%;padding:0;background:transparent;outline:none;box-shadow:none;opacity:.3}
.hero-frame .art-paper{width:100%;height:100%;aspect-ratio:auto;background:transparent}
.hero-frame .art-paper>img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero-frame .art-paper>svg{width:100%;height:100%}
.hero-motion{position:absolute!important;left:auto!important;right:24px;bottom:22px!important;margin:0!important;transform:none!important;background:#fdfbf5ed!important;border-color:#0c4c5235!important;pointer-events:auto;font-size:12px}
.collection{padding-top:35px}
@media(max-width:760px){.hero{display:flex;min-height:430px;padding:48px 6% 78px}.hero-copy{max-width:460px}.hero h1{font-size:43px;max-width:12ch}.hero-intro{font-size:16px;max-width:29ch}.hero-footnote{font-size:13px;max-width:29ch}.hero-frame{opacity:.24}.hero-motion{right:6%;bottom:18px!important}.collection{padding-top:30px}}
@media(max-width:370px){.hero{min-height:420px}.hero h1{font-size:39px}}
.footer .footer-shop{margin:0;padding:12px 17px;font-size:14px;gap:12px;background:var(--gallery-accent);color:#fff}
.footer .footer-shop:hover{background:var(--gallery-accent-hover)}
.footer .footer-shop:after{display:none}
@media(max-width:760px){.footer .footer-shop{font-size:13px;padding:11px 14px}}
/* Prism draws behind the headline; the Woven print sits in the foreground. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:65px;min-height:440px;padding-top:46px;padding-bottom:54px}
.hero-copy{max-width:560px}
.hero h1{font-size:clamp(38px,4.3vw,58px);max-width:14ch}
.hero-feature{position:relative;z-index:2;width:235px;max-width:100%;margin:0 auto;outline:1px solid #20232210;box-shadow:0 2px 8px #2023220b}
.hero-feature img{width:100%;height:auto}
.hero-frame{opacity:.17}
@media(max-width:900px){.hero{grid-template-columns:minmax(0,1fr) 220px;gap:40px}.hero-feature{width:210px}}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:28px;padding:40px 6% 70px;min-height:0}.hero h1{font-size:40px;max-width:13ch}.hero-feature{width:175px;margin:0}.hero-frame{opacity:.13}}
@media(max-width:370px){.hero h1{font-size:36px}}

/* Keep replay centered beneath the foreground example at every width. */
.hero-feature{outline:none;box-shadow:none}
.hero-feature img{outline:1px solid #20232210;box-shadow:0 2px 8px #2023220b}
.hero-feature .hero-motion{position:static!important;inset:auto!important;display:flex;width:max-content;max-width:100%;margin:14px auto 0!important;transform:none!important}

/* Align the navigation labels and shop link without underline padding. */
.header nav{align-items:center}
.header nav a,.header-shop{display:inline-flex;align-items:center;line-height:1.35;padding:0;border-bottom:0}
/* Final spacing pass: one content grid from header through footer. */
:root{--site-gutter:clamp(24px,5vw,64px);--content-width:1132px}
.section-shell,.studio-notes{padding-left:var(--site-gutter);padding-right:var(--site-gutter)}
.header,.hero,.footer{padding-left:max(var(--site-gutter),calc((100% - var(--content-width))/2));padding-right:max(var(--site-gutter),calc((100% - var(--content-width))/2))}
.header nav{margin-right:32px;gap:28px}
.header nav a,.header-shop{min-height:44px}
.section-heading h2,.how h2,.story-copy h2,.process h2,.faq h2{font-size:24px;line-height:1.3}
.how{grid-template-columns:170px minmax(0,1fr);gap:28px}
.how .section-heading{padding-top:0}
.steps{margin:0;padding:0;list-style:none}
.steps h3{line-height:1.95}
.story-copy p{margin:14px 0 18px}
.process p{margin-top:14px}
.motion-button{min-height:36px}
.faq summary{gap:20px}
.faq summary:after{flex-shrink:0}
.faq details p{max-width:62ch;padding-right:24px}
@media(max-width:1000px) and (min-width:761px){
 .how{grid-template-columns:1fr;gap:20px}
}
@media(max-width:760px){
 :root{--site-gutter:clamp(20px,6vw,28px)}
 .hero{padding-bottom:40px;gap:30px}
 .hero-feature{width:180px}
 .hero-feature .hero-motion{min-height:40px}
 .section-heading h2,.how h2,.story-copy h2,.process h2,.faq h2{font-size:22px}
 .how{padding-top:28px;padding-bottom:28px}
 .how .section-heading{margin-bottom:20px}
 .steps{gap:22px}
 .steps h3{line-height:1.4}
 .steps p{margin-top:7px}
 .studio-notes{padding-top:36px;padding-bottom:36px;gap:36px}
 .story-copy p{margin:14px 0 16px}
 .art-shop:before,.text-link:before{inset:-10px -3px}
 .faq summary{min-height:60px;align-items:center}
 .footer{padding-top:24px;padding-bottom:28px}
}
/* This section is already inside the shared content container. */
.studio-notes .process{padding:0}
@media(min-width:1100px){
 .hero{grid-template-columns:minmax(0,1fr) 360px;min-height:560px}
 .hero-feature{width:clamp(280px,23vw,340px)}
}
@media(max-width:760px){
 .hero-copy{text-align:center;margin-inline:auto}
 .hero h1,.hero-intro,.hero-footnote{margin-left:auto;margin-right:auto}
 .hero h1{max-width:12ch}
 .hero-feature{margin-inline:auto;width:clamp(180px,52vw,230px)}
}

/* An oversized, cropped print gives Woven more presence in the hero. */
.hero-print{width:100%}
@media(min-width:1100px){
 .hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px}
 .hero-feature{width:100%;max-width:520px}
 .hero-print{height:clamp(380px,32vw,440px);overflow:hidden;outline:1px solid #20232210;box-shadow:0 2px 8px #2023220b}
 .hero-feature img{width:100%;height:auto;outline:none;box-shadow:none}
}
.wordmark .brand-dot{color:#a45c3f}
@media(min-width:761px) and (max-width:1099px){
 .hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px}
 .hero-feature{width:100%;max-width:420px}
 .hero-print{height:clamp(280px,36vw,380px);overflow:hidden;outline:1px solid #20232210;box-shadow:0 2px 8px #2023220b}
 .hero-feature img{outline:none;box-shadow:none}
}
/* Anchor navigation underlines to the text, independently of hit-area height. */
.header nav a:after{display:none}
.header nav a:hover,.header nav a:focus-visible{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.art-shop,.text-link{padding-bottom:2px}
/* Show the complete square Woven print at every breakpoint. */
.hero .hero-print{height:auto;aspect-ratio:1;overflow:visible}

.art-stage:focus-visible{outline:2px solid var(--gallery-accent);outline-offset:4px}
.internal-arrow{width:14px;height:14px;flex:0 0 14px}

/* One restrained type family for the interface; preserve the established mark. */
body{font-family:"Instrument Sans",Arial,Helvetica,sans-serif}
.wordmark{font-family:Arial,Helvetica,sans-serif}
.hero h1{font-weight:500;letter-spacing:-.035em}
.section-heading h2,.how h2,.story-copy h2,.process h2,.faq h2{font-weight:500;letter-spacing:-.015em}
.art-info h3,.steps h3{font-weight:500}

.footer-legal{padding:0 max(var(--site-gutter),calc((100% - var(--content-width))/2)) 24px;font-size:12px;color:var(--gallery-muted)}
.footer-legal a{text-decoration:underline;text-underline-offset:3px}
.privacy-page{max-width:var(--site-width);margin:0 auto;padding:56px var(--site-gutter) 64px;min-height:60vh}
.privacy-copy{max-width:68ch}
.privacy-page h1{font-size:36px;font-weight:500;letter-spacing:-.025em;margin-bottom:12px}
.privacy-page h2{font-size:21px;letter-spacing:normal;font-weight:500;margin:28px 0 10px}
.privacy-page p{margin:12px 0;font-size:16px;color:var(--gallery-muted)}
.privacy-page a{color:var(--gallery-accent);text-decoration:underline;text-underline-offset:3px}
.privacy-page .privacy-date{font-size:13px}
@media(max-width:760px){.privacy-page{padding-top:36px;padding-bottom:40px}.privacy-page h1{font-size:30px}}
/* Small depth cues keep the foreground print distinct from the Prism backdrop. */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .hero-print{transition:transform 350ms cubic-bezier(.2,.65,.3,1);transform-origin:center}
 .hero-feature:hover .hero-print{transform:translateY(-3px) rotate(-1.2deg)}
}
@media(prefers-reduced-motion:no-preference){
 .hero-frame{transform:translate3d(0,var(--hero-scroll-y,0px),0) rotate(var(--hero-scroll-rotation,0deg)) scale(1.1);transform-origin:50% 50%}
}

.footer .footer-actions{display:flex;align-items:center;gap:22px}
.footer .footer-privacy{position:relative;font-size:12px;line-height:1.4;color:var(--gallery-muted);text-decoration:underline;text-underline-offset:3px}
.footer .footer-privacy:after{display:none}
@media(max-width:500px){
 .footer .footer-actions{grid-column:1/-1;grid-row:3;justify-content:space-between;margin-top:6px}
}

/* Keep the headline geometry stable before and after fonts are available. */
.hero h1>span,.hero h1>span:last-child{display:block;white-space:nowrap}
