/* Sinapi QR menu: shared tokens, type, header, footer. Concept demo by Nerwx. */
@font-face{font-family:'Sofia XC';font-style:normal;font-weight:500 900;font-display:swap;src:url(../fonts/sofiaxc-greek.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:'Sofia XC';font-style:normal;font-weight:500 900;font-display:swap;src:url(../fonts/sofiaxc-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/commissioner-greek.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/commissioner-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --paper:#F4EDDF;
  --paper-2:#EAE0CA;
  --card:#FFFCF5;
  --mustard:#E2A623;
  --mustard-2:#F2CB62;
  --mustard-deep:#7A5205;
  --olive:#3F4729;
  --olive-2:#2C321E;
  --ink:#16180F;
  --ink-2:#3A3D30;
  --tomato:#B23A22;
  --line:rgba(22,24,15,.18);
  --display:'Sofia XC','Arial Narrow',sans-serif;
  --sans:'Commissioner',system-ui,-apple-system,'Segoe UI',sans-serif;
  --pad:16px;
  --max:640px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
::selection{background:var(--mustard);color:var(--ink)}
:focus-visible{outline:3px solid var(--tomato);outline-offset:2px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* concept strip (doubles as the "Concept by Nerwx" badge) */
.demo-bar{background:var(--ink);color:var(--paper);font-size:.8rem;font-weight:500}
.demo-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px}
.demo-bar a{text-decoration:none;display:inline-flex;align-items:center;gap:7px;min-height:40px}
.concept i{width:7px;height:7px;border-radius:50%;background:var(--mustard);flex:none}
.demo-bar .to{font-weight:650;color:var(--mustard-2);text-decoration:underline;text-underline-offset:3px}

/* header */
.hdr{background:var(--paper);border-bottom:2px solid var(--ink)}
.hdr .wrap{display:flex;align-items:center;gap:12px;min-height:64px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--display);font-weight:900;font-size:1.9rem;letter-spacing:.01em;text-transform:uppercase;line-height:1}
.logo i{width:17px;height:17px;border-radius:50%;background:var(--mustard);box-shadow:inset 0 0 0 4.5px var(--olive);flex:none}
.hdr-sub{font-size:.78rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;border:2px solid var(--ink);padding:3px 7px 2px;line-height:1.2}
.lang{display:flex;margin-left:auto;border:2px solid var(--ink)}
.lang button{min-width:48px;min-height:44px;font-size:.88rem;font-weight:700;letter-spacing:.04em}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:52px;padding:0 20px;font-weight:700;font-size:1rem;text-decoration:none;border:2px solid var(--ink);background:var(--card);color:var(--ink)}
.btn.solid{background:var(--ink);color:var(--paper)}
.btn.mustard{background:var(--mustard);border-color:var(--mustard);color:var(--ink)}
.btn svg{width:20px;height:20px;flex:none}

/* sales block + footer */
.sell{background:var(--olive-2);color:var(--paper);padding:36px 0 30px;margin-top:40px}
.sell h2{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:2.4rem;line-height:.92;letter-spacing:.005em}
.sell p{margin-top:10px;color:rgba(244,237,223,.88);max-width:42ch}
.sell .acts{display:grid;gap:10px;margin-top:20px}
.sell .btn{width:100%}
.sell .btn.ghost{background:transparent;color:var(--paper);border-color:rgba(244,237,223,.55)}
.ft{background:var(--olive-2);color:var(--paper);font-size:.84rem;padding-bottom:max(18px,env(safe-area-inset-bottom))}
.ft .wrap{border-top:1px solid rgba(244,237,223,.22);padding-top:18px}
.ft p{color:rgba(244,237,223,.8);line-height:1.6}
.ft p a{color:var(--mustard-2)}
.ft-bottom{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center;margin-top:14px}
.powered{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:500;min-height:44px}
.powered svg{width:24px;height:24px;border-radius:6px;flex:none}
.powered b{font-weight:800;letter-spacing:-.01em}
.powered:hover b{text-decoration:underline}

@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
