:root{
  --bg:#fff9f7;
  --surface:#ffffff;
  --surface-2:#fff1ee;
  --rose-50:#fff5f3;
  --rose-100:#fbe4e1;
  --rose-200:#f5c9c5;
  --rose-300:#eba7a3;
  --rose-400:#df7e7f;
  --rose-500:#cd6269;
  --rose-600:#b54b57;
  --wine:#7c2d37;
  --wine-2:#963d49;
  --ink:#3e2b2f;
  --muted:#7d656a;
  --line:#efd9d6;
  --cream:#fffaf4;
  --success:#3d7a5b;
  --shadow:0 18px 50px rgba(115,44,55,.10);
  --shadow-sm:0 10px 30px rgba(115,44,55,.08);
  --radius:24px;
  --radius-sm:16px;
  --container:min(1180px,calc(100% - 40px));
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at top left, rgba(248,210,205,.45), transparent 24rem),
    linear-gradient(180deg,var(--bg),#fff);
  line-height:1.6;
}
body.cart-open{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.container{width:var(--container);margin-inline:auto}
.muted{color:var(--muted)}
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  text-transform:uppercase;letter-spacing:.18em;font-size:.75rem;font-weight:800;
  color:var(--wine-2);
}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--rose-400);border-radius:99px}
.section{padding:80px 0}
.section-tight{padding:48px 0}
.section-heading{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:28px}
.section-heading h2,.page-hero h1,.hero h1{margin:.35rem 0 0;line-height:1.05;letter-spacing:-.045em}
.section-heading h2{font-size:clamp(2rem,4vw,3.5rem)}
.section-heading p{max-width:560px;margin:0;color:var(--muted)}

.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,249,247,.9);backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(239,217,214,.75);
}
.nav{
  width:var(--container);margin:auto;min-height:78px;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;
}
.brand{display:flex;align-items:center;gap:12px;font-weight:900}
.brand img{width:58px;height:58px;object-fit:contain}
.brand-name{font-size:1.15rem;letter-spacing:-.025em}
.nav-links{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}
.nav-links a{
  padding:10px 11px;border-radius:999px;font-size:.88rem;font-weight:700;color:#674f54;
}
.nav-links a:hover,.nav-links a.active{background:var(--rose-100);color:var(--wine)}
.nav-actions{display:flex;align-items:center;gap:10px}
.icon-btn,.btn{
  border:0;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-weight:800;transition:.2s ease;
}
.icon-btn{width:44px;height:44px;background:var(--surface);border:1px solid var(--line);position:relative}
.badge{
  position:absolute;right:-2px;top:-3px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;
  background:var(--wine);color:white;font-size:.7rem;display:grid;place-items:center;font-weight:900;
}
.btn{padding:13px 19px}
.btn:hover,.icon-btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--wine);color:white;box-shadow:0 10px 24px rgba(124,45,55,.18)}
.btn-primary:hover{background:#65232c}
.btn-soft{background:var(--rose-100);color:var(--wine)}
.btn-light{background:#fff;color:var(--wine);border:1px solid var(--line)}
.btn-block{width:100%}
.mobile-toggle{display:none}

.hero{padding:58px 0 72px}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(3.4rem,7vw,6.6rem);max-width:780px}
.hero h1 .accent{color:var(--rose-600)}
.hero p{font-size:1.08rem;color:var(--muted);max-width:610px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero-meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:34px}
.hero-meta strong{display:block;font-size:1.45rem;line-height:1}
.hero-meta span{font-size:.82rem;color:var(--muted)}
.hero-art{
  position:relative;min-height:560px;border-radius:40px;overflow:hidden;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.95),transparent 24%),
    linear-gradient(145deg,#ffd8d3,#f0a8a5 54%,#b6515f);
  box-shadow:var(--shadow);
}
.hero-art::before{
  content:"";position:absolute;width:380px;height:380px;border:1px solid rgba(255,255,255,.55);
  border-radius:50%;right:-90px;top:-100px;
}
.hero-art::after{
  content:"";position:absolute;width:220px;height:220px;background:rgba(255,255,255,.14);
  border-radius:50%;left:-40px;bottom:-40px;
}
.hero-logo{
  width:min(78%,470px);position:absolute;inset:50% auto auto 50%;
  transform:translate(-50%,-50%);filter:drop-shadow(0 24px 30px rgba(96,30,42,.14));
}
.float-card{
  position:absolute;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow-sm);
  border-radius:20px;padding:14px 16px;font-weight:800;z-index:2;
}
.float-card.top{top:26px;right:26px}
.float-card.bottom{left:26px;bottom:26px}
.float-card span{display:block;font-weight:500;color:var(--muted);font-size:.78rem}

