@charset "UTF-8";
:root{--paper:#faf6f2;--ink:#352c28;--muted:#77685f;--copper:#a96043;--line:#e5d7cc}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;background-image:radial-gradient(ellipse at 95% 25%,#f1dcd066,transparent 55%)}
.page{max-width:1512px;margin:auto;padding:28px 6.2vw 0;min-height:100svh;display:flex;flex-direction:column}
header{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{width:195px;height:auto;mix-blend-mode:multiply}
.header-note{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
main{display:grid;grid-template-columns:1.1fr 1fr;gap:7%;align-items:center;padding:50px 0 70px;flex:1}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--copper);margin:0 0 27px}
.eyebrow span{height:1px;width:34px;background:var(--copper)}
h1{font:normal clamp(42px,4.4vw,68px)/1.1 Georgia,'Times New Roman',serif;letter-spacing:-.045em;margin:0 0 27px}
h1 em{font-weight:normal;color:var(--copper)}
.intro{font:24px/1.4 Georgia,'Times New Roman',serif;margin:0 0 18px}
.description{max-width:410px;font-size:14px;line-height:1.9;color:var(--muted);margin:0 0 29px}
.status{display:flex;gap:12px;align-items:flex-start;padding:19px 0;border-top:1px solid var(--line);max-width:430px}
.status p{margin:0;font-size:12px;line-height:1.85;color:var(--muted)}
.status strong{font-weight:400;color:var(--ink)}
.dot{width:6px;height:6px;flex-shrink:0;border-radius:50%;margin-top:8px;background:var(--copper);box-shadow:0 0 0 4px #a9604312;animation:breathe 3s ease-in-out infinite}
.social{display:inline-flex;align-items:center;gap:30px;font-size:12px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--copper);padding:8px 0;margin-top:6px}
.social span{font-size:19px;color:var(--copper)}
.social:hover{color:var(--copper)}
.social:focus-visible{outline:2px solid var(--copper);outline-offset:6px}
.visual{position:relative;margin:0;padding:0 13px 30px 0}
.photo{height:clamp(400px,40vw,560px);border-radius:170px 170px 12px 12px;overflow:hidden;position:relative;background:#edd5c5}
.photo img{width:100%;height:100%;object-fit:cover;object-position:69% center;display:block}
.photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,#71432a20)}
.visual:before{content:'';position:absolute;inset:14px 0 17px 14px;border:1px solid #c58d6e66;border-radius:170px 170px 12px 12px}
figcaption{position:absolute;bottom:9px;left:-32px;padding:23px 30px;background:#fffaf5;box-shadow:0 12px 40px #6d403210;transform:rotate(-3deg);font:23px/1.3 Georgia,serif}
figcaption span,figcaption em{display:block}
figcaption em{color:var(--copper)}
.detail{position:absolute;right:30px;bottom:53px;color:white;font-size:8px;letter-spacing:.23em;writing-mode:vertical-rl}
footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:24px 0;font-size:10px;color:var(--muted);letter-spacing:.04em}
footer a{color:inherit;text-underline-offset:4px}.footer-mark{font-size:21px;color:var(--copper)}
@keyframes breathe{50%{box-shadow:0 0 0 7px #a9604306}}
@media(min-width:1600px){.page{padding-left:90px;padding-right:90px}}
@media(max-width:850px){.page{padding:18px 7vw 0}.header-note{max-width:130px;text-align:right;line-height:1.8;font-size:8px}.logo{width:160px}main{gap:35px;grid-template-columns:1fr;padding:35px 0 50px}.message{max-width:550px}h1{font-size:clamp(40px,7.5vw,62px)}.visual{max-width:520px;width:100%;justify-self:center;margin-top:8px}.photo{height:390px;border-radius:130px 130px 12px 12px}.visual:before{border-radius:130px 130px 12px 12px}figcaption{left:-8px}.description{max-width:480px}footer{font-size:9px;flex-wrap:wrap}footer span:nth-child(2){max-width:160px;text-align:right}.footer-mark{display:none}}
@media(prefers-reduced-motion:reduce){.dot{animation:none}}

/* Coming soon page in the theme (coming-soon.php): a way in for shop staff, top right. */
.header-side{display:flex;align-items:center;gap:26px}
.login{display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:9px 16px;background:#fff8}
.login svg{width:14px;height:14px;fill:none;stroke:var(--copper);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.login:hover{border-color:var(--copper);color:var(--copper)}
.login:focus-visible{outline:2px solid var(--copper);outline-offset:4px}
@media(max-width:850px){.header-side{flex-direction:column;align-items:flex-end;gap:10px}.login{font-size:9px;padding:8px 13px}}
