/* =========================================================
   Digital shop — premium, modern, responsive design
   ========================================================= */
:root{
  --bg:#FAF7F2;            /* warm cream, page background */
  --surface:#FFFFFF;
  --ink:#1B1814;          /* almost black, warm */
  --ink-soft:#6B655B;     /* secondary text */
  --line:#ECE6DC;         /* thin warm line */
  --accent:#C8553D;       /* terracotta — premium accent */
  --accent-soft:#F8EBE6;
  --accent-ink:#8E2F1C;
  --gold:#C79A3A;
  --sage:#7C8A6B;
  --honey-soft:#FBF3DF;
  --radius:22px;
  --radius-sm:14px;
  --shadow:0 24px 60px -18px rgba(27,24,20,.22);
  --shadow-sm:0 10px 28px -12px rgba(27,24,20,.18);
  --maxw:1140px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Inter',system-ui,sans-serif; font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{max-width:100%; display:block;}
a{color:var(--accent); text-decoration:none;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
.wrap-narrow{max-width:580px; margin:0 auto; padding:0 28px;}
.serif{font-family:'Fraunces',serif;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:'Inter',sans-serif; font-weight:600; font-size:15.5px; line-height:1; cursor:pointer;
  border:1px solid transparent; border-radius:999px; padding:14px 24px; text-decoration:none;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s; white-space:nowrap;}
.btn-primary{background:var(--ink); color:#fff;}
.btn-primary:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm);}
.btn-accent{background:var(--accent); color:#fff;}
.btn-accent:hover{transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(200,85,61,.6);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line);}
.btn-ghost:hover{background:#fff; border-color:#dcd5c8; transform:translateY(-2px);}
.btn-danger{background:var(--accent-soft); color:var(--accent-ink); border-color:#E9CFC6;}
.btn-block{width:100%;}
.btn-sm{padding:11px 18px; font-size:14px;}
.btn-lg{padding:16px 30px; font-size:16.5px;}

/* ---------- Header ---------- */
header.site{position:sticky; top:0; z-index:50; border-bottom:1px solid transparent;
  background:rgba(250,247,242,.72); backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px);
  transition:border-color .2s, background .2s;}
header.site.scrolled{border-bottom-color:var(--line); background:rgba(250,247,242,.9);}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; padding:16px 28px;}
.brand{font-family:'Fraunces',serif; font-weight:600; font-size:23px; letter-spacing:-.01em; color:var(--ink); text-decoration:none; display:inline-flex; align-items:center; gap:2px;}
.brand .dot{color:var(--accent);}
.nav-right{display:flex; align-items:center; gap:20px;}
.nav-right a.navlink{color:var(--ink-soft); font-size:15px; font-weight:500;}
.nav-right a.navlink:hover{color:var(--ink);}

/* ---------- Hero ---------- */
.hero{position:relative; overflow:hidden;}
.hero::before{content:""; position:absolute; top:-180px; right:-160px; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, rgba(200,85,61,.16), rgba(200,85,61,0) 68%); pointer-events:none;}
.hero::after{content:""; position:absolute; bottom:-220px; left:-160px; width:480px; height:480px; border-radius:50%;
  background:radial-gradient(circle, rgba(199,154,58,.14), rgba(199,154,58,0) 68%); pointer-events:none;}
.hero .wrap{position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; padding-top:64px; padding-bottom:64px;}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-family:'Inter',sans-serif; font-size:13px; font-weight:600;
  letter-spacing:.02em; color:var(--accent-ink); background:var(--accent-soft); border:1px solid #Efceeb;
  padding:7px 14px; border-radius:999px; margin-bottom:22px;}
.hero h1{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(36px,5.6vw,62px); line-height:1.02;
  letter-spacing:-.025em; margin:0 0 20px;}
.hero h1 em{font-style:italic; color:var(--accent);}
.hero .sub{font-size:clamp(17px,2vw,20px); color:var(--ink-soft); max-width:480px; margin:0 0 30px;}
.hero-cta{display:flex; gap:14px; flex-wrap:wrap;}
.hero .mini-trust{display:flex; gap:8px 22px; flex-wrap:wrap; margin-top:28px; font-size:14px; color:var(--ink-soft);}
.hero .mini-trust span{display:inline-flex; align-items:center; gap:8px;}