.pill-row{display:flex;gap:10px;flex-wrap:wrap}
.pill{padding:9px 13px;border:1px solid var(--line);background:#fff;border-radius:999px;color:var(--muted);font-size:.84rem}

.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.category-card{
  min-height:300px;border-radius:30px;position:relative;overflow:hidden;padding:26px;
  display:flex;align-items:end;background:linear-gradient(145deg,#fff0ed,#f5c1bd);
  box-shadow:var(--shadow-sm);
}
.category-card:nth-child(2){background:linear-gradient(145deg,#f9e5df,#d99595)}
.category-card:nth-child(3){background:linear-gradient(145deg,#fff5ea,#eeb3aa)}
.category-card h3{font-size:1.8rem;margin:0}
.category-card p{margin:4px 0 0;color:#6f5055}
.category-icon{position:absolute;right:28px;top:22px;font-size:5rem;transform:rotate(-10deg)}

.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.feature-card{background:white;border:1px solid var(--line);padding:22px;border-radius:22px}
.feature-icon{width:44px;height:44px;border-radius:14px;background:var(--rose-100);display:grid;place-items:center;font-size:1.25rem;margin-bottom:14px}
.feature-card h3{margin:0 0 4px;font-size:1.05rem}
.feature-card p{margin:0;color:var(--muted);font-size:.9rem}

.page-hero{padding:64px 0 42px}
.page-hero .hero-box{
  border-radius:34px;padding:52px;background:
    radial-gradient(circle at 88% 16%,rgba(255,255,255,.8),transparent 18rem),
    linear-gradient(135deg,#fce8e5,#f3c4bf);
  border:1px solid rgba(255,255,255,.65);
}
.page-hero h1{font-size:clamp(2.8rem,6vw,5.2rem)}
.page-hero p{max-width:700px;color:#70575c;font-size:1.03rem}

.product-toolbar{
  display:grid;grid-template-columns:1.4fr repeat(2,minmax(150px,.5fr)) auto;gap:12px;
  margin:20px 0 26px;
}
.field,.select,.textarea{
  width:100%;border:1px solid var(--line);background:white;border-radius:15px;
  padding:13px 15px;outline:none;color:var(--ink);
}
.field:focus,.select:focus,.textarea:focus{border-color:var(--rose-400);box-shadow:0 0 0 4px rgba(223,126,127,.12)}
.textarea{min-height:120px;resize:vertical}
.form-label{display:block;font-size:.83rem;font-weight:800;margin-bottom:7px;color:#684e53}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-stack{display:grid;gap:14px}
.form-card{background:#fff;border:1px solid var(--line);border-radius:26px;padding:24px;box-shadow:var(--shadow-sm)}
.helper{font-size:.8rem;color:var(--muted);margin-top:6px}

.products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.product-card{
  background:white;border:1px solid var(--line);border-radius:26px;overflow:hidden;
  box-shadow:0 10px 30px rgba(124,45,55,.05);display:flex;flex-direction:column;
}
.product-media{
  min-height:260px;background:linear-gradient(145deg,#fff5f1,#f2c1bd);display:grid;place-items:center;
  position:relative;overflow:hidden;
}
.product-media img{width:100%;height:260px;object-fit:cover}
.product-placeholder{font-size:6rem;filter:drop-shadow(0 18px 16px rgba(115,44,55,.16));transform:rotate(-8deg)}
.product-chip{position:absolute;left:16px;top:16px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.88);font-size:.75rem;font-weight:800}
.product-body{padding:19px;display:flex;flex-direction:column;gap:12px;flex:1}
.product-title-row{display:flex;justify-content:space-between;gap:12px;align-items:start}
.product-title{margin:0;font-size:1.08rem}
.product-price{font-weight:900;color:var(--wine);white-space:nowrap}
.product-desc{margin:0;color:var(--muted);font-size:.86rem}
.product-meta{display:flex;gap:8px;flex-wrap:wrap;font-size:.76rem;color:#73565b}
.product-meta span{background:var(--rose-50);border:1px solid var(--rose-100);border-radius:999px;padding:6px 8px}
.product-actions{display:flex;gap:8px;margin-top:auto}
.product-actions .btn{padding:10px 12px;font-size:.82rem;flex:1}
.product-manage{display:flex;gap:6px}
.product-manage button{border:0;background:transparent;color:var(--muted);font-size:.78rem;font-weight:800;padding:5px 2px}
.product-manage button:hover{color:var(--wine)}

.admin-panel{margin-bottom:28px;display:none}
.admin-panel.open{display:block}
.image-preview{
  width:100%;aspect-ratio:16/9;border-radius:16px;border:1px dashed var(--rose-300);
  background:var(--rose-50);display:grid;place-items:center;overflow:hidden;color:var(--muted)
}
.image-preview img{width:100%;height:100%;object-fit:cover}

.auth-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:stretch}
.auth-visual{
  min-height:620px;border-radius:30px;padding:34px;display:flex;flex-direction:column;justify-content:space-between;
  background:linear-gradient(145deg,#f0b6b3,#a63d4b);color:white;
}
.auth-visual img{width:190px;background:rgba(255,255,255,.92);padding:10px;border-radius:26px}
.auth-visual h2{font-size:3rem;line-height:1.05;margin:0;letter-spacing:-.04em}
.tab-row{display:flex;gap:8px;background:var(--rose-50);padding:5px;border-radius:999px;margin-bottom:22px}
.tab-btn{flex:1;border:0;background:transparent;padding:10px;border-radius:999px;font-weight:800;color:var(--muted)}
.tab-btn.active{background:#fff;color:var(--wine);box-shadow:0 4px 12px rgba(90,35,44,.08)}
.auth-form{display:none}
.auth-form.active{display:grid;gap:14px}

.order-track{display:grid;grid-template-columns:1fr .8fr;gap:24px}
.status-list{display:grid;gap:0;margin-top:22px}
.status-step{display:grid;grid-template-columns:38px 1fr;gap:14px;position:relative;padding-bottom:22px}
.status-step:not(:last-child)::before{
  content:"";position:absolute;left:18px;top:36px;width:2px;height:calc(100% - 16px);background:var(--line)
}
.status-dot{width:38px;height:38px;border-radius:50%;background:var(--rose-100);display:grid;place-items:center;font-weight:900;color:var(--wine);z-index:1}
.status-step.done .status-dot{background:var(--wine);color:#fff}
.status-step h4{margin:2px 0 1px}
.status-step p{margin:0;color:var(--muted);font-size:.84rem}

.checkout-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start}
.summary-card{position:sticky;top:102px;background:#fff;border:1px solid var(--line);border-radius:26px;padding:24px}
.summary-line{display:flex;justify-content:space-between;gap:15px;padding:9px 0}
.summary-line.total{border-top:1px solid var(--line);margin-top:7px;padding-top:16px;font-size:1.12rem;font-weight:900}
.cart-summary-items{display:grid;gap:12px;max-height:340px;overflow:auto}
.summary-item{display:grid;grid-template-columns:54px 1fr auto;gap:10px;align-items:center}
.summary-thumb{width:54px;height:54px;border-radius:14px;background:var(--rose-100);display:grid;place-items:center;font-size:1.7rem;overflow:hidden}
.summary-thumb img{width:100%;height:100%;object-fit:cover}
.summary-item h4{font-size:.84rem;margin:0}
.summary-item p{margin:0;color:var(--muted);font-size:.75rem}

.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
.about-visual{min-height:520px;border-radius:34px;background:linear-gradient(145deg,#f8d2cf,#c46069);position:relative;overflow:hidden}
.about-visual img{width:65%;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);filter:drop-shadow(0 20px 25px rgba(90,30,40,.16))}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}
.stat{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px}
.stat strong{font-size:1.6rem;display:block;line-height:1}
.stat span{font-size:.78rem;color:var(--muted)}

.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:24px}
.contact-card{background:linear-gradient(145deg,#f9d9d5,#efb1ad);border-radius:28px;padding:28px}
.contact-list{display:grid;gap:13px;margin-top:24px}
.contact-list div{background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.7);padding:14px;border-radius:16px}
.contact-list strong{display:block}
.contact-list span{color:#74545a;font-size:.86rem}

.cart-overlay{position:fixed;inset:0;background:rgba(52,25,30,.35);z-index:90;opacity:0;pointer-events:none;transition:.2s}
.cart-overlay.open{opacity:1;pointer-events:auto}
.cart-drawer{
  position:fixed;right:0;top:0;height:100vh;width:min(430px,92vw);background:#fff;z-index:100;
  transform:translateX(105%);transition:.25s ease;padding:24px;display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(74,31,37,.18)
}
.cart-drawer.open{transform:translateX(0)}
.cart-head{display:flex;justify-content:space-between;align-items:center}
.cart-items{display:grid;gap:12px;overflow:auto;padding:18px 2px;flex:1}
.cart-item{display:grid;grid-template-columns:64px 1fr auto;gap:11px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:12px}
.cart-item-media{width:64px;height:64px;background:var(--rose-100);border-radius:14px;display:grid;place-items:center;font-size:2rem;overflow:hidden}
.cart-item-media img{width:100%;height:100%;object-fit:cover}
.cart-item h4{margin:0;font-size:.88rem}
.cart-item p{margin:0;color:var(--muted);font-size:.76rem}
.qty{display:flex;align-items:center;gap:7px;margin-top:6px}
.qty button{width:24px;height:24px;border-radius:50%;border:1px solid var(--line);background:#fff}
.cart-footer{border-top:1px solid var(--line);padding-top:16px}
.empty-state{padding:46px 16px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:20px}

.toast{
  position:fixed;left:50%;bottom:28px;transform:translate(-50%,30px);opacity:0;pointer-events:none;
  background:#3e2b2f;color:#fff;padding:12px 18px;border-radius:999px;z-index:150;font-weight:700;
  transition:.2s;box-shadow:var(--shadow)
}
.toast.show{opacity:1;transform:translate(-50%,0)}

footer{margin-top:60px;background:#3b2529;color:#f7e9e8;padding:54px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.2fr repeat(3,.7fr);gap:26px}
footer h4{margin:0 0 12px}
footer a{display:block;color:#dbc6c8;font-size:.88rem;margin:7px 0}
footer .brand img{background:#fff;border-radius:16px;padding:4px}
.footer-bottom{margin-top:32px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:15px;color:#cdb6b9;font-size:.78rem}

@media (max-width:980px){
  .nav{grid-template-columns:auto auto;justify-content:space-between}
  .nav-links{display:none;grid-column:1/-1;justify-content:flex-start;padding-bottom:14px}
  .nav-links.open{display:flex}
  .mobile-toggle{display:inline-flex}
  .hero-grid,.about-grid,.auth-layout,.order-track,.checkout-grid,.contact-grid{grid-template-columns:1fr}
  .hero-art{min-height:470px}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .products-grid{grid-template-columns:repeat(2,1fr)}
  .product-toolbar{grid-template-columns:1fr 1fr}
  .summary-card{position:static}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  :root{--container:min(100% - 28px,1180px)}
  .brand-name{display:none}
  .nav-actions .btn{display:none}
  .hero{padding-top:34px}
  .hero h1{font-size:3.4rem}
  .hero-art{min-height:390px;border-radius:28px}
  .section{padding:60px 0}
  .category-grid,.products-grid,.feature-grid,.stat-grid,.form-grid,.footer-grid{grid-template-columns:1fr}
  .product-toolbar{grid-template-columns:1fr}
  .page-hero .hero-box{padding:32px 24px}
  .auth-visual{min-height:420px}
  .footer-bottom{flex-direction:column}
}
