@font-face{font-family:Cormorant;src:url('./assets/fonts/cormorant-garamond-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Cormorant;src:url('./assets/fonts/cormorant-garamond-latin-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:Work Sans;src:url('./assets/fonts/work-sans-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Work Sans;src:url('./assets/fonts/work-sans-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}
:root{
  color-scheme:light;
  --paper:#f6f2ea;--paper-deep:#eee8dd;--paper-white:#fffcf5;
  --ink:#332b25;--muted:#71655a;--accent:#96452f;--accent-wordmark:#904530;
  --line:oklch(0.38 .04 45 / .20);--header:oklch(.964 .012 80 / .94);
  --contact:#91462f;--contact-ink:#fff7ed;--image-opacity:.75;
  --font-display:Cormorant,Georgia,serif;--font-body:'Work Sans',Arial,sans-serif;
  --text-xs:clamp(.75rem,.72rem + .12vw,.8125rem);
  --text-sm:clamp(.875rem,.84rem + .12vw,.9375rem);
  --text-base:clamp(1rem,.94rem + .22vw,1.125rem);
  --text-title:clamp(2rem,1.5rem + 1.5vw,3rem);
  --text-hero:clamp(3.75rem,1.35rem + 5.8vw,7rem);
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;
  --space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;
  --space-20:5rem;--space-24:6rem;--space-32:8rem;
  --gutter:clamp(var(--space-6),5vw,var(--space-20));--radius-full:50%;
  --ease:cubic-bezier(.16,1,.3,1);--transition:220ms var(--ease);
}
[data-theme=dark]{
  color-scheme:dark;--paper:#27221e;--paper-deep:#302921;--paper-white:#3b3027;
  --ink:#f0e7db;--muted:#c0afa0;--accent:#dda18a;--accent-wordmark:#dda18a;
  --line:oklch(.9 .025 65 / .20);--header:oklch(.27 .016 60 / .94);
  --contact:#683522;--image-opacity:.78;
}
body{font-family:var(--font-body);font-size:var(--text-base);font-weight:400;line-height:1.6;background:var(--paper);color:var(--ink)}
body::after{content:"";position:fixed;inset:0;z-index:40;pointer-events:none;background:url('./assets/images/paper-grain.webp') repeat;opacity:.025;mix-blend-mode:multiply}
.wrap{width:min(1440px,100%);padding-inline:var(--gutter);margin-inline:auto}
.reading-progress{position:fixed;left:0;right:0;top:0;height:2px;z-index:80;background:var(--accent);transform:scaleX(0);transform-origin:left;pointer-events:none}
.site-header{position:sticky;top:0;z-index:50;background:var(--header);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.header-inner{height:100px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.brand{display:flex;align-items:center;gap:var(--space-3);flex-shrink:0}
.brand-mark{width:46px}
.brand-wordmark{width:196px}
.desktop-nav{display:flex;gap:clamp(var(--space-5),2.7vw,var(--space-10));font-size:var(--text-xs)}
.desktop-nav a{padding-block:var(--space-3);position:relative}
.desktop-nav a::after{content:"";position:absolute;bottom:4px;left:0;width:100%;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--transition)}
.desktop-nav a:hover::after,.desktop-nav a:focus-visible::after{transform:scaleX(1)}
.desktop-nav a[aria-current]{color:var(--accent)}
.header-actions{display:flex;align-items:center;gap:var(--space-2)}
.icon-button{display:grid;place-items:center;width:44px;height:44px;font-size:var(--text-base);border:0;background:transparent;border-radius:var(--radius-full);transition:background var(--transition),color var(--transition),transform var(--transition)}
.icon-button:hover{background:var(--paper-deep)}
.icon-button:active{transform:scale(.94)}
.theme-toggle{font-size:1.35rem}
.motion-toggle{font-family:var(--font-body);font-size:1rem;color:var(--accent);border:1px solid var(--line)}
.motion-toggle[aria-pressed=true]{background:var(--paper-deep)}
.theme-toggle span{font-family:Arial,sans-serif;font-size:24px;line-height:1}
.contact-shortcut{border:1px solid var(--line);color:var(--accent);font-size:1.5rem}
.hero{position:relative;display:grid;grid-template-columns:1.13fr 1fr;gap:var(--space-8);min-height:730px;padding-top:var(--space-20);padding-bottom:var(--space-24);align-items:center}
.eyebrow{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.little-rule{width:28px;height:1px;background:var(--accent)}
h1{font-family:var(--font-display);font-size:var(--text-hero);font-weight:400;line-height:.95;letter-spacing:-.045em;margin-top:var(--space-8)}
.local-word{position:relative;color:var(--accent);font-style:italic;letter-spacing:-.055em;display:inline-block;padding-right:var(--space-3)}
.word-rule{position:absolute;bottom:-.08em;left:0;right:0;border-bottom:1px solid var(--accent);transform:rotate(-3deg)}
.hero-description{color:var(--muted);font-size:var(--text-sm);line-height:1.8;margin-top:var(--space-10)}
.mail-button{display:inline-flex;align-items:center;gap:var(--space-8);margin-top:var(--space-8);padding:var(--space-4) var(--space-6);font-size:var(--text-sm);border:1px solid var(--accent);background:var(--accent);color:var(--paper);transition:background var(--transition),transform var(--transition)}
.mail-button:hover{background:var(--accent-wordmark);transform:translateY(-2px)}
.mail-button:active{transform:translateY(0)}
.arrow{font-size:1.3rem;line-height:1}
.hero-art{position:relative;width:100%;max-width:535px;justify-self:end;margin-top:var(--space-6)}
.press-sheet{aspect-ratio:1.2;position:relative;background:#fff;padding:var(--space-8);transform:rotate(2deg)}
.press-machine{position:absolute;left:2%;top:49%;width:96%;transform:translateY(calc(-50% + var(--photo-shift,0px))) rotate(var(--photo-turn,-2deg)) scale(var(--photo-scale,1));will-change:transform}
.xerox-photo{position:relative;z-index:2;width:100%;height:auto;object-fit:contain}
.paper-feed{position:absolute;z-index:3;left:85%;top:4%;width:13%;aspect-ratio:.72;background:#fffdf8;padding:3px;opacity:0;box-shadow:0 8px 12px #2e221b25;transform-origin:left bottom;pointer-events:none}
.paper-feed img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
[data-motion=on] .paper-feed{animation:print-sheet 5.5s cubic-bezier(.4,0,.2,1) infinite}
.contact-machine .paper-feed{animation-delay:-2.5s}
@keyframes print-sheet{0%,8%{opacity:0;transform:translate(-15%,30%) rotate(18deg) scale(.6)}18%{opacity:1}70%,86%{opacity:1;transform:translate(48%,-48%) rotate(23deg) scale(.95)}100%{opacity:0;transform:translate(58%,-68%) rotate(25deg) scale(.95)}}
.plate-bottom{position:absolute;left:var(--space-8);right:var(--space-8);bottom:var(--space-6);display:flex;justify-content:space-between;gap:var(--space-4);font-size:var(--text-xs);color:#71655a}
.plate-bottom span:last-child{padding-right:var(--space-16)}
.registration{position:absolute;width:14px;height:14px;opacity:.55;color:var(--accent)}
.registration::before,.registration::after{content:"";position:absolute;background:currentColor}
.registration::before{top:6px;left:0;width:14px;height:1px}.registration::after{top:0;left:6px;width:1px;height:14px}
.top-left{left:14px;top:14px}.top-right{right:14px;top:14px}.bottom-left{left:14px;bottom:14px}.bottom-right{right:14px;bottom:14px}
.hero-seal{position:absolute;bottom:-28px;right:-20px;width:112px;background:var(--paper);border-radius:50%;padding:var(--space-2);transform:rotate(var(--seal-turn,-12deg))}
.scroll-cue{position:absolute;bottom:var(--space-6);left:var(--gutter);width:44px;height:44px;display:grid;place-items:center;color:var(--accent);font-size:1.5rem}
.scroll-cue span{transition:transform var(--transition)}.scroll-cue:hover span{transform:translateY(4px)}
[data-motion=on] .scroll-cue span{animation:scroll-invitation 2s ease-in-out infinite}
@keyframes scroll-invitation{0%,100%{transform:translateY(-4px)}50%{transform:translateY(8px)}}
.service-index{display:grid;grid-template-columns:1fr 1fr 1.25fr}
.service-index a{display:flex;align-items:center;gap:var(--space-5);padding:var(--space-6) var(--space-6);border-block:1px solid var(--line);font-size:var(--text-sm);transition:background var(--transition),color var(--transition)}
.service-index a:first-child{padding-left:0}
.service-index a:last-child{padding-right:0}
.service-index a+a{border-left:1px solid var(--line)}
.index-number{font-size:var(--text-xs);color:var(--accent);font-variant-numeric:tabular-nums}
.index-arrow{margin-left:auto;font-size:1.3rem;transition:transform var(--transition)}
.service-index a:hover{color:var(--accent);background:var(--paper-deep)}.service-index a:hover .index-arrow{transform:translate(3px,3px)}
.service-index a:active{background:var(--paper-deep)}
.services{padding-block:var(--space-16) var(--space-20)}
.service{display:grid;grid-template-columns:1fr 1fr;gap:clamp(var(--space-10),9vw,var(--space-32));align-items:center;padding-block:var(--space-10)}
.service-copy{padding-block:var(--space-8)}
.section-number{color:var(--accent);letter-spacing:0;margin-right:var(--space-2)}
.service h2{font-family:var(--font-display);font-size:var(--text-title);font-weight:400;line-height:1.08;letter-spacing:-.025em;margin-top:var(--space-6)}
.service-copy>p:not(.eyebrow){margin-top:var(--space-5);color:var(--muted);font-size:var(--text-base)}
.secondary-copy{font-size:var(--text-sm)}
.service-mail{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);max-width:320px;padding-block:var(--space-4);margin-top:var(--space-8);border-bottom:1px solid var(--line);color:var(--accent);font-size:var(--text-xs);transition:border-color var(--transition)}
.service-mail:hover{border-color:var(--accent)}.service-mail span:last-child{font-size:1.3rem;transition:transform var(--transition)}.service-mail:hover span:last-child{transform:translate(3px,-3px)}
.service-visual{height:410px;position:relative;overflow:hidden;background:var(--paper-deep);isolation:isolate}
.personal-visual{background:#e9dfd1}.student-visual{background:#e7e3d9}.business-visual{background:#e8ddd1}
.visual-folio{position:absolute;z-index:10;bottom:var(--space-5);left:var(--space-6);right:var(--space-6);display:flex;justify-content:space-between;align-items:center;border-top:1px solid #806e5729;padding-top:var(--space-3);color:#5b4a3e;font-size:var(--text-xs)}
.gallery-item{position:absolute;display:block;padding:0;border:0;background:transparent;cursor:zoom-in;transform:translate3d(var(--card-x,0px),var(--card-y,0px),0) rotate(var(--card-turn,0deg));will-change:transform}
.thumbnail-inner{display:block;position:relative;transition:transform 350ms var(--ease);filter:drop-shadow(0 12px 12px #53392125)}
.thumbnail-inner>img{display:block;width:100%;height:auto;max-height:300px;object-fit:contain}
.gallery-item:hover,.gallery-item:focus-visible{z-index:5}
.gallery-item:hover .thumbnail-inner,.gallery-item:focus-visible .thumbnail-inner{transform:scale(1.065)}
.gallery-item:active .thumbnail-inner{transform:scale(.99)}
.zoom-mark{display:grid;place-items:center;position:absolute;right:-10px;bottom:-10px;width:32px;height:32px;border-radius:50%;background:var(--paper-white);color:var(--accent);border:1px solid var(--line);font-size:23px;line-height:1;box-shadow:0 3px 10px #30221817}
.sample-condoleances{left:8%;top:14%;width:40%;--card-turn:-8deg}
.sample-merci{right:8%;top:22%;width:40%;--card-turn:7deg}
.sample-reliures{left:15%;top:9%;width:70%;--card-turn:-3deg}
.binding-label{position:absolute;color:#904530;font-family:var(--font-body);font-size:clamp(12px,1.05vw,15px);font-weight:500;line-height:1.35;text-align:center;pointer-events:none}
.binding-spiral{left:25%;top:21%;width:32%;transform:rotate(-11deg)}
.binding-folded{left:43%;top:54%;width:35%;transform:rotate(7deg)}
.sample-echo{left:7%;top:15%;width:26%;--card-turn:-8deg}
.sample-loto{left:37%;top:12%;width:26%;z-index:2}
.sample-agaunoise{right:7%;top:15%;width:26%;--card-turn:8deg}
.image-viewer{position:fixed;inset:0;margin:auto;width:min(1100px,calc(100% - 48px));max-height:calc(100dvh - 32px);padding:24px;background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:0 30px 100px #0006}
.image-viewer::backdrop{background:#18120fe0;backdrop-filter:blur(7px)}
.image-viewer[open]{animation:viewer-in 250ms var(--ease)}
@keyframes viewer-in{from{opacity:0}to{opacity:1}}
.viewer-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:var(--text-xs);color:var(--muted)}
.viewer-close{font-size:30px;border:1px solid var(--line)}
.viewer-stage{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:24px}
.viewer-stage figure{margin:0;min-width:0;text-align:center}
.viewer-art{display:inline-block;position:relative;max-width:100%;vertical-align:middle}
.viewer-art .binding-label{font-size:clamp(12px,1.75vw,24px)}
.viewer-image{display:block;margin:auto;max-width:100%;width:auto;height:min(65dvh,650px);object-fit:contain}
.viewer-caption{font-size:var(--text-sm);padding:20px 0 8px}
.viewer-prev,.viewer-next{border:1px solid var(--line);color:var(--accent)}
body.viewer-open{overflow:hidden}
.contact-section{overflow:hidden;background:var(--contact);color:var(--contact-ink);position:relative}
.contact-inner{min-height:430px;display:grid;grid-template-columns:.75fr 1.25fr;gap:var(--space-16);align-items:center;padding-block:var(--space-16)}
.contact-art{position:relative;max-width:380px;justify-self:center;width:100%;padding:24px;background:#fff;border:1px solid #fff6e928}
.contact-machine{position:relative;transform:translateY(var(--contact-shift,0px)) rotate(var(--contact-turn,0deg));will-change:transform}
.contact-copy .eyebrow{opacity:.8;font-size:var(--text-xs)}
.contact-copy h2{font-family:var(--font-display);font-size:var(--text-title);font-weight:400;line-height:1.2;margin-top:var(--space-5)}
.contact-email{display:flex;align-items:center;gap:var(--space-6);font-family:var(--font-display);font-size:clamp(1.5rem,1rem + 1.6vw,2.75rem);line-height:1.2;letter-spacing:-.015em;padding-block:var(--space-6);border-bottom:1px solid #fff5e750;transition:color var(--transition)}
.contact-email span:last-child{margin-left:auto;transition:transform var(--transition)}
.contact-email:hover{color:#eac5ac}.contact-email:hover span:last-child{transform:translate(4px,-4px)}
.contact-details{display:flex;justify-content:space-between;gap:var(--space-8);margin-top:var(--space-6);font-size:var(--text-sm)}
.contact-details a{display:flex;gap:var(--space-5);align-items:flex-start;min-height:44px;padding-top:var(--space-2)}
.contact-details a:hover{text-decoration:underline;text-underline-offset:5px}
.site-footer{min-height:150px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-8)}
.site-footer>img{width:220px}.site-footer p{font-size:var(--text-xs);color:var(--muted)}
.back-top{border:1px solid var(--line);color:var(--accent);font-size:1.4rem}
[data-theme=dark] .brand img,[data-theme=dark] .hero-seal,[data-theme=dark] .site-footer>img{filter:brightness(0) saturate(100%) invert(77%) sepia(17%) saturate(677%) hue-rotate(328deg) brightness(94%)}
[data-theme=dark] .hero-seal{background:transparent}
[data-theme=dark] .service-visual{filter:brightness(.82)}
.reveal{opacity:1;clip-path:inset(0);transition:opacity 650ms ease-out,clip-path 850ms var(--ease)}
[data-motion=on] .reveal.pending{opacity:0;clip-path:inset(0 0 100% 0)}
.reveal.visible{opacity:1;clip-path:inset(0)}
[data-motion=off] .paper-feed{animation:none;opacity:0}
[data-motion=off] .scroll-cue span{animation:none}
[data-motion=off] .gallery-item{will-change:auto}
@media(min-width:1600px){.hero{min-height:820px}.hero-art{max-width:555px}}
@media(max-width:1100px){
  .desktop-nav{gap:var(--space-4)}.brand-wordmark{width:170px}.brand-mark{width:40px}
  .hero{min-height:690px;gap:var(--space-5)}.hero-art{max-width:450px}
  .service{gap:var(--space-12)}.contact-inner{gap:var(--space-10)}
}
@media(max-width:900px){
  .desktop-nav{display:none}.header-inner{height:86px}
  .hero{padding-top:var(--space-16);padding-bottom:var(--space-20);min-height:620px}
  .hero-description br{display:none}.hero-description{max-width:30ch}
  .hero-seal{width:88px;right:-12px}.press-sheet{padding:var(--space-4)}
  .plate-bottom{left:var(--space-5);right:var(--space-5)}
  .service-index a{padding:var(--space-5) var(--space-4);gap:var(--space-3)}.index-number{display:none}
  .services{padding-block:var(--space-10) var(--space-16)}
  .service-visual{height:320px}.service{gap:var(--space-8)}
  .contact-inner{grid-template-columns:.55fr 1.45fr;gap:var(--space-8)}
  .contact-art{padding:12px}.contact-email{font-size:1.7rem}
}
@media(max-width:640px){
  html{scroll-padding-top:100px}
  .header-inner{height:80px;gap:12px}.brand{gap:var(--space-2)}.brand-wordmark{width:136px}.brand-mark{width:30px}
  .header-actions{gap:0}.icon-button{width:44px;height:44px}.theme-toggle,.motion-toggle{width:36px;height:36px}
  .hero{grid-template-columns:1fr;gap:var(--space-12);padding-top:var(--space-12);padding-bottom:var(--space-20);min-height:0}
  .hero h1{font-size:clamp(3.6rem,11vw + .9rem,5.5rem);margin-top:var(--space-6);line-height:.97}
  .hero-description{margin-top:var(--space-8);max-width:35ch}
  .mail-button{margin-top:var(--space-6);padding:var(--space-4) var(--space-5);gap:var(--space-5)}
  .hero-art{width:88%;max-width:370px;justify-self:center;margin-top:0}
  .press-sheet{aspect-ratio:1.2}.press-machine{width:94%;left:3%;top:47%}.hero-seal{width:78px;bottom:-24px;right:-14px}
  .plate-bottom{bottom:var(--space-4);font-size:var(--text-xs)}
  .scroll-cue{bottom:var(--space-4);left:calc(50% - 22px)}
  .service-index{grid-template-columns:1fr}
  .service-index a{padding:var(--space-4) 0;gap:var(--space-5);border-top:0}
  .service-index a:first-child{border-top:1px solid var(--line)}
  .service-index a+a{border-left:0}.index-number{display:block}
  .service{grid-template-columns:1fr;gap:0;padding-block:var(--space-8)}
  .services{padding-top:var(--space-8);padding-bottom:var(--space-12)}
  .service-copy{padding:var(--space-8) 0 var(--space-4)}
  .service-student .service-copy{order:2}.service-student .service-visual{order:1}
  .service h2{font-size:2.5rem}.service-visual{height:330px}
  .service-mail{margin-top:var(--space-5);max-width:none}
  .service-copy .eyebrow{font-size:var(--text-xs);letter-spacing:.11em}
  .contact-inner{display:block;min-height:0;padding-block:var(--space-16);position:relative}
  .contact-art{position:relative;width:290px;max-width:100%;margin:0 auto 40px;padding:12px}
  .contact-copy{position:relative;z-index:2}
  .contact-copy .eyebrow{font-size:var(--text-xs);letter-spacing:.06em}
  .contact-copy h2{font-size:2.5rem;margin-top:var(--space-6)}
  .contact-email{font-size:clamp(1.55rem,6.7vw,2.15rem);gap:var(--space-3);padding-block:var(--space-6)}
  .contact-email span:first-child{overflow-wrap:anywhere}
  .contact-details{gap:var(--space-4);flex-wrap:wrap;font-size:var(--text-sm)}
  .site-footer{display:grid;grid-template-columns:1fr auto;padding-block:var(--space-8);gap:var(--space-6)}
  .site-footer>img{width:180px}.site-footer p{grid-column:1;grid-row:2;font-size:var(--text-xs)}
  .back-top{grid-column:2;grid-row:1 / 3}
  .sample-condoleances{top:17%;width:39%}.sample-merci{top:24%;width:39%}
  .sample-reliures{width:78%;left:11%;top:8%}
  .sample-echo,.sample-agaunoise{top:22%}.sample-loto{top:17%}
  .image-viewer{width:calc(100% - 20px);padding:14px;max-height:calc(100dvh - 20px)}
  .viewer-stage{grid-template-columns:36px minmax(0,1fr) 36px;gap:4px}
  .viewer-stage .icon-button{width:36px;height:44px}
  .viewer-image{width:100%;height:auto;max-height:62dvh}
  .viewer-caption{font-size:13px}
}
@media(max-width:340px){
  .header-inner{gap:6px}.brand-wordmark{width:116px}.brand-mark{display:none}
  .theme-toggle,.motion-toggle{width:34px;height:34px}
  .plate-bottom span:last-child{display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{transition:none}.image-viewer[open]{animation:none}.thumbnail-inner{transition:none}}