/* =========================================================
   SOLTERO FLOWERS — APK VISION PREMIUM STYLESHEET
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
  --bg: #FFF8F6;
  --bg-2: #FFEFF2;
  --accent: #FF5C8A;
  --accent-dark: #E14577;
  --accent-2: #7ED6A7;
  --gold: #D4AF37;
  --text: #202124;
  --text-soft: rgba(32,33,36,.62);
  --glass: rgba(255,255,255,.55);
  --glass-strong: rgba(255,255,255,.75);
  --glass-border: rgba(255,255,255,.65);
  --shadow-color: 336deg 70% 60%;
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --nav-h: 84px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --splash-glow: #FFE3EC;
  color-scheme: light;
}

:root.dark{
  --bg: #16121A;
  --bg-2: #1D1620;
  --text: #F5EEF2;
  --text-soft: rgba(245,238,242,.62);
  --glass: rgba(40,32,40,.55);
  --glass-strong: rgba(48,38,48,.75);
  --glass-border: rgba(255,255,255,.12);
  --splash-glow: #3A2130;
  color-scheme: dark;
}

*,*::before,*::after{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:'Manrope', sans-serif;
  background: var(--bg);
  color: var(--text);
  overscroll-behavior:none;
  -webkit-tap-highlight-color: transparent;
  transition: background .5s ease, color .5s ease;
}

h1,h2,h3,.display{
  font-family:'Cormorant Garamond', serif;
  font-weight:600;
  letter-spacing:.2px;
  margin:0;
}

p{ margin:0; }
button{ font-family:inherit; border:none; background:none; cursor:pointer; -webkit-tap-highlight-color:transparent; }
img{ -webkit-user-drag:none; user-select:none; }
a{ color:inherit; text-decoration:none; }

/* ---------- ambient background ---------- */
#bg-canvas{
  position:fixed; inset:0; z-index:0; pointer-events:none;
}
.bg-blob{
  position:fixed; border-radius:50%;
  filter: blur(70px);
  opacity:.45;
  z-index:0;
  pointer-events:none;
  animation: floatBlob 16s ease-in-out infinite;
}
.blob-1{ width:340px; height:340px; background: radial-gradient(circle, var(--accent), transparent 70%); top:-80px; left:-60px; }
.blob-2{ width:300px; height:300px; background: radial-gradient(circle, var(--accent-2), transparent 70%); bottom:120px; right:-80px; animation-delay:-6s; }
.blob-3{ width:260px; height:260px; background: radial-gradient(circle, var(--gold), transparent 70%); top:40%; left:60%; animation-delay:-11s; opacity:.3; }

@keyframes floatBlob{
  0%,100%{ transform: translate(0,0) scale(1); }
  33%{ transform: translate(20px,-30px) scale(1.08); }
  66%{ transform: translate(-15px,20px) scale(.95); }
}

/* ---------- app shell ---------- */
#app{
  position:relative; z-index:1;
  max-width:560px; margin:0 auto;
  min-height:100vh;
  padding-bottom: calc(var(--nav-h) + 28px + var(--safe-bottom));
}

.screen{ display:none; padding: calc(18px + var(--safe-top)) 18px 8px; }
.screen.active{ display:block; }

/* ---------- glass utility ---------- */
.glass{
  background: var(--glass);
  backdrop-filter: blur(22px) saturate(160%);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  border: 1px solid var(--glass-border);
}
.glass-strong{
  background: var(--glass-strong);
  backdrop-filter: blur(28px) saturate(180%);
  -webkit-backdrop-filter: blur(28px) saturate(180%);
  border: 1px solid var(--glass-border);
}

