/* Fraunces — latin-ext covers Romanian ș ț ă */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/fonts/fraunces-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/fonts/fraunces-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;
}

/* Inter */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url('/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url('/fonts/inter-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{
  --ink:#1a1410;
  --paper:#fbf6ee;
  --orange:#ff6b35;
  --orange-warm:#ff8c42;
  --slip:#fffdf9;
  --line:#e6ddd0;
  --muted:#7a6f63;
  --green:#3a7d44;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.wrap{max-width:1100px;margin:0 auto;padding:0 28px}

/* nav */
nav{display:flex;align-items:center;justify-content:space-between;padding:26px 0}
.brand{font-family:'Fraunces',serif;font-weight:900;font-size:1.35rem;letter-spacing:-.01em;display:flex;align-items:center;gap:9px}
.barcode{display:inline-flex;gap:2px;height:22px;align-items:stretch}
.barcode i{width:2px;background:var(--ink);border-radius:1px}
.barcode i:nth-child(2){width:3px}
.barcode i:nth-child(4){width:4px;background:var(--orange)}
.barcode i:nth-child(6){width:2px}
.barcode i:nth-child(7){width:5px}
.barcode i:nth-child(8){width:1px}
.barcode i:nth-child(9){width:3px}
.barcode i:nth-child(10){width:2px}

/* animated scanner barcode */
.barcode-anim{position:relative;overflow:hidden;padding:2px 3px;border-radius:3px}
.barcode-anim i{transform-origin:bottom;animation:bar-rise .5s cubic-bezier(.2,.8,.2,1) backwards}
.barcode-anim i:nth-child(1){animation-delay:.00s}
.barcode-anim i:nth-child(2){animation-delay:.05s}
.barcode-anim i:nth-child(3){animation-delay:.10s}
.barcode-anim i:nth-child(4){animation-delay:.15s}
.barcode-anim i:nth-child(5){animation-delay:.20s}
.barcode-anim i:nth-child(6){animation-delay:.25s}
.barcode-anim i:nth-child(7){animation-delay:.30s}
.barcode-anim i:nth-child(8){animation-delay:.35s}
.barcode-anim i:nth-child(9){animation-delay:.40s}
.barcode-anim i:nth-child(10){animation-delay:.45s}
.barcode-anim::after{
  content:"";position:absolute;top:-2px;bottom:-2px;width:2px;
  background:var(--orange);box-shadow:0 0 6px 1px var(--orange);
  border-radius:2px;left:0;opacity:0;
  animation:scan 2.8s ease-in-out 1s infinite;
}
@keyframes bar-rise{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes scan{
  0%{left:0;opacity:0}
  8%{opacity:1}
  42%{left:calc(100% - 2px);opacity:1}
  50%{left:calc(100% - 2px);opacity:0}
  100%{left:calc(100% - 2px);opacity:0}
}
/* real scannable Code 128 barcode (economisescu.ro/app) */
.bc{display:block;height:22px;width:auto;color:var(--ink)}
.bc rect{fill:currentColor}
.bc-link{display:inline-block;line-height:0}
.bc-link:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:2px}
.navright{display:flex;align-items:center;gap:16px}
.tag{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
.lang{display:inline-flex;border:1px solid var(--line);border-radius:100px;overflow:hidden;background:var(--slip)}
.lang button{border:none;background:transparent;font-family:inherit;font-size:.74rem;font-weight:600;letter-spacing:.06em;padding:6px 12px;cursor:pointer;color:var(--muted);transition:background .2s ease,color .2s ease}
.lang button.active{background:var(--orange);color:#fff}
.lang button:focus-visible{outline:2px solid var(--orange);outline-offset:2px}

/* hero */
.hero{padding:60px 0 30px;position:relative}
.eyebrow{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);font-weight:600;margin-bottom:22px}
h1{font-family:'Fraunces',serif;font-weight:900;font-size:clamp(2.7rem,7vw,5.4rem);line-height:.98;letter-spacing:-.025em;max-width:14ch}
h1 .nod{color:var(--orange);position:relative;white-space:nowrap}
.lede{font-size:clamp(1.05rem,2.4vw,1.32rem);color:var(--muted);max-width:46ch;margin-top:26px;line-height:1.5}

/* the character card — the signature */
.stage{display:grid;grid-template-columns:1.3fr .9fr;gap:48px;align-items:center;margin-top:54px}
@media(max-width:820px){.stage{grid-template-columns:1fr;gap:36px}}

.receipt{
  background:var(--slip);
  border:1px solid var(--line);
  border-radius:4px;
  padding:30px 30px 26px;
  box-shadow:0 24px 50px -28px rgba(60,40,20,.4);
  position:relative;
  font-family:'Inter',sans-serif;
  transform:rotate(-1.4deg);
}
.receipt::before,.receipt::after{
  content:"";position:absolute;left:0;right:0;height:10px;
  background-image:radial-gradient(circle at 6px -3px, transparent 6px, var(--slip) 6px);
  background-size:14px 10px;background-repeat:repeat-x;
}
.receipt::before{top:-9px;transform:rotate(180deg)}
.receipt::after{bottom:-9px}
.r-head{text-align:center;border-bottom:1.5px dashed var(--line);padding-bottom:14px;margin-bottom:14px}
.r-head .name{font-family:'Fraunces',serif;font-weight:900;font-size:1.5rem;letter-spacing:-.01em}
.r-head .sub{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.r-row{display:flex;justify-content:space-between;font-size:.92rem;padding:7px 0;color:var(--ink)}
.r-row .store{color:var(--muted)}
.r-row.win .price{color:var(--green);font-weight:600}
.r-row.win .store{color:var(--ink);font-weight:600}
.r-strike{text-decoration:line-through;color:var(--muted)}
.r-total{display:flex;justify-content:space-between;border-top:1.5px dashed var(--line);margin-top:12px;padding-top:13px;font-family:'Fraunces',serif;font-weight:900;font-size:1.15rem}
.r-total .save{color:var(--orange)}
.r-foot{text-align:center;margin-top:16px}
.r-foot .barcode{height:40px;justify-content:center;margin-bottom:7px}
.r-foot .barcode i{background:var(--ink)}
.r-foot small{font-size:.68rem;letter-spacing:.22em;color:var(--muted)}

.pitch h2{font-family:'Fraunces',serif;font-weight:600;font-size:1.7rem;line-height:1.15;letter-spacing:-.01em;margin-bottom:16px}
.pitch p{color:var(--muted);line-height:1.6;font-size:1.02rem;margin-bottom:14px}
.stores{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.chip{font-size:.78rem;font-weight:500;padding:6px 13px;border:1px solid var(--line);border-radius:100px;color:var(--muted);background:var(--slip)}
.chip-more{border-color:var(--orange);color:var(--orange);font-weight:600}

/* signup */
.signup{margin-top:64px;background:var(--ink);border-radius:16px;padding:clamp(34px,5vw,56px);color:var(--paper);position:relative;overflow:hidden}
.signup .glow{position:absolute;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,var(--orange) 0%,transparent 70%);opacity:.32;top:-120px;right:-80px;pointer-events:none}
.signup h3{font-family:'Fraunces',serif;font-weight:900;font-size:clamp(1.6rem,3.6vw,2.4rem);line-height:1.05;letter-spacing:-.02em;max-width:18ch;position:relative}
.signup p{color:#d9cfc2;margin-top:14px;max-width:42ch;line-height:1.5;position:relative}
.form{display:flex;gap:10px;margin-top:26px;max-width:480px;position:relative}
@media(max-width:540px){.form{flex-direction:column}}
.form input{flex:1;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:9px;padding:15px 17px;color:#fff;font-size:1rem;font-family:inherit}
.form input::placeholder{color:#a89c8e}
.form input:focus{outline:2px solid var(--orange);outline-offset:1px;border-color:transparent}
.form button{background:var(--orange);color:#fff;border:none;border-radius:9px;padding:15px 26px;font-size:1rem;font-weight:600;font-family:inherit;cursor:pointer;transition:transform .12s ease,background .2s ease;white-space:nowrap}
.form button:hover{background:var(--orange-warm);transform:translateY(-1px)}
.form button:active{transform:translateY(0)}
.note{font-size:.8rem;color:#a89c8e;margin-top:14px;position:relative}
.done{position:relative;font-size:1.05rem;color:#fff;margin-top:8px;display:none}
.done b{color:var(--orange-warm)}
.apps{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:30px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12);position:relative}
.apps-label{font-size:.82rem;color:#d9cfc2;letter-spacing:.02em;margin-right:2px}
.store-badge{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.22);border-radius:10px;padding:8px 14px;color:#fff;background:rgba(255,255,255,.04)}
.store-badge svg{flex-shrink:0}
.store-badge span{display:flex;flex-direction:column;line-height:1.1;text-align:left}
.store-badge small{font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:#a89c8e}
.store-badge b{font-family:'Fraunces',serif;font-size:1.02rem;font-weight:600}

footer{padding:40px 0 50px;text-align:center;color:var(--muted);font-size:.85rem}
footer .bc-link{margin-bottom:14px}
footer .barcode{height:18px;justify-content:center;margin-bottom:14px}
footer .barcode i{background:var(--muted)}

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

@media(max-width:560px){
  nav{padding:18px 0;flex-wrap:wrap;gap:10px}
  .navright{gap:10px}
  .tag{display:none}
  .brand{font-size:1.2rem}
  .apps{gap:10px}
  .apps-label{width:100%;margin-bottom:2px}
}