/* hero visual — "preview" card with badges anchored in the corners */
.hero-visual{position:relative; display:flex; align-items:center; justify-content:center; min-height:400px; padding:34px 28px;}
.preview-card{position:relative; transform:rotate(-2deg); width:300px;
  background:var(--surface); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow);}
.preview-card .pc-cover{aspect-ratio:4/3; background:linear-gradient(145deg,#F3E7D6,#E7CFA8);
  display:flex; align-items:center; justify-content:center; border-radius:24px 24px 0 0; overflow:hidden;}
.preview-card .pc-cover span{font-size:64px; filter:drop-shadow(0 8px 16px rgba(27,24,20,.18));}
.preview-card .pc-body{padding:18px 20px 22px;}
.preview-card h4{font-family:'Fraunces',serif; font-size:21px; margin:0 0 6px;}
.preview-card .pc-row{display:flex; align-items:center; justify-content:space-between; margin-top:14px;}
.preview-card .pc-price{font-family:'Fraunces',serif; font-weight:600; font-size:22px;}
.float-badge{position:absolute; z-index:3; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-sm);
  border-radius:14px; padding:10px 14px; font-size:13px; font-weight:600; display:flex; align-items:center; gap:9px; white-space:nowrap; transform:rotate(2deg);}
.float-badge.fb-top{top:-18px; right:-16px;}
.float-badge.fb-bottom{bottom:-18px; left:-16px;}
.float-badge .fb-ic{width:28px; height:28px; border-radius:9px; background:var(--accent-soft); color:var(--accent);
  display:flex; align-items:center; justify-content:center; font-size:14px;}

/* ---------- Trust bar ---------- */
.proof{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.5);}
.proof .wrap{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px 40px; padding:22px 28px;}
.proof .pitem{display:inline-flex; align-items:center; gap:10px; font-size:14.5px; color:var(--ink-soft); font-weight:500;}
.proof .pitem strong{color:var(--ink);}
.stars{color:var(--gold); letter-spacing:2px;}

/* ---------- Sections ---------- */
section.block{padding:78px 0;}
.section-head{max-width:620px; margin:0 auto 46px; text-align:center;}
.section-head .eyebrow{margin-bottom:16px;}
.section-head h2{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(28px,4vw,42px); line-height:1.08;
  letter-spacing:-.02em; margin:0 0 14px;}
.section-head p{font-size:18px; color:var(--ink-soft); margin:0;}

