/* ==========================================================================
   Lumière Aesthetics — glassmorphism booking experience
   Airy, premium-clean. Lavender/blush/mint aurora, frosted glass, orchid→rose.
   ========================================================================== */

:root{
  /* brand + accents */
  --orchid:#A06BD6;
  --rose:#E5729B;
  /* deeper accent used only where white text sits on the fill (>=4.5:1) */
  --cta-a:#8A46C8;
  --cta-b:#C13E7A;
  --accent-grad:linear-gradient(120deg,var(--orchid),var(--rose));
  --cta-grad:linear-gradient(120deg,var(--cta-a),var(--cta-b));

  /* ink */
  --ink:#2A2740;
  --ink-2:#453F5C;
  --muted:#615B78;
  --rose-ink:#C43769; /* deeper rose that passes 4.5:1 for small text on light glass */

  /* glass */
  --glass-bg:rgba(255,255,255,.55);
  --glass-bg-strong:rgba(255,255,255,.72);
  --glass-inner:rgba(255,255,255,.5);
  --glass-brd:rgba(255,255,255,.65);
  --glass-brd-soft:rgba(140,110,190,.16);
  --shadow-lg:0 30px 70px -28px rgba(90,55,140,.42);
  --shadow-md:0 16px 40px -20px rgba(90,55,140,.34);
  --shadow-sm:0 6px 18px -10px rgba(90,55,140,.3);

  --r-lg:26px;
  --r-md:18px;
  --r-sm:13px;

  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:320ms;

  --font:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --display:'Sora',var(--font);
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%;background:linear-gradient(125deg,#EAE6FF 0%,#FFE9F0 52%,#E6FFF4 100%)}
body{
  margin:0;
  font-family:var(--font);
  color:var(--ink);
  background:linear-gradient(125deg,#EAE6FF 0%,#FFE9F0 52%,#E6FFF4 100%);
  min-height:100vh;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit}
button{font-family:inherit}
h1,h2,h3{margin:0;font-family:var(--display);letter-spacing:-.01em;line-height:1.12}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- aurora background ---------- */
.aurora{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.aurora .blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.72;will-change:transform}
.blob-1{width:52vmax;height:52vmax;left:-14vmax;top:-16vmax;background:radial-gradient(circle at 30% 30%,#C7B4FF,#B79BFF00 70%);animation:drift1 26s var(--ease) infinite alternate}
.blob-2{width:46vmax;height:46vmax;right:-12vmax;top:8vmax;background:radial-gradient(circle at 60% 40%,#FFC0D6,#FFB3CC00 70%);animation:drift2 30s var(--ease) infinite alternate}
.blob-3{width:44vmax;height:44vmax;left:18vmax;bottom:-20vmax;background:radial-gradient(circle at 50% 50%,#A9F5DA,#9BF0D000 70%);animation:drift3 34s var(--ease) infinite alternate}
.grain{position:absolute;inset:0;opacity:.4;background-image:radial-gradient(rgba(255,255,255,.55) 1px,transparent 1px);background-size:3px 3px;mix-blend-mode:overlay}
@keyframes drift1{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(8vmax,6vmax,0) scale(1.12)}}
@keyframes drift2{from{transform:translate3d(0,0,0) scale(1.05)}to{transform:translate3d(-7vmax,9vmax,0) scale(.92)}}
@keyframes drift3{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(6vmax,-8vmax,0) scale(1.14)}}

/* ---------- glass primitives ---------- */
.glass{
  background:var(--glass-bg);
  -webkit-backdrop-filter:blur(24px) saturate(1.5);
  backdrop-filter:blur(24px) saturate(1.5);
  border:1px solid var(--glass-brd);
  box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,.7);
  border-radius:var(--r-lg);
}
.glass-inner{
  background:var(--glass-inner);
  -webkit-backdrop-filter:blur(12px) saturate(1.3);
  backdrop-filter:blur(12px) saturate(1.3);
  border:1px solid var(--glass-brd);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-sm),inset 0 1px 0 rgba(255,255,255,.6);
}

/* ---------- top bar ---------- */
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px clamp(16px,4vw,40px);
  position:sticky;top:0;z-index:20;
  background:rgba(255,255,255,.42);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid rgba(255,255,255,.5);
}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--glass-bg-strong);box-shadow:var(--shadow-sm),inset 0 1px 0 rgba(255,255,255,.8);border:1px solid var(--glass-brd)}
.brand-mark svg{width:26px;height:26px}
.brand-name{font-family:var(--display);font-weight:700;font-size:18px;line-height:1;display:flex;flex-direction:column;gap:2px}
.brand-name-sub{font-family:var(--font);font-weight:600;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.topbar-right{display:flex;align-items:center;gap:16px}
.topbar-phone{display:inline-flex;align-items:center;gap:7px;text-decoration:none;font-weight:600;font-size:14px;color:var(--ink-2)}
.topbar-phone svg{width:17px;height:17px;color:var(--orchid)}
.topbar-phone:hover{color:var(--ink)}
.powered{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.5);border:1px solid var(--glass-brd)}
.powered strong{color:var(--ink);font-weight:800}

/* ---------- page ---------- */
.page{max-width:940px;margin:0 auto;padding:clamp(20px,4vw,44px) clamp(16px,4vw,24px) 40px}

/* ---------- hero ---------- */
.hero{text-align:center;margin-bottom:clamp(18px,3vw,30px)}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:var(--accent-grad);box-shadow:0 0 0 4px rgba(160,107,214,.16)}
.hero-title{font-size:clamp(28px,6vw,44px);font-weight:700;color:var(--ink)}
.hero-title em{font-style:normal;background:var(--accent-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-sub{max-width:44ch;margin:12px auto 0;color:var(--ink-2);font-size:clamp(14.5px,2.4vw,16px)}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;padding:0;margin:18px 0 0}
.chip{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ink-2);padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.55);border:1px solid var(--glass-brd);box-shadow:var(--shadow-sm)}
.chip svg{width:16px;height:16px;color:var(--orchid)}
.chip strong{color:var(--ink);font-weight:800}
.chip:first-child svg{color:#E8A93B}

/* ---------- widget ---------- */
.widget{padding:clamp(18px,3vw,30px);position:relative;overflow:hidden}

/* stepper */
.stepper{position:relative;margin:2px 4px clamp(20px,3vw,28px)}
.stepper-track{position:absolute;left:6%;right:6%;top:17px;height:3px;border-radius:2px;background:rgba(140,110,190,.18)}
.stepper-fill{display:block;height:100%;width:0;border-radius:2px;background:var(--accent-grad);transition:width 460ms var(--ease)}
.steps-list{list-style:none;display:flex;justify-content:space-between;margin:0;padding:0;position:relative}
.step-node{display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;text-align:center}
.node-dot{position:relative;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--glass-bg-strong);border:1px solid var(--glass-brd);box-shadow:var(--shadow-sm),inset 0 1px 0 rgba(255,255,255,.8);color:var(--muted);font-weight:800;font-size:14px;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),color var(--dur)}
.node-num,.node-check{grid-area:1/1;transition:opacity 220ms var(--ease),transform 220ms var(--ease)}
.node-check{width:18px;height:18px;color:#fff;opacity:0;transform:scale(.5)}
.node-label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.01em;transition:color var(--dur)}
.step-node.is-current .node-dot{color:#fff;background:var(--cta-grad);border-color:transparent;box-shadow:0 8px 20px -6px rgba(160,80,180,.6),inset 0 1px 0 rgba(255,255,255,.4);transform:scale(1.08)}
.step-node.is-current .node-label{color:var(--ink)}
.step-node.is-done .node-dot{background:var(--accent-grad);border-color:transparent;color:#fff}
.step-node.is-done .node-num{opacity:0;transform:scale(.5)}
.step-node.is-done .node-check{opacity:1;transform:scale(1)}
.step-node.is-done .node-label{color:var(--ink-2)}

/* panels */
.panels{position:relative}
.panel{outline:none}
.panel[hidden]{display:none}
.panel.is-active{animation:panelIn var(--dur) var(--ease) both}
@keyframes panelIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.panel-head{margin-bottom:18px}
.panel-title{font-size:clamp(20px,3.4vw,25px);font-weight:700;color:var(--ink)}
.panel-sub{margin:6px 0 0;color:var(--muted);font-size:14px}

/* selectable cards */
.cards{display:grid;gap:12px}
.cards-treatments{grid-template-columns:1fr}
.card{
  position:relative;display:flex;align-items:center;gap:14px;width:100%;text-align:left;
  padding:15px 16px;border-radius:var(--r-md);cursor:pointer;
  background:var(--glass-inner);border:1px solid var(--glass-brd);
  box-shadow:var(--shadow-sm),inset 0 1px 0 rgba(255,255,255,.55);
  color:var(--ink);font:inherit;
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease),background var(--dur);
  overflow:hidden;
}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md),inset 0 1px 0 rgba(255,255,255,.6);border-color:rgba(160,107,214,.35)}
.card:active{transform:translateY(0) scale(.994)}
.card:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(160,107,214,.45),var(--shadow-md)}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,rgba(160,107,214,.14),rgba(229,114,155,.14));opacity:0;transition:opacity var(--dur)}
.card.is-selected{border-color:transparent;background:var(--glass-bg-strong);box-shadow:0 14px 34px -14px rgba(160,80,180,.5),0 0 0 1.5px rgba(160,107,214,.55),inset 0 1px 0 rgba(255,255,255,.7);transform:translateY(-2px)}
.card.is-selected::after{opacity:1}
/* shimmer sweep on selected */
.card.is-selected::before{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-18deg);animation:shimmer 1.5s var(--ease) .05s;pointer-events:none}
@keyframes shimmer{to{left:130%}}

