/*
Theme Name: Veronica Fashion
Theme URI: https://veronica.ae
Author: Veronica Fashion L.L.C.
Description: Custom boutique theme for Veronica Fashion — product showcase with categories, catalogs and a WhatsApp inquiry basket. Manage products from the WordPress admin (Products menu).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: veronica-fashion
*/

:root{
  --ivory:#FAF7F4; --paper:#FFFFFF; --ink:#161217; --magenta:#D40F78;
  --magenta-dark:#A80B60; --rose:#F4DFEB; --rose-soft:#FBF1F7;
  --mist:#8E8590; --hairline:rgba(22,18,23,.13); --wa:#25D366;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;background:var(--ivory);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
.ar{font-family:'Tajawal',sans-serif;direction:rtl}
.wrap{width:min(1240px,92vw);margin:0 auto}
.eyebrow{font-size:11px;letter-spacing:.4em;text-indent:.4em;text-transform:uppercase;color:var(--magenta);font-weight:500}
.sec-head{text-align:center;margin-bottom:clamp(36px,6vw,60px)}
.sec-head h2{font-family:'Tenor Sans',serif;font-weight:400;font-size:clamp(26px,4vw,40px);letter-spacing:.18em;text-indent:.18em;text-transform:uppercase;margin-top:14px}
.sec-head .ar-sub{color:var(--mist);font-size:15px;margin-top:8px;font-weight:300}
.sec-rule{display:flex;align-items:center;gap:9px;width:110px;margin:18px auto 0}
.sec-rule .l{flex:1;height:2px;background:var(--magenta)}
.sec-rule .d{width:6px;height:6px;border-radius:50%;background:var(--magenta);flex:none}
section{padding:clamp(64px,9vw,110px) 0}

/* top bar */
.topbar{background:var(--ink);color:#EDE7EA;font-size:12.5px;letter-spacing:.06em}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 0}
.topbar a{display:inline-flex;align-items:center;gap:7px;transition:color .3s}
.topbar a:hover{color:var(--magenta)}
.topbar .grp{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.topbar svg{width:13px;height:13px;fill:currentColor;flex:none}
@media(max-width:720px){.topbar .loc-item{display:none}}

/* nav */
nav.main{position:sticky;top:0;z-index:60;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--hairline)}
body.admin-bar nav.main{top:32px}
@media(max-width:782px){body.admin-bar nav.main{top:46px}}
nav.main .wrap{display:flex;align-items:center;justify-content:space-between;height:78px;gap:20px}
.nav-logo{display:flex;align-items:center}
.nav-logo img,.nav-logo .custom-logo,img.custom-logo{height:44px;width:auto;max-width:220px;object-fit:contain}
.custom-logo-link{display:flex;align-items:center}
@media(max-width:520px){.nav-logo img,.nav-logo .custom-logo,img.custom-logo{height:36px;max-width:170px}}
.nav-links{display:flex;gap:clamp(18px,2.6vw,36px);list-style:none;align-items:center}
.nav-links a{font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:400;position:relative;padding:6px 0;transition:color .3s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:1.5px;width:0;background:var(--magenta);transition:width .35s cubic-bezier(.2,.65,.25,1)}
.nav-links a:hover{color:var(--magenta)}
.nav-links a:hover::after{width:100%}
.nav-cta{background:var(--magenta);color:#fff;border:none;padding:11px 22px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;transition:background .3s,transform .3s}
.nav-cta:hover{background:var(--magenta-dark);transform:translateY(-1px)}
.burger{display:none;background:none;border:none;width:40px;height:40px;position:relative}
.burger span{position:absolute;left:8px;right:8px;height:2px;background:var(--ink);transition:.35s}
.burger span:nth-child(1){top:13px}.burger span:nth-child(2){top:20px}.burger span:nth-child(3){top:27px}
.burger.open span:nth-child(1){top:20px;transform:rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){top:20px;transform:rotate(-45deg)}
@media(max-width:920px){
  .nav-links{position:fixed;inset:78px 0 auto 0;background:var(--ivory);flex-direction:column;padding:28px 6vw 34px;gap:22px;border-bottom:1px solid var(--hairline);transform:translateY(-130%);transition:transform .45s cubic-bezier(.2,.65,.25,1);box-shadow:0 24px 40px rgba(22,18,23,.08);align-items:flex-start;z-index:59}
  body.admin-bar .nav-links{inset:124px 0 auto 0}
  .nav-links.open{transform:none}
  .burger{display:block}
  .nav-cta-desktop{display:none}
}

/* hero */
.hero{position:relative;min-height:calc(100svh - 116px);display:flex;align-items:center;overflow:hidden;padding:60px 0}
.hero .glow{position:absolute;right:-12vw;top:-18vh;width:64vw;height:64vw;background:radial-gradient(circle,var(--rose) 0%,transparent 60%);opacity:.7;pointer-events:none}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,70px);align-items:center;position:relative;z-index:2}
.hero-copy .eyebrow{color:var(--mist)}
.hero-copy h1{font-family:'Tenor Sans',serif;font-weight:400;font-size:clamp(34px,5.2vw,62px);line-height:1.14;letter-spacing:.06em;margin:22px 0 8px}
.hero-copy h1 em{font-style:normal;color:var(--magenta)}
.hero-copy .ar-line{color:var(--mist);font-size:clamp(15px,1.8vw,19px);font-weight:300;margin-bottom:22px}
.hero-copy p.lede{font-weight:300;font-size:clamp(15px,1.6vw,17.5px);line-height:1.8;color:#3d3740;max-width:50ch;margin-bottom:34px}
.btn-row{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 30px;font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;border:1px solid var(--ink);transition:.35s;font-weight:400;background:none}
.btn.solid{background:var(--ink);color:var(--ivory)}
.btn.solid:hover{background:var(--magenta);border-color:var(--magenta);transform:translateY(-2px)}
.btn.ghost:hover{border-color:var(--magenta);color:var(--magenta);transform:translateY(-2px)}
.btn.magenta{background:var(--magenta);border-color:var(--magenta);color:#fff}
.btn.magenta:hover{background:var(--magenta-dark);border-color:var(--magenta-dark);transform:translateY(-2px)}
.hero-art{position:relative;display:flex;justify-content:center}
.hero-art .card{background:var(--paper);border:1px solid var(--hairline);padding:clamp(26px,3vw,44px) clamp(22px,2.6vw,38px);box-shadow:0 30px 60px rgba(22,18,23,.09);position:relative}
.hero-art .card::before{content:"";position:absolute;inset:10px;border:1px solid var(--hairline);pointer-events:none}
.hero-art img.lady{height:clamp(260px,32vw,400px);width:auto;margin:0 auto}
.hero-art .tag{position:absolute;background:var(--ink);color:var(--ivory);font-size:10.5px;letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;padding:9px 16px}
.hero-art .tag.t1{top:26px;left:-18px}
.hero-art .tag.t2{bottom:34px;right:-16px;background:var(--magenta)}
@media(max-width:860px){
  .hero .wrap{grid-template-columns:1fr;text-align:center}
  .hero-copy p.lede{margin-inline:auto}
  .btn-row{justify-content:center}
  .hero-art{order:-1}
  .hero-art img.lady{height:200px}
  .hero-art .tag{display:none}
}

/* strip */
.strip{background:var(--ink);color:#CFC6CC;overflow:hidden;padding:13px 0;border-block:1px solid var(--hairline)}
.strip .track{display:flex;flex-wrap:nowrap;width:max-content;animation:marq 32s linear infinite;will-change:transform}
.strip .track:hover{animation-play-state:paused}
.strip-group{font-size:11.5px;letter-spacing:.34em;text-transform:uppercase;display:inline-flex;align-items:center;gap:54px;padding-right:54px;white-space:nowrap;flex:none}
.strip i{width:5px;height:5px;border-radius:50%;background:var(--magenta);display:inline-block;flex:none}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* categories */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,26px)}
.cat-card{position:relative;background:var(--paper);border:1px solid var(--hairline);overflow:hidden;cursor:pointer;transition:transform .4s cubic-bezier(.2,.65,.25,1),box-shadow .4s}
.cat-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(22,18,23,.1)}
.cat-card .art{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.cat-card .art svg,.cat-card .art img{height:100%;width:100%;object-fit:cover;transition:transform .5s}
.cat-card .art svg{height:78%;width:auto;object-fit:contain}
.cat-card:hover .art svg,.cat-card:hover .art img{transform:scale(1.06)}
.cat-card .meta{padding:18px 20px 20px;border-top:1px solid var(--hairline);display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.cat-card h3{font-family:'Tenor Sans',serif;font-weight:400;font-size:17px;letter-spacing:.14em;text-transform:uppercase}
.cat-card .cnt{font-size:12px;color:var(--mist);letter-spacing:.1em}
.cat-card .go{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:var(--ivory);border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--magenta);opacity:0;transform:translateY(-6px);transition:.35s}
.cat-card:hover .go{opacity:1;transform:none}
@media(max-width:860px){.cat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.cat-grid{grid-template-columns:1fr 1fr;gap:12px}.cat-card h3{font-size:13.5px}.cat-card .meta{padding:13px 13px 15px}}

/* products */
#products{background:var(--rose-soft)}
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:16px}
.chip{border:1px solid var(--hairline);background:var(--paper);padding:9px 20px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;transition:.3s}
.chip:hover{border-color:var(--magenta);color:var(--magenta)}
.chip.active{background:var(--ink);color:var(--ivory);border-color:var(--ink)}
.search-row{display:flex;justify-content:center;margin-bottom:clamp(28px,4vw,44px)}
.search-row input{width:min(420px,86vw);border:1px solid var(--hairline);background:var(--paper);padding:13px 20px;font-family:'Jost',sans-serif;font-size:14.5px;letter-spacing:.04em;outline:none;transition:border-color .3s}
.search-row input:focus{border-color:var(--magenta)}
.prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:clamp(16px,2vw,26px)}
.prod{background:var(--paper);border:1px solid var(--hairline);overflow:hidden;display:flex;flex-direction:column;transition:transform .4s cubic-bezier(.2,.65,.25,1),box-shadow .4s}
.prod.hide{display:none}
.prod:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(22,18,23,.1)}
.prod .ph{aspect-ratio:3/3.4;position:relative;overflow:hidden;cursor:pointer;background:var(--rose-soft)}
.prod .ph svg{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.prod .ph img{width:100%;height:100%;object-fit:contain;object-position:center;transition:transform .5s}
.prod:hover .ph svg,.prod:hover .ph img{transform:scale(1.05)}
.prod .badge{position:absolute;top:12px;left:12px;background:var(--magenta);color:#fff;font-size:9.5px;letter-spacing:.24em;text-indent:.24em;text-transform:uppercase;padding:6px 11px}
.prod .body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:5px;flex:1}
.prod h3{font-family:'Tenor Sans',serif;font-weight:400;font-size:16px;letter-spacing:.08em}
.prod .sku{font-size:11.5px;color:var(--mist);letter-spacing:.14em}
.prod .cat-tag{font-size:11px;color:var(--magenta);letter-spacing:.2em;text-transform:uppercase}
.prod .acts{display:flex;gap:8px;margin-top:auto;padding-top:14px}
.prod .acts .add{flex:1;border:1px solid var(--ink);background:none;padding:11px 8px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;transition:.3s;display:flex;align-items:center;justify-content:center;gap:7px}
.prod .acts .add:hover{background:var(--ink);color:var(--ivory)}
.prod .acts .add.in{background:var(--magenta);border-color:var(--magenta);color:#fff}
.prod .acts .wa-mini{width:42px;border:1px solid var(--wa);background:none;display:flex;align-items:center;justify-content:center;transition:.3s;flex:none}
.prod .acts .wa-mini svg{width:19px;height:19px;fill:var(--wa);transition:.3s}
.prod .acts .wa-mini:hover{background:var(--wa)}
.prod .acts .wa-mini:hover svg{fill:#fff}
.empty-note{text-align:center;color:var(--mist);font-weight:300;padding:50px 0;font-size:15px;letter-spacing:.06em;display:none}

/* catalogs */
.catalog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(16px,2vw,26px)}
.catalog{background:var(--paper);border:1px solid var(--hairline);padding:0 0 22px;text-align:center;transition:transform .4s,box-shadow .4s;display:flex;flex-direction:column}
.catalog:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(22,18,23,.1)}
.catalog .cover{aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--hairline);position:relative;overflow:hidden}
.catalog .cover .season{font-family:'Tenor Sans',serif;font-size:clamp(20px,2vw,26px);letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;color:var(--ink);z-index:2}
.catalog .cover::after{content:"";position:absolute;inset:12px;border:1px solid rgba(22,18,23,.18)}
.catalog h3{font-family:'Tenor Sans',serif;font-weight:400;font-size:17px;letter-spacing:.1em;margin:20px 14px 4px}
.catalog p{font-size:13.5px;color:var(--mist);font-weight:300;margin:0 20px 18px;line-height:1.6}
.catalog .btn{margin:auto auto 0;padding:11px 22px;font-size:11px}

