/* =========================================================
   WordPress layer on top of the BukaEasy design system (base.css)
   ========================================================= */

/* Forms used as inline buttons */
.be-inline{display:inline-flex; margin:0}
.be-danger-text{color:var(--error)!important}
.btn[disabled]{pointer-events:none}

/* Save heart sits on the card cover, above the card's full-card link */
.pcard .cover .save-wrap{position:absolute; top:12px; right:12px; z-index:3; margin:0}
.pcard .cover .save-wrap .icon-btn{background:rgba(255,255,255,.94); border-color:transparent}
.icon-btn[aria-pressed="true"] .i{fill:currentColor}

/* Segmented links (explore grid/list) */
.seg a.seg-a{display:inline-flex; align-items:center; justify-content:center; min-height:40px; min-width:40px; padding:0 12px; color:var(--ink-2)}
.seg a.seg-a[aria-current="true"]{background:var(--green); color:#fff}
.be-explore{display:block}
.be-explore .filterbar{margin-bottom:16px}

/* Header saved count hidden state */
.saved-count .n[hidden]{display:none}
.header-actions .account-btn{text-decoration:none}

/* Pop-over menus built on <details> */
details.be-pop, details.be-decline{position:relative}
details.be-pop>summary, details.be-decline>summary{list-style:none}
details.be-pop>summary::-webkit-details-marker, details.be-decline>summary::-webkit-details-marker{display:none}
.be-pop-panel{position:absolute; z-index:20; top:calc(100% + 6px); left:0; width:min(320px,80vw); box-shadow:var(--shadow-2)}
.be-pop-panel.wide{width:min(720px,90vw); right:0; left:auto; background:transparent}
.actions .be-pop-panel{left:auto; right:0}
@media (max-width:760px){ .be-pop-panel, .actions .be-pop-panel{position:static; width:100%; margin-top:8px} }
details.be-decline[open]>summary{margin-bottom:0}

/* Multi-step forms */
.be-step{border:0; padding:0; margin:0; min-width:0}
.be-step+.be-step{margin-top:32px; padding-top:24px; border-top:1px solid var(--border)}
form.is-wizard .be-step+.be-step{margin-top:0; padding-top:0; border-top:0}
.be-step h2{font-size:1.375rem}
.wiz-nav [hidden]{display:none!important}

/* Photos */
.be-thumbs{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px}
.be-thumbs img{width:84px; height:64px; object-fit:cover; border-radius:6px; border:1px solid var(--border)}
.be-photo{display:flex; flex-direction:column; gap:6px; padding:8px; border:1px solid var(--border); border-radius:var(--r); background:var(--surface)}
.be-photo-img{display:block; position:relative; aspect-ratio:4/3; border-radius:6px; overflow:hidden}
.be-photo-img .media{position:absolute; inset:0}

/* Gallery with a single image */
.gallery.single{grid-template-columns:1fr!important; grid-template-rows:auto!important; height:auto!important}
.gallery.single .media{aspect-ratio:21/9!important}
@media (max-width:799px){ .gallery.single .media{aspect-ratio:16/9!important} }

/* Notices with links */
.notice a{color:inherit; font-weight:700}

/* Prose (ordinary pages, supplier descriptions) */
.prose-page{max-width:760px}
.prose-page h1{color:var(--green-deep); font-size:clamp(2rem,4vw,2.8rem); margin-bottom:20px}
.prose{font-size:1.0625rem; line-height:1.7; color:var(--ink-2)}
.prose h2{font-size:1.375rem; margin:1.6em 0 .5em; color:var(--ink)}
.prose h3{font-size:1.125rem; margin:1.4em 0 .4em; color:var(--ink)}
.prose ul,.prose ol{padding-left:1.25em}
.prose li{margin:.3em 0}
.prose a{color:var(--green); text-underline-offset:2px}
.prose img{border-radius:var(--r)}
.prose blockquote{margin:1.2em 0; padding:4px 0 4px 18px; color:var(--ink)}
.prose table{width:100%; border-collapse:collapse}
.prose td,.prose th{border-bottom:1px solid var(--border); padding:8px; text-align:left}
.alignleft{float:left; margin:0 1.5em 1em 0}
.alignright{float:right; margin:0 0 1em 1.5em}
.aligncenter{margin-left:auto; margin-right:auto}
.wp-caption-text{font-size:.8125rem; color:var(--muted)}

/* Pagination */
.nav-links{display:flex; gap:6px; flex-wrap:wrap}
.nav-links .page-numbers{display:inline-grid; place-items:center; min-width:40px; min-height:40px; padding:0 10px; border:1px solid var(--border-strong); border-radius:var(--r); background:var(--surface); text-decoration:none; color:var(--ink)}
.nav-links .page-numbers.current{background:var(--green); color:#fff; border-color:var(--green)}

/* App (workspace) pages: full screen, no public chrome */
body.be-app .footer{display:none}
body.be-app .app{min-height:100vh}
.side form{margin:0}
.side select{appearance:auto}
.app-main .page-head h1{font-size:clamp(1.4rem,2.6vw,1.9rem)}

/* Login page tweaks when WordPress screens are used (password reset) */
.login h1 a{background-image:none!important}

/* Small screens */
@media (max-width:640px){
  .toolbar .left{width:100%; justify-content:space-between}
  .page-head .row{width:100%}
}
@media print{
  .site-header,.footer,.side,.aside .card:not(.quote-box),.btn,.toasts{display:none!important}
  body{background:#fff}
}

/* Hero photo: the couple sits right of centre. On wide screens the photo fills the right
   ~70% of the frame and fades into the dark left side, keeping faces clear of the headline. */
.hero-frame>.media{background:#17110f}
@media (min-width:900px){
  .hero-frame>.media img{position:absolute; right:0; top:0; width:70%; height:100%; object-position:45% 35%;
    -webkit-mask-image:linear-gradient(to right, transparent 0, #000 30%); mask-image:linear-gradient(to right, transparent 0, #000 30%)}
}

/* WordPress puts class="page" on <body>; the design system's .page wrapper padding must not apply to it. */
body.page{padding:0}
/* Two-photo gallery: second photo fills the full height */
@media (min-width:800px){ .gallery .media:nth-child(2):last-child{grid-row:span 2} }

/* =========================================================
   FLORAL MODERN LAYER
   Palette tokens live in base.css :root. The BUKA logo keeps its own navy/teal.
   ========================================================= */

/* ---- Logo (unchanged artwork and colours) ---- */
.brand{gap:10px; color:var(--logo-navy)}
.brand-mark{width:30px; height:33px; color:var(--logo-navy); --logo-arc:var(--logo-teal)}
.brand-word{font-family:"Poppins", var(--font-ui); font-weight:800; letter-spacing:.02em; font-size:1.125rem; color:var(--logo-navy)}
.brand-word em{font-style:normal; color:var(--logo-teal)}
.side .brand, .side .brand-mark, .side .brand-word{color:#fff; --logo-arc:var(--logo-mint)}
.side .brand-word em{color:var(--logo-mint)}

/* ---- Type: one family site-wide (Poppins, the BUKA brand font) ---- */
.hero h1, .section-head h2, .assist h2, .recruit h2, .page-head h1.serif, .p-title h1, .success-hero h1, .prose-page h1{
  font-family:var(--font-display); font-weight:700; letter-spacing:-.025em; color:var(--ink)}
.hero h1{color:#fff; line-height:1.06; font-weight:800; letter-spacing:-.03em}
.section-head h2{font-size:clamp(1.85rem,3.3vw,2.6rem)}
.eyebrow{color:var(--muted)}
.eyebrow::before{background:var(--teal)}
.hero .eyebrow{color:rgba(255,255,255,.9)}
.hero .eyebrow::before{background:var(--color-petal-pink)}

/* ---- Surfaces and controls ---- */
.site-header{background:rgba(248,241,238,.94)}
.btn{border-radius:var(--r-pill)}
.btn-light{color:var(--green)}
.btn-ghost{background:#fff}
.searchbar{box-shadow:0 18px 50px -24px rgba(59,51,56,.35)}
.choice input:checked+span{background:#FBF1F3}
.chip{background:#F8ECEF; border-color:#EED3DA; color:var(--green-deep)}
.step .num{color:var(--teal)}
.assist{background:#F5E9EC}
.trust-item .i, .ticks .i{color:var(--teal)}
.pcard .cat, .cat-tile .lbl .i{color:var(--muted)}

/* ---- Footer: light, so the logo appears in its original colours ---- */
.footer{background:#F2E8E4; color:var(--ink-2); border-top:1px solid var(--border); margin-top:72px; padding-top:52px}
.footer h4{color:var(--muted)}
.footer a,.footer button.link{color:var(--ink-2)}
.footer a:hover{color:var(--green)}
.footer-tag{color:var(--ink); font-weight:700; margin:14px 0 6px}
.footer-contact{list-style:none; padding:0; margin:14px 0 0; display:grid; gap:8px}
.footer-contact a{display:inline-flex; gap:8px; align-items:center}

/* ---- WhatsApp button (generic chat icon, no third-party logo) ---- */
.wa-float{position:fixed; right:18px; bottom:18px; z-index:90; display:inline-flex; align-items:center; gap:8px; padding:12px 18px; border-radius:var(--r-pill); background:var(--teal); color:#fff; font-weight:700; text-decoration:none; box-shadow:0 18px 40px -16px rgba(59,51,56,.5)}
.wa-float:hover{background:var(--teal-deep)}
.wa-float .i{width:22px; height:22px}
@media (max-width:640px){ .wa-float{padding:14px} .wa-float span{display:none} }
.toasts{bottom:84px}

/* =========================================================
   Faint floral watermarks — decorative only (aria-hidden, no pointer events).
   One SVG line drawing is used as a mask, so its colour follows --floral-tint.
   ========================================================= */
.flora{position:absolute; z-index:0; pointer-events:none; background:var(--floral-tint); opacity:var(--floral-opacity);
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-size:contain; mask-size:contain; -webkit-mask-position:center; mask-position:center;
  transition:background-color .4s ease, opacity .4s ease}
.flora-bouquet{-webkit-mask-image:url(../floral/bouquet.svg); mask-image:url(../floral/bouquet.svg)}
.flora-sprig{-webkit-mask-image:url(../floral/sprig.svg); mask-image:url(../floral/sprig.svg)}
.flora-petals{-webkit-mask-image:url(../floral/petals.svg); mask-image:url(../floral/petals.svg); -webkit-mask-repeat:repeat; mask-repeat:repeat; -webkit-mask-size:380px; mask-size:380px}

.hero{position:relative}
.hero .wrap{position:relative; z-index:1}
.hero-flora{left:-60px; bottom:-120px; width:520px; height:178px; transform:rotate(-6deg); opacity:.16}
.assist{position:relative; isolation:isolate}
.assist .copy, .assist .visual{position:relative; z-index:1}
.assist-flora{left:calc(50% - 190px); bottom:-36px; width:210px; height:315px; opacity:.16}
.footer{position:relative; overflow:hidden}
.footer .wrap{position:relative; z-index:1}
.footer-flora{right:-40px; top:18px; width:420px; height:143px; opacity:.2}
.page.occasion-ctx .wrap{position:relative}
.page-flora{right:0; top:-8px; width:360px; height:122px; opacity:.2}
.page.occasion-ctx .page-head{position:relative; z-index:1}
/* Gentle sprig above empty states and confirmations */
.empty::before, .success-hero::before{content:""; display:block; width:170px; height:58px; margin:0 auto 6px; background:var(--floral-tint);
  opacity:.35; -webkit-mask:url(../floral/sprig.svg) center/contain no-repeat; mask:url(../floral/sprig.svg) center/contain no-repeat}
@media (max-width:899px){
  .assist-flora, .occ-flora{display:none}
  .hero-flora{width:320px; height:110px; bottom:-90px}
  .footer-flora{width:260px; height:88px}
  .page-flora{width:200px; height:68px; top:-18px}
}

/* =========================================================
   Occasion tones — one brand, gentle contextual variation
   ========================================================= */
[data-occasion]{--occ-accent:var(--green)}
[data-occasion="wedding"]{--floral-tint:#C8798D; --occ-soft:#F6E7EB; --occ-accent:#98536A}
[data-occasion="funeral"]{--floral-tint:#8C958B; --floral-opacity:.09; --occ-soft:#EEF0EC; --occ-accent:#3B3338}
[data-occasion="corporate"]{--floral-tint:#526B57; --floral-opacity:.06; --occ-soft:#EDF1EC; --occ-accent:#526B57}
[data-occasion="birthday"]{--floral-tint:#D9917F; --occ-soft:#FBEDE7; --occ-accent:#98536A}
[data-occasion="traditional"]{--floral-tint:#9A7B5B; --occ-soft:#F3ECE3; --occ-accent:#526B57}
[data-occasion="religious"]{--floral-tint:#7E907F; --occ-soft:#EDF1EC; --occ-accent:#526B57}
[data-occasion="family"]{--floral-tint:#D9A09B; --occ-soft:#FBEFEC; --occ-accent:#98536A}
[data-occasion="graduation"]{--floral-tint:#526B57; --floral-opacity:.08; --occ-soft:#F0F1EB; --occ-accent:#3B3338}
[data-occasion="festival"]{--floral-tint:#A9785E; --occ-soft:#F5ECE4; --occ-accent:#98536A}
[data-occasion="other"]{--floral-tint:#89717F; --occ-soft:#F4EEF0; --occ-accent:#98536A}

/* =========================================================
   "What are you planning?" picker
   ========================================================= */
.occasion-picker{position:relative; overflow:hidden; background:linear-gradient(180deg, var(--cream) 0%, var(--occ-soft) 100%); transition:background .4s ease}
.occasion-picker:not([data-occasion]), .occasion-picker[data-occasion=""]{--occ-soft:#F5EAED}
.occasion-picker .wrap{position:relative; z-index:1}
.occasion-picker .flora-petals{inset:0; opacity:calc(var(--floral-opacity) * .7)}
.occ-flora{right:-30px; top:30px; width:250px; height:375px; opacity:calc(var(--floral-opacity) + .04)}
.occ-form{margin:0}
.occ-grid{display:grid; gap:16px; grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){ .occ-grid{grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px} }
.occ-card{position:relative; display:flex; flex-direction:column; align-items:stretch; text-align:left; padding:0; margin:0; border:1px solid var(--border); border-radius:var(--r-lg); background:#fff; overflow:hidden; cursor:pointer; color:var(--ink); font:inherit; transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s}
.occ-card:hover{transform:translateY(-2px); box-shadow:0 16px 36px -22px rgba(59,51,56,.45)}
.occ-img{position:relative; display:block; aspect-ratio:16/10}
.occ-img .media{position:absolute; inset:0}
.occ-label{display:block; padding:12px 44px 14px 14px; font-weight:700; font-size:.98rem; line-height:1.3}
.occ-tick{position:absolute; top:10px; right:10px; width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.92); border:1px solid var(--border); color:transparent; transition:all .2s}
.occ-card[aria-pressed="true"]{border-color:var(--occ-accent); box-shadow:0 0 0 2px var(--occ-accent)}
.occ-card[aria-pressed="true"] .occ-tick{background:var(--occ-accent); border-color:var(--occ-accent); color:#fff}
.occ-card:focus-visible{box-shadow:var(--focus); border-radius:var(--r-lg)}
.occ-more{margin-top:18px}
.occ-grid-compact{margin-top:14px}
@media (min-width:900px){ .occ-grid-compact{grid-template-columns:repeat(4,minmax(0,1fr))} }
.occ-compact{flex-direction:row; align-items:center; gap:12px; padding:12px 44px 12px 12px; min-height:64px}
.occ-compact .occ-label{padding:0; font-size:.92rem}
.occ-compact .occ-tick{top:50%; transform:translateY(-50%)}
.occ-ico{width:40px; height:40px; flex:none; border-radius:12px; display:grid; place-items:center; background:var(--sage-soft); color:var(--teal)}
.occ-next{margin-top:24px; display:grid; gap:12px; padding:22px 24px; background:#fff}
.occ-next[hidden]{display:none}
.occ-next-head{display:flex; justify-content:space-between; align-items:flex-start; gap:12px}
.occ-kicker{display:block; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:700}
.occ-chosen{display:block; font-family:var(--font-display); font-weight:700; font-size:clamp(1.4rem,2.6vw,1.8rem); line-height:1.15; color:var(--ink)}
.occ-sub, .occ-note, .occ-hint{margin:0; color:var(--muted); font-size:.9rem}
.occ-chips{display:flex; flex-wrap:wrap; gap:8px}
.occ-chip{display:inline-flex; gap:7px; align-items:center; min-height:40px; padding:8px 14px; border-radius:var(--r-pill); background:var(--occ-soft); border:1px solid var(--border); color:var(--ink); text-decoration:none; font-weight:600; font-size:.88rem}
.occ-chip:hover{border-color:var(--occ-accent); color:var(--ink)}
.occ-chip .i{color:var(--occ-accent)}
.occ-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:4px}
@media (max-width:599px){
  .occ-grid{gap:12px}
  .occ-img{aspect-ratio:4/3}
  .occ-label{font-size:.88rem; padding:10px 36px 12px 12px}
  .occ-tick{width:26px; height:26px; top:8px; right:8px}
  .occ-next{padding:18px}
  .occ-actions .btn{flex:1 1 100%}
}
@media (max-width:379px){ .occ-grid-compact{grid-template-columns:1fr} }

/* Occasion context strip on Explore / Get quotes */
.occ-context{display:flex; gap:12px; align-items:flex-start; padding:12px 16px; margin:-6px 0 18px; border-radius:var(--r); background:var(--occ-soft); color:var(--ink-2); font-size:.92rem; position:relative; z-index:1}
.occ-context .i{color:var(--occ-accent); margin-top:2px; flex:none}
.occ-context a{color:var(--occ-accent); font-weight:700}
.occ-grid[hidden]{display:none}
.occ-tick{z-index:2}

/* =========================================================
   Hero legibility: a scrim on the text side, stronger on small screens where the
   photo sits behind the whole text block; soft shadow; subtitle kept off the couple.
   ========================================================= */
.hero-frame::after{background:
  linear-gradient(90deg, rgba(26,20,24,.88) 0%, rgba(26,20,24,.72) 34%, rgba(26,20,24,.28) 62%, rgba(26,20,24,0) 82%),
  linear-gradient(180deg, rgba(26,20,24,0) 55%, rgba(26,20,24,.45) 100%)}
.hero h1, .hero .lede, .hero .eyebrow{text-shadow:0 2px 16px rgba(0,0,0,.45)}
.hero .lede{color:#fff; max-width:29em}
@media (max-width:899px){
  .hero-frame::after{background:linear-gradient(180deg, rgba(26,20,24,.62) 0%, rgba(26,20,24,.78) 55%, rgba(26,20,24,.86) 100%)}
  .hero-frame>.media img{object-position:62% 30%}
}
.be-pager{justify-content:center; margin-top:28px}
.be-pager .dots{border:0; background:transparent}
.be-regions{display:grid; gap:8px}
.be-region{border:1px solid var(--border); border-radius:var(--r); background:#fff; padding:0 12px}
.be-region>summary{list-style:none; display:flex; align-items:center; gap:8px; min-height:46px; cursor:pointer; font-weight:700}
.be-region>summary::-webkit-details-marker{display:none}
.be-region>summary .i{margin-left:auto; transition:transform .2s}
.be-region[open]>summary .i{transform:rotate(180deg)}
.be-region .choice-grid{padding:4px 0 14px}

/* =========================================================
   Delight layer — quick feedback that makes planning feel good.
   All motion is skipped for prefers-reduced-motion (see base.css).
   ========================================================= */
.be-confetti{position:fixed; inset:0; width:100vw; height:100vh; pointer-events:none; z-index:400}
@keyframes bePop{0%{transform:scale(1)} 35%{transform:scale(1.28)} 70%{transform:scale(.94)} 100%{transform:scale(1)}}
@keyframes beRise{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none}}
@keyframes beTick{0%{transform:scale(.4); opacity:0} 60%{transform:scale(1.12); opacity:1} 100%{transform:scale(1)}}
@keyframes beGlow{0%,100%{box-shadow:0 0 0 0 rgba(152,83,106,.0)} 50%{box-shadow:0 0 0 8px rgba(152,83,106,.14)}}
.be-pop{animation:bePop .45s var(--ease)}
.notice.ok{animation:beRise .4s var(--ease)}

/* Buttons and cards respond to touch */
.btn{transition:transform .15s var(--ease), box-shadow .2s var(--ease), background .15s, border-color .15s, color .15s}
.btn-primary:hover{box-shadow:0 10px 24px -12px rgba(152,83,106,.7); transform:translateY(-1px)}
.btn:active{transform:translateY(1px) scale(.98)}
.choice input:checked+span{animation:bePop .35s var(--ease)}
.pcard .cover{transition:box-shadow .25s var(--ease)}
.pcard:hover .cover{box-shadow:0 18px 40px -24px rgba(59,51,56,.55)}

/* "Request sent" moment */
.be-success{margin-bottom:24px; padding:24px; background:linear-gradient(135deg,#fff 0%, var(--occ-soft,#F6E7EB) 100%); border-color:transparent; animation:beRise .5s var(--ease)}
.be-success-top{display:flex; gap:16px; align-items:flex-start}
.be-tick{width:56px; height:56px; flex:none; border-radius:50%; display:grid; place-items:center; background:var(--success); color:#fff; animation:beTick .6s .15s var(--ease) both}
.be-tick .i{width:28px; height:28px; stroke-width:2.4}
[data-calm] .be-tick{background:var(--ink)}
.be-success-title{font-size:clamp(1.5rem,3vw,2rem); margin:0}
.be-steps-mini{list-style:none; padding:0; margin:18px 0 0; display:grid; gap:10px; grid-template-columns:repeat(3,minmax(0,1fr))}
.be-steps-mini li{display:flex; gap:10px; align-items:center; padding:10px 12px; border-radius:var(--r); background:rgba(255,255,255,.7); font-weight:600; font-size:.9rem}
.be-steps-mini span{width:26px; height:26px; flex:none; border-radius:50%; display:grid; place-items:center; background:var(--sage-soft); color:var(--ink); font-size:.8rem}
.be-steps-mini li.done span{background:var(--success); color:#fff}
@media (max-width:640px){ .be-steps-mini{grid-template-columns:1fr} }
.be-similar{margin-top:18px}
.be-similar-list{display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); margin-top:8px}
.be-similar-item{display:flex; gap:10px; align-items:center; padding:8px; border:1px solid var(--border); border-radius:var(--r); background:#fff; text-decoration:none; color:var(--ink); transition:border-color .2s, transform .2s var(--ease)}
.be-similar-item:hover{border-color:var(--green); transform:translateY(-1px)}
.be-similar-item b{display:block; font-size:.9rem}
.be-similar-item small{color:var(--muted)}
.be-similar-item>.i{margin-left:auto; color:var(--green)}
.be-similar-img{position:relative; width:52px; height:52px; flex:none; border-radius:8px; overflow:hidden}
.be-similar-img .media{position:absolute; inset:0}

/* Progress rings */
.be-ring{position:relative; display:inline-grid; place-items:center; width:var(--size,64px); height:var(--size,64px); flex:none}
.be-ring svg{width:100%; height:100%; transform:rotate(-90deg)}
.ring-track{fill:none; stroke:var(--sage-soft); stroke-width:7}
.ring-fill{fill:none; stroke:var(--occ-accent, var(--green)); stroke-width:7; stroke-linecap:round; transition:stroke-dashoffset 1.1s var(--ease)}
.ring-num{position:absolute; font-weight:800; font-size:calc(var(--size,64px) * .26); color:var(--ink); letter-spacing:-.02em}
.ring-num small{font-size:.55em; font-weight:700}
.event-card-main{display:flex; justify-content:space-between; gap:14px; align-items:center}
.be-milestone{margin-top:10px; color:var(--ink-2); font-weight:600}
.be-progress-hero{display:flex; gap:18px; align-items:center; margin-bottom:22px; padding:18px 22px; background:linear-gradient(135deg,#fff, var(--occ-soft,#F6E7EB))}
.be-milestone-big{display:block; font-size:1.15rem; margin-bottom:2px}
.planner .check-row:first-child .btn-primary{animation:beGlow 2.4s 1s ease-in-out 2}

/* One-tap occasion quick-starts */
.be-quick{margin:0 0 28px}
.be-quick-title{font-size:1.15rem; margin:0 0 12px}
.be-quick-grid{display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.be-quick-tile{display:flex; gap:10px; align-items:center; padding:12px; border:1px solid var(--border); border-radius:var(--r-lg); background:#fff; text-decoration:none; color:var(--ink); font-weight:600; font-size:.9rem; transition:transform .2s var(--ease), border-color .2s, box-shadow .2s}
.be-quick-tile:hover{transform:translateY(-2px); border-color:var(--occ-accent, var(--green)); box-shadow:0 14px 30px -22px rgba(59,51,56,.5)}
.be-quick-tile .occ-ico{background:var(--occ-soft, var(--sage-soft)); color:var(--occ-accent, var(--teal))}

/* Wizard meter + encouragement */
.wiz-meter{height:6px; border-radius:6px; background:var(--sage-soft); overflow:hidden; margin:-12px 0 10px}
.wiz-meter span{display:block; height:100%; width:25%; border-radius:6px; background:linear-gradient(90deg, var(--green), var(--color-brand-rose)); transition:width .5s var(--ease)}
.wiz-msg{margin:0 0 16px; font-weight:700; color:var(--green); min-height:1.5em}
@media (max-width:640px){ .progress-steps{display:none} .wiz-meter{margin-top:0} }

/* Sticky quote bar on phones */
.sticky-cta{position:fixed; left:12px; right:84px; bottom:14px; z-index:95; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 10px 10px 16px; border-radius:var(--r-pill); background:var(--ink); color:#fff; text-decoration:none; box-shadow:0 16px 40px -14px rgba(59,51,56,.6); transition:transform .3s var(--ease), opacity .3s}
.sticky-cta.is-hidden{transform:translateY(140%); opacity:0; pointer-events:none}
.sticky-cta-price{font-weight:700; font-size:.92rem}
.sticky-cta-btn{display:inline-flex; gap:6px; align-items:center; padding:10px 16px; border-radius:var(--r-pill); background:var(--green); font-weight:800; font-size:.92rem; white-space:nowrap}
body:has(.sticky-cta) .toasts{bottom:140px}