.card-ic{flex:0 0 auto;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:var(--accent-grad);color:#fff;box-shadow:var(--shadow-sm)}
.card-ic svg{width:24px;height:24px}
.card-body{flex:1;min-width:0;position:relative;z-index:1}
.card-name{font-family:var(--display);font-weight:600;font-size:16px;color:var(--ink);display:block}
.card-desc{font-size:13px;color:var(--muted);margin-top:3px;display:block}
.card-meta{flex:0 0 auto;text-align:right;position:relative;z-index:1}
.card-price{font-family:var(--display);font-weight:700;font-size:16px;color:var(--ink);display:block}
.card-price.is-free{background:var(--cta-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.card-dur{font-size:12px;color:var(--muted);display:block;margin-top:2px}
.card-tick{position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:50%;background:var(--accent-grad);display:grid;place-items:center;opacity:0;transform:scale(.4);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);z-index:2}
.card-tick svg{width:13px;height:13px;color:#fff}
.card.is-selected .card-tick{opacity:1;transform:scale(1)}
.card.is-selected .card-meta{padding-right:26px}

/* specialists */
.cards-specialists{grid-template-columns:1fr}
.card-avatar{flex:0 0 auto;width:52px;height:52px;border-radius:50%;overflow:hidden;position:relative;background:var(--accent-grad);box-shadow:var(--shadow-sm),0 0 0 2px rgba(255,255,255,.6)}
.card-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.card-avatar .monogram{position:absolute;inset:0;display:none;align-items:center;justify-content:center;color:#fff;font-family:var(--display);font-weight:700;font-size:19px}
.spec-cred{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--muted);margin-top:3px}
.spec-cred svg{width:14px;height:14px;color:var(--orchid)}
.spec-rating{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;color:var(--ink-2);margin-top:5px}
.spec-rating svg{width:13px;height:13px;color:#E8A93B}

/* ---------- schedule ---------- */
.schedule{display:grid;grid-template-columns:1fr;gap:14px}
.cal{padding:16px}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.cal-month{font-family:var(--display);font-weight:600;font-size:16px;color:var(--ink)}
.cal-nav{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.6);border:1px solid var(--glass-brd);color:var(--ink-2);cursor:pointer;box-shadow:var(--shadow-sm);transition:transform 160ms var(--ease),color 160ms,background 160ms}
.cal-nav svg{width:18px;height:18px}
.cal-nav:hover:not(:disabled){color:var(--orchid);transform:translateY(-1px)}
.cal-nav:active:not(:disabled){transform:translateY(0) scale(.94)}
.cal-nav:disabled{opacity:.32;cursor:not-allowed}
.cal-nav:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(160,107,214,.45)}
.cal-dows{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px}
.cal-dows span{text-align:center;font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--muted)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-day{position:relative;aspect-ratio:1;border:none;background:transparent;border-radius:11px;font:inherit;font-weight:600;font-size:14px;color:var(--ink);cursor:pointer;display:grid;place-items:center;transition:background 180ms var(--ease),color 180ms,transform 160ms var(--ease);animation:dayIn 360ms var(--ease) both}
.cal-day.blank{visibility:hidden;pointer-events:none}
@keyframes dayIn{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
.cal-day:hover:not(:disabled):not(.is-selected){background:rgba(160,107,214,.12)}
.cal-day:active:not(:disabled){transform:scale(.9)}
.cal-day:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(160,107,214,.45)}
.cal-day:disabled{color:rgba(97,91,120,.32);cursor:not-allowed;text-decoration:line-through;text-decoration-color:rgba(97,91,120,.3)}
.cal-day.is-full{color:rgba(97,91,120,.4);cursor:not-allowed}
.cal-day.is-full::after{content:"";position:absolute;bottom:6px;width:4px;height:4px;border-radius:50%;background:var(--rose);opacity:.55}
.cal-day.is-today{box-shadow:inset 0 0 0 1.5px rgba(160,107,214,.5)}
.cal-day.is-selected{background:var(--cta-grad);color:#fff;box-shadow:0 8px 18px -6px rgba(160,80,180,.6);transform:scale(1.02)}
.cal-legend{display:flex;align-items:center;gap:6px;margin:12px 0 0;font-size:12px;color:var(--muted)}
.cal-legend .lg{width:9px;height:9px;border-radius:50%;display:inline-block}
.lg-open{background:var(--accent-grad)}
.lg-full{background:var(--rose);opacity:.5;margin-left:8px}

/* slots */
.slots{padding:16px;display:flex;flex-direction:column}
.slots-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.slots-title{font-family:var(--display);font-weight:600;font-size:15px;color:var(--ink)}
.slots-tz{font-size:11.5px;color:var(--muted);font-weight:600}
.slots-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;align-content:start}
.slots-empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:26px 10px;display:flex;flex-direction:column;align-items:center;gap:10px}
.slots-empty svg{width:34px;height:34px;color:rgba(160,107,214,.5)}
.slots-empty p{margin:0;font-size:13.5px;max-width:26ch}
.slot{position:relative;padding:11px 8px;border-radius:12px;border:1px solid var(--glass-brd);background:rgba(255,255,255,.55);font:inherit;font-weight:600;font-size:14px;color:var(--ink);cursor:pointer;text-align:center;box-shadow:var(--shadow-sm);transition:transform 160ms var(--ease),box-shadow 180ms,border-color 180ms,background 180ms;animation:slotIn 300ms var(--ease) both;animation-delay:calc(var(--i,0) * 32ms)}
@keyframes slotIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.slot:hover:not(:disabled):not(.is-selected){transform:translateY(-2px);border-color:rgba(160,107,214,.4);box-shadow:var(--shadow-md)}
.slot:active:not(:disabled){transform:translateY(0) scale(.96)}
.slot:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(160,107,214,.45)}
.slot.is-selected{background:var(--cta-grad);color:#fff;border-color:transparent;box-shadow:0 10px 22px -8px rgba(160,80,180,.6)}
.slot:disabled{opacity:.42;cursor:not-allowed;text-decoration:line-through;text-decoration-color:rgba(97,91,120,.4);background:rgba(255,255,255,.3)}
.slot-tag{display:block;font-size:10px;font-weight:700;letter-spacing:.03em;color:var(--rose-ink);margin-top:2px}
.slot.is-selected .slot-tag{color:rgba(255,255,255,.9)}

/* ---------- details form ---------- */
.details-form{display:flex;flex-direction:column;gap:16px}
.field-row{display:grid;grid-template-columns:1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:13px;font-weight:700;color:var(--ink-2)}
.field .opt{font-weight:500;color:var(--muted);font-size:12px}
.field input,.field textarea{
  font:inherit;font-size:15px;color:var(--ink);padding:12px 14px;border-radius:13px;
  background:rgba(255,255,255,.6);border:1px solid var(--glass-brd);
  box-shadow:inset 0 1px 3px rgba(90,55,140,.06);
  transition:border-color 180ms,box-shadow 180ms,background 180ms;resize:vertical;
}
.field input::placeholder,.field textarea::placeholder{color:#9a94ac}
.field input:hover,.field textarea:hover{border-color:rgba(160,107,214,.35)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--orchid);background:rgba(255,255,255,.85);box-shadow:0 0 0 3px rgba(160,107,214,.2)}
.field.has-error input,.field.has-error textarea{border-color:var(--rose);box-shadow:0 0 0 3px rgba(229,114,155,.16)}
.field-err{font-size:12.5px;font-weight:600;color:#c43769;min-height:0;max-height:0;opacity:0;overflow:hidden;transition:max-height 220ms var(--ease),opacity 200ms}
.field.has-error .field-err{max-height:24px;opacity:1}
.consent{display:flex;align-items:flex-start;gap:11px;cursor:pointer;font-size:13.5px;color:var(--ink-2);user-select:none}
.consent input{position:absolute;opacity:0;width:1px;height:1px}
.consent-box{flex:0 0 auto;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--glass-brd);background:rgba(255,255,255,.6);display:grid;place-items:center;transition:background 180ms,border-color 180ms}
.consent-box svg{width:14px;height:14px;color:#fff;opacity:0;transform:scale(.4);transition:opacity 180ms var(--ease),transform 180ms var(--ease)}
.consent input:checked + .consent-box{background:var(--accent-grad);border-color:transparent}
.consent input:checked + .consent-box svg{opacity:1;transform:scale(1)}
.consent input:focus-visible + .consent-box{box-shadow:0 0 0 3px rgba(160,107,214,.45)}

/* ---------- confirmation ---------- */
.panel-confirm{text-align:center}
.confirm-burst{position:relative;width:104px;height:104px;margin:6px auto 18px}
.confirm-burst .ring{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(160,107,214,.4);animation:ringPulse 1.6s var(--ease) infinite}
.confirm-burst .ring-2{animation-delay:.5s;border-color:rgba(229,114,155,.4)}
@keyframes ringPulse{0%{transform:scale(.6);opacity:.9}70%{opacity:0}100%{transform:scale(1.5);opacity:0}}
.check-badge{position:absolute;inset:14px;border-radius:50%;background:var(--cta-grad);display:grid;place-items:center;box-shadow:0 16px 34px -10px rgba(160,80,180,.6)}
.check-badge svg{width:56px;height:56px}
.cb-circle{stroke:rgba(255,255,255,.4);stroke-width:2;fill:none}
.cb-check{stroke:#fff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;fill:none;stroke-dasharray:48;stroke-dashoffset:48;animation:draw .6s var(--ease) .25s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.spark{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--accent-grad);opacity:0}
.s1{top:-2px;left:12px;animation:spark 1s var(--ease) .3s}
.s2{top:8px;right:-4px;animation:spark 1s var(--ease) .42s}
.s3{bottom:2px;left:-4px;animation:spark 1s var(--ease) .5s}
.s4{bottom:-2px;right:16px;animation:spark 1s var(--ease) .6s}
@keyframes spark{0%{opacity:0;transform:scale(0)}40%{opacity:1;transform:scale(1.2)}100%{opacity:0;transform:scale(.4) translateY(-10px)}}
.confirm-title{font-size:clamp(26px,5vw,34px);font-weight:700;color:var(--ink)}
.confirm-sub{margin:8px auto 22px;color:var(--ink-2);max-width:36ch}

.summary{padding:16px 18px;text-align:left;margin-bottom:22px}
.summary-ref{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px dashed var(--glass-brd-soft)}
.summary-ref .lbl{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.summary-ref .code{font-family:var(--display);font-weight:700;font-size:15px;color:var(--ink);letter-spacing:.04em}
.summary-row{display:flex;align-items:flex-start;gap:12px;padding:8px 0}
.summary-row .s-ic{flex:0 0 auto;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(160,107,214,.12);color:var(--orchid)}
.summary-row .s-ic svg{width:18px;height:18px}
.summary-row .s-body{flex:1;min-width:0}
.summary-row .s-lbl{font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);display:block}
.summary-row .s-val{font-size:15px;font-weight:600;color:var(--ink);display:block;margin-top:1px}
.summary-row .s-sub{font-size:13px;color:var(--muted)}
.summary-total{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding-top:12px;border-top:1px dashed var(--glass-brd-soft)}
.summary-total .t-lbl{font-weight:700;color:var(--ink-2);font-size:14px}
.summary-total .t-val{font-family:var(--display);font-weight:700;font-size:19px;color:var(--ink)}

.loop{text-align:left;margin-bottom:22px}
.loop-lead{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;text-align:center}
.loop-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.loop-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--glass-inner);border:1px solid var(--glass-brd);box-shadow:var(--shadow-sm);opacity:0;transform:translateY(10px);animation:loopIn .5s var(--ease) forwards;animation-delay:calc(.5s + var(--i) * .28s)}
@keyframes loopIn{to{opacity:1;transform:none}}
.loop-ic{flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--accent-grad);color:#fff;box-shadow:var(--shadow-sm)}
.loop-ic svg{width:20px;height:20px}
.loop-tx{flex:1;min-width:0}
.loop-tx strong{display:block;font-size:14.5px;color:var(--ink);font-weight:700}
.loop-tx span{display:block;font-size:12.5px;color:var(--muted);margin-top:1px}
.loop-done{flex:0 0 auto;width:22px;height:22px;color:#39b98a;opacity:0;transform:scale(.4);animation:loopDone .4s var(--ease) forwards;animation-delay:calc(.9s + var(--i) * .28s)}
@keyframes loopDone{to{opacity:1;transform:scale(1)}}

.btn-again{margin:0 auto}

/* ---------- footer nav / buttons ---------- */
.widget-foot{display:flex;align-items:center;gap:12px;margin-top:clamp(20px,3vw,28px);padding-top:18px;border-top:1px solid var(--glass-brd-soft)}
.foot-hint{flex:1;font-size:13px;color:var(--muted);text-align:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:700;font-size:14.5px;border-radius:13px;cursor:pointer;border:1px solid transparent;transition:transform 160ms var(--ease),box-shadow 200ms,background 200ms,opacity 200ms;-webkit-tap-highlight-color:transparent}
.btn svg{width:18px;height:18px}
.btn-back{background:rgba(255,255,255,.55);border-color:var(--glass-brd);color:var(--ink-2);padding:11px 16px;box-shadow:var(--shadow-sm)}
.btn-back:hover{transform:translateY(-1px);color:var(--ink)}
.btn-back:active{transform:translateY(0) scale(.97)}
.btn-primary{background:var(--cta-grad);color:#fff;padding:12px 22px;box-shadow:0 12px 26px -10px rgba(160,80,180,.65),inset 0 1px 0 rgba(255,255,255,.3);position:relative}
.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(160,80,180,.7)}
.btn-primary:active:not(:disabled){transform:translateY(0) scale(.98)}
.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
.btn-primary .btn-spinner{display:none;width:17px;height:17px;border:2.4px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.btn-primary.is-loading .btn-label,.btn-primary.is-loading .btn-arrow{display:none}
.btn-primary.is-loading .btn-spinner{display:block}
.btn-ghost{background:rgba(255,255,255,.5);border-color:var(--glass-brd);color:var(--ink);padding:12px 22px;box-shadow:var(--shadow-sm)}
.btn-ghost:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);color:var(--orchid)}
.btn-ghost:active{transform:translateY(0) scale(.98)}
.btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(160,107,214,.5)}

