/* Yes I Smell Good — storefront design, ported verbatim from the approved Claude Design handoff.
   Colors/type/spacing are the final spec; do not drift. Fonts (Fredoka+Nunito) enqueued in functions.php. */

:root{
    --yellow:#FBB024; --orange:#F79400; --coral:#F26A62;
    --magenta:#E11B9C; --purple:#7C1AE6; --deep:#4E0F7A;
    --ink:#2A1140; --muted:#6B5A7A; --muted2:#8A7A9B;
    --lilac:#F4EEFA; --screen:#F7F2FB; --border:#E7DCF0;
    --card:#FFFFFF;
    --page-gradient:linear-gradient(180deg,#FBB024 0%,#F79400 24%,#F26A62 46%,#E11B9C 70%,#7C1AE6 100%);
    --shadow-card:0 18px 32px -18px rgba(60,10,90,.55);
    --shadow-mag:0 10px 18px -8px rgba(225,27,156,.7);
  }
  *{box-sizing:border-box;}
  html,body{margin:0;}
  body{
    font-family:'Nunito',sans-serif; color:var(--ink);
    background:#20102e; -webkit-font-smoothing:antialiased;
  }
  a{color:var(--purple); text-decoration:none;}
  a:hover{color:var(--magenta);}
  img{max-width:100%; display:block;}

  /* The store lives in a mobile-width column, centered on larger screens. */
  .app{
    position:relative; width:100%; max-width:480px; margin:0 auto;
    min-height:100vh; background:var(--page-gradient); overflow-x:hidden;
  }

  /* ---------- HERO ---------- */
  .hero{position:relative; padding:26px 24px 30px; text-align:center;}
  .cart-pill{
    position:absolute; top:18px; right:18px; z-index:5; cursor:pointer;
    display:flex; align-items:center; gap:6px; background:#fff; color:var(--purple);
    font-family:'Fredoka'; font-weight:600; font-size:13px; padding:7px 13px;
    border-radius:100px; box-shadow:0 8px 16px -8px rgba(90,20,120,.5); border:0;
  }
  .logo{width:92%; max-width:320px; margin:6px auto 0; filter:drop-shadow(0 8px 18px rgba(90,20,120,.25));}
  .hero__headline{
    font-family:'Fredoka'; font-weight:700; font-size:26px; line-height:1.05;
    letter-spacing:.5px; color:var(--deep); margin:22px 4px 6px; text-transform:uppercase;
  }
  .hero__sub{font-family:'Fredoka'; font-weight:500; font-size:15px; color:#fff; margin:0 14px 22px;}
  .confetti{position:absolute; pointer-events:none;}

  .video-banner{
    position:relative; margin:6px 2px 2px; border-radius:26px; overflow:hidden;
    border:3px solid #fff; box-shadow:0 20px 34px -16px rgba(90,20,120,.6);
    aspect-ratio:16/9; background:linear-gradient(135deg,var(--deep) 0%,var(--purple) 52%,var(--magenta) 100%);
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
  }
  .video-banner__play{
    width:66px; height:66px; border-radius:50%; background:rgba(255,255,255,.94);
    display:flex; align-items:center; justify-content:center; box-shadow:0 12px 24px -8px rgba(0,0,0,.4);
  }
  .video-banner__play::after{
    content:""; width:0;height:0; border-left:21px solid var(--purple);
    border-top:13px solid transparent; border-bottom:13px solid transparent; margin-left:6px;
  }
  .video-banner__label{font-family:'Fredoka'; font-weight:600; font-size:14px; color:#fff;}

  .btn{border:0; cursor:pointer; font-family:'Fredoka'; font-weight:600; border-radius:100px;}
  .btn--shop{
    display:inline-flex; align-items:center; gap:9px; margin-top:26px;
    background:var(--deep); color:#fff; font-size:17px; padding:16px 30px;
    box-shadow:0 16px 28px -12px rgba(78,15,122,.7);
  }

  /* ---------- PRODUCTS ---------- */
  .products-section{padding:16px 18px 42px;}
  .products-section__title{font-family:'Fredoka'; font-weight:700; font-size:27px; color:#fff; margin:8px 4px 2px; text-align:center;}
  .products-section__sub{text-align:center; color:rgba(255,255,255,.9); font-size:13px; margin:0 0 20px; font-family:'Fredoka'; font-weight:500;}
  .products{display:flex; flex-direction:column; gap:16px;}
  .card{
    background:var(--card); border-radius:28px; padding:14px; display:flex; gap:14px;
    align-items:center; box-shadow:var(--shadow-card); border:2px solid rgba(255,255,255,.9);
  }
  .card__img{width:88px; height:118px; flex:0 0 88px; border-radius:18px; overflow:hidden; background:var(--lilac);}
  .card__body{flex:1; min-width:0;}
  .card__name{font-family:'Fredoka'; font-weight:700; font-size:17px; color:var(--ink); line-height:1.1;}
  .card__desc{font-size:12px; color:var(--muted); line-height:1.35; margin:5px 0 11px;}
  .card__row{display:flex; align-items:center; gap:7px;}
  .card__price{font-family:'Fredoka'; font-weight:700; font-size:18px; color:var(--ink); margin-right:auto;}
  .btn--info{background:var(--lilac); color:var(--purple); font-size:12.5px; padding:10px 15px; white-space:nowrap;}
  .btn--add{background:var(--magenta); color:#fff; font-size:12.5px; padding:10px 15px; white-space:nowrap; box-shadow:var(--shadow-mag);}

  .footer{text-align:center; margin:26px 8px 0; padding-bottom:8px;}
  .btn--contact{background:rgba(255,255,255,.18); color:#fff; font-size:14px; padding:11px 24px; border:1.5px solid rgba(255,255,255,.55);}
  .footer__brand{color:#fff; font-size:13px; margin:14px 0 0; font-family:'Fredoka'; font-weight:600;}

  /* image placeholder (replace with real product image) */
  .ph{width:100%; height:100%; display:flex; align-items:center; justify-content:center;
      background:repeating-linear-gradient(45deg,#efe7f7,#efe7f7 8px,#f6f0fb 8px,#f6f0fb 16px);
      color:#a996bd; font-family:'Nunito'; font-weight:700; font-size:11px; text-align:center; padding:6px;}

  /* ---------- OVERLAYS (sheets + full screens) ---------- */
  .overlay{position:fixed; inset:0; z-index:40; display:none;}
  .overlay.is-open{display:block;}
  .overlay__backdrop{position:absolute; inset:0; background:rgba(20,6,30,.55);}
  .app-scope{ /* overlays are constrained to the mobile column */
    position:fixed; inset:0; margin:0 auto; max-width:480px;
  }

  /* product detail = bottom sheet */
  .sheet{position:absolute; left:0; right:0; bottom:0; max-height:93%; overflow-y:auto;
    background:#fff; border-radius:32px 32px 0 0; padding:0 20px 26px;}
  .sheet__grip{position:sticky; top:0; background:#fff; padding:12px 0 8px; display:flex; justify-content:center;}
  .sheet__grip span{width:44px; height:5px; border-radius:100px; background:#E7DCF0;}
  .sheet__close, .screen__back{
    border:0; cursor:pointer; width:38px; height:38px; border-radius:50%;
    background:var(--lilac); color:var(--purple); font-size:18px; font-family:'Fredoka'; font-weight:700; line-height:1;
  }
  .sheet__close{position:absolute; top:14px; right:16px; z-index:2; font-size:16px; font-weight:600;}
  .sheet__img{position:relative; height:208px; border-radius:24px; overflow:hidden; background:var(--lilac); margin-top:2px;}
  .tag{display:inline-block; margin-top:16px; color:#fff; font-family:'Fredoka'; font-weight:600; font-size:11px; padding:5px 11px; border-radius:100px;}
  .sheet h3{font-family:'Fredoka'; font-weight:700; font-size:24px; color:var(--ink); margin:10px 0 3px; line-height:1.1;}
  .sheet__size{font-family:'Nunito'; font-weight:700; font-size:13px; color:var(--muted2);}
  .sheet__desc{font-size:14px; color:#5a4a6b; line-height:1.5; margin:12px 0 0;}
  .panel{margin-top:16px; background:#F8F3FC; border-radius:18px; padding:14px 16px;}
  .panel__label, .field-label{font-family:'Fredoka'; font-weight:700; font-size:12px; color:var(--purple); text-transform:uppercase; letter-spacing:.6px;}
  .panel__body{font-size:13px; color:#4a3a5b; margin-top:5px; line-height:1.45;}
  .benefits{margin-top:16px; display:flex; flex-direction:column; gap:9px;}
  .benefit{display:flex; align-items:center; gap:10px; font-size:13px; color:#3a2a4b; font-weight:600;}
  .benefit span{flex:0 0 auto; width:20px; height:20px; border-radius:50%; background:var(--magenta); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:11px;}
  .sheet__buy{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:22px;}
  .sheet__buy .price{font-family:'Fredoka'; font-weight:700; font-size:26px; color:var(--ink);}
  .btn--buy{flex:1; background:var(--magenta); color:#fff; font-size:16px; padding:15px 20px; box-shadow:0 12px 22px -8px rgba(225,27,156,.7);}

  /* full-screen pages */
  .screen{position:absolute; inset:0; background:var(--screen); display:flex; flex-direction:column;}
  .screen__head{flex:0 0 auto; display:flex; align-items:center; gap:12px; padding:18px; background:#fff; border-bottom:1px solid #F0E7F7;}
  .screen__title{font-family:'Fredoka'; font-weight:700; font-size:20px; color:var(--ink);}
  .screen__body{flex:1; overflow-y:auto; padding:16px;}
  .screen__foot{flex:0 0 auto; background:#fff; border-top:1px solid #F0E7F7; padding:16px 18px 18px;}

  .bag-item{display:flex; gap:12px; align-items:center; background:#fff; border-radius:20px; padding:10px; margin-bottom:12px; box-shadow:0 10px 22px -16px rgba(60,10,90,.5);}
  .bag-item__img{width:64px; height:64px; flex:0 0 64px; border-radius:14px; overflow:hidden; background:var(--lilac);}
  .bag-item__name{font-family:'Fredoka'; font-weight:700; font-size:14px; color:var(--ink); line-height:1.15;}
  .bag-item__each{font-size:11px; color:var(--muted2); margin:2px 0 8px;}
  .stepper{display:flex; align-items:center; gap:10px;}
  .stepper button{border:0; cursor:pointer; width:26px; height:26px; border-radius:8px; background:var(--lilac); color:var(--purple); font-size:16px; font-family:'Fredoka'; font-weight:700; line-height:1;}
  .stepper span{font-family:'Fredoka'; font-weight:700; font-size:15px; color:var(--ink); min-width:16px; text-align:center;}
  .bag-item__right{display:flex; flex-direction:column; align-items:flex-end; gap:8px; margin-left:auto;}
  .bag-item__line{font-family:'Fredoka'; font-weight:700; font-size:15px; color:var(--ink);}
  .link-remove{border:0; cursor:pointer; background:none; color:#B0208A; font-size:11px; font-family:'Nunito'; font-weight:700; text-decoration:underline;}
  .empty{text-align:center; padding:56px 20px; color:var(--muted2);}
  .empty__big{font-size:44px;}
  .empty__title{font-family:'Fredoka'; font-weight:700; font-size:18px; color:var(--ink); margin-top:10px;}

  .promo{display:flex; gap:8px; margin-bottom:12px;}
  .promo input{flex:1; min-width:0;}
  .promo button{background:var(--deep); color:#fff; font-family:'Fredoka'; font-weight:600; font-size:14px; padding:0 20px; border-radius:12px; border:0; cursor:pointer;}
  .promo-chip{display:flex; align-items:center; justify-content:space-between; gap:8px; background:#F1FBF3; border:1px solid #BFE9C8; border-radius:12px; padding:9px 12px; margin-bottom:12px;}
  .promo-chip span{font-family:'Fredoka'; font-weight:600; font-size:13px; color:#1E874B;}
  .sum-row{display:flex; justify-content:space-between; font-size:13px; color:var(--muted); margin-bottom:5px;}
  .sum-total{display:flex; justify-content:space-between; font-family:'Fredoka'; font-weight:700; font-size:19px; color:var(--ink); margin:9px 0 13px;}
  .btn--primary{width:100%; background:var(--magenta); color:#fff; font-size:16px; padding:15px; box-shadow:0 12px 22px -8px rgba(225,27,156,.7);}
  .btn--dark{width:100%; background:var(--deep); color:#fff; font-size:16px; padding:15px; box-shadow:0 14px 26px -10px rgba(78,15,122,.7);}

  input, textarea{
    width:100%; box-sizing:border-box; border:1.5px solid var(--border); border-radius:12px;
    padding:12px 14px; font-family:'Nunito'; font-size:14px; color:var(--ink); background:#fff; margin-bottom:10px;
  }
  textarea{resize:none;}
  .field-label{margin:2px 0 10px;}
  .two{display:flex; gap:10px;}
  .two input{flex:1; min-width:0;}
  .demo-note{font-size:11px; color:var(--muted2); text-align:center; margin-top:8px;}

  /* confirmation */
  .confirm{position:absolute; inset:0; background:linear-gradient(180deg,#FBB024 0%,#E11B9C 60%,#7C1AE6 100%);
    display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:34px; color:#fff;}
  .confirm__emoji{font-size:64px;}
  .confirm h2{font-family:'Fredoka'; font-weight:700; font-size:30px; margin:10px 0 0;}
  .confirm p{font-family:'Fredoka'; font-weight:500; font-size:16px; margin:12px 20px 0;}
  .confirm__order{margin-top:22px; background:rgba(255,255,255,.2); border:1px solid rgba(255,255,255,.45); border-radius:18px; padding:16px 22px;}
  .btn--light{margin-top:28px; background:#fff; color:var(--purple); font-size:16px; padding:15px 30px; box-shadow:0 14px 26px -10px rgba(0,0,0,.35);}

  .contact-row{display:flex; align-items:center; gap:12px; background:#fff; border-radius:16px; padding:13px 15px; margin-bottom:10px; font-family:'Nunito'; font-weight:700; font-size:14px; color:var(--ink);}
  .thanks{background:#fff; border-radius:20px; padding:26px 20px; text-align:center; box-shadow:0 12px 26px -18px rgba(60,10,90,.5);}

/* ============================================================
   WooCommerce integration — the loop renders as <ul class="products">,
   but the design's .products was a <div>. Reset the browser's default
   list padding/margin so the cards fill the column full-width and stay
   centered (the default ul padding-left:40px was shoving them right).
   ============================================================ */
.products{list-style:none;margin:0;padding:0;}
.products > li{list-style:none;}
.products > li.card{margin:0;width:auto;max-width:none;min-width:0;float:none;}

/* ============================================================
   WooCommerce screens skinned to the design
   (single product · quick-view sheet · contact · cart · checkout · confirmation)
   ============================================================ */
html{scroll-behavior:smooth;}

/* ---- single product = the detail design ---- */
.single-wrap{padding:18px 16px 40px;}
.single-detail{background:#fff;border-radius:32px;padding:20px;box-shadow:var(--shadow-card);border:2px solid rgba(255,255,255,.9);}
.single-detail__name{font-family:'Fredoka';font-weight:700;font-size:24px;color:var(--ink);margin:12px 0 3px;line-height:1.1;}
.single-detail__how{font-size:13px;color:#5a4a6b;line-height:1.5;margin:0;}
.single-detail .sheet__buy .btn--buy{max-width:220px;}

/* ---- quick-view sheet (store.js injects .single-detail) ---- */
.sheet__inner{padding:0 20px 10px;}
.sheet__inner .single-detail{background:transparent;border:0;box-shadow:none;padding:0;border-radius:0;}
.sheet__loading{padding:64px 0;text-align:center;color:var(--muted2);font-family:'Fredoka';font-weight:600;}

/* ---- contact page ---- */
.screen-page{background:var(--screen);min-height:78vh;}
.screen-page__head{display:flex;align-items:center;gap:12px;padding:18px;background:#fff;border-bottom:1px solid #F0E7F7;}
.screen-page__body{padding:18px;}
.contact-intro{font-family:'Fredoka';font-weight:500;font-size:15px;color:#4a3a5b;margin:2px 0 16px;line-height:1.4;}
.contact-form{margin-top:8px;}

/* ---- cart · checkout · order-received become light screens ---- */
.woocommerce-cart .app, .woocommerce-checkout .app, .woocommerce-order-received .app{background:var(--screen);}
.woocommerce-cart .app-main, .woocommerce-checkout .app-main{padding:16px 16px 40px;}
.woocommerce .woocommerce-breadcrumb{display:none;}
.woocommerce-cart .entry-title, .woocommerce-checkout .entry-title, .woocommerce-page h1{font-family:'Fredoka';font-weight:700;color:var(--ink);padding:6px 4px;}

/* brand buttons across WooCommerce */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #place_order, .woocommerce .wc-proceed-to-checkout a.checkout-button{
	background:var(--magenta)!important;color:#fff!important;border:0!important;border-radius:100px!important;
	font-family:'Fredoka',sans-serif!important;font-weight:600!important;font-size:15px!important;padding:14px 22px!important;
	box-shadow:var(--shadow-mag)!important;cursor:pointer!important;text-shadow:none!important;width:auto;}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce #place_order:hover{background:#c8168a!important;}
.woocommerce .wc-proceed-to-checkout a.checkout-button, .woocommerce #place_order{background:var(--deep)!important;box-shadow:0 14px 26px -10px rgba(78,15,122,.7)!important;display:block;text-align:center;}
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce #place_order:hover{background:#3d0c61!important;}

/* white rounded panels */
.woocommerce .cart_totals, .woocommerce-checkout #customer_details .woocommerce-billing-fields,
.woocommerce-checkout #customer_details .woocommerce-shipping-fields, .woocommerce-checkout #order_review,
.woocommerce table.shop_table, .woocommerce .woocommerce-order, .woocommerce ul.order_details{
	background:#fff;border:0;border-radius:20px;padding:16px 18px;box-shadow:0 10px 22px -16px rgba(60,10,90,.5);margin-bottom:14px;}
.woocommerce table.shop_table{overflow:hidden;border-collapse:collapse;}
.woocommerce table.shop_table th, .woocommerce table.shop_table td{border:0;border-bottom:1px solid #F1EAF8;padding:13px 12px;font-family:'Nunito';color:var(--ink);}
.woocommerce table.shop_table tr:last-child td{border-bottom:0;}
.woocommerce table.cart img{border-radius:12px;width:58px;height:58px;object-fit:cover;}
.woocommerce .cart_totals h2, .woocommerce #order_review_heading{font-family:'Fredoka';font-weight:700;font-size:18px;color:var(--ink);margin:0 0 10px;}

/* inputs */
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select,
.woocommerce-checkout input:not([type=radio]):not([type=checkbox]), .woocommerce .quantity input.qty{
	border:1.5px solid var(--border)!important;border-radius:12px!important;padding:12px 14px!important;
	font-family:'Nunito',sans-serif!important;font-size:14px!important;color:var(--ink)!important;background:#fff!important;box-shadow:none!important;}
.woocommerce form .form-row label, .woocommerce-checkout label{font-family:'Fredoka',sans-serif;font-weight:600;font-size:13px;color:var(--ink);}

/* coupon row like the design's promo */
.woocommerce .cart .actions .coupon{display:flex;gap:8px;align-items:center;margin-bottom:12px;}
.woocommerce .cart .actions .coupon input.input-text{margin:0!important;flex:1;}

/* order-received / confirmation → gradient celebration */
.woocommerce-order-received .app{background:var(--page-gradient);}
.woocommerce-order-received .app-main{padding:34px 24px;color:#fff;text-align:center;}
.woocommerce-order-received .entry-title, .woocommerce-order-received .woocommerce-thankyou-order-received{
	font-family:'Fredoka';font-weight:700;font-size:28px;color:#fff;}
.woocommerce-order-received .woocommerce-order p{color:#fff;font-family:'Fredoka';font-weight:500;}
.woocommerce-order-received ul.order_details{color:var(--ink);text-align:left;}

/* ---- animated hero confetti ---- */
.hero__confetti{position:absolute;inset:0;pointer-events:none;z-index:1;}
.hero .logo, .hero__headline, .hero__sub, .hero .video-banner, .hero .btn--shop{position:relative;z-index:2;}
@keyframes yisgConfetti{
	0%   {transform:translateY(0)    rotate(-8deg) scale(1);}
	25%  {transform:translateY(-8px) rotate(9deg)  scale(1.12);}
	50%  {transform:translateY(4px)  rotate(-7deg) scale(.94);}
	75%  {transform:translateY(-5px) rotate(6deg)  scale(1.06);}
	100% {transform:translateY(0)    rotate(-8deg) scale(1);}
}
.hero__confetti .confetti{
	display:inline-block;line-height:1;text-shadow:0 1px 3px rgba(60,10,90,.18);
	animation:yisgConfetti var(--dur,4.5s) ease-in-out infinite;
	animation-delay:var(--d,0s);will-change:transform;
}
@media (prefers-reduced-motion:reduce){.hero__confetti .confetti{animation:none!important;}}

/* ---- cart / checkout page chrome (design "screen" head + body) ---- */
.woocommerce-cart .cart-pill, .woocommerce-checkout .cart-pill{display:none;}
.woocommerce-cart .app, .woocommerce-checkout .app{background:var(--screen);}
.screen__body{background:var(--screen);padding:16px 16px 40px;}
.screen__body--received{padding:0;background:transparent;}
.woocommerce-cart .screen__head, .woocommerce-checkout .screen__head{position:sticky;top:0;z-index:5;}

/* WooCommerce notices ("… added to your cart") as a clean brand bar */
.woocommerce-message, .woocommerce-info, .woocommerce-error{
	background:#fff!important;border:0!important;border-left:4px solid var(--magenta)!important;border-radius:14px!important;
	padding:13px 15px!important;font-family:'Nunito',sans-serif!important;font-size:14px!important;color:var(--ink)!important;
	box-shadow:0 8px 18px -14px rgba(60,10,90,.5)!important;margin:0 0 14px!important;
	display:flex;align-items:center;gap:10px;flex-wrap:wrap;list-style:none;}
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before{
	position:static!important;margin:0 2px 0 0!important;color:var(--magenta)!important;font-size:16px;}
.woocommerce-message a.button, .woocommerce-info a.button{margin-left:auto;padding:9px 16px!important;font-size:13px!important;}

/* ---- keep the brand gradient on cart/checkout (not a flat light screen) ---- */
.woocommerce-cart .app, .woocommerce-checkout .app{background:var(--page-gradient)!important;}
.screen__body{background:transparent;}
.woocommerce-cart .screen__head, .woocommerce-checkout .screen__head{background:#fff;}

/* ---- centre anchor-based button labels (WC Add-to-bag/Info are <a>, not <button>) ---- */
.btn--info, .btn--add, .btn--buy,
.woocommerce a.button, .woocommerce button.button, .woocommerce .single_add_to_cart_button{
	display:inline-flex!important;align-items:center;justify-content:center;text-align:center;line-height:1.1;
}

/* ---- order-received celebration chip ---- */
.confirm__label{font-size:12px;opacity:.85;font-family:'Fredoka',sans-serif;letter-spacing:.5px;}
.confirm__num{font-family:'Fredoka',sans-serif;font-weight:700;font-size:20px;margin-top:2px;}
.confirm__total{font-size:13px;margin-top:6px;}
.confirm__email{font-size:13px;opacity:.92;margin:16px 20px 0;}
.woocommerce-order-received .screen__body--received{position:relative;min-height:calc(100vh - 70px);}

/* hide WC's default order-received furniture (we render .confirm instead) */
.woocommerce-order-received .woocommerce-thankyou-order-received,
.woocommerce-order-received .woocommerce-order-overview,
.woocommerce-order-received .woocommerce-customer-details{display:none!important;}

/* ---- Real product photos must fill their image box (fix: <img> overflowed a fixed-height box and showed a blank slice) ---- */
.card__img img{width:100%; height:100%; object-fit:cover; display:block;}
.sheet__img{aspect-ratio:3/4; height:auto;}           /* portrait product photos: box matches image ratio, no crop */
.sheet__img img{width:100%; height:100%; object-fit:cover; display:block;}

/* ---- Footer: centre + widen the Contact button (markup uses .site-footer, old rule targeted .footer) ---- */
.site-footer{text-align:center; margin:26px 16px; padding-bottom:16px;}
.site-footer .btn--contact{display:block; width:100%; box-sizing:border-box; text-align:center; font-size:15px; padding:15px 24px;}

/* ---- Quick-view sheet: animate transform so swipe-down-to-dismiss follows the finger and snaps ---- */
.sheet{transition:transform .28s cubic-bezier(.4,0,.2,1); will-change:transform; touch-action:pan-y;}
.sheet__grip{cursor:grab; touch-action:none;}

/* ---- Product image gallery: swipeable carousel of all photos with dot indicators ---- */
.sheet__gallery{position:relative; margin-top:2px;}
.sheet__track{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; border-radius:24px; -webkit-overflow-scrolling:touch; scrollbar-width:none; touch-action:pan-x;}
.sheet__track::-webkit-scrollbar{display:none;}
.sheet__slide{flex:0 0 100%; scroll-snap-align:center; aspect-ratio:3/4; background:var(--lilac);}
.sheet__slide img{width:100%; height:100%; object-fit:cover; display:block;}
.sheet__dots{display:flex; justify-content:center; gap:7px; margin-top:11px;}
.sheet__dot{width:7px; height:7px; border-radius:100px; background:var(--border); cursor:pointer; transition:width .2s, background .2s;}
.sheet__dot.is-active{background:var(--purple); width:20px;}