:root{
--ink:#2b2025;
--muted:#7e6871;
--line:#eadde2;
--paper:#fffafa;
--cream:#fff6f1;
--blush:#f7dbe3;
--blush-2:#fdecef;
--rose:#c56a86;
--rose-dark:#9f4666;
--sage:#9caf9f;
--gold:#c99a5b;
--shadow:0 18px 45px rgba(73,42,52,.12);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
margin:0;
font-family:"Segoe UI",Arial,sans-serif;
color:var(--ink);
background:linear-gradient(180deg,#fffafa 0%,#fff6f1 46%,#fffafa 100%);
line-height:1.5;
}
a{color:inherit}
img{max-width:100%;display:block}

.site-header{
position:sticky;
top:0;
z-index:20;
background:rgba(255,250,250,.94);
backdrop-filter:blur(18px);
border-bottom:1px solid rgba(234,221,226,.9);
box-shadow:0 8px 24px rgba(64,34,45,.05);
}

.topbar{
max-width:1240px;
margin:0 auto;
display:grid;
grid-template-columns:auto minmax(280px,1fr) auto;
align-items:center;
gap:24px;
padding:16px 24px 12px;
}

.brand{
font-family:Georgia,"Times New Roman",serif;
font-size:30px;
font-weight:700;
letter-spacing:0;
text-decoration:none;
color:var(--rose-dark);
white-space:nowrap;
}

.search{
display:flex;
align-items:center;
gap:8px;
justify-self:end;
width:min(520px,100%);
background:#fff;
border:1px solid var(--line);
border-radius:999px;
padding:5px;
box-shadow:0 10px 25px rgba(73,42,52,.06);
}

.search input,
.form-grid input,
.form-grid textarea,
.form-grid select,
.inline-form input,
.inline-form select{
width:100%;
border:1px solid var(--line);
border-radius:14px;
background:#fff;
color:var(--ink);
padding:12px 14px;
font:inherit;
outline:none;
}

.search input{
border:0;
border-radius:999px;
padding:10px 14px;
}

.search input:focus,
.form-grid input:focus,
.form-grid textarea:focus,
.form-grid select:focus,
.inline-form input:focus,
.inline-form select:focus{
box-shadow:0 0 0 4px rgba(197,106,134,.14);
border-color:var(--rose);
}

.search button,
button,
.button,
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:42px;
padding:11px 18px;
border:0;
border-radius:999px;
background:linear-gradient(135deg,var(--rose),var(--rose-dark));
color:#fff;
text-decoration:none;
cursor:pointer;
font-weight:700;
box-shadow:0 12px 24px rgba(159,70,102,.22);
transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}

.search button:hover,
button:hover,
.button:hover,
.btn:hover{
transform:translateY(-1px);
box-shadow:0 16px 30px rgba(159,70,102,.28);
}