/* ---------- trust footer ---------- */
.trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:26px;font-size:12.5px;color:var(--muted)}
.trust .dot{opacity:.5}

/* ---------- responsive ---------- */
@media(min-width:620px){
  .cards-treatments{grid-template-columns:1fr 1fr}
  .field-row{grid-template-columns:1fr 1fr}
  .slots-grid{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:780px){
  .schedule{grid-template-columns:1.05fr 1fr}
  .slots-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .node-label{display:none}
  .stepper-track{top:17px}
  .topbar-phone span{display:none}
  .powered{display:none}
  .foot-hint{display:none}
  .btn-primary{flex:1}
}
@media(max-width:360px){
  .cards-treatments{grid-template-columns:1fr}
}

/* ---------- reduced motion / transparency ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .aurora .blob{animation:none}
  .card.is-selected::before{display:none}
  .cb-check{stroke-dashoffset:0}
  .loop-item{opacity:1;transform:none}
  .loop-done{opacity:1;transform:none}
  .spark{display:none}
}
@media(prefers-reduced-transparency:reduce){
  .glass,.glass-inner,.topbar{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(255,255,255,.92)}
}
/* fallback for browsers without backdrop-filter */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .glass{background:rgba(255,255,255,.9)}
  .glass-inner,.topbar{background:rgba(255,255,255,.85)}
}
