.skip-link { position: fixed; z-index: 10000; top: .75rem; left: .75rem; padding: .7rem .9rem; border: 2px solid currentColor; background: #f3eee4; color: #080807; font-weight: 600; text-decoration: none; transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
:root{--paper:#f2eddf;--ink:#171713;--muted:#6f6b60;--line:rgb(23 23 19/18%);--gold:#9b6c22}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}button,a{color:inherit;font:inherit}a{text-decoration:none}button{cursor:pointer}:focus-visible{outline:2px solid currentColor;outline-offset:4px}.shell{width:min(100% - 3rem,1440px);margin-inline:auto}
.site-header{position:sticky;z-index:100;top:0;display:flex;align-items:center;justify-content:space-between;padding-block:1.35rem;border-bottom:1px solid var(--line);background:rgb(242 237 223/88%);box-shadow:0 .75rem 2rem rgb(23 23 19/8%);backdrop-filter:blur(14px)}.brand{display:inline-flex;align-items:center;gap:.75rem}.brand img{width:2.15rem;aspect-ratio:1;padding:.18rem;border:1px solid var(--gold);background:#111;object-fit:contain}.brand span{font-size:.73rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}.back{padding-bottom:.25rem;border-bottom:1px solid var(--gold);color:var(--muted);font-size:.65rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase}
.hero{display:grid;grid-template-columns:1.3fr .7fr;gap:4rem;align-items:end;padding-block:clamp(4.5rem,9vw,8rem) clamp(3.5rem,7vw,6.5rem)}.kicker{margin:0 0 1rem;color:var(--gold);font:500 .65rem "DM Sans",sans-serif;letter-spacing:.18em;text-transform:uppercase}h1{max-width:880px;margin:0;font:400 clamp(4.3rem,10.5vw,10rem)/.76 Italiana,serif;letter-spacing:-.055em}h1 em{color:var(--gold);font-weight:400}.hero-note{max-width:31rem;padding-top:1.5rem;border-top:1px solid var(--line)}.hero-note p{margin:0;color:var(--muted);font-size:.93rem;line-height:1.75}.hero-note strong{color:var(--ink);font-weight:500}
.gallery-intro{display:flex;align-items:baseline;justify-content:space-between;gap:2rem;padding-block:1.2rem;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}.gallery-intro p{margin:0;font:500 .68rem "DM Sans",sans-serif;letter-spacing:.13em;text-transform:uppercase}.gallery-intro span{color:var(--muted)}.specimens{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));padding-bottom:5rem}.card{position:relative;grid-column:span 6;min-height:34rem;overflow:hidden;padding:clamp(1.5rem,3vw,2.6rem);border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between}.card:nth-child(even){border-right:0}.card:after{position:absolute;right:1.25rem;bottom:.9rem;content:attr(data-number);font:500 .6rem "DM Sans",sans-serif;opacity:.48}.card-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:1rem}.font-name{font:500 .64rem "DM Sans",sans-serif;letter-spacing:.13em;text-transform:uppercase}.tags{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.35rem}.tags span{padding:.3rem .5rem;border:1px solid currentColor;border-radius:999px;font-size:.52rem;font-weight:600;letter-spacing:.08em;opacity:.68;text-transform:uppercase}.phrase{position:relative;z-index:1;margin:3rem 0;font-size:clamp(3.7rem,7.2vw,7.8rem);letter-spacing:-.065em;line-height:.8}.phrase span{display:block}.prompt-row{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:end;border-top:1px solid currentColor;padding-top:1rem}.prompt{max-width:39rem;margin:0;font-size:.77rem;line-height:1.55;opacity:.78}.copy{min-width:4.5rem;padding:.55rem .65rem;border:1px solid currentColor;background:transparent;font:500 .56rem "DM Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase;transition:background .16s,color .16s}.copy:hover{background:currentColor;color:var(--hover,#fff)}
.amalurra{background:#0f3633;color:#f8f3e9}.amalurra .phrase{font-family:Italiana,serif;font-size:clamp(3.25rem,5.75vw,6.5rem);font-weight:400;letter-spacing:-.035em;line-height:.9}.amalurra .phrase span+span{color:#cbe9ef;font-style:italic}.amalurra .prompt-row{border-color:#a27035}.studio{background:#090908;color:#f3eee4}.studio .phrase{font-family:"DM Sans",sans-serif;font-weight:300;letter-spacing:-.075em}.studio .phrase span+span{color:#d2ae72}.studio .prompt-row{border-color:#d2ae72}
.prata{grid-column:span 7;background:#641f2c;color:#f5ead9}.prata .phrase{font-family:Prata,serif;font-size:clamp(3.3rem,6.2vw,7rem);letter-spacing:-.045em}.prata .phrase span+span{color:#e8b660}.gilda{grid-column:span 5;background:#d9dfcf;color:#244039;--hover:#d9dfcf}.gilda .phrase{font-family:"Gilda Display",serif;font-size:clamp(3.2rem,5.8vw,6.5rem);letter-spacing:-.04em}.gilda .phrase span+span{color:#9a593c}
.marcellus{grid-column:span 5;background:#d8d1c2;color:#172c45;--hover:#d8d1c2}.marcellus .phrase{font-family:Marcellus,serif;font-size:clamp(3.1rem,5.6vw,6.2rem);letter-spacing:-.035em;text-transform:uppercase}.marcellus .phrase span+span{color:#885c39}.cormorant{grid-column:span 7;background:#243c35;color:#e8e1cd}.cormorant .phrase{font-family:"Cormorant Garamond",serif;font-weight:600}.cormorant .phrase span+span{color:#d6b3d3;font-style:italic}
.bodoni{background:#1b1a18;color:#f4ead7}.bodoni .phrase{font-family:"Bodoni Moda",serif;font-weight:600}.bodoni .phrase span+span{color:#d4a54e;font-style:italic}.instrument{background:#3155bc;color:#f5f0dc}.instrument .phrase{font-family:"Instrument Sans",sans-serif;font-weight:600;letter-spacing:-.075em}.instrument .phrase span+span{color:#d9f27a}
.manrope{grid-column:span 5;background:#f4f1e9;color:#111;--hover:#f4f1e9}.manrope .phrase{font-family:Manrope,sans-serif;font-weight:700}.manrope .phrase span+span{color:#2458d3}.jakarta{grid-column:span 7;background:#c65f43;color:#281b17;--hover:#c65f43}.jakarta .phrase{font-family:"Plus Jakarta Sans",sans-serif;font-size:clamp(3.2rem,6.1vw,6.9rem);font-weight:700;letter-spacing:-.075em}.jakarta .phrase span+span{color:#fff0cb}
.guide{display:grid;grid-template-columns:.7fr 1.3fr;gap:4rem;padding-block:clamp(4rem,8vw,7rem);border-top:1px solid var(--ink)}.guide h2{margin:0;font:400 clamp(2.8rem,5vw,5.6rem)/.92 Italiana,serif;letter-spacing:-.04em}.guide-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.guide-step{padding-top:1rem;border-top:1px solid var(--line)}.guide-step span{color:var(--gold);font:500 .62rem "DM Sans",sans-serif}.guide-step h3{margin:1.5rem 0 .55rem;font-size:.88rem}.guide-step p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.6}footer{display:flex;justify-content:space-between;gap:2rem;padding-block:1.25rem 1.6rem;border-top:1px solid var(--line);color:var(--muted);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase}footer p{margin:0}
@media(max-width:920px){.hero{grid-template-columns:1fr;gap:3rem}.card,.prata,.gilda,.marcellus,.cormorant,.manrope,.jakarta{grid-column:span 12;border-right:0}.guide{grid-template-columns:1fr;gap:2.5rem}}@media(max-width:620px){.shell{width:min(100% - 1.5rem,1440px)}.brand span{display:none}.hero{padding-block:4rem 3rem}h1{font-size:clamp(4rem,22vw,6.5rem)}.gallery-intro{align-items:flex-start;flex-direction:column;gap:.45rem}.card{min-height:30rem;padding:1.35rem}.phrase{font-size:clamp(3.5rem,18vw,5.7rem)}.amalurra .phrase,.prata .phrase,.gilda .phrase,.marcellus .phrase,.jakarta .phrase{font-size:clamp(3rem,14.5vw,4.8rem)}.prompt-row{grid-template-columns:1fr}.copy{justify-self:start}.guide-steps{grid-template-columns:1fr}footer{align-items:flex-start;flex-direction:column;gap:.4rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.copy{transition:none}}
