.bouquet-studio { background: #f6f4f0; }
.studio-workbench { grid-template-columns: minmax(340px, .85fr) minmax(0, 1.15fr); min-height: 0; }
.studio-preview-column { min-height: min(840px, 100vh); padding: 42px clamp(26px, 4vw, 66px); background: #d9dce2; }
.studio-title h1 { font-size: clamp(3rem, 4.6vw, 5rem); }
.studio-title > p:last-child { font-size: 1rem; line-height: 1.55; }
.bouquet-composer.real-example { width: min(100%, 390px); aspect-ratio: 9 / 16; margin: 24px auto 14px; border-radius: 24px; background: #ece9e5; }
.studio-reference-photo { display: block; width: 100%; height: 100%; object-fit: contain; }
.bouquet-composer.real-example figcaption { font-size: .85rem; }
.studio-controls { padding: 38px clamp(24px, 4vw, 64px) 128px; background: #fcfbf8; }
.studio-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.studio-tabs button { font-size: .86rem; }
.panel-heading h2 { font-size: clamp(2.35rem, 3.5vw, 3.8rem); }
.panel-heading p, .studio-choice small, .material-card small, .flower-library-main small, .builder-hint { font-size: .9rem; }
.studio-panel h3 { font-size: .8rem; }
.flower-library { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.flower-library-main b { font-size: 1rem; }
.flower-variant b, .flower-variant small { font-size: .85rem; }
.wrap-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-top: 24px; }
.wrap-card { min-height: 210px; padding: 11px 11px 16px; }
.wrap-card b { font-size: 1.05rem; }
.wrap-card small { display: block; font-size: .82rem; }
.wrap-swatch { display: block; height: 124px; margin-bottom: 14px; border-radius: 11px; background: var(--wrap-tone); box-shadow: inset 0 1px 8px rgba(255,255,255,.4), inset 0 -12px 20px rgba(0,0,0,.08); }
.wrap-truth { margin-top: 18px; color: #555d68; font-size: .9rem; line-height: 1.5; }
.studio-final-action { width: min(670px, calc(58vw - 40px)); }

.studio-review { align-items: stretch; }
.studio-review .review-visual { min-height: 720px; padding: 48px; background: #d9dce2; }
.studio-review .review-visual h1 { font-size: clamp(2.8rem, 4vw, 4.3rem); }
.studio-review .review-visual h1 em { font-weight: 400; }
.studio-review .review-copy { padding: clamp(36px, 4vw, 68px); }
.studio-review .review-copy h2 { margin-bottom: 16px; font-size: clamp(2.5rem, 3.6vw, 3.6rem); line-height: 1; }
.review-intro { max-width: 560px; margin: 0 0 28px; color: #555d66; font-size: 1rem; line-height: 1.6; }
.studio-review .final-preview-frame { width: min(100%, 470px); aspect-ratio: 4 / 5; }
.studio-review .final-preview-frame canvas, .studio-review .final-preview-frame img { object-fit: contain; background: #eeeae5; }
.order-decision { display: grid; gap: 10px; margin: 26px 0; padding: 28px; border-radius: 20px; background: #242831; color: #fff; }
.order-decision[hidden], .order-details[hidden], [data-order-it][hidden] { display: none !important; }
.order-decision .eyebrow { color: #c2c8d2; }
.order-decision h3 { margin: 0; font-family: var(--serif); font-size: 2.25rem; font-weight: 400; line-height: 1; }
.order-decision p { margin: 0 0 8px; color: #d7dbe1; font-size: .98rem; line-height: 1.5; }
.order-decision .button { justify-self: start; background: #fff; color: #242831; }
.order-decision .text-link { justify-self: start; color: #fff; }
.order-details { scroll-margin-top: 24px; }
.review-details-form input, .review-details-form textarea { font-size: 1rem; }
.review-back { display: inline-block; margin-top: 24px; }

@media (max-width: 760px) {
  .studio-workbench { grid-template-columns: 1fr; }
  .studio-preview-column { position: relative; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(160px, 36%); align-items: center; gap: 16px; padding: 26px 24px 18px; }
  .studio-title h1 { font-size: clamp(2.4rem, 6vw, 3.7rem); }
  .bouquet-composer.real-example { width: 100%; margin: 0; }
  .bouquet-composer.real-example figcaption { display: none; }
  .composer-summary { grid-column: 1 / -1; width: 100%; }
  .studio-final-action { width: auto; }
  .studio-review .review-visual { min-height: 0; }
}
@media (max-width: 620px) {
  .studio-preview-column { display: grid; grid-template-columns: minmax(0, 1fr) minmax(125px, 38%); align-items: center; gap: 12px; padding: 24px 18px 18px; }
  .studio-title h1 { font-size: clamp(2.15rem, 8vw, 3.2rem); }
  .studio-title > p:last-child { font-size: .9rem; }
  .bouquet-composer.real-example { width: 100%; margin: 0; border-radius: 15px; }
  .bouquet-composer.real-example figcaption { display: none; }
  .composer-summary { grid-column: 1 / -1; width: 100%; }
  .studio-controls { padding: 16px 16px 115px; }
  .studio-panel { padding-top: 27px; }
  .studio-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flower-library { grid-template-columns: 1fr; }
  .wrap-grid { gap: 8px; }
  .wrap-card { min-height: 0; padding: 8px 8px 12px; }
  .wrap-swatch { height: 82px; margin-bottom: 10px; }
  .wrap-card b { font-size: .9rem; }
  .wrap-card small { font-size: .72rem; }
  .studio-review .review-visual { min-height: 0; padding: 22px 18px; }
  .studio-review .final-preview-frame { width: min(100%, 270px); }
  .studio-review .review-visual .eyebrow { margin-top: 12px; }
  .studio-review .review-visual h1 { font-size: 2.45rem; }
  .studio-review .review-copy { padding: 32px 20px 56px; }
  .studio-review .review-copy h2 { font-size: 2.65rem; }
  .order-decision { padding: 22px; }
  .order-decision .button { width: 100%; }
}

/* The wrap picker is intentionally a spacious two-column block on every screen. */
.wrap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.wrap-card { min-width: 0; }
.wrap-card-name { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.wrap-card-name b { min-width: 0; padding-right: 0; overflow-wrap: anywhere; }
.wrap-card-price { flex: 0 0 auto; white-space: nowrap; }

@media (max-width: 620px) {
  .wrap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .wrap-card { padding: 12px 12px 16px; }
  .wrap-card-image { height: 160px; aspect-ratio: auto; margin-bottom: 14px; }
  .wrap-card-copy { padding: 0; }
  .wrap-card-name b { font-size: .92rem; line-height: 1.15; }
  .wrap-card-price { font-size: .72rem; }
  .wrap-card-copy small { display: block; font-size: .76rem; line-height: 1.45; }
}