/* ---------- top bar ---------- */
.topbar{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:18px;
}
.topbar .brand{
  display:flex; align-items:center; gap:10px;
}
.topbar .brand-mark{
  width:38px; height:38px; border-radius:14px;
  background: linear-gradient(135deg, var(--accent), var(--gold));
  box-shadow: 0 6px 18px hsl(var(--shadow-color) / .35);
  display:flex; align-items:center; justify-content:center;
  font-size:18px;
}
.topbar .brand-text{ display:flex; flex-direction:column; line-height:1; gap:3px; }
.topbar h1{
  font-size:24px;
  font-weight:600;
  letter-spacing:.4px;
  line-height:1;
  background: linear-gradient(135deg, var(--accent) 0%, var(--gold) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.brand-sub{
  font-family:'Manrope', sans-serif;
  font-size:9.5px;
  font-weight:800;
  letter-spacing:3.5px;
  text-transform:uppercase;
  color: var(--text-soft);
  padding-left:1px;
}
.icon-btn{
  width:44px; height:44px; border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  font-size:18px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.icon-btn:active{ transform: scale(.9); }

/* ---------- language picker ---------- */
.lang-picker{ position:relative; }
.lang-picker .icon-btn{ font-size:20px; }
.lang-menu{
  position:absolute; top: calc(100% + 10px); right:0;
  min-width:168px;
  border-radius: var(--radius-md);
  padding:8px;
  display:flex; flex-direction:column; gap:2px;
  opacity:0; visibility:hidden; transform: translateY(-8px) scale(.96);
  transform-origin: top right;
  transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
  z-index:60;
  box-shadow: 0 20px 40px hsl(var(--shadow-color) / .25);
}
.lang-menu.open{
  opacity:1; visibility:visible; transform: translateY(0) scale(1);
}
.lang-menu-item{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  border-radius: var(--radius-sm);
  font-size:14px; font-weight:600;
  color: var(--text);
  transition: background .2s ease;
  width:100%;
}
.lang-menu-item:hover, .lang-menu-item:active{ background: var(--glass); }
.lang-menu-item.active{ background: linear-gradient(135deg, var(--accent), var(--accent-dark)); color:#fff; }
.lm-flag{ font-size:18px; line-height:1; }

.screen-header{
  display:flex; align-items:center; gap:12px; margin-bottom:18px;
}
.screen-header h1{ font-size:26px; }
.back-btn{
  width:42px; height:42px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:16px 22px;
  border-radius:20px;
  font-weight:700; font-size:15px;
  position:relative; overflow:hidden;
  transition: transform .2s ease, box-shadow .3s ease;
}
.btn-primary{
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color:#fff;
  box-shadow: 0 10px 30px hsl(var(--shadow-color) / .45), inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-primary::after{
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,.5), transparent 60%);
  opacity:0; transition: opacity .3s ease;
}
.btn-primary:active{ transform: scale(.96); }
.btn-primary:active::after{ opacity:1; }
.btn-primary.glow{ animation: pulseGlow 2.4s ease-in-out infinite; }
@keyframes pulseGlow{
  0%,100%{ box-shadow: 0 10px 30px hsl(var(--shadow-color) / .45), inset 0 1px 0 rgba(255,255,255,.35); }
  50%{ box-shadow: 0 10px 42px hsl(var(--shadow-color) / .7), inset 0 1px 0 rgba(255,255,255,.5); }
}
.btn-ghost{
  background: var(--glass);
  color: var(--text);
  border:1px solid var(--glass-border);
}
.btn-block{ width:100%; }
.btn-sm{ padding:10px 16px; font-size:13px; border-radius:14px; }

.btn-floating{
  position:fixed; left:18px; right:18px;
  bottom: calc(var(--nav-h) + 18px + var(--safe-bottom));
  z-index:40; max-width:524px; margin:0 auto;
}

/* ---------- cards ---------- */
.card{
  border-radius: var(--radius-lg);
  overflow:hidden;
  position:relative;
}

.section{ margin-bottom:30px; }
.section-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:14px;
}
.section-head h2{ font-size:20px; }
.link-more{ font-size:13px; font-weight:700; color: var(--accent-dark); }

/* quick categories */
.quick-cats{
  display:flex; gap:12px; overflow-x:auto; padding-bottom:6px;
  scroll-snap-type:x proximity;
}
.quick-cats::-webkit-scrollbar{ display:none; }
.quick-cat{
  flex:0 0 auto; width:84px; text-align:center; scroll-snap-align:start;
  display:flex; flex-direction:column; align-items:center; gap:8px;
}
.quick-cat .thumb{
  width:72px; height:72px; border-radius:22px; overflow:hidden;
  box-shadow: 0 10px 24px rgba(32,33,36,.12);
  transition: transform .25s ease;
}
.quick-cat .thumb img{ width:100%; height:100%; object-fit:cover; }
.quick-cat:active .thumb{ transform: scale(.92); }
.quick-cat span{ font-size:11.5px; font-weight:600; color:var(--text-soft); line-height:1.25; }

/* flower card grid */
.flower-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
}
.flower-card{
  border-radius: var(--radius-lg);
  padding:10px 10px 14px;
  box-shadow: 0 14px 30px rgba(32,33,36,.08);
  opacity:0; transform: translateY(24px) scale(.94);
}
.flower-card .fc-img-wrap{
  position:relative; border-radius:20px; overflow:hidden;
  aspect-ratio:1/1; margin-bottom:10px;
}
.flower-card .fc-img-wrap img{
  width:100%; height:100%; object-fit:cover;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.flower-card:active .fc-img-wrap img{ transform: scale(1.08); }
.fav-btn{
  position:absolute; top:8px; right:8px; width:34px; height:34px;
  border-radius:12px; display:flex; align-items:center; justify-content:center;
  font-size:15px;
}
.fav-btn.active{ color: var(--accent); }
.fc-title{ font-size:13.5px; font-weight:700; line-height:1.3; margin-bottom:6px; min-height:34px; }
.fc-row{ display:flex; align-items:center; justify-content:space-between; }
.fc-price{ font-size:14px; font-weight:800; color: var(--text); }
.fc-price small{ font-weight:600; color:var(--text-soft); font-size:10.5px; }
.add-btn{
  width:36px; height:36px; border-radius:12px;
  background: linear-gradient(135deg, var(--accent), var(--gold));
  color:#fff; font-size:17px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 6px 16px hsl(var(--shadow-color) / .4);
}
.add-btn.bumped{ animation: bump .35s ease; }
@keyframes bump{ 0%{transform:scale(1)} 40%{transform:scale(1.35) rotate(15deg)} 100%{transform:scale(1)} }

/* hero */
.hero{
  position:relative; border-radius: var(--radius-xl);
  overflow:hidden; min-height:420px;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:26px 22px 26px;
  box-shadow: 0 24px 60px rgba(32,33,36,.18);
  margin-bottom:26px;
}
.hero img.hero-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  animation: heroFloat 10s ease-in-out infinite;
}
@keyframes heroFloat{
  0%,100%{ transform: scale(1.04) translateY(0); }
  50%{ transform: scale(1.09) translateY(-8px); }
}
.hero::before{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(32,20,26,0) 20%, rgba(20,10,16,.75) 100%);
}
.hero-content{ position:relative; z-index:2; color:#fff; }
.hero-content h1{
  font-size:34px; line-height:1.12; color:#fff;
  text-shadow: 0 4px 20px rgba(0,0,0,.35);
  margin-bottom:10px; white-space:pre-line;
}
.hero-content p{ font-size:14px; opacity:.9; margin-bottom:18px; max-width:280px; }
.hero-actions{ display:flex; gap:10px; }
.light-rays{
  position:absolute; inset:0; z-index:1; mix-blend-mode:screen; opacity:.5;
  background: conic-gradient(from 200deg at 70% 20%, transparent 0deg, rgba(255,255,255,.35) 20deg, transparent 60deg, transparent 360deg);
  animation: rayRotate 14s linear infinite;
}
@keyframes rayRotate{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);} }