/* ---------- Product grid ---------- */
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:28px;}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  display:flex; flex-direction:column; transition:transform .2s ease, box-shadow .2s ease, border-color .2s;}
.card:hover{transform:translateY(-6px); box-shadow:var(--shadow); border-color:#E2DACC;}
.card .cover{aspect-ratio:4/3; background-size:cover; background-position:center; position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center;}
.card .cover .cover-emoji{font-size:58px; line-height:1; filter:drop-shadow(0 8px 18px rgba(27,24,20,.2)); transition:transform .35s ease;}
.card:hover .cover .cover-emoji{transform:scale(1.08) rotate(-3deg);}
.card .tag-digital{position:absolute; top:14px; left:14px; background:rgba(255,255,255,.92);
  color:var(--ink); font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  padding:5px 11px; border-radius:999px; backdrop-filter:blur(4px);}
.card .body{padding:20px 22px 22px; display:flex; flex-direction:column; gap:10px; flex:1;}
.card h3{font-family:'Fraunces',serif; font-size:22px; font-weight:600; margin:0; line-height:1.18; letter-spacing:-.01em;}
.card .desc{font-size:14.5px; color:var(--ink-soft); margin:0; flex:1; line-height:1.55;}
.card .foot{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:6px; padding-top:16px; border-top:1px solid var(--line);}
.card .pret{font-family:'Fraunces',serif; font-weight:600; font-size:24px; letter-spacing:-.01em;}

/* ---------- How it works ---------- */
.steps3{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.step{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px; position:relative;}
.step .num{font-family:'Fraunces',serif; font-size:16px; font-weight:600; color:var(--accent);
  width:42px; height:42px; border-radius:50%; border:1.5px solid var(--accent-soft); background:var(--accent-soft);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px;}
.step h3{font-family:'Fraunces',serif; font-size:21px; margin:0 0 8px;}
.step p{margin:0; color:var(--ink-soft); font-size:15.5px;}

/* ---------- Testimonials ---------- */
.quotes{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.quote{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px 26px; display:flex; flex-direction:column; gap:16px;}
.quote .stars{font-size:15px;}
.quote p{margin:0; font-size:16px; line-height:1.6; flex:1;}
.quote .who{display:flex; align-items:center; gap:12px;}
.quote .avatar{width:42px; height:42px; border-radius:50%; background:linear-gradient(135deg,var(--accent),var(--gold)); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:16px;}
.quote .who b{display:block; font-size:15px;}
.quote .who small{color:var(--ink-soft); font-size:13px;}

/* ---------- FAQ ---------- */
.faq{max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:12px;}
.faq details{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:4px 22px; transition:border-color .2s;}
.faq details[open]{border-color:#E2DACC;}
.faq summary{list-style:none; cursor:pointer; padding:18px 0; font-weight:600; font-size:17px; display:flex; align-items:center; justify-content:space-between; gap:16px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; font-size:24px; color:var(--accent); font-weight:400; transition:transform .2s;}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq .ans{padding:0 0 20px; color:var(--ink-soft); font-size:15.5px; line-height:1.6;}

/* ---------- CTA band ---------- */
.cta-band{margin:40px 0 0;}
.cta-inner{background:var(--ink); color:#fff; border-radius:28px; padding:56px 44px; text-align:center; position:relative; overflow:hidden;}
.cta-inner::before{content:""; position:absolute; top:-120px; right:-80px; width:360px; height:360px; border-radius:50%;
  background:radial-gradient(circle, rgba(200,85,61,.4), rgba(200,85,61,0) 70%);}
.cta-inner h2{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(26px,3.6vw,38px); margin:0 0 12px; position:relative;}
.cta-inner p{color:rgba(255,255,255,.75); font-size:18px; margin:0 0 26px; position:relative;}

/* ---------- Messages / utilities ---------- */
.msg{border-radius:var(--radius-sm); padding:14px 18px; margin:0 0 22px; font-size:15px;}
.msg-ok{background:#EDF4EE; border:1px solid #CBE3D4; color:#3C7A55;}
.msg-err{background:var(--accent-soft); border:1px solid #E9CFC6; color:var(--accent-ink);}
.muted{color:var(--ink-soft); font-size:14px;}
.hidden{display:none !important;}

/* ---------- Result pages (thank you / cancelled) ---------- */
.result{min-height:84vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:40px 28px;}
.result .ico{width:84px; height:84px; border-radius:50%; background:var(--accent-soft); color:var(--accent);
  display:flex; align-items:center; justify-content:center; font-size:40px; margin-bottom:22px;}
.result h1{font-family:'Fraunces',serif; font-size:clamp(30px,5vw,42px); font-weight:600; margin:0 0 14px;}
.result p{font-size:18px; color:var(--ink-soft); max-width:470px; margin:0 0 28px;}

/* ---------- Admin: forms & table ---------- */
.panel{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px; margin:24px 0; box-shadow:var(--shadow-sm);}
.panel h2{font-family:'Fraunces',serif; font-size:25px; margin:0 0 18px;}
label{display:block; font-size:13.5px; font-weight:600; color:var(--ink-soft); margin:16px 0 7px;}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=file],textarea{
  width:100%; font-family:'Inter',sans-serif; font-size:16px; color:var(--ink);
  border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:#fff;}
input:focus,textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
textarea{min-height:96px; resize:vertical;}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.check-line{display:flex; align-items:center; gap:10px; margin:18px 0;}
.check-line input{width:18px; height:18px; accent-color:var(--accent);}
.check-line label{margin:0;}
table{width:100%; border-collapse:collapse; margin-top:8px;}
th,td{text-align:left; padding:14px 10px; border-bottom:1px solid var(--line); font-size:14.5px; vertical-align:middle;}
th{font-size:11.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft);}
.tag{display:inline-block; font-size:12px; font-weight:600; padding:4px 11px; border-radius:999px;}
.tag-on{background:#EDF4EE; color:#3C7A55;}
.tag-off{background:#F1EEE8; color:var(--ink-soft);}

/* ---------- Consent dialog (before payment) ---------- */
.modal-fundal{position:fixed; inset:0; background:rgba(27,24,20,.55); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center; padding:20px; z-index:100;}
.modal{background:var(--surface); border-radius:var(--radius); padding:30px; max-width:480px; width:100%; box-shadow:var(--shadow);}
.modal h3{font-family:'Fraunces',serif; font-size:24px; margin:0 0 8px;}
.modal p{color:var(--ink-soft); font-size:15px; margin:0 0 16px;}
.modal .acord{display:flex; gap:12px; align-items:flex-start; background:var(--bg); border:1px solid var(--line);
  border-radius:var(--radius-sm); padding:14px 16px; font-size:14.5px; line-height:1.5; cursor:pointer;}
.modal .acord input{width:20px; height:20px; flex:0 0 auto; margin-top:2px; accent-color:var(--accent);}
.modal .butoane{display:flex; gap:10px; margin-top:20px; flex-wrap:wrap;}
.modal .butoane .btn{flex:1;}
.btn[disabled]{opacity:.45; cursor:not-allowed; transform:none !important; box-shadow:none !important;}

/* ---------- Text pages (terms, privacy) ---------- */
.pagina-text{max-width:720px; margin:0 auto; padding:56px 28px 80px;}
.pagina-text h1{font-family:'Fraunces',serif; font-size:clamp(30px,4.6vw,42px); font-weight:600; margin:0 0 6px; letter-spacing:-.02em;}
.pagina-text h3{font-family:'Fraunces',serif; font-size:21px; margin:30px 0 8px;}
.pagina-text p{color:var(--ink); font-size:16px; line-height:1.7; margin:0 0 12px;}
.pagina-text .completeaza{background:var(--honey-soft,#FBF3DF); border:1.5px dashed var(--gold); border-radius:8px; padding:2px 8px; font-size:.95em;}

/* ---------- Admin: tabs & sales ---------- */
.tabs{display:flex; gap:8px; margin:22px 0 4px; flex-wrap:wrap;}
.tab{font-family:'Inter',sans-serif; font-weight:600; font-size:15px; padding:10px 20px; border-radius:999px;
  border:1px solid var(--line); background:transparent; cursor:pointer; color:var(--ink-soft);}
.tab.activ{background:var(--ink); border-color:var(--ink); color:#fff;}
.tab .bulina{display:inline-flex; min-width:20px; height:20px; padding:0 6px; margin-left:6px; border-radius:999px;
  background:var(--accent); color:#fff; font-size:12px; align-items:center; justify-content:center;}
.tag-warn{background:var(--honey-soft,#FBF3DF); color:#8A6418;}
.vanzare{border:1px solid var(--line); border-radius:var(--radius-sm); padding:16px 18px; margin-bottom:12px; background:#fff;}
.vanzare .cap{display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap;}
.vanzare .cap b{font-family:'Fraunces',serif; font-size:17px;}
.vanzare .detalii{font-size:14px; color:var(--ink-soft); margin:6px 0 10px; line-height:1.5;}
.vanzare .actiuni{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.vanzare .actiuni input{max-width:260px; padding:9px 12px; font-size:14px;}

/* ---------- Footer ---------- */
footer.site{border-top:1px solid var(--line); margin-top:30px;}
footer.site .wrap{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding:34px 28px;}
footer.site .f-brand{font-family:'Fraunces',serif; font-size:19px; color:var(--ink);}
footer.site .f-meta{font-size:13.5px; color:var(--ink-soft);}
footer.site .admin-link{color:var(--ink-soft); opacity:.55; font-size:13px;}
footer.site .admin-link:hover{opacity:1; color:var(--accent);}
footer.site .sep{opacity:.4; margin:0 9px;}

/* ---------- Responsive ---------- */
@media(max-width:880px){
  .hero .wrap{grid-template-columns:1fr; gap:10px; padding-top:48px; padding-bottom:48px;}
  .hero-visual{display:none;}
  .steps3,.quotes{grid-template-columns:1fr;}
  section.block{padding:58px 0;}
}
@media(max-width:560px){
  body{font-size:16px;}
  .wrap,.wrap-narrow{padding:0 20px;}
  header.site .wrap{padding:14px 20px;}
  .nav-right{gap:14px;}
  .nav-right .navlink{display:none;}
  .hero-cta .btn{flex:1;}
  .grid{grid-template-columns:1fr; gap:20px;}
  .cta-inner{padding:40px 26px;}
  .panel{padding:22px;}
  .row2{grid-template-columns:1fr;}
  td .btn{margin-bottom:6px;}
}
