:root { --ink:#291722; --paper:#fffaf6; --rosewater:#f2dfe5; --lacquer:#a92e5c; --plum:#5a214a; --chrome:#b9c9c9; --line:rgba(41,23,34,.18); --shadow:0 22px 60px rgba(71,31,55,.16); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 86% 8%,rgba(185,201,201,.34),transparent 24rem),var(--paper); font-family:"Trebuchet MS","Segoe UI",sans-serif; line-height:1.6; }
a { color:inherit; }
.skip-link { position:fixed; left:1rem; top:-4rem; z-index:20; background:var(--ink); color:#fff; padding:.7rem 1rem; }
.skip-link:focus { top:1rem; }
.site-header { width:min(1180px,calc(100% - 40px)); margin:0 auto; min-height:92px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.wordmark { display:inline-flex; gap:.6rem; align-items:center; text-decoration:none; font:700 1rem/1 "Arial Narrow","Segoe UI",sans-serif; letter-spacing:-.02em; text-transform:uppercase; }
.wordmark i { color:var(--lacquer); font-family:Georgia,serif; font-weight:400; text-transform:none; }
.wordmark-star { color:var(--lacquer); font-size:1.2rem; }
nav { display:flex; gap:2rem; }
nav a { text-decoration:none; font-size:.82rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
nav a:hover, nav a:focus-visible { color:var(--lacquer); }
.hero { width:min(1180px,calc(100% - 40px)); min-height:calc(100vh - 92px); margin:0 auto; padding:5.6rem 0 6rem; display:grid; grid-template-columns:1.14fr .86fr; gap:5rem; align-items:center; }
.eyebrow,.section-label,.board-label,.farewell-kicker { margin:0 0 1.4rem; font:700 .76rem/1.2 "Arial Narrow","Segoe UI",sans-serif; letter-spacing:.18em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:1.8rem; font-family:"Arial Black","Arial Narrow",sans-serif; font-size:clamp(4rem,7.7vw,7.5rem); line-height:.81; letter-spacing:-.095em; text-transform:uppercase; }
h1 span { display:inline-block; color:var(--lacquer); font-family:Georgia,serif; font-style:italic; font-weight:400; letter-spacing:-.07em; text-transform:none; transform:translateX(.04em); }
.intro { max-width:660px; font-size:1.12rem; }
.status-card { max-width:650px; margin:2rem 0; padding:1.1rem 1.2rem; display:flex; gap:1rem; background:#fff; border:1px solid var(--line); border-left:4px solid var(--lacquer); box-shadow:0 10px 30px rgba(71,31,55,.08); }
.status-card p { margin:.15rem 0 0; font-size:.92rem; }
.status-dot { flex:0 0 auto; width:10px; height:10px; margin-top:.42rem; border-radius:50%; background:var(--lacquer); box-shadow:0 0 0 5px var(--rosewater); }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem; }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:50px; padding:.78rem 1.2rem; border:1px solid var(--ink); text-decoration:none; font-size:.85rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; transition:transform .2s ease,background .2s ease,color .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--ink); color:#fff; }
.button-primary:hover { background:var(--lacquer); border-color:var(--lacquer); }
.button-secondary:hover { background:var(--ink); color:#fff; }
.text-link { font-size:.88rem; font-weight:700; text-underline-offset:.3em; }
.polish-board { position:relative; padding:2rem 2rem 2.4rem; background:rgba(255,255,255,.7); border:1px solid rgba(41,23,34,.12); box-shadow:var(--shadow); transform:rotate(1.5deg); }
.polish-board::before { content:""; position:absolute; inset:10px; border:1px dashed rgba(41,23,34,.13); pointer-events:none; }
.board-label { position:relative; }
.swatches { position:relative; display:grid; grid-template-columns:repeat(5,1fr); gap:.9rem; align-items:start; padding:1rem .2rem 1.5rem; }
.swatch { display:block; aspect-ratio:.52; border-radius:48% 48% 42% 42% / 32% 32% 67% 67%; border:2px solid rgba(255,255,255,.75); box-shadow:inset .42rem .3rem .55rem rgba(255,255,255,.36),0 8px 14px rgba(41,23,34,.2); transform-origin:50% 100%; }
.swatch:nth-child(even) { transform:translateY(1.7rem) rotate(3deg); }
.swatch:nth-child(3n) { transform:translateY(.4rem) rotate(-4deg); }
.swatch-1{background:#9d264e}.swatch-2{background:#e3a3b4}.swatch-3{background:#4c152e}.swatch-4{background:#d75278}.swatch-5{background:#cad5ce}.swatch-6{background:#7e3b66}.swatch-7{background:#f0c7cd}.swatch-8{background:#b95d4c}.swatch-9{background:#d9d7df}.swatch-10{background:#af7b9b}
.board-note { position:relative; max-width:24ch; margin:1.5rem 0 0 auto; font-family:Georgia,serif; font-size:1.05rem; font-style:italic; line-height:1.35; }
.section { width:min(1180px,calc(100% - 40px)); margin:0 auto; padding:8rem 0; }
.story { border-top:1px solid var(--line); }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:7rem; }
h2 { max-width:14ch; font:700 clamp(2.4rem,4.7vw,4.8rem)/.98 "Arial Narrow","Segoe UI",sans-serif; letter-spacing:-.055em; }
.story-copy { max-width:590px; font-size:1.05rem; }
blockquote { position:relative; margin:3rem 0 .6rem; padding:1.5rem 0 1.5rem 2rem; border-left:4px solid var(--lacquer); color:var(--plum); font:italic 1.8rem/1.25 Georgia,serif; }
.quote-note { color:#725d6a; font-size:.8rem; }
.craft { width:100%; max-width:none; padding-left:max(20px,calc((100% - 1180px)/2)); padding-right:max(20px,calc((100% - 1180px)/2)); background:var(--ink); color:#fff; }
.craft .section-label { color:#e8b5c5; }
.craft-head { display:flex; justify-content:space-between; gap:2rem; align-items:end; margin-bottom:3rem; }
.craft-head h2,.craft-head p { margin-bottom:0; }
.craft-head p { max-width:28ch; color:#d1c5cc; }
.craft-list { border-top:1px solid rgba(255,255,255,.22); }
.craft-list article { display:grid; grid-template-columns:90px 1fr; gap:1.4rem; padding:2rem 0; border-bottom:1px solid rgba(255,255,255,.22); }
.craft-mark { color:#e8b5c5; font:italic 2.4rem Georgia,serif; }
.craft-list h3 { margin:0 0 .3rem; font:700 1.4rem "Arial Narrow","Segoe UI",sans-serif; text-transform:uppercase; letter-spacing:.02em; }
.craft-list p { margin:0; color:#d1c5cc; }
.farewell { text-align:center; }
.farewell-kicker { color:var(--lacquer); }
.farewell-date { display:grid; grid-template-columns:.7fr .7fr 1.6fr; margin:0; font:900 clamp(3.2rem,10vw,8.5rem)/1 "Arial Black",sans-serif; letter-spacing:-.08em; }
.farewell-date span { padding:.5rem; border:1px solid var(--line); }
.farewell-copy { max-width:640px; margin:2.2rem auto 0; font:italic 1.3rem/1.45 Georgia,serif; }
.contact { display:grid; grid-template-columns:.9fr 1.1fr; gap:6rem; border-top:1px solid var(--line); }
.contact>div>p { max-width:46ch; }
.contact-card { padding:2rem; background:var(--rosewater); font-style:normal; box-shadow:var(--shadow); }
.contact-card div { display:grid; grid-template-columns:.8fr 1.2fr; gap:1rem; padding:1rem 0; border-bottom:1px solid rgba(41,23,34,.18); }
.contact-card span { font-size:.73rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.contact-card p { margin:0; }
.contact-card .button { margin-top:1.8rem; width:100%; }
footer { padding:3rem max(20px,calc((100% - 1180px)/2)); display:grid; grid-template-columns:.8fr 1fr 1.2fr; gap:2rem; align-items:start; background:#eadde3; border-top:1px solid var(--line); font-size:.78rem; }
footer p { margin:0; }
.legal-note { color:#705e68; }
:focus-visible { outline:3px solid #e2457d; outline-offset:3px; }
@media (max-width:880px) { nav{display:none}.hero{min-height:auto;grid-template-columns:1fr;gap:4rem;padding-top:4rem}.polish-board{max-width:560px;transform:rotate(.7deg)}.story-grid,.contact{grid-template-columns:1fr;gap:3rem}.craft-head{align-items:start;flex-direction:column}footer{grid-template-columns:1fr} }
@media (max-width:560px) { .site-header{min-height:72px}.hero,.section{width:min(100% - 28px,1180px)}.hero{padding:3.5rem 0 4.5rem}h1{font-size:clamp(3.5rem,18vw,5.1rem)}.swatches{gap:.45rem}.polish-board{padding:1.35rem}.board-note{font-size:.9rem}.section{padding:5.5rem 0}.craft{width:100%;padding-left:14px;padding-right:14px}.craft-list article{grid-template-columns:56px 1fr}.farewell-date{font-size:clamp(2.6rem,15vw,5rem)}.contact-card{padding:1.35rem}.contact-card div{grid-template-columns:1fr;gap:.35rem}.hero-actions .button{width:100%} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important} }