/* ---------- bottom navigation ---------- */
.bottom-nav{
  position:fixed; left:0; right:0; bottom: calc(14px + var(--safe-bottom));
  z-index:100;
  display:flex; justify-content:center;
}
.bottom-nav-inner{
  display:flex; align-items:center; gap:4px;
  padding:10px 10px;
  border-radius:28px;
  box-shadow: 0 18px 50px rgba(32,33,36,.22), inset 0 1px 0 rgba(255,255,255,.5);
  width:calc(100% - 36px); max-width:460px;
}
.nav-item{
  flex:1; position:relative;
  display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:9px 4px 8px;
  border-radius:20px;
  color: var(--text-soft);
  transition: color .3s ease;
}
.nav-item .nav-icon{ font-size:19px; position:relative; z-index:2; }
.nav-item .nav-label{ font-size:10px; font-weight:700; position:relative; z-index:2; }
.nav-item .nav-glow{
  position:absolute; inset:2px; border-radius:18px; z-index:1;
  background: linear-gradient(135deg, var(--accent), var(--gold));
  opacity:0; transform: scale(.7);
  transition: opacity .35s cubic-bezier(.2,.9,.3,1.3), transform .35s cubic-bezier(.2,.9,.3,1.3);
  box-shadow: 0 8px 20px hsl(var(--shadow-color) / .5);
}
.nav-item.active{ color:#fff; }
.nav-item.active .nav-glow{ opacity:1; transform:scale(1); }
.nav-item .cart-badge{
  position:absolute; top:2px; right:14px; z-index:3;
  background: var(--accent-dark); color:#fff; font-size:9px; font-weight:800;
  width:16px; height:16px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}

/* ---------- splash ---------- */
#splash{
  position:fixed; inset:0; z-index:1000;
  background: linear-gradient(160deg, var(--bg) 0%, var(--bg-2) 60%, var(--splash-glow) 100%);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:18px;
  transition: opacity .6s ease, visibility .6s ease;
}
#splash.hidden{ opacity:0; visibility:hidden; pointer-events:none; }
.splash-mark{
  width:104px; height:104px; border-radius:32px;
  background: linear-gradient(135deg, var(--accent), var(--gold));
  display:flex; align-items:center; justify-content:center;
  font-size:46px;
  box-shadow: 0 20px 50px hsl(var(--shadow-color) / .5);
}
.splash-title{ font-size:28px; font-weight:600; }
.splash-tagline{ font-size:13px; color:var(--text-soft); letter-spacing:.5px; }
.splash-loader{
  width:140px; height:3px; border-radius:3px; background: rgba(0,0,0,.08); overflow:hidden; margin-top:8px;
}
.splash-loader-bar{
  height:100%; width:0%; border-radius:3px;
  background: linear-gradient(90deg, var(--accent), var(--gold));
}

