.atelier { --paper:#f2eee5; --ink:#343c2f; --line:#d2cfc3; margin:0; background:var(--paper); color:var(--ink); font:16px/1.65 'Instrument Sans',Arial,sans-serif; -webkit-font-smoothing:antialiased; }
.atelier *, .atelier *::before, .atelier *::after { box-sizing:border-box; }
.atelier a { color:inherit; text-decoration:none; }
.atelier a:hover { text-decoration:underline; text-underline-offset:5px; }
.atelier :focus-visible { outline:3px solid #896149; outline-offset:5px; }
.atelier h1,.atelier h2,.atelier h3,.atelier p,.atelier figure { margin:0; }
.atelier h1,.atelier h2 { font-family:Georgia,serif; font-weight:400; line-height:1.04; letter-spacing:-.055em; }
.atelier h1 { font-size:clamp(54px,7.5vw,112px); }
.atelier h2 { font-size:clamp(36px,4.7vw,68px); }
.atelier h3 { font-size:24px; font-weight:400; line-height:1.3; letter-spacing:-.03em; }
.atelier main { overflow-wrap:anywhere; }
.atelier-container { width:min(calc(100% - 112px),1360px); margin-inline:auto; }
.atelier-skip { position:absolute; top:-100px; left:20px; padding:12px 20px; background:white; z-index:30; }
.atelier-skip:focus { top:14px; }
.atelier-demo { display:flex; justify-content:center; gap:12px 30px; flex-wrap:wrap; padding:10px 22px; background:#343c2f; color:#f2eee5; font-size:11px; }
.atelier-demo a { text-decoration:underline; text-underline-offset:3px; }
.atelier-header { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:30px; border-bottom:1px solid var(--line); }
.atelier-wordmark { font-size:30px; font-weight:600; letter-spacing:-.08em; }
.atelier-wordmark span { vertical-align:super; font-size:11px; margin-left:4px; }
.atelier-header nav { display:flex; flex-wrap:wrap; gap:12px 32px; font-size:13px; }
.atelier-kicker { font-size:11px; text-transform:uppercase; letter-spacing:.15em; }
.atelier-hero { padding-top:64px; }
.atelier-hero-heading { display:grid; grid-template-columns:1fr 280px; gap:24px 50px; align-items:end; padding-bottom:45px; }
.atelier-hero-heading .atelier-kicker { grid-column:1/-1; }
.atelier-hero-heading h1 { max-width:950px; }
.atelier-hero-note { display:grid; gap:24px; padding-bottom:8px; font-size:13px; color:#686d60; }
.atelier-hero-note > span { font-size:60px; line-height:1; color:var(--ink); }
.atelier-hero-image img { display:block; width:100%; height:clamp(340px,45vw,650px); object-fit:cover; }
.atelier-hero-image figcaption { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-top:15px; font-size:11px; }
.atelier-section { padding-block:100px; border-bottom:1px solid var(--line); }
.atelier-intro-grid { display:grid; grid-template-columns:1fr 2fr; gap:70px; }
.atelier-intro-grid > div > p { margin-top:28px; max-width:650px; color:#686d60; font-size:17px; }
.atelier-text-link { display:inline-block; padding-block:12px; font-size:13px; }
.atelier-intro-grid .atelier-text-link { margin-top:20px; }
.atelier-section-top { display:flex; align-items:end; justify-content:space-between; gap:36px; margin-bottom:46px; }
.atelier-section-top h2 { margin-top:24px; }
.atelier-project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:42px; }
.atelier-project-card:nth-child(even) { padding-top:95px; }
.atelier-card-image { overflow:hidden; }
.atelier-card-image img { display:block; width:100%; aspect-ratio:1.15; height:auto; object-fit:cover; transition:transform .35s; }
.atelier-project-card a:hover img { transform:scale(1.025); }
.atelier-card-caption { display:flex; justify-content:space-between; gap:20px; padding-top:22px; }
.atelier-card-caption > span { font-size:28px; }
.atelier-card-caption p { margin-top:5px; font-size:12px; color:#686d60; }
.atelier-services { padding-block:100px; background:#e4e0d4; }
.atelier-services h2 { margin-block:24px 55px; }
.atelier-service-list a { display:grid; grid-template-columns:50px 1fr 35px; align-items:center; gap:25px; padding-block:26px; border-top:1px solid #b9beb0; }
.atelier-service-list a:last-child { border-bottom:1px solid #b9beb0; }
.atelier-service-list a > span:first-child { font-size:11px; }
.atelier-service-list a > span:last-child { font-size:27px; }
.atelier-service-list h3 { font-size:clamp(26px,3vw,40px); }
.atelier-footer { background:#343c2f; color:var(--paper); padding-top:85px; }
.atelier-footer h2 { margin-top:24px; }
.atelier-footer > div > p:not(.atelier-kicker) { max-width:500px; margin-top:26px; color:#ced0c4; font-size:14px; }
.atelier-button { display:inline-flex; align-items:center; gap:30px; border:1px solid currentColor; border-radius:30px; padding:14px 24px; margin-top:28px; font:inherit; font-size:13px; color:inherit; background:transparent; cursor:pointer; }
.atelier-button:hover { background:#535d49; color:#fff; text-decoration:none!important; }
.atelier-footer-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:75px; padding-block:25px; border-top:1px solid #69725f; font-size:11px; }
.atelier-collection,.atelier-detail { padding-block:70px 100px; }
.atelier-collection > h1 { margin-top:24px; max-width:960px; }
.atelier-collection-intro { max-width:600px; margin-block:32px 65px!important; color:#686d60; }
.atelier-service-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; }
.atelier-service-cards article { padding-top:25px; border-top:1px solid var(--line); }
.atelier-service-cards h2 { font-size:36px; }
.atelier-service-cards p { margin-block:24px; font-size:14px; color:#686d60; }
.atelier-detail > h1 { margin-block:30px 60px; max-width:1000px; }
.atelier-prose { max-width:850px; margin-block:45px; }
.atelier-prose h2 { font-size:clamp(28px,3vw,44px); margin-bottom:24px; }
.atelier-prose p { white-space:pre-line; color:#5d6455; font-size:17px; }
.atelier-detail-image { margin-block:48px!important; }
.atelier-detail-image img { display:block; width:100%; height:auto; max-height:850px; object-fit:cover; }
.atelier-detail-image figcaption { margin-top:14px; font-size:12px; color:#686d60; }
.atelier-preview { padding:20px; border:1px solid var(--line); margin-bottom:20px; }
.atelier-demo-entry { max-width:780px; margin:9vh auto; padding:25px; }
.atelier-demo-entry h1 { margin-block:30px; }
.atelier-demo-entry > p:not(.atelier-kicker) { max-width:580px; }
.atelier-demo-entry .atelier-text-link { margin-top:24px; }
@media(max-width:850px) { .atelier-container { width:calc(100% - 48px); } .atelier-hero-heading { grid-template-columns:1fr; } .atelier-hero-note { grid-template-columns:50px 1fr; align-items:center; max-width:500px; } .atelier-hero-note > span { font-size:40px; } .atelier-intro-grid { grid-template-columns:1fr; gap:25px; } .atelier-service-cards { grid-template-columns:1fr; } }
@media(max-width:560px) { .atelier-header { flex-wrap:wrap; padding-block:24px; gap:18px; } .atelier-header nav { gap:25px; } .atelier-wordmark { font-size:29px; } .atelier-demo { justify-content:start; gap:5px 18px; font-size:10px; } .atelier-demo > span { width:100%; } .atelier-hero { padding-top:40px; } .atelier-hero-heading { gap:22px; padding-bottom:30px; } .atelier-section,.atelier-services { padding-block:60px; } .atelier-project-grid { grid-template-columns:1fr; gap:40px; } .atelier-project-card:nth-child(even) { padding-top:0; } .atelier-section-top { display:block; } .atelier-section-top > a { margin-top:22px; } .atelier-collection,.atelier-detail { padding-block:45px 65px; } .atelier-service-list a { grid-template-columns:24px 1fr 25px; gap:16px; } .atelier-footer { padding-top:60px; } }
@media(prefers-reduced-motion:reduce) { .atelier * { transition:none!important; } }