:root{--paper:#F8F4EC;--ink:#1A1815;--soft:#6B665C;--sea:#0F6E6A;--rule:#E1DACB}
*{box-sizing:border-box}
html{font-size:18px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Fraunces",Georgia,serif;font-variation-settings:"opsz" 14,"SOFT" 50;line-height:1.55}
a{color:var(--sea);text-decoration:none;border-bottom:2px solid rgba(15,110,106,.35)}
a:hover{border-bottom-color:var(--sea)}
a:focus-visible{outline:2px solid var(--sea);outline-offset:4px}
.wrap{max-width:40rem;margin:0 auto;padding:0 1.5rem}
/* wordmark */
.mark{display:inline-block;font-weight:900;font-size:clamp(4.5rem,14vw,8.5rem);line-height:.9;letter-spacing:-.04em;color:var(--ink);border:0;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1}
.mark span{color:var(--sea)}
.tag{margin:.9rem 0 0;color:var(--soft);font-size:1rem}
header.site{padding:4.5rem 0 3rem}
main{padding:0 0 3rem}
h1{font-size:clamp(1.7rem,4.2vw,2.35rem);line-height:1.2;font-weight:600;margin:0 0 1.25rem;letter-spacing:-.015em;font-variation-settings:"opsz" 72,"SOFT" 60}
p{margin:0 0 1.15rem;max-width:62ch;font-size:1.05rem}
.about{padding:1.5rem 0 2.5rem;border-top:1px solid var(--rule)}
.contact{padding:2.25rem 0 0;border-top:1px solid var(--rule)}
.contact h2{font-size:1rem;color:var(--soft);font-weight:400;margin:0 0 .6rem}
.contact a.big{font-size:clamp(1.4rem,4vw,2rem);font-weight:600;letter-spacing:-.01em;display:inline-block;margin-bottom:.25rem;border-bottom-width:3px}
.contact p{margin-top:.4rem}
footer.site{padding:3rem 0 3.5rem;color:var(--soft);font-size:.85rem}
footer.site a{color:var(--soft);border-bottom:1px solid var(--rule)}
footer.site .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.75rem}
.legal{padding:3rem 0}
.legal h1{font-size:1.9rem}
.legal h2{font-size:1.1rem;margin:2rem 0 .5rem}
.legal .back{display:inline-block;margin-bottom:2rem;font-size:.95rem}
@media (max-width:600px){html{font-size:17px}header.site{padding-top:3rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* contact form */
form#contact{display:grid;gap:1rem;max-width:34rem;margin-top:.25rem}
form#contact label{display:grid;gap:.35rem;font-size:.95rem;color:var(--soft)}
form#contact input,form#contact textarea{font:inherit;font-size:1.05rem;color:var(--ink);background:#fff;border:1px solid var(--rule);border-radius:6px;padding:.7rem .8rem;width:100%}
form#contact input:focus,form#contact textarea:focus{outline:2px solid var(--sea);outline-offset:1px;border-color:var(--sea)}
form#contact textarea{resize:vertical;min-height:7rem}
form#contact button{justify-self:start;font:inherit;font-weight:700;font-size:1.05rem;color:#fff;background:var(--sea);border:0;border-radius:6px;padding:.8rem 1.4rem;cursor:pointer}
form#contact button:hover{filter:brightness(.92)}
form#contact button:disabled{opacity:.6;cursor:default}
form#contact .status{min-height:1.4em;margin:0;color:var(--soft);font-size:.95rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.alt{margin-top:1.5rem;font-size:.95rem;color:var(--soft)}
.contact{padding-top:2rem}

/* hero row with art */
.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem}
.art{width:clamp(140px,22vw,220px);height:auto;flex:none;margin-bottom:.4rem}
@media (max-width:600px){.hero{flex-direction:column;align-items:flex-start;gap:1.25rem}.art{width:160px}}

.contact h2.drop{font-size:clamp(1.5rem,4vw,2.1rem);font-weight:600;color:var(--ink);margin:0 0 1rem;letter-spacing:-.01em;font-variation-settings:"opsz" 72,"SOFT" 60}
main{padding-top:1.5rem}
.contact{border-top:0;padding-top:1rem}
@media (max-width:600px){.rot-stage{min-width:0;width:100%}.rotator{flex-direction:column;gap:.15rem}}

/* rotator under the wordmark — pure CSS, 5 words × 2.6s = 13s loop */
.rotator{margin:1.4rem 0 0;display:flex;flex-direction:column;gap:.45rem;align-items:flex-start}
.rot-label{font-size:.82rem;letter-spacing:.22em;text-transform:uppercase;color:var(--soft);font-weight:400}
.rot-word .n{color:var(--soft);font-weight:400;font-size:.72em;margin-right:.35em;letter-spacing:.02em}
.rot-stage{position:relative;display:block;min-width:26ch;height:1.25em;font-size:clamp(1.6rem,4vw,2.3rem);font-weight:600;line-height:1.2;color:var(--sea);letter-spacing:-.01em;font-variation-settings:"opsz" 72,"SOFT" 60}
.rot-word{position:absolute;left:0;top:0;white-space:nowrap;opacity:0;transform:translateY(.6em);
  animation:rot 13s cubic-bezier(.4,0,.2,1) infinite;animation-delay:calc(var(--i) * 2.6s)}
@keyframes rot{
  0%{opacity:0;transform:translateY(.6em)}
  4%{opacity:1;transform:translateY(0)}
  17%{opacity:1;transform:translateY(0)}
  21%{opacity:0;transform:translateY(-.6em)}
  100%{opacity:0;transform:translateY(-.6em)}
}
@media (prefers-reduced-motion:reduce){
  .rot-stage{height:auto;min-width:0}
  .rot-word{position:static;opacity:1;transform:none;animation:none;white-space:normal}
  .rot-word+.rot-word::before{content:" · "}
}
@media (max-width:600px){.rot-stage{min-width:0;width:100%}.rotator{flex-direction:column;gap:.15rem}}