/* ---------- floating particles ---------- */
.particle{
  position:absolute; border-radius:50%; pointer-events:none;
  background: radial-gradient(circle, rgba(255,255,255,.9), transparent 70%);
  opacity:.7;
}

/* ---------- category chips ---------- */
.chip-row{ display:flex; gap:10px; overflow-x:auto; padding-bottom:4px; }
.chip-row::-webkit-scrollbar{ display:none; }
.chip{
  flex:0 0 auto; padding:10px 18px; border-radius:16px;
  font-size:13px; font-weight:700; color:var(--text-soft);
  border:1px solid var(--glass-border);
}
.chip.active{
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color:#fff; border-color:transparent;
  box-shadow: 0 8px 20px hsl(var(--shadow-color) / .4);
}

.search-bar{
  display:flex; align-items:center; gap:10px;
  padding:14px 16px; border-radius:18px; margin-bottom:16px;
}
.search-bar input{
  border:none; background:transparent; outline:none; font-size:14px; color:var(--text);
  width:100%; font-family:inherit;
}
.search-bar input::placeholder{ color:var(--text-soft); }

/* ---------- detail page ---------- */
.gallery{
  display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:0;
  border-radius: var(--radius-xl); margin-bottom:16px; box-shadow:0 20px 50px rgba(32,33,36,.15);
}
.gallery::-webkit-scrollbar{ display:none; }
.gallery img{
  flex:0 0 100%; scroll-snap-align:start; width:100%; height:340px; object-fit:cover;
}
.gallery-dots{ display:flex; justify-content:center; gap:6px; margin-bottom:20px; }
.gallery-dots span{ width:6px; height:6px; border-radius:50%; background: var(--text-soft); opacity:.3; }
.gallery-dots span.active{ opacity:1; background: var(--accent); width:18px; border-radius:4px; transition:.3s; }

.detail-header{ display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:6px; }
.detail-title{ font-size:26px; margin-bottom:4px; }
.detail-price{ font-size:20px; font-weight:800; color:var(--accent-dark); margin-bottom:16px; }
.detail-block{ padding:18px; border-radius: var(--radius-lg); margin-bottom:14px; }
.detail-block h3{ font-size:15px; margin-bottom:8px; font-family:'Manrope'; font-weight:800; }
.detail-block p{ font-size:13.5px; color:var(--text-soft); line-height:1.5; }
.color-dots{ display:flex; gap:10px; }
.color-dots span{ width:30px; height:30px; border-radius:50%; box-shadow: 0 4px 10px rgba(0,0,0,.15), inset 0 0 0 2px rgba(255,255,255,.6); }
.reco-row{ display:flex; gap:12px; overflow-x:auto; }
.reco-row::-webkit-scrollbar{ display:none; }
.reco-card{ flex:0 0 130px; border-radius:18px; overflow:hidden; box-shadow:0 10px 24px rgba(32,33,36,.1); }
.reco-card img{ width:100%; height:110px; object-fit:cover; }
.reco-card .rc-body{ padding:8px 10px 10px; }
.reco-card .rc-title{ font-size:11.5px; font-weight:700; margin-bottom:4px; }
.reco-card .rc-price{ font-size:12px; font-weight:800; color:var(--accent-dark); }

/* ---------- builder ---------- */
.builder-preview{
  border-radius: var(--radius-xl);
  padding:26px 18px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:220px; margin-bottom:18px; position:relative; overflow:hidden;
  box-shadow: 0 20px 50px rgba(32,33,36,.14);
}
.bouquet-visual{ position:relative; width:150px; height:150px; }
.bq-flower{
  position:absolute; width:52px; height:52px; border-radius:50%;
  box-shadow: 0 8px 18px rgba(0,0,0,.15);
  border:3px solid rgba(255,255,255,.7);
  transition: all .4s cubic-bezier(.2,.9,.3,1.2);
  background-size:cover; background-position:center;
}
.bq-wrap{
  position:absolute; bottom:-14px; left:50%; transform:translateX(-50%);
  width:140px; height:70px; border-radius:0 0 70px 70px;
  transition: background .4s ease;
}
.bq-ribbon{
  position:absolute; bottom:14px; left:50%; transform:translateX(-50%);
  width:44px; height:14px; border-radius:6px; transition: background .3s ease;
}
.builder-total{ font-size:22px; font-weight:800; margin-top:6px; }

.step-title{ font-size:14px; font-weight:800; margin: 20px 0 10px; }
.option-row{ display:flex; gap:12px; overflow-x:auto; padding-bottom:4px; }
.option-row::-webkit-scrollbar{ display:none; }
.opt-flower{
  flex:0 0 auto; width:64px; height:64px; border-radius:20px; overflow:hidden;
  border:3px solid transparent; position:relative;
}
.opt-flower img{ width:100%; height:100%; object-fit:cover; }
.opt-flower.selected{ border-color: var(--accent); box-shadow: 0 0 0 3px hsl(var(--shadow-color)/.25); }
.qty-control{ display:flex; align-items:center; gap:16px; }
.qty-btn{
  width:44px; height:44px; border-radius:16px; font-size:20px; font-weight:800;
}
.qty-value{ font-size:20px; font-weight:800; min-width:34px; text-align:center; }
.opt-swatch{
  flex:0 0 auto; width:56px; height:56px; border-radius:18px; position:relative;
  border:3px solid transparent; display:flex; align-items:center; justify-content:center;
  font-size:9.5px; font-weight:700; color:rgba(0,0,0,.55); text-align:center;
}
.opt-swatch.selected{ border-color: var(--text); transform: scale(1.05); }
textarea.note-input{
  width:100%; border-radius: var(--radius-md); border:1px solid var(--glass-border);
  padding:14px; font-family:inherit; font-size:13.5px; resize:none; min-height:80px;
  background: var(--glass); color:var(--text);
}

/* ---------- cart / favorites ---------- */
.cart-item{
  display:flex; gap:12px; padding:12px; border-radius:20px; margin-bottom:12px;
  box-shadow: 0 10px 24px rgba(32,33,36,.08);
}
.cart-item img{ width:74px; height:74px; border-radius:16px; object-fit:cover; }
.cart-item-body{ flex:1; display:flex; flex-direction:column; justify-content:space-between; }
.cart-item-title{ font-size:13.5px; font-weight:700; }
.cart-item-sub{ font-size:11.5px; color:var(--text-soft); }
.cart-item-row{ display:flex; align-items:center; justify-content:space-between; }
.qty-mini{ display:flex; align-items:center; gap:8px; }
.qty-mini button{ width:26px; height:26px; border-radius:9px; background: var(--glass); font-weight:800; }
.remove-btn{ font-size:11px; color:var(--accent-dark); font-weight:700; }

