/* ═══ BOUQUET STUDIO — тизер на главной ═══ */
.sx{ max-width:1440px; margin:0 auto; padding:90px 32px; display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; border-top:1px solid var(--block-line); }
.sx__art{ background:radial-gradient(circle at 50% 40%, #FFFFFF 0%, #F7F2EC 70%); aspect-ratio:1/1; cursor:pointer; position:relative; overflow:hidden; transition:transform .5s; }
.sx__art:hover{ transform:scale(1.01); }
.sx__text h2{ font-family:'Playfair Display',Georgia,serif !important; font-weight:400; font-size:clamp(34px,4vw,56px); line-height:1.08; margin:8px 0 20px; }
.sx__text p{ font-size:17px; line-height:1.75; color:var(--ink-soft); max-width:46ch; margin:0 0 30px; }

/* ═══ Сцена букета ═══ */
.bs-stage{ position:relative; width:100%; aspect-ratio:1/1; overflow:hidden; }
.bs-stage--teaser{ position:absolute; inset:4%; width:auto; }
.bs-svg{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.bs-front{ z-index:80; }
.bs-heads{ position:absolute; inset:0; z-index:20; }
.bs-head{ position:absolute; transform:translate(-50%,-50%) rotate(var(--r,0deg)); mix-blend-mode:multiply; filter:drop-shadow(0 6px 8px rgba(70,40,30,.14)); transition:left .5s cubic-bezier(.3,.7,.2,1), top .5s cubic-bezier(.3,.7,.2,1), width .5s; }
.bs-head.pop{ animation:bsPop .55s cubic-bezier(.3,1.5,.5,1); }
@keyframes bsPop{ 0%{ opacity:0; transform:translate(-50%,-80%) rotate(var(--r)) scale(.4); } 100%{ opacity:1; transform:translate(-50%,-50%) rotate(var(--r)) scale(1); } }
.bs-empty{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:0 18%; font-family:'Playfair Display',serif !important; font-size:22px; color:var(--ink-soft); }

/* ═══ Окно конструктора ═══ */
.studio{ position:fixed; inset:0; z-index:200; background:rgba(46,38,32,.35); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:.3s; }
.studio.open{ opacity:1; visibility:visible; }
.bs{ width:min(1240px, 100vw); height:min(900px, 100dvh); background:#fff; display:grid; grid-template-rows:auto 1fr auto; overflow:hidden; transform:translateY(20px); transition:transform .35s cubic-bezier(.3,.7,.2,1); }
.studio.open .bs{ transform:none; }
.bs__head{ display:flex; justify-content:space-between; align-items:center; padding:20px 30px 14px; border-bottom:1px solid var(--block-line); }
.bs__head h2{ font-family:'Playfair Display',serif !important; font-weight:400; font-size:30px; margin:2px 0 0; }
.bs__close{ width:44px; height:44px; border-radius:50%; border:1px solid var(--block-line); background:#fff; font-size:16px; cursor:pointer; }
.bs__main{ display:grid; grid-template-columns:1fr 330px; min-height:0; }
.bs__stagewrap{ position:relative; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 50% 42%, #FFFFFF 0%, #FBF8F4 55%, #F4EEE7 100%); min-height:0; overflow:hidden; }
.bs__stagewrap .bs-stage{ height:100%; width:auto; max-width:100%; }
.bs-flash{ position:absolute; top:18px; left:50%; transform:translate(-50%,-10px); background:var(--ink); color:#fff; font-size:13.5px; padding:9px 18px; border-radius:100px; opacity:0; transition:.3s; pointer-events:none; z-index:100; }
.bs-flash.show{ opacity:1; transform:translate(-50%,0); }
.bs__side{ border-left:1px solid var(--block-line); padding:24px 26px; display:flex; flex-direction:column; overflow-y:auto; }
.bs__side-t{ font-family:'Playfair Display',serif !important; font-size:24px; margin:0; }
.bs__count{ font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin:4px 0 14px; }
.bs__list{ list-style:none; padding:0; margin:0 0 10px; font-size:15px; line-height:1.55; }
.bs__list li{ padding:6px 0; border-bottom:1px solid var(--block-line); }
.bs__extras{ font-size:14px; color:var(--ink-soft); margin:4px 0 16px; }
.bs__total{ display:flex; justify-content:space-between; align-items:baseline; margin:auto 0 14px; padding-top:16px; border-top:1px solid var(--ink); }
.bs__total span{ font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; }
.bs__total b{ font-family:'Playfair Display',serif !important; font-size:30px; font-weight:400; }
.bs__clear{ background:none; border:none; text-decoration:underline; font-size:13.5px; color:var(--ink-soft); margin:10px 0 0; cursor:pointer; }
.bs__hint{ font-size:12.5px; color:var(--ink-soft); line-height:1.55; margin:14px 0 0; }

/* лента выбора */
.bs__tray{ border-top:1px solid var(--block-line); background:#fff; }
.bs__tabs{ position:relative; display:flex; gap:34px; padding:14px 30px 0; border-bottom:1px solid var(--block-line); }
.bs__tabs button{ background:none; border:none; padding:6px 0 12px; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); cursor:pointer; }
.bs__tabs button.on{ color:var(--ink); }
.bs__tabline{ position:absolute; left:0; bottom:-1px; height:2px; background:var(--ink); transition:transform .4s cubic-bezier(.6,.1,.2,1), width .4s; }
.bs__items{ display:flex; gap:18px; overflow-x:auto; padding:18px 30px 20px; scroll-snap-type:x proximity; scrollbar-width:thin; }
.bs-tile{ position:relative; flex:0 0 112px; text-align:center; scroll-snap-align:start; cursor:pointer; }
.bs-tile__img{ position:relative; display:block; width:96px; height:96px; margin:0 auto; border-radius:50%; background:#FBF8F4; border:1px solid var(--block-line); padding:0; cursor:pointer; transition:transform .25s, box-shadow .25s, border-color .25s; overflow:visible; }
.bs-tile__img img{ width:100%; height:100%; object-fit:cover; border-radius:50%; mix-blend-mode:multiply; }
.bs-tile:hover .bs-tile__img{ transform:translateY(-3px); box-shadow:0 12px 24px rgba(46,38,32,.12); }
.bs-tile.on .bs-tile__img{ border-color:var(--ink); box-shadow:0 0 0 3px #fff inset; }
.bs-plus{ position:absolute; right:2px; bottom:2px; width:24px; height:24px; border-radius:50%; background:var(--ink); color:#fff; font-size:16px; line-height:24px; opacity:0; transform:scale(.7); transition:.2s; }
.bs-tile:hover .bs-plus{ opacity:1; transform:none; }
.bs-badge{ position:absolute; left:-2px; top:-2px; min-width:24px; height:24px; padding:0 6px; border-radius:12px; background:var(--ink); color:#fff; font-size:12px; font-weight:600; line-height:24px; }
.bs-minus{ position:absolute; top:-2px; right:6px; width:24px; height:24px; border-radius:50%; border:1px solid var(--block-line); background:#fff; font-size:15px; line-height:20px; cursor:pointer; z-index:2; }
.bs-tile__name{ font-family:'Playfair Display',serif !important; font-size:16px; margin-top:10px; }
.bs-tile__sub{ font-size:12px; color:var(--ink-soft); margin-top:2px; }
.bs-dots{ display:flex; justify-content:center; gap:6px; margin-top:8px; min-height:16px; }
.bs-dot{ width:15px; height:15px; border-radius:50%; border:1px solid rgba(0,0,0,.15); cursor:pointer; padding:0; transition:transform .15s; }
.bs-dot.on{ box-shadow:0 0 0 2px #fff, 0 0 0 3px var(--ink); }
.bs-dot:hover{ transform:scale(1.15); }
.bs-swatch{ display:block; width:100%; height:100%; border-radius:50%; }
.bs-swatch--film{ background:linear-gradient(135deg,#F7FBFF 0%,#DCE8F1 45%,#FFFFFF 55%,#E3EEF6 100%); }
.bs-swatch--vase{ background:radial-gradient(ellipse at 40% 35%, #FFFFFF 0%, #E3EEF6 55%, #C9DCEA 100%); }
.bs-swatch--ribbon{ background:repeating-linear-gradient(135deg, var(--rc) 0 10px, color-mix(in srgb, var(--rc) 82%, #fff) 10px 12px); }
.bs-g{ display:block; width:100%; height:100%; border-radius:50%; background-size:cover; }
.bs-g--eucalyptus{ background:radial-gradient(circle at 35% 40%, #A7BCA2 0 18%, transparent 19%), radial-gradient(circle at 62% 55%, #8FA88A 0 20%, transparent 21%), radial-gradient(circle at 45% 72%, #9DB497 0 16%, transparent 17%), #EEF2EC; }
.bs-g--gypsophila{ background:radial-gradient(circle at 30% 35%, #fff 0 6%, transparent 7%), radial-gradient(circle at 55% 45%, #fff 0 6%, transparent 7%), radial-gradient(circle at 42% 62%, #fff 0 6%, transparent 7%), radial-gradient(circle at 66% 68%, #fff 0 6%, transparent 7%), radial-gradient(circle at 70% 30%, #fff 0 6%, transparent 7%), #DDE3D6; }
.bs-g--pistacia{ background:linear-gradient(135deg, transparent 40%, #5E7D45 41% 46%, transparent 47%), linear-gradient(45deg, transparent 40%, #6E8F52 41% 46%, transparent 47%), #E6EDE0; }
.bs-g--none{ background:#fff; }

/* ═══ Опции в карточке букета ═══ */
.pd-opts{ margin:6px 0 16px; }
.pd-row{ margin-bottom:12px; }
.pd-lbl{ font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); margin:0 0 8px; }
.pd-lbl b{ color:var(--ink); font-weight:500; text-transform:none; letter-spacing:0; margin-left:6px; font-size:13px; }
.pd-sws{ display:flex; gap:10px; flex-wrap:wrap; }
.pd-sw{ width:34px; height:34px; border-radius:50%; border:1px solid var(--block-line); padding:3px; background:#fff; cursor:pointer; transition:.15s; }
.pd-sw span{ display:block; width:100%; height:100%; border-radius:50%; border:1px solid rgba(0,0,0,.08); }
.pd-sw.on{ border-color:var(--ink); box-shadow:0 0 0 1px var(--ink); }
.pd-note{ font-size:12.5px; color:var(--ink-soft); line-height:1.5; margin:4px 0 0; }

/* ═══ Адаптив ═══ */
@media (max-width:900px){
  .sx{ grid-template-columns:1fr; gap:30px; padding:60px 18px; }
  .bs{ height:100dvh; grid-template-rows:auto 1fr auto auto; }
  .bs__head{ padding:14px 18px 10px; }
  .bs__head h2{ font-size:22px; }
  .bs__main{ grid-template-columns:1fr; grid-template-rows:1fr auto; }
  .bs__side{ border-left:none; border-top:1px solid var(--block-line); padding:12px 18px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:6px 14px; }
  .bs__side-t, .bs__list, .bs__extras, .bs__hint, .bs__clear{ display:none; }
  .bs__count{ grid-column:1; margin:0; }
  .bs__total{ grid-column:2; margin:0; padding:0; border:none; gap:10px; }
  .bs__total b{ font-size:22px; }
  #bsAdd{ grid-column:1/-1; }
  .bs__tabs{ gap:20px; padding:10px 18px 0; overflow-x:auto; }
  .bs__items{ padding:14px 18px 16px; gap:12px; }
  .bs-tile{ flex-basis:92px; }
  .bs-tile__img{ width:78px; height:78px; }
  .bs-tile__name{ font-size:14px; }
}
.bs__side{ overflow:hidden; }
.bs__list{ flex:1 1 auto; overflow-y:auto; min-height:0; }
.bs__total{ margin-top:12px; }
.bs{ grid-template-columns:minmax(0,1fr); }
.bs__main, .bs__stagewrap, .bs__tray{ min-width:0; }
@media (max-width:900px){
  .bs__main{ grid-template-columns:minmax(0,1fr); }
  .bs__stagewrap .bs-stage{ width:min(100%, 52dvh); height:auto; }
  .bs__close{ width:38px; height:38px; flex:0 0 auto; }
}