.secondary{
background:linear-gradient(135deg,var(--sage),#718a78);
box-shadow:0 12px 24px rgba(113,138,120,.2);
}

.header-actions{
display:flex;
gap:14px;
align-items:center;
white-space:nowrap;
font-size:14px;
color:var(--muted);
}

.header-actions a,
.category-nav a{
text-decoration:none;
transition:color .18s ease;
}

.header-actions a:hover,
.category-nav a:hover{
color:var(--rose-dark);
}

.category-nav{
max-width:1240px;
margin:0 auto;
display:flex;
gap:12px;
align-items:center;
padding:0 24px 16px;
overflow-x:auto;
}

.category-nav a{
display:inline-flex;
align-items:center;
height:36px;
padding:0 16px;
border:1px solid var(--line);
border-radius:999px;
background:#fff;
color:var(--ink);
font-size:14px;
box-shadow:0 8px 18px rgba(73,42,52,.04);
}

.hero{
max-width:1240px;
min-height:560px;
margin:26px auto 0;
padding:54px;
display:grid;
grid-template-columns:minmax(0,460px) minmax(420px,1fr);
align-items:center;
gap:38px;
border-radius:28px;
background:
radial-gradient(circle at 90% 15%,rgba(255,255,255,.72) 0 13%,transparent 14%),
linear-gradient(135deg,#fdecef 0%,#fff7f2 48%,#f4d4dd 100%);
box-shadow:var(--shadow);
overflow:hidden;
position:relative;
}

.hero::before{
content:"";
position:absolute;
right:4%;
top:10%;
width:44%;
height:76%;
background:url('/assets/store/img/hero.svg') center/contain no-repeat;
opacity:.92;
filter:drop-shadow(0 26px 30px rgba(73,42,52,.12));
}

.hero::after{
content:"New Collection";
position:absolute;
right:42px;
bottom:34px;
padding:10px 18px;
border-radius:999px;
background:rgba(255,255,255,.76);
color:var(--rose-dark);
font-weight:700;
box-shadow:0 12px 24px rgba(73,42,52,.1);
}

.hero>div{
position:relative;
z-index:1;
max-width:480px;
}

.hero h1{
font-family:Georgia,"Times New Roman",serif;
font-size:68px;
line-height:1;
margin:0 0 18px;
color:var(--rose-dark);
}

.hero p{
font-size:22px;
color:var(--muted);
margin:0 0 26px;
max-width:410px;
}

.section{
max-width:1240px;
margin:0 auto;
padding:58px 24px 12px;
}

.section h1,
.section h2{
font-family:Georgia,"Times New Roman",serif;
font-size:38px;
line-height:1.1;
margin:0 0 22px;
color:var(--ink);
}

.section>p{
color:var(--muted);
max-width:680px;
margin-top:-8px;
margin-bottom:28px;
}

.narrow{max-width:640px}

.products{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:24px;
align-items:stretch;
}

.product{
position:relative;
overflow:hidden;
border:1px solid rgba(234,221,226,.9);
border-radius:22px;
background:rgba(255,255,255,.86);
box-shadow:0 16px 36px rgba(73,42,52,.08);
transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}

.product:hover{
transform:translateY(-5px);
box-shadow:0 24px 50px rgba(73,42,52,.14);
border-color:#e6c2cf;
}

.product a{
display:grid;
height:100%;
text-decoration:none;
}

.product img{
width:100%;
aspect-ratio:4/5;
object-fit:cover;
background:
radial-gradient(circle at 70% 20%,#fff 0 10%,transparent 11%),
linear-gradient(145deg,#fff2f5,#f8dedf 55%,#efe7d7);
padding:18px;
}

.product h3{
font-size:17px;
line-height:1.3;
margin:16px 18px 5px;
min-height:44px;
color:var(--ink);
}

.price,
.product p{
margin:0 18px 18px;
color:var(--rose-dark);
font-size:16px;
font-weight:800;
}

.product::before{
content:"Soft feel";
position:absolute;
left:14px;
top:14px;
z-index:1;
padding:7px 11px;
border-radius:999px;
background:rgba(255,255,255,.86);
color:var(--rose-dark);
font-size:12px;
font-weight:800;
box-shadow:0 8px 18px rgba(73,42,52,.08);
}

.product-page{
max-width:1240px;
margin:0 auto;
padding:44px 24px;
display:grid;
grid-template-columns:minmax(0,1.05fr) minmax(330px,.95fr);
gap:42px;
}

.product-image img{
width:100%;
border-radius:26px;
background:linear-gradient(145deg,#fff2f5,#f6e2dc);
box-shadow:var(--shadow);
padding:22px;
}

.product-info{
align-self:start;
padding:28px;
border-radius:24px;
background:rgba(255,255,255,.82);
border:1px solid var(--line);
box-shadow:0 16px 36px rgba(73,42,52,.08);
}

.product-info h1{
font-family:Georgia,"Times New Roman",serif;
font-size:44px;
line-height:1.08;
margin:0 0 18px;
color:var(--rose-dark);
}

.product-info p{color:var(--muted)}
.product-info h2{font-size:28px;color:var(--ink)}

.inline-form{
display:flex;
gap:10px;
align-items:center;
flex-wrap:wrap;
margin:18px 0;
}

.inline-form input[type=number]{max-width:110px}

.table{
width:100%;
border-collapse:separate;
border-spacing:0;
background:#fff;
border:1px solid var(--line);
border-radius:18px;
overflow:hidden;
box-shadow:0 12px 28px rgba(73,42,52,.06);
}

.table th,
.table td{
padding:14px;
border-bottom:1px solid var(--line);
text-align:left;
vertical-align:top;
}

.table th{
background:var(--blush-2);
color:var(--rose-dark);
font-size:13px;
text-transform:uppercase;
letter-spacing:.04em;
}

.summary,
.panel{
border:1px solid var(--line);
border-radius:20px;
padding:22px;
margin-top:20px;
background:rgba(255,255,255,.86);
box-shadow:0 14px 32px rgba(73,42,52,.07);
}

.form-grid{
display:grid;
gap:14px;
}

.checkout textarea,
.form-grid textarea{min-height:110px}
.error{color:#a1183b;font-weight:800}
.success{text-align:center}

.admin-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:14px;
}

.admin-grid a{
padding:18px;
border:1px solid var(--line);
border-radius:18px;
text-decoration:none;
background:#fff;
box-shadow:0 12px 28px rgba(73,42,52,.06);
}

.site-footer{
margin-top:58px;
padding:34px 24px;
background:linear-gradient(135deg,#3b2830,#6e3850);
color:#fff;
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:24px;
}

.site-footer strong{
font-family:Georgia,"Times New Roman",serif;
font-size:26px;
}

.site-footer p{color:#f4dce4}
.site-footer a{color:#fff;text-decoration:none;margin-left:16px}

@media(max-width:900px){
.topbar{
grid-template-columns:1fr;
gap:12px;
}
.search{justify-self:stretch;width:100%}
.header-actions{justify-content:space-between;overflow-x:auto}
.hero{
grid-template-columns:1fr;
min-height:520px;
padding:36px 24px 260px;
margin:18px 16px 0;
}
.hero::before{
width:82%;
height:250px;
right:4%;
top:auto;
bottom:18px;
}
.hero::after{right:24px;bottom:20px}
.hero h1{font-size:48px}
.hero p{font-size:19px}
.product-page{grid-template-columns:1fr}
.site-footer{grid-template-columns:1fr}
.site-footer a{margin-left:0;margin-right:16px}
}

@media(max-width:560px){
.section{padding:42px 16px 8px}
.section h1,.section h2{font-size:31px}
.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.product{border-radius:18px}
.product img{padding:10px}
.product h3{font-size:14px;margin:12px 12px 4px;min-height:38px}
.price,.product p{font-size:14px;margin:0 12px 14px}
.product::before{font-size:11px;left:10px;top:10px}
}