.summary-card{ padding:18px; border-radius: var(--radius-lg); margin-top:6px; }
.summary-row{ display:flex; justify-content:space-between; font-size:13.5px; margin-bottom:8px; color:var(--text-soft); }
.summary-row.total{ color:var(--text); font-weight:800; font-size:16px; margin-top:8px; padding-top:12px; border-top:1px dashed rgba(0,0,0,.12); }

.empty-state{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:60px 20px; gap:14px;
}
.empty-state .emoji{ font-size:52px; }
.empty-state h3{ font-size:18px; }
.empty-state p{ font-size:13px; color:var(--text-soft); }

/* ---------- profile ---------- */
.profile-header{ display:flex; align-items:center; gap:16px; padding:20px; border-radius: var(--radius-xl); margin-bottom:22px; }
.avatar{
  width:64px; height:64px; border-radius:22px;
  background: linear-gradient(135deg, var(--accent), var(--gold));
  display:flex; align-items:center; justify-content:center; font-size:26px; color:#fff;
  box-shadow: 0 10px 24px hsl(var(--shadow-color)/.4);
}
.profile-name{ font-size:17px; font-weight:800; }
.profile-sub{ font-size:12px; color:var(--text-soft); }

.menu-list{ border-radius: var(--radius-lg); overflow:hidden; }
.menu-item{
  display:flex; align-items:center; gap:14px; padding:16px 16px;
  border-bottom:1px solid rgba(0,0,0,.06);
}
:root.dark .menu-item{ border-bottom-color: rgba(255,255,255,.06); }
.menu-item:last-child{ border-bottom:none; }
.menu-item .mi-icon{
  width:38px; height:38px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  background: rgba(255,92,138,.12); font-size:16px;
}
.menu-item .mi-label{ flex:1; font-size:14px; font-weight:700; }
.menu-item .mi-chevron{ color:var(--text-soft); }