/* about */
#about .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,6vw,80px);align-items:center}
#about .art{position:relative;display:flex;justify-content:center}
#about .art .frame-box{border:1px solid var(--hairline);padding:clamp(24px,3vw,44px);background:var(--paper);box-shadow:0 26px 52px rgba(22,18,23,.08)}
#about .art img{height:clamp(240px,26vw,360px);width:auto}
#about h2{font-family:'Tenor Sans',serif;font-weight:400;font-size:clamp(24px,3.4vw,36px);letter-spacing:.14em;text-transform:uppercase;margin:14px 0 6px}
#about .ar-sub{color:var(--mist);margin-bottom:20px;font-weight:300}
#about p{font-weight:300;line-height:1.85;color:#3d3740;margin-bottom:16px;font-size:15.5px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.stat{border-top:2px solid var(--magenta);padding-top:14px}
.stat b{font-family:'Tenor Sans',serif;font-weight:400;font-size:clamp(22px,2.6vw,30px);display:block}
.stat span{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist)}
@media(max-width:820px){#about .wrap{grid-template-columns:1fr}#about .art{order:-1}}

/* inquiry */
#inquiry{background:var(--ink);color:#EDE7EA}
#inquiry .eyebrow{color:var(--magenta)}
#inquiry .sec-head h2{color:#fff}
#inquiry .wrap.grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,70px)}
.sel-panel{border:1px solid rgba(255,255,255,.14);padding:clamp(22px,3vw,34px);background:rgba(255,255,255,.03)}
.sel-panel h3,.form-panel h3{font-family:'Tenor Sans',serif;font-weight:400;letter-spacing:.2em;text-transform:uppercase;font-size:15px;margin-bottom:18px;color:#fff}
.sel-list{display:flex;flex-direction:column;gap:10px;max-height:280px;overflow:auto;padding-right:6px}
.sel-list::-webkit-scrollbar{width:4px}
.sel-list::-webkit-scrollbar-thumb{background:var(--magenta)}
.sel-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid rgba(255,255,255,.12);padding:11px 14px;font-size:13.5px;letter-spacing:.05em}
.sel-item .sku{color:var(--magenta);font-size:11.5px;letter-spacing:.14em}
.sel-item button{background:none;border:none;color:#8E8590;font-size:17px;line-height:1;transition:color .3s}
.sel-item button:hover{color:var(--magenta)}
.sel-empty{color:#8E8590;font-weight:300;font-size:14px;line-height:1.7}
.form-panel label{display:block;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#B9B0B6;margin:0 0 8px}
.form-panel input,.form-panel textarea{width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.16);color:#fff;padding:13px 16px;font-family:'Jost',sans-serif;font-size:14.5px;letter-spacing:.04em;outline:none;margin-bottom:20px;transition:border-color .3s}
.form-panel input:focus,.form-panel textarea:focus{border-color:var(--magenta)}
.form-panel textarea{resize:vertical;min-height:90px}
.send-row{display:flex;gap:12px;flex-wrap:wrap}
.send-row .btn{border-color:rgba(255,255,255,.3);color:#fff}
.send-row .btn.wa{background:var(--wa);border-color:var(--wa)}
.send-row .btn.wa:hover{filter:brightness(1.08);transform:translateY(-2px)}
.send-row .btn.ghost:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08)}
@media(max-width:820px){#inquiry .wrap.grid{grid-template-columns:1fr}}

/* contact */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(16px,2vw,26px)}
.c-card{background:var(--paper);border:1px solid var(--hairline);padding:30px 26px;text-align:center;transition:transform .4s,box-shadow .4s}
.c-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(22,18,23,.08)}
.c-card .ic{width:48px;height:48px;border-radius:50%;background:var(--rose);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.c-card .ic svg{width:20px;height:20px;fill:var(--magenta)}
.c-card h3{font-family:'Tenor Sans',serif;font-weight:400;font-size:14px;letter-spacing:.24em;text-transform:uppercase;margin-bottom:10px}
.c-card p,.c-card a.val{font-weight:300;font-size:14.5px;line-height:1.7;color:#3d3740;display:block}
.c-card a.val:hover{color:var(--magenta)}
.c-card .sub{font-size:12.5px;color:var(--mist);margin-top:4px}

/* footer */
footer.site-footer{background:var(--ink);color:#B9B0B6;padding:clamp(50px,7vw,80px) 0 0}
.f-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:clamp(28px,4vw,56px);padding-bottom:50px}
.f-brand img{height:52px;width:auto;filter:brightness(0) invert(1);opacity:.95;margin-bottom:18px}
.f-brand p{font-weight:300;font-size:13.5px;line-height:1.8}
footer.site-footer h4{font-family:'Tenor Sans',serif;color:#fff;font-weight:400;font-size:13px;letter-spacing:.28em;text-transform:uppercase;margin-bottom:18px}
footer.site-footer ul{list-style:none;display:flex;flex-direction:column;gap:11px}
footer.site-footer ul a{font-size:13.5px;font-weight:300;letter-spacing:.06em;transition:color .3s}
footer.site-footer ul a:hover{color:var(--magenta)}
footer.site-footer ul li{font-size:13.5px;font-weight:300;line-height:1.6}
.f-bottom{border-top:1px solid rgba(255,255,255,.1);padding:20px 0;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.f-bottom .dom{color:var(--magenta)}
@media(max-width:900px){.f-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.f-grid{grid-template-columns:1fr}}

/* floaters */
.wa-float{position:fixed;right:clamp(16px,2.6vw,30px);bottom:clamp(16px,2.6vw,30px);z-index:80;width:56px;height:56px;border-radius:50%;background:var(--wa);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 22px rgba(37,211,102,.4);transition:transform .3s}
.wa-float:hover{transform:translateY(-4px) scale(1.06)}
.wa-float svg{width:30px;height:30px;fill:#fff}
.basket-float{position:fixed;right:clamp(16px,2.6vw,30px);bottom:calc(clamp(16px,2.6vw,30px) + 70px);z-index:80;width:56px;height:56px;border-radius:50%;background:var(--magenta);border:none;display:none;align-items:center;justify-content:center;box-shadow:0 6px 22px rgba(212,15,120,.42);transition:transform .3s}
.basket-float.show{display:flex}
.basket-float:hover{transform:translateY(-4px) scale(1.06)}
.basket-float svg{width:24px;height:24px;fill:#fff}
.basket-float .n{position:absolute;top:-4px;right:-4px;background:var(--ink);color:#fff;font-size:11px;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid var(--ivory)}

/* modal */
.vf-modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px}
.vf-modal.open{display:flex}
.vf-modal .backdrop{position:absolute;inset:0;background:rgba(22,18,23,.6);backdrop-filter:blur(4px)}
.vf-modal .box{position:relative;background:var(--paper);width:min(760px,94vw);max-height:90svh;overflow:auto;display:grid;grid-template-columns:1fr 1fr;animation:mup .45s cubic-bezier(.2,.65,.25,1)}
@keyframes mup{from{opacity:0;transform:translateY(24px)}to{opacity:1}}
.vf-modal .m-art{background:var(--rose-soft);display:flex;align-items:center;justify-content:center;min-height:320px;overflow:hidden}
.vf-modal .m-art svg{width:100%;height:100%;object-fit:cover}
.vf-modal .m-art img{width:100%;height:100%;object-fit:contain}
.vf-modal .m-body{padding:clamp(24px,3.4vw,40px)}
.vf-modal .m-body .cat-tag{font-size:11px;color:var(--magenta);letter-spacing:.26em;text-transform:uppercase}
.vf-modal .m-body h3{font-family:'Tenor Sans',serif;font-weight:400;font-size:clamp(21px,2.6vw,27px);letter-spacing:.08em;margin:10px 0 4px}
.vf-modal .m-body .sku{font-size:12.5px;color:var(--mist);letter-spacing:.16em;margin-bottom:18px;display:block}
.vf-modal .m-body p{font-weight:300;font-size:14.5px;line-height:1.8;color:#3d3740;margin-bottom:22px}
.vf-modal .m-acts{display:flex;flex-direction:column;gap:11px}
.vf-modal .m-acts .btn{justify-content:center}
.vf-modal .x{position:absolute;top:12px;right:12px;width:38px;height:38px;border-radius:50%;border:1px solid var(--hairline);background:var(--paper);font-size:19px;line-height:1;z-index:2;transition:.3s}
.vf-modal .x:hover{background:var(--ink);color:#fff}
@media(max-width:640px){.vf-modal .box{grid-template-columns:1fr}.vf-modal .m-art{min-height:220px}}

/* fabric disclaimer note */
.fabric-note{margin-top:16px;font-size:13px;font-style:italic;font-weight:300;color:var(--mist);letter-spacing:.04em}

/* gallery viewer (modal) */
.vf-modal .m-art{position:relative}
.g-nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:1px solid var(--hairline);background:rgba(255,255,255,.92);font-size:17px;line-height:1;display:flex;align-items:center;justify-content:center;transition:.3s;z-index:3}
.g-nav:hover{background:var(--ink);color:#fff}
.g-prev{left:10px}.g-next{right:10px}
.g-count{position:absolute;bottom:10px;right:12px;background:rgba(22,18,23,.75);color:#fff;font-size:11px;letter-spacing:.14em;padding:4px 10px;z-index:3}

/* gallery thumbnails (single product page) */
.g-thumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.g-thumb{width:68px;height:68px;padding:0;border:1px solid var(--hairline);background:var(--paper);overflow:hidden;transition:border-color .3s}
.g-thumb img{width:100%;height:100%;object-fit:cover}
.g-thumb.active,.g-thumb:hover{border-color:var(--magenta)}

/* toast */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(80px);background:var(--ink);color:#fff;padding:13px 26px;font-size:13px;letter-spacing:.12em;z-index:120;transition:transform .45s cubic-bezier(.2,.65,.25,1);pointer-events:none}
.toast.show{transform:translateX(-50%)}

/* reveals */
.reveal-io{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s cubic-bezier(.2,.65,.25,1)}
.reveal-io.vis{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal-io{opacity:1;transform:none}}

/* single product page */
.single-product-wrap{padding:clamp(50px,7vw,90px) 0}
.single-product-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,70px);align-items:start}
.single-product-grid .img-box{border:1px solid var(--hairline);background:var(--rose-soft);aspect-ratio:3/3.4;overflow:hidden}
.single-product-grid .img-box svg{width:100%;height:100%;object-fit:cover}
.single-product-grid .img-box img{width:100%;height:100%;object-fit:contain}
.single-product-grid h1{font-family:'Tenor Sans',serif;font-weight:400;font-size:clamp(26px,3.4vw,38px);letter-spacing:.1em;margin:10px 0 6px}
.single-product-grid .content{font-weight:300;line-height:1.85;color:#3d3740;margin:20px 0 28px}
@media(max-width:760px){.single-product-grid{grid-template-columns:1fr}}