/* Curl & Crop | Experience redesign v2
   Layout and interaction styling only. Existing JS hooks and checkout logic remain intact. */
:root{
  color-scheme:light;
  --bg:#fbf6f2;
  --surface:#fffdfb;
  --panel:#f3e7e4;
  --ink:#33252a;
  --muted:#7d6b70;
  --gold:#a56c78;
  --gold-soft:#f0dfe1;
  --line:#e8d9d8;
  --wa:#147c69;
  --wa-2:#0d6253;
  --danger:#a3383c;
  --serif:"Young Serif",Georgia,serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --shadow:0 18px 55px rgba(64,38,46,.09);
  --max:1200px;
  --r:24px;
}

html{scroll-behavior:smooth;scroll-padding-top:104px;background:var(--bg)}
body{background:var(--bg);color:var(--ink);line-height:1.65;letter-spacing:.002em}
::selection{background:#e7c6cb;color:#33252a}
.wrap{width:min(var(--max),calc(100% - 48px))}
h1,h2,h3{color:var(--ink);letter-spacing:-.035em}
h1{font-size:clamp(3rem,6.6vw,5.55rem);line-height:.99;max-width:10.5ch}
h1 em,h2 em{font-style:normal;color:#9c5e6e}
h2{font-size:clamp(2.1rem,4.1vw,3.35rem);line-height:1.06;max-width:18ch}
h3{line-height:1.2}
.eyebrow{color:#9d6572;letter-spacing:.2em;font-size:.68rem;font-weight:700}
.lede{font-size:1.04rem;line-height:1.82;color:var(--muted);max-width:48ch}
.micro{font-size:.84rem;line-height:1.65;color:var(--muted)}
.amp{color:#b77c88}

/* A small brand-level cue above the navigation, not another noisy promotion. */
.announcement{min-height:34px;display:flex;align-items:center;justify-content:center;gap:8px;padding:7px 16px;background:#563944;color:#fff8f5;text-align:center;font-size:.72rem;letter-spacing:.075em}
.announcement a{color:#f0cbd0;text-decoration:underline;text-underline-offset:3px;font-weight:700}
.announcement__dot{width:4px;height:4px;flex:none;border-radius:50%;background:#e8b5be}

.site-head{position:sticky;top:0;z-index:50;background:rgba(251,246,242,.92);border-bottom:1px solid rgba(232,217,216,.82);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.site-head.is-scrolled{box-shadow:0 8px 30px rgba(64,38,46,.055)}
.site-head__in{min-height:78px;padding:12px 0;gap:22px}
.logo{font-size:1.6rem;letter-spacing:-.045em;color:#4b303a;white-space:nowrap}
.nav{gap:3px}
.nav a{padding:9px 13px;border-radius:999px;color:#725f65;font-size:.84rem;transition:background .2s,color .2s}
.nav a:hover,.nav a:focus-visible{background:#f0e1e1;color:#563944}
.head__cta{gap:10px}
.head__cta .btn{box-shadow:none}
.nav-toggle{border-radius:12px;color:#563944}
.mnav{background:#fffaf7;border-color:var(--line);padding:8px 0 18px}
.mnav a{padding:13px 4px;border-color:var(--line);font-weight:500}

.btn{min-height:48px;padding:13px 23px;border-radius:999px;background:#603b49;color:#fffaf8;font-size:.88rem;font-weight:700;letter-spacing:.015em;box-shadow:0 8px 20px rgba(96,59,73,.14);transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover{background:#805161;color:white;transform:translateY(-2px);box-shadow:0 13px 28px rgba(96,59,73,.18)}
.btn--wa{background:var(--wa);color:#fff;box-shadow:0 7px 18px rgba(20,124,105,.13)}
.btn--wa:hover{background:var(--wa-2);color:#fff}
.btn--ghost{background:transparent;color:#603b49;border:1px solid #d8c1c4;box-shadow:none}
.btn--ghost:hover{background:#f3e5e4;color:#603b49;border-color:#cdaab1;box-shadow:none}
.btn--sm{min-height:40px;padding:9px 16px;font-size:.8rem}
.btn--block{width:100%}
:focus-visible{outline:3px solid #c88998;outline-offset:3px}

/* Hero: editorial message first, product image second, with one clear primary action. */
.hero{position:relative;isolation:isolate;overflow:hidden;padding:clamp(54px,7.2vw,108px) 0 clamp(58px,7.8vw,104px);background:linear-gradient(116deg,#fffaf6 0%,#f8ece9 55%,#eddbdd 100%);border-radius:0 0 42px 42px}
.hero::before{content:"";position:absolute;z-index:-1;width:min(47vw,650px);aspect-ratio:1;right:-12%;top:-36%;border-radius:50%;border:1px solid rgba(156,94,110,.17);box-shadow:0 0 0 30px rgba(255,255,255,.19),0 0 0 68px rgba(255,255,255,.11)}
.hero::after{content:"";position:absolute;z-index:-1;width:270px;height:270px;left:-150px;bottom:-190px;border-radius:50%;background:rgba(218,170,177,.2);filter:blur(3px)}
.hero__grid{display:grid;gap:clamp(32px,5vw,74px);align-items:center}
@media(min-width:900px){.hero__grid{grid-template-columns:1.04fr .96fr;gap:clamp(54px,7vw,100px)}}
.hero__grid>div:first-child{padding:4px 0 8px}
.hero h1{color:#452c36;max-width:10ch}
.hero .lede{max-width:43ch;color:#77636b;font-size:1.07rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:30px}
.hero__actions .btn{min-width:178px}
.hero__trust{display:grid;gap:9px;margin:28px 0 0;color:#755e67;font-size:.82rem}
.hero__trust li{gap:9px}
.hero__trust svg{color:#9f6271}
.hero__media{position:relative;width:100%;max-width:570px;justify-self:end;aspect-ratio:4/4.65;border-radius:46% 46% 22px 22px;border:8px solid rgba(255,253,251,.8);background:#eddfdc;box-shadow:0 25px 68px rgba(76,45,58,.17);overflow:hidden}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:50% 17%;transform:scale(1.01)}
.hero__badge{left:18px;bottom:18px;padding:11px 16px;border:1px solid rgba(255,255,255,.85);background:rgba(255,253,251,.94);color:#563944;border-radius:999px;box-shadow:0 9px 24px rgba(73,42,54,.12);font-size:.73rem;letter-spacing:.025em}

.trust-strip{padding:19px 0;background:#fffdfb;border-top:1px solid #eadbda;border-bottom:1px solid #eadbda}
.trust-strip__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.trust-strip__item{justify-content:center;gap:9px;color:#715d64;font-size:.8rem;font-weight:500}
.trust-strip__item svg{color:#9f6271}

/* Editorial value story creates breathing room before the catalogue. */
.brand-manifesto{position:relative;padding:clamp(64px,8vw,106px) 0;background:#f5e9e6;overflow:hidden}
.brand-manifesto::after{content:"CURL & CROP";position:absolute;right:-.03em;bottom:-.28em;color:rgba(128,82,96,.045);font-family:var(--serif);font-size:clamp(5rem,17vw,15rem);line-height:1;white-space:nowrap;pointer-events:none}
.brand-manifesto__inner{position:relative;z-index:1;display:grid;gap:32px;align-items:end}
.brand-manifesto__intro{max-width:720px}
.brand-manifesto__intro h2{max-width:16ch}
.brand-manifesto__intro p:last-child{max-width:58ch;margin-top:16px;color:#79666d;line-height:1.8}
.brand-manifesto__points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.brand-manifesto__point{min-width:0;padding:19px 19px 18px;border:1px solid rgba(143,95,107,.18);border-radius:17px;background:rgba(255,253,251,.72)}
.brand-manifesto__point span{display:block;margin-bottom:14px;color:#a36d7a;font-size:.68rem;font-weight:700;letter-spacing:.14em}
.brand-manifesto__point h3{margin-bottom:7px;color:#503640;font-family:var(--sans);font-size:.93rem;font-weight:700;letter-spacing:0}
.brand-manifesto__point p{color:#806d73;font-size:.82rem;line-height:1.65}

.section{padding:clamp(64px,8vw,108px) 0}
.section--panel{background:#f6eeeb}
.section__head{max-width:65ch;margin-bottom:34px}
.section__head .lede{margin-top:15px}
.section__head h2{max-width:19ch}
#shop{background:#fbf6f2}
.cart-toolbar{margin:22px 0 18px;color:#634b55;font-size:.88rem}
.cart-toolbar>span{font-weight:600}
.catalog-tools{gap:12px;margin:22px 0 25px}
.catalog-tools label{display:block;margin-bottom:7px;color:#775f68;font-size:.75rem;font-weight:700;letter-spacing:.055em}
.catalog-tools input,.catalog-tools select{min-height:49px;padding:11px 14px;border:1px solid #e4cfd2;border-radius:13px;background:#fffdfb;color:var(--ink);box-shadow:0 4px 12px rgba(73,42,54,.025)}
.catalog-tools input:focus,.catalog-tools select:focus{outline:3px solid rgba(199,138,152,.23);border-color:#c78a98}
.product-grid{gap:18px;margin-bottom:48px}
.product-card{overflow:hidden;border:1px solid #ead9da;border-radius:20px;background:#fffdfb;box-shadow:0 5px 18px rgba(73,42,54,.035);transition:transform .25s,box-shadow .25s}
.product-card:hover{transform:translateY(-5px);box-shadow:0 18px 36px rgba(73,42,54,.105)}
.product-card__image{background:#f0e4e2}
.product-card__image img{transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.product-card:hover .product-card__image img{transform:scale(1.045)}
.product-card__badge{top:12px;left:12px;padding:7px 11px;border-radius:999px;background:rgba(255,250,248,.96);color:#704754;font-size:.66rem;letter-spacing:.04em}
.product-card__body{padding:16px 16px 17px}
.product-card__category{margin-bottom:5px;color:#a36d7a;font-size:.65rem;font-weight:700;letter-spacing:.14em}
.product-card__body h3{margin-bottom:7px;color:#4c303b;font-size:1.12rem}
.product-card__price{margin-bottom:3px;color:#754454;font-size:1rem;font-weight:700}
.product-card__stock{margin-bottom:12px;color:#88767c;font-size:.73rem}
.product-card__body .btn{width:100%;min-height:40px;padding:9px 13px;font-size:.76rem}
.catalog-empty{border-color:#dcbfc5;background:#fffaf8;color:#806b72}

.shop{gap:clamp(30px,4vw,54px);align-items:start}
@media(min-width:900px){.shop{grid-template-columns:1.06fr .94fr}}
.gal{gap:11px}
.gal__item{border:1px solid #ead6d9;border-radius:17px;background-color:#f0e4e2}
.gal__item span{left:11px;bottom:11px;padding:6px 11px;background:rgba(57,35,45,.78);letter-spacing:.025em}
.shop__panel{position:sticky;top:112px;padding:clamp(23px,3.4vw,37px);border:1px solid #ead8da;border-radius:25px;background:#fffdfb;box-shadow:0 16px 42px rgba(73,42,54,.06)}
.shop__title{align-items:center}
.shop__title h3{color:#4d303b;font-size:1.55rem}
.badge{background:#f3e2e4;color:#935a6b;letter-spacing:.09em}
.price{margin:14px 0 7px;color:#754454;font-size:2.45rem}
.price small{font-size:.76rem}
.shop__desc{color:#7b6870;line-height:1.75}
.opt legend,.shop__panel label{color:#644a55}
.seg span{padding:10px 17px;border-color:#e5d1d5;border-radius:12px;background:#fffbfa}
.seg input:checked+span{border-color:#694352;background:#694352;color:#fff9f6}
.qty{border-color:#e5d1d5;border-radius:13px}
.qty button{background:#fff9f7;color:#684653}
.qty input{color:#4c313c}
.buy-row{gap:9px;margin-top:22px}
#addToCart{background:#603b49;color:#fffaf8}
#addToCart:hover{background:#805161}
#buyWa{background:#147c69;color:#fff}
#askWa{border-color:#d8c1c4;color:#603b49}
.summary{margin-top:14px;color:#806d73;line-height:1.6}
.specs{margin-top:23px;border-color:#eddddf}
.specs div{padding:12px 0;border-color:#eddddf;font-size:.86rem}
.specs dt{color:#8a747c}
.specs dd{color:#583c47}

/* Clear, accurate ordering steps replace the old "no checkout forms" promise. */
#how{background:#f5e9e6}
#how .section__head h2{max-width:20ch}
.steps{gap:15px}
.step{position:relative;min-height:205px;padding:26px 24px 24px;border:1px solid #ead8da;border-radius:20px;background:#fffdfb;box-shadow:0 9px 25px rgba(73,42,54,.035)}
.step__num{width:43px;height:43px;margin-bottom:17px;border:4px solid #f4e3e5;background:#a96778;color:#fff}
.step h3{margin-bottom:9px;color:#533642;font-size:1.08rem}
.step p{color:#7b6870;font-size:.88rem;line-height:1.72}

#learn{background:#fbf6f2}
.edu{gap:30px}
.art,.assistant{border:1px solid #ead8da;border-radius:20px;background:#fffdfb;box-shadow:0 9px 26px rgba(73,42,54,.035)}
.art{padding:23px}
.art__tag{color:#a45e70;letter-spacing:.13em}
.art__open{color:#573a46;line-height:1.3}
.art p{color:#806d73;line-height:1.7}
.assistant{padding:24px}
.assistant h3{color:#563845}
.msg--bot{background:#f7eae9;color:#624854}
.msg--user{background:#694352;color:#fff9f6}
.linkbtn{color:#9b5b6c}
.search input,.assistant__form input{min-height:47px;border:1px solid #e7d3d6;border-radius:13px;background:#fffdfb;color:var(--ink)}
.chip{border-color:#e4cdd2;background:#fffaf8;color:#795c67}
.chip[aria-pressed=true]{border-color:#694352;background:#694352;color:#fff}

.promises{gap:16px}
.promise{padding:24px;border:1px solid #ead8da;border-radius:20px;background:#fffdfb;box-shadow:0 8px 22px rgba(73,42,54,.03)}
.promise svg{color:#a45e70}
.promise h3{margin-bottom:7px;color:#583946}
.promise p{color:#806d73;line-height:1.7;font-size:.88rem}
.review{border-color:#ead8da;border-radius:20px;background:#fffdfb}
.review__stars{color:#b67a83}
.faq-list{max-width:850px}
details{border-color:#e7d4d7}
summary{color:#543845;font-size:.98rem}
summary::after{color:#a45e70}
details p{color:#806d73;line-height:1.75}

#contact{background:#fbf6f2}
.contact{gap:30px}
.field label{color:#634b55}
.field input,.field select,.field textarea{border:1px solid #e5d1d5;border-radius:12px;background:#fffdfb;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid rgba(199,138,152,.22);border-color:#c78a98}

.foot{margin-top:0;padding:56px 0 26px;border-top:0;background:#4b303b;color:#fff7f4}
.foot .logo,.foot h4{color:#fff7f4}
.foot .amp{color:#e3aeb7}
.foot .micro,.foot__legal{color:#d9c5ca}
.foot a{color:#e9d9dc}
.foot a:hover{color:#f2c4cc}
.foot__legal{border-color:rgba(255,255,255,.18)}

.sticky{z-index:45;border-color:#ead8da;background:rgba(255,253,251,.96);backdrop-filter:blur(13px)}
.sticky .btn{background:#603b49;color:#fff9f6}
.sticky .btn:hover{background:#805161}

/* Cart and checkout: roomy on desktop, full-height and scrollable on phones. */
.dlg{border:1px solid #ead8da;border-radius:22px;background:#fffdfb;color:#39262e;box-shadow:0 22px 70px rgba(38,22,29,.22)}
.dlg::backdrop{background:rgba(40,24,31,.54);backdrop-filter:blur(4px)}
.dlg__bar{position:sticky;top:0;z-index:3;border-color:#ead8da;border-radius:22px 22px 0 0;background:rgba(255,253,251,.97);color:#563845;backdrop-filter:blur(10px)}
.dlg__body{max-height:72vh;padding:22px;overscroll-behavior:contain}
#cartDialog{max-width:min(760px,calc(100% - 28px));max-height:calc(100dvh - 36px)}
#cartDialog .dlg__body{max-height:calc(100dvh - 108px)}
#orderSuccessDialog .dlg__body{max-height:calc(100dvh - 92px)}
.iconbtn:hover{background:#f7e9ea;color:#694352}
.acard{border-color:#ead8da;border-radius:15px;background:#fffaf8}
.admin__head{border-color:#ead8da}
.tabs{border-color:#ead8da}
.tab{color:#806d73}
.tab[aria-selected=true]{background:#694352;color:#fff9f6}
.admin__gate input,.aform input,.aform textarea,.aform select{border:1px solid #e5d1d5;border-radius:11px;background:#fffdfb;color:#39262e}
.aform label,.admin__gate label{color:#634b55}
.alist__row{border-color:#ead8da;background:#fffaf8}
.alist__row button{color:#9b5b6c}
.previewbar{background:#f2e0e3;color:#563845}
.previewbar button{background:#694352;color:#fff9f6}
.toast{background:#563845;color:#fff9f6;box-shadow:0 12px 32px rgba(73,42,54,.2)}
.toast.err{background:#9b3941;color:#fff}

.cart-total{border-color:#ead8da;color:#654a56}
.cart-total strong{color:#573744}
.cart-total--detail{font-size:.94rem}
.cart-total--grand{border-color:#dfc4ca;font-size:1.1rem}
.cart-total--grand strong{color:#744453;font-size:1.24rem}
.cart-line{border-color:#eddddf}
.cart-line img{border-radius:13px;background:#f3e5e5}
.cart-line__actions button{border-color:#e5d1d5;border-radius:9px;background:#fffdfb;color:#674653}
.checkout-form{gap:11px}
.checkout-form h3,.checkout-form h4{color:#573845}
.checkout-form input,.checkout-form textarea,.checkout-form select{border:1px solid #e5d1d5;border-radius:11px;background:#fffdfb;color:#39262e}
.checkout-form input:focus,.checkout-form textarea:focus,.checkout-form select:focus{outline:3px solid rgba(199,138,152,.22);border-color:#c78a98}
#checkoutDeliveryInfo{border:1px solid #ebd7da;border-radius:13px;background:#f8edec;padding:12px 14px;color:#70515d}
#cartDeliveryNote{color:#89757d}
.order-controls select{border-color:#e5d1d5;border-radius:10px;background:#fffdfb;color:#39262e}

@media(min-width:960px){
  .brand-manifesto__inner{grid-template-columns:.85fr 1.15fr;gap:64px}
  .brand-manifesto__points{align-self:end}
}
@media(max-width:880px){
  .hero{border-radius:0 0 30px 30px}
  .mnav{background:#fff9f6;border-color:#ead8da}
  .mnav a{border-color:#ead8da;color:#654a56}
  .mnav .btn{color:#fff}
}
@media(max-width:760px){
  .brand-manifesto__points{grid-template-columns:1fr;gap:10px}
  .brand-manifesto__point{display:grid;grid-template-columns:32px 1fr;column-gap:10px;align-items:start;padding:15px}
  .brand-manifesto__point span{grid-row:span 2;margin:2px 0 0}
  .brand-manifesto__point h3{margin-bottom:4px}
}
@media(max-width:640px){
  .wrap{width:min(var(--max),calc(100% - 30px))}
  .announcement{min-height:31px;font-size:.63rem;letter-spacing:.035em}
  .site-head__in{min-height:66px;padding:10px 0}
  .logo{font-size:1.36rem}
  .head__cta>.btn{padding:9px 12px;font-size:.72rem;min-height:38px}
  .hero{padding:44px 0 52px}
  .hero h1{font-size:clamp(2.85rem,13vw,4.15rem);max-width:10.2ch}
  .hero__grid{gap:29px}
  .hero .lede{font-size:.98rem}
  .hero__actions{display:grid;grid-template-columns:1fr;max-width:370px;margin-top:23px}
  .hero__actions .btn{width:100%}
  .hero__trust{margin-top:22px;font-size:.78rem}
  .hero__media{width:min(100%,430px);margin-inline:auto!important;border-width:6px;aspect-ratio:4/4.55}
  .hero__badge{left:12px;bottom:12px;padding:9px 12px;font-size:.68rem}
  .trust-strip{padding:16px 0}
  .trust-strip__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 9px}
  .trust-strip__item{justify-content:flex-start;font-size:.73rem}
  .section{padding:58px 0}
  .section__head{margin-bottom:26px}
  .brand-manifesto{padding:58px 0}
  .brand-manifesto__intro h2{font-size:2.25rem}
  .cart-toolbar{align-items:flex-start}
  .cart-toolbar>span{max-width:15ch}
  .product-grid{gap:10px;margin-bottom:38px}
  .product-card{border-radius:15px}
  .product-card__body{padding:10px}
  .product-card__body h3{font-size:.97rem}
  .product-card__price{font-size:.9rem}
  .product-card__stock{font-size:.68rem}
  .product-card__body .btn{min-height:38px;font-size:.69rem;padding:8px 6px}
  .shop{gap:22px}
  .shop__panel{position:static;padding:20px;border-radius:19px}
  .shop__title{flex-wrap:wrap}
  .shop__title h3{font-size:1.35rem}
  .buy-row{gap:8px}
  .steps{gap:11px}
  .step{min-height:0;padding:20px}
  .foot{padding:42px 0 25px}
  .cart-total{font-size:.94rem}
  #cartDialog{width:100%;max-width:none;max-height:100dvh;height:100dvh;margin:0;border-radius:0;border:0}
  #cartDialog .dlg__bar{border-radius:0}
  #cartDialog .dlg__body{max-height:calc(100dvh - 66px);padding:16px}
  #orderSuccessDialog{width:100%;max-width:none;max-height:100dvh;height:100dvh;margin:0;border-radius:0;border:0}
  #orderSuccessDialog .dlg__bar{border-radius:0}
  #orderSuccessDialog .dlg__body{max-height:calc(100dvh - 66px);padding:16px}
  .dlg__body{padding:17px}
  .order-controls{grid-template-columns:1fr}
  .form__actions .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}