.lang-switch{ display:flex; gap:10px; padding:4px; border-radius:18px; }
.lang-opt{ flex:1; padding:12px; text-align:center; border-radius:14px; font-weight:700; font-size:13px; color:var(--text-soft); }
.lang-opt.active{ background: linear-gradient(135deg, var(--accent), var(--accent-dark)); color:#fff; }

.toggle{
  width:48px; height:28px; border-radius:14px; background: rgba(0,0,0,.12); position:relative; transition:.3s;
}
.toggle::after{
  content:''; position:absolute; top:3px; left:3px; width:22px; height:22px; border-radius:50%;
  background:#fff; box-shadow:0 3px 8px rgba(0,0,0,.2); transition:.3s;
}
.toggle.on{ background: linear-gradient(135deg, var(--accent), var(--gold)); }
.toggle.on::after{ left:23px; }

/* ---------- about / location / delivery / payment / contact ---------- */
.about-hero{ border-radius: var(--radius-xl); overflow:hidden; height:220px; margin-bottom:18px; position:relative; }
.about-hero img{ width:100%; height:100%; object-fit:cover; }
.story-block{ padding:20px; border-radius: var(--radius-lg); margin-bottom:20px; }
.story-block h2{ font-size:22px; margin-bottom:10px; }
.story-block p{ font-size:14px; color:var(--text-soft); line-height:1.6; }
.about-gallery{ display:grid; grid-template-columns: repeat(3,1fr); gap:8px; }
.about-gallery img{ width:100%; height:90px; object-fit:cover; border-radius:14px; }

.map-placeholder{
  height:220px; border-radius: var(--radius-xl); position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,92,138,.25), transparent 50%),
    radial-gradient(circle at 70% 70%, rgba(126,214,167,.25), transparent 50%),
    linear-gradient(135deg, #FDEDE9, #F3E6D8);
  margin-bottom:18px;
  display:flex; align-items:center; justify-content:center;
}
.map-grid{ position:absolute; inset:0; background-image: linear-gradient(rgba(32,33,36,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(32,33,36,.05) 1px, transparent 1px); background-size:28px 28px; }
.map-pin{
  width:46px; height:46px; border-radius:50% 50% 50% 0; transform: rotate(-45deg);
  background: linear-gradient(135deg, var(--accent), var(--accent-dark)); position:relative; z-index:2;
  box-shadow: 0 10px 24px hsl(var(--shadow-color)/.5);
  animation: pinBounce 2.4s ease-in-out infinite;
}
.map-pin::after{ content:''; position:absolute; inset:12px; background:#fff; border-radius:50%; }
@keyframes pinBounce{ 0%,100%{ transform: rotate(-45deg) translateY(0);} 50%{ transform: rotate(-45deg) translateY(-8px);} }
.info-row{ display:flex; gap:14px; padding:16px; border-radius:18px; margin-bottom:10px; }
.info-row .ir-icon{ font-size:20px; }
.info-row .ir-label{ font-size:11px; color:var(--text-soft); font-weight:700; text-transform:uppercase; letter-spacing:.4px; }
.info-row .ir-value{ font-size:14px; font-weight:700; }

.timeline{ position:relative; padding-left:34px; }
.timeline::before{ content:''; position:absolute; left:13px; top:6px; bottom:6px; width:2px; background: linear-gradient(180deg, var(--accent), var(--accent-2)); }
.tl-item{ position:relative; padding-bottom:26px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-dot{
  position:absolute; left:-34px; top:0; width:28px; height:28px; border-radius:50%;
  background: linear-gradient(135deg, var(--accent), var(--gold)); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:13px;
  box-shadow: 0 6px 16px hsl(var(--shadow-color)/.4);
}
.tl-item.done .tl-dot{ background: linear-gradient(135deg, var(--accent-2), #4fae7a); }
.tl-title{ font-size:14.5px; font-weight:800; margin-bottom:3px; }
.tl-text{ font-size:12.5px; color:var(--text-soft); }

.payment-card{
  padding:18px; border-radius: var(--radius-lg); margin-bottom:14px;
  display:flex; align-items:center; gap:14px;
  box-shadow: 0 12px 28px rgba(32,33,36,.1);
}
.payment-card .pc-icon{
  width:46px; height:46px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:20px;
  background: linear-gradient(135deg, var(--accent), var(--gold)); color:#fff;
}
.payment-card .pc-title{ font-size:14.5px; font-weight:800; }
.payment-card .pc-sub{ font-size:11.5px; color:var(--text-soft); }

.contact-fabs{ display:flex; flex-direction:column; gap:14px; align-items:center; padding:20px 0; }
.contact-fab{
  width:100%; max-width:320px; padding:18px; border-radius:22px;
  display:flex; align-items:center; gap:14px;
  box-shadow: 0 14px 32px rgba(32,33,36,.12);
}
.contact-fab .cf-icon{
  width:46px; height:46px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:20px; color:#fff;
}
.contact-fab.telegram .cf-icon{ background: linear-gradient(135deg, #4FC3F7, #29A9E0); }
.contact-fab.instagram .cf-icon{ background: linear-gradient(135deg, #F58529, #DD2A7B, #8134AF); }
.contact-fab.phone .cf-icon{ background: linear-gradient(135deg, var(--accent-2), #4fae7a); }
.contact-fab .cf-label{ font-weight:800; font-size:14.5px; }

/* ---------- toast ---------- */
#toast{
  position:fixed; left:50%; bottom: calc(var(--nav-h) + 30px + var(--safe-bottom));
  transform: translateX(-50%) translateY(20px);
  padding:14px 22px; border-radius:18px; z-index:200;
  font-size:13.5px; font-weight:700;
  opacity:0; pointer-events:none; transition: all .35s cubic-bezier(.2,.9,.3,1.2);
  box-shadow: 0 16px 40px rgba(32,33,36,.2);
}
#toast.show{ opacity:1; transform: translateX(-50%) translateY(0); pointer-events:auto; }

/* ---------- scroll reveal helpers ---------- */
.reveal{ opacity:0; transform: translateY(30px); }

/* misc */
::-webkit-scrollbar{ width:0; height:0; }
.hidden{ display:none !important; }

@media (min-width:600px){
  .flower-grid{ grid-template-columns: 1fr 1fr 1fr; }
}