:root{--black:#090909;--ink:#121212;--cream:#eee9df;--paper:#f7f3eb;--muted:#9b978e;--line:#2a2a2a;--darkline:#d2cbc0;--max:1200px;--pad:clamp(24px,5vw,72px);font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:#fff;line-height:1.45}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.site-header{height:62px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--pad);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;background:rgba(9,9,9,.96);backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;width:190px;height:40px}.brand img{display:block;width:100%;height:auto;max-height:34px;object-fit:contain;object-position:left center}.desktop-nav{display:flex;gap:28px;font-size:10px;font-weight:800;letter-spacing:.18em}.desktop-nav a:hover,.legal-links a:hover{opacity:.65}.header-btn{justify-self:end;border:1px solid #777;padding:8px 13px;font-size:10px;font-weight:800;letter-spacing:.13em}.menu-btn{display:none}.mobile-menu{display:none}.mobile-menu[hidden]{display:none!important}.section,.hero{padding:clamp(70px,9vw,120px) var(--pad)}.section-dark{background:var(--black)}.section-cream{background:var(--cream);color:var(--ink)}.hero{min-height:calc(100vh - 62px);display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:7vw;border-bottom:1px solid var(--line)}.hero-copy{max-width:520px}.eyebrow{font-size:10px;letter-spacing:.22em;font-weight:800;color:#a5a099;margin:0 0 16px;text-transform:uppercase}.section-cream .eyebrow{color:#6b675f}.hero h1,h2{font-size:clamp(36px,4.6vw,64px);letter-spacing:-.06em;line-height:.96;margin:0 0 22px;font-weight:900}.hero .lede{color:#b9b5ad;max-width:470px;font-size:14px;margin-bottom:30px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border:1px solid #777;background:transparent;color:#fff;padding:0 16px;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;transition:transform .18s ease,background .18s ease,color .18s ease}.button:hover{transform:translateY(-1px);background:#fff;color:#000}.button.primary{background:#fff;color:#000;border-color:#fff}.button.primary:hover{background:#e8e3db}.button.ghost{background:transparent;color:#fff}.section-cream .button{color:#000;border-color:#555}.section-cream .button.primary{background:#000;color:#fff;border-color:#000}.section-cream .button.primary:hover{background:#222}.full{width:100%}.hero-art{min-width:0}.hero-art img{width:100%;display:block;max-height:610px;object-fit:contain;object-position:center;box-shadow:0 18px 60px rgba(0,0,0,.4);background:var(--black)}.section-intro{margin-bottom:45px}.split{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.section-intro h2,.template-copy h2,.customise h2,.process h2,.order-heading h2,.legal-section h2{font-size:clamp(28px,3.3vw,46px);margin-bottom:12px}.section-intro>p,.customise-intro>p,.order-heading>p,.template-copy>p{color:#a5a19a;max-width:520px;margin:12px 0 0;font-size:13px}.example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.example-card{margin:0;display:flex;flex-direction:column}.example-card img{width:100%;height:auto;aspect-ratio:auto;display:block;object-fit:contain;object-position:center;background:var(--black)}.example-card figcaption{font-size:9px;letter-spacing:.14em;font-weight:800;color:#b7b1a7;padding-top:10px}.template-section{display:grid;grid-template-columns:1fr .82fr;gap:10vw;align-items:center}.template-points{border-top:1px solid var(--darkline);margin-top:28px}.template-points div{padding:12px 0;border-bottom:1px solid var(--darkline);font-size:10px;letter-spacing:.08em;font-weight:800}.template-points strong{margin-right:7px}.template-image-link{display:block;max-width:370px;justify-self:center}.template-image-link img{width:100%;display:block;box-shadow:0 14px 48px rgba(0,0,0,.12)}.customise-intro{display:grid;grid-template-columns:1fr 1fr;gap:8vw;margin-bottom:48px}.customise-layout{display:grid;grid-template-columns:340px 1fr;gap:9vw;align-items:start}.customise-template{width:100%;max-width:340px;display:block}.customise-text{max-width:700px}.rule-item{display:grid;grid-template-columns:45px 1fr;gap:15px;border-top:1px solid var(--line);padding:17px 0}.rule-item span{font-size:10px;color:#9f9b92;letter-spacing:.1em}.rule-item p{margin:0;font-size:12px;color:#c3c0b9}.micro{border-top:1px solid var(--line);padding-top:17px;color:#77736c;font-size:10px;margin-bottom:28px}.process-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.process-grid>div{padding:25px 22px 35px;border-right:1px solid var(--line)}.process-grid>div:last-child{border-right:0}.process-grid span{font-size:10px;color:#8e8a82}.process-grid h3{font-size:13px;margin:30px 0 8px}.process-grid p{font-size:12px;color:#9c9991;max-width:280px;margin:0}.order-section{padding-top:95px}.order-heading{max-width:780px;margin-bottom:42px}.order-shell{max-width:1050px;background:#f6f1e9;border:1px solid #d5cec2}.stepper{display:grid;grid-template-columns:repeat(6,1fr);border-bottom:1px solid #d5cec2}.step{border:0;background:transparent;border-right:1px solid #d5cec2;padding:16px 10px;text-align:left;font-size:9px;letter-spacing:.1em;font-weight:800;color:#68635c}.step:last-child{border-right:0}.step span{display:block;font-size:9px;margin-bottom:7px;color:#9b958b}.step.active{background:#111;color:#fff}.step.active span{color:#c2bdb3}.order-step{display:none;padding:36px}.order-step.active{display:block}.order-step h3{font-size:25px;letter-spacing:-.03em;margin:0 0 24px}.field-grid.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.order-step label{display:block;font-size:9px;letter-spacing:.12em;font-weight:800;color:#615c54;margin-bottom:18px}.order-step input,.order-step select,.order-step textarea{display:block;width:100%;margin-top:8px;border:1px solid #cfc7bb;background:#fbf8f2;padding:14px;font-size:14px;letter-spacing:0;color:#181716;outline:none}.order-step input:focus,.order-step select:focus,.order-step textarea:focus{border-color:#111;box-shadow:0 0 0 2px rgba(0,0,0,.06)}.helper{font-size:11px;color:#79746c;max-width:650px}.swatches{display:flex;gap:16px;flex-wrap:wrap}.swatch{border:1px solid transparent;background:transparent;padding:7px 4px;color:#26231f;font-size:9px;letter-spacing:.12em;font-weight:800;text-align:center}.swatch span{display:block;width:66px;height:66px;border-radius:50%;background:var(--swatch);border:1px solid #bbb2a6;margin-bottom:8px}.swatch.selected{border-color:#111}.conditional.hidden{display:none}.checks{margin-top:20px}.check{display:flex!important;align-items:flex-start;gap:10px;text-transform:none!important;letter-spacing:0!important;font-size:11px!important;font-weight:400!important;color:#5f5a53!important}.check input{width:auto!important;margin-top:1px!important}.review{border-top:1px solid #cfc7bb}.review-row{display:grid;grid-template-columns:190px 1fr;padding:14px 0;border-bottom:1px solid #cfc7bb;font-size:11px}.review-row span{color:#817a71}.review-row strong{font-weight:800}.total-row{display:flex;justify-content:space-between;align-items:center;margin:25px 0;font-size:11px;letter-spacing:.1em;font-weight:800}.total-row strong{font-size:20px;letter-spacing:0}.payment-note{font-size:10px;color:#777168;margin-bottom:16px}.order-actions{display:flex;justify-content:space-between;border-top:1px solid #d5cec2;padding:18px 24px;background:#eee7dc}.order-actions #prev-step{visibility:hidden}.legal-section{display:grid;grid-template-columns:1fr auto;gap:10vw;align-items:end}.legal-section h2{font-size:30px}.legal-section p{color:#9c9891;font-size:12px;margin:0}.legal-links{display:flex;gap:20px;align-items:center;font-size:9px;font-weight:800;letter-spacing:.12em}.text-btn{background:none;border:0;color:#fff;font-size:9px;font-weight:800;letter-spacing:.12em;padding:0}.disclaimer{grid-column:1/-1;border-top:1px solid var(--line);padding-top:18px;color:#77736c!important;font-size:10px!important}.modal{width:min(90vw,720px);border:0;padding:0;background:transparent}.modal::backdrop{background:rgba(0,0,0,.82)}.modal img{width:100%;display:block}.modal-close{position:absolute;top:-42px;right:0;border:0;background:none;color:#fff;font-size:30px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:#111;color:#fff;padding:11px 16px;border:1px solid #444;font-size:11px;opacity:0;pointer-events:none;transition:all .2s ease;z-index:100}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:1100px){.site-header{grid-template-columns:1fr auto;height:58px}.desktop-nav,.header-btn{display:none}.menu-btn{display:inline-flex;align-items:center;justify-content:center;background:#0b0b0b;border:1px solid #777;color:#fff;min-width:74px;height:34px;padding:0 14px;font-size:10px;font-weight:800;letter-spacing:.14em}.mobile-menu{position:fixed;top:58px;right:0;left:0;background:#0b0b0b;z-index:100;border-bottom:1px solid #2b2b2b;padding:10px var(--pad);box-shadow:0 10px 25px rgba(0,0,0,.35)}.mobile-menu:not([hidden]){display:block}.mobile-menu a{display:block;padding:14px 0;font-size:10px;font-weight:800;letter-spacing:.15em;border-bottom:1px solid #2b2b2b}.hero{grid-template-columns:1fr;min-height:auto;gap:40px}.hero-art{order:-1}.hero-copy{max-width:none}.split,.customise-intro,.template-section{grid-template-columns:1fr}.example-grid{grid-template-columns:1fr 1fr}.customise-layout{grid-template-columns:1fr;gap:40px}.process-grid{grid-template-columns:1fr}.process-grid>div{border-right:0;border-bottom:1px solid var(--line)}.process-grid>div:last-child{border-bottom:0}.stepper{grid-template-columns:repeat(3,1fr)}.step:nth-child(3){border-right:0}.step:nth-child(4),.step:nth-child(5),.step:nth-child(6){border-top:1px solid #d5cec2}.field-grid.two{grid-template-columns:1fr}.legal-section{grid-template-columns:1fr}.legal-links{flex-wrap:wrap}}
@media(max-width:560px){.section,.hero{padding:55px 20px}.example-grid{grid-template-columns:1fr}.section-intro h2,.template-copy h2,.customise h2,.process h2,.order-heading h2{font-size:31px}.hero h1{font-size:43px}.hero .lede{font-size:13px}.stepper{grid-template-columns:repeat(2,1fr)}.order-step{padding:26px 18px}.swatches{gap:8px}.swatch span{width:58px;height:58px}.review-row{grid-template-columns:1fr;gap:4px}.order-actions{padding:14px}.button{min-height:40px}.legal-links{gap:14px}}

.shipping-box{border-top:1px solid #d1c8bc;border-bottom:1px solid #d1c8bc;padding:22px 0 10px;margin:28px 0}.shipping-box h4{font-size:14px;letter-spacing:.06em;margin:0 0 8px}.shipping-helper{font-size:11px;color:#777168;max-width:620px;margin:0 0 22px}.shipping-result{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-top:1px solid #e0d8cc;margin-top:8px;font-size:10px;font-weight:800;letter-spacing:.1em}.shipping-result strong{font-size:16px;letter-spacing:0}.totals-box{margin-top:20px;border-top:1px solid #cfc7bb}.cost-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid #cfc7bb;font-size:10px;letter-spacing:.1em;font-weight:800}.cost-row strong{font-size:13px;letter-spacing:0}

.contact-section{padding-bottom:80px}.contact-card{display:flex;justify-content:space-between;align-items:center;gap:32px;border-top:1px solid #d2cbc0;border-bottom:1px solid #d2cbc0;padding:28px 0}.contact-email{font-size:clamp(24px,3vw,38px);font-weight:900;letter-spacing:-.05em;color:var(--ink)}.contact-email:hover{opacity:.65}.contact-card .eyebrow{margin-bottom:8px}@media(max-width:700px){.contact-card{align-items:flex-start;flex-direction:column}.contact-email{font-size:25px}}

.legal-page{padding-top:clamp(70px,8vw,110px)}.legal-copy{max-width:820px}.legal-copy h1{font-size:clamp(42px,6vw,72px);letter-spacing:-.06em;line-height:.95;margin:0 0 24px}.legal-copy h2{font-size:clamp(22px,2.3vw,30px);margin:46px 0 12px;letter-spacing:-.04em}.legal-copy p{max-width:760px;font-size:14px;color:#3f3b35}.legal-copy .lead-legal{color:#777168;font-size:11px;text-transform:uppercase;letter-spacing:.16em;font-weight:800}.legal-copy .legal-note{margin-top:50px;padding-top:20px;border-top:1px solid #d2cbc0;color:#777168;font-size:11px}.legal-copy a{color:inherit}

.format-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:24px 0 18px}.format-card{min-height:150px;border:1px solid #d2c9bc;background:#fbf8f2;color:#181716;text-align:left;padding:20px;display:flex;flex-direction:column;justify-content:space-between;gap:16px;transition:border-color .18s ease,background .18s ease,transform .18s ease}.format-card:hover{transform:translateY(-1px);border-color:#8d867c}.format-card.selected{border-color:#111;background:#111;color:#fff}.format-card .format-name{font-size:10px;letter-spacing:.14em;font-weight:900}.format-card strong{font-size:24px;letter-spacing:-.04em}.format-card .format-meta{font-size:10px;line-height:1.45;color:#777168}.format-card.selected .format-meta{color:#bdb8af}.frame-type-note{font-size:11px;color:#777168;padding:12px 14px;border:1px solid #d2c9bc;background:#fbf8f2;max-width:580px;margin-bottom:22px}.fulfillment-box{margin:28px 0 0;padding:22px 0 4px;border-top:1px solid #d1c8bc}.fulfillment-box h4{font-size:14px;letter-spacing:.06em;margin:0 0 16px}.fulfillment-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fulfillment-card{min-height:86px;border:1px solid #d2c9bc;background:#fbf8f2;color:#181716;text-align:left;padding:18px;display:flex;flex-direction:column;justify-content:center;gap:7px}.fulfillment-card strong{font-size:10px;letter-spacing:.12em}.fulfillment-card span{font-size:10px;color:#777168}.fulfillment-card.selected{border-color:#111;background:#111;color:#fff}.fulfillment-card.selected span{color:#c2bdb3}.digital-delivery-note{margin-top:28px;padding:20px 0;border-top:1px solid #d1c8bc;border-bottom:1px solid #d1c8bc}.digital-delivery-note strong{display:block;font-size:13px;max-width:650px}.stepper.no-frame{grid-template-columns:repeat(6,1fr)}[hidden]{display:none!important}
@media(max-width:900px){.format-grid{grid-template-columns:1fr 1fr}.stepper{grid-template-columns:repeat(4,1fr)}.stepper.no-frame{grid-template-columns:repeat(3,1fr)}.fulfillment-grid{grid-template-columns:1fr}}
@media(max-width:560px){.format-grid{grid-template-columns:1fr}.format-card{min-height:125px}.stepper,.stepper.no-frame{grid-template-columns:repeat(2,1fr)}.fulfillment-card{min-height:76px}}

/* THE GARAGE */
.garage-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.garage-description{max-width:520px;color:#a5a19a;font-size:13px}
.garage-description p{margin:0 0 16px}
.garage-feature{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start;margin-top:48px}
.garage-card{margin:0;min-width:0}
.garage-card img{width:100%;aspect-ratio:3/4;display:block;object-fit:contain;object-position:center;background:#050505}
.garage-card figcaption{display:flex;justify-content:space-between;gap:15px;padding-top:10px;color:#b7b1a7;font-size:9px;letter-spacing:.12em;font-weight:800}
.garage-pricing{margin-top:72px;border-top:1px solid var(--line);padding-top:42px}
.garage-pricing-head{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:end;margin-bottom:30px}
.garage-pricing-head h3,.garage-template-copy h3{font-size:clamp(27px,3.2vw,44px);line-height:.98;letter-spacing:-.05em;margin:0}
.garage-pricing-head>p{color:#a5a19a;font-size:13px;max-width:520px;margin:0}
.garage-pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.garage-price-card{background:#0d0d0d;padding:24px 20px 26px;min-height:145px;display:flex;flex-direction:column;justify-content:space-between}
.garage-price-card.selected{background:#f7f3eb;color:#121212}
.garage-price-card span{font-size:9px;letter-spacing:.15em;font-weight:800}
.garage-price-card strong{font-size:27px;letter-spacing:-.04em}
.garage-price-card p{font-size:10px;color:#9d9991;margin:0}
.garage-price-card.selected p{color:#6b675f}
.garage-pricing-note{color:#77736c;font-size:10px;margin:14px 0 0}
.garage-template{display:grid;grid-template-columns:.8fr 1fr;gap:9vw;align-items:center;margin-top:78px;padding-top:60px;border-top:1px solid var(--line)}
.garage-template-image{max-width:360px}
.garage-template-image img{width:100%;display:block}
.garage-template-copy{max-width:650px}
.garage-template-copy>p:not(.eyebrow){color:#a5a19a;font-size:13px;max-width:520px}
.garage-points{border-top:1px solid var(--line);margin:28px 0}
.garage-points div{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);font-size:10px;font-weight:800;letter-spacing:.08em}
.garage-points span{color:#8e8a82}
@media (max-width:900px){
  .garage-feature{grid-template-columns:repeat(3,minmax(0,1fr))}
  .garage-template{grid-template-columns:1fr}
  .garage-side{grid-template-columns:1fr 1fr}
  .garage-pricing-grid{grid-template-columns:repeat(2,1fr)}
  .garage-pricing-head{grid-template-columns:1fr;gap:24px}
  .garage-template-image{max-width:320px;justify-self:center}
}
@media (max-width:650px){
  .garage-feature{grid-template-columns:1fr}
  .garage-side{grid-template-columns:1fr}
  .garage-pricing-grid{grid-template-columns:1fr}
  .garage-card figcaption{display:block}
  .garage-card figcaption span{display:block;margin-bottom:4px}
}

/* THE GARAGE ORDER FLOW */
.garage-order { background: #f1eee7; color: #111; }
.garage-order .order-heading { max-width: 900px; }
.garage-order .order-shell { max-width: 1180px; margin: 0 auto; }
.garage-order h2, .garage-order h3 { color: #111; }
.garage-order .field-grid { display:grid; gap:14px; }
.garage-order .field-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.garage-order label { display:grid; gap:8px; font-size:.72rem; letter-spacing:.08em; font-weight:700; }
.garage-order input, .garage-order select, .garage-order textarea { width:100%; box-sizing:border-box; border:1px solid rgba(17,17,17,.2); background:#fff; color:#111; padding:14px 15px; font:inherit; letter-spacing:0; font-weight:400; }
.garage-order textarea { resize:vertical; }
.garage-order .garage-format-grid, .garage-order .garage-fulfillment-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.garage-order .garage-fulfillment-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.garage-format, .garage-fulfillment { border:1px solid rgba(17,17,17,.2); background:transparent; color:#111; padding:20px; text-align:left; cursor:pointer; display:grid; gap:8px; }
.garage-format.selected, .garage-fulfillment.selected { background:#111; color:#fff; border-color:#111; }
.garage-format strong { font-size:1.25rem; }
.garage-format .format-meta, .garage-fulfillment span { font-size:.78rem; line-height:1.5; opacity:.72; }
.garage-format.selected .format-meta, .garage-fulfillment.selected span { opacity:.8; }
.garage-form-section { padding:28px 0; border-top:1px solid rgba(17,17,17,.14); }
.garage-form-section:first-child { border-top:0; }
.garage-form-section > h3 { margin-bottom:8px; }
.garage-form-section > p { max-width:760px; margin-bottom:20px; color:rgba(17,17,17,.68); }
.garage-spec-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.garage-order .garage-form-section > p strong{font-weight:900;color:#111}
.garage-spec-note{font-size:.78rem!important;color:rgba(17,17,17,.62)!important;margin-top:-8px!important}

.garage-upload { border:1px dashed rgba(17,17,17,.3); padding:22px; background:rgba(255,255,255,.5); }
.garage-upload input { border:0; padding:0; background:transparent; }
#photo-list { margin-top:10px; font-size:.78rem; color:rgba(17,17,17,.62); line-height:1.5; }
.garage-total-box { margin-top:28px; border-top:1px solid rgba(17,17,17,.2); padding-top:20px; }
.garage-cost-row, .garage-total-row { display:flex; justify-content:space-between; gap:20px; padding:7px 0; }
.garage-total-row { font-size:1.25rem; border-top:1px solid rgba(17,17,17,.15); margin-top:8px; padding-top:15px; }
.garage-checks { display:grid; gap:12px; margin-top:22px; }
.garage-check { display:flex !important; grid-template-columns:none !important; align-items:flex-start; gap:10px; letter-spacing:0 !important; font-size:.82rem !important; font-weight:400 !important; }
.garage-check input { width:auto; margin-top:3px; }
.garage-order .button.full { width:100%; justify-content:center; margin-top:24px; }
.garage-note { font-size:.76rem; line-height:1.55; color:rgba(17,17,17,.62); margin-top:12px; }
#garage-toast { position:fixed; left:50%; bottom:24px; transform:translate(-50%,20px); background:#111; color:#fff; padding:13px 18px; z-index:1000; opacity:0; pointer-events:none; transition:.2s ease; max-width:min(90vw,600px); font-size:.82rem; }
#garage-toast.show { opacity:1; transform:translate(-50%,0); }
@media (max-width: 1100px){
  .garage-order .garage-format-grid, .garage-spec-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px){
  .garage-order .field-grid.two, .garage-order .garage-format-grid, .garage-order .garage-fulfillment-grid, .garage-spec-grid { grid-template-columns:1fr; }
}
