:root { 
    --paper: #F4F8FB; 
    --cream: #E3EEF5; 
    --ink: #0E1720; 
    --plum: #17344A; 
    --plum-deep: #091B2A; 
    --rose: #159EBA; 
    --rose-deep: #08758D; 
    --rose-soft: #D9F1F6; 
    --blush: #EAF7FA; 
    --peach: #A9D8E2; 
    --gold: #D9A441; 
    --lime: #9BCB63; 
    --mint: #B6DED9; 
    --lav: #C9D9EA; 
    --muted: #637481; 
    --line: rgba(14, 23, 32, .1); 
}

* { box-sizing: border-box }
html { scroll-behavior: smooth; scroll-padding-top: 110px }
body { font-family: 'Plus Jakarta Sans', sans-serif; background: var(--paper); color: var(--ink); overflow-x: hidden; -webkit-font-smoothing: antialiased }
.font-display { font-family: 'Fraunces', serif; letter-spacing: -.03em }
::selection { background: var(--rose); color: #fff }
::-webkit-scrollbar { width: 10px }
::-webkit-scrollbar-track { background: #FFF1E7 }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #F43F7A, #9B1348); border-radius: 99px }
img { max-width: 100% }

.dot-grid { background-image: radial-gradient(rgba(23, 16, 22, .10) 1.2px, transparent 1.2px); background-size: 26px 26px }
.dot-grid-light { background-image: radial-gradient(rgba(255, 255, 255, .16) 1.2px, transparent 1.2px); background-size: 26px 26px }
.grain { position: relative }
.grain::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E") }

.eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--rose-deep) }
.eyebrow::before { content: ''; width: 28px; height: 2px; background: var(--rose); border-radius: 2px }
.eyebrow.center::after { content: ''; width: 28px; height: 2px; background: var(--rose); border-radius: 2px }
.eyebrow.dark { color: #FFB3CD }
.eyebrow.dark::before, .eyebrow.dark::after { background: #FF8DB8 }

.btn-bloom { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; padding: 15px 28px; font-size: 14px; font-weight: 800; border: none; cursor: pointer; transition: .3s; text-decoration: none }
.btn-rose { background: linear-gradient(90deg, #F43F7A, #C2185B); color: #fff; box-shadow: 0 18px 40px -12px rgba(244, 63, 122, .6) }
.btn-rose:hover { transform: translateY(-2px); color: #fff; box-shadow: 0 24px 50px -12px rgba(244, 63, 122, .75) }
.btn-dark { background: #171016; color: #fff; box-shadow: 0 18px 40px -14px rgba(23, 16, 22, .6) }
.btn-dark:hover { background: #2A1E2B; color: #fff; transform: translateY(-2px) }
.btn-white { background: #fff; color: var(--rose-deep); box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .3) }
.btn-white:hover { background: #FFF0F5; color: var(--rose-deep); transform: translateY(-2px) }
.btn-lime { background: var(--lime); color: #171016 }
.btn-lime:hover { background: #E6FF6B; color: #171016; transform: translateY(-2px) }
.btn-outline-b { border: 1.5px solid rgba(23, 16, 22, .15); background: rgba(255, 255, 255, .6); color: var(--ink) }
.btn-outline-b:hover { border-color: var(--rose); color: var(--rose-deep) }

section { position: relative }

/* NAV */
.topbar { position: fixed; inset: 0 0 auto 0; z-index: 1050; padding: 12px 12px 0 }
.navbar-bloom { max-width: 1060px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-radius: 22px; border: 1px solid rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .65); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); padding: 10px 12px 10px 16px; box-shadow: 0 16px 50px -20px rgba(23, 16, 22, .25); transition: .4s }
.navbar-bloom.scrolled { background: rgba(255, 255, 255, .88); border-color: rgba(23, 16, 22, .1); box-shadow: 0 20px 60px -18px rgba(23, 16, 22, .3) }
.logo-badge { width: 40px; height: 40px; border-radius: 14px; background: linear-gradient(135deg, #F43F7A, #9B1348); display: flex; align-items: center; justify-content: center; color: #fff; box-shadow: 0 10px 24px -8px rgba(244, 63, 122, .7); position: relative; flex-shrink: 0 }
.logo-badge::after { content: ''; position: absolute; right: -3px; top: -3px; width: 12px; height: 12px; border-radius: 50%; background: var(--lime); border: 2px solid #fff }
.logo-name { font-family: 'Fraunces', serif; font-size: 21px; font-weight: 700; line-height: 1; color: var(--ink) }
.logo-name em { font-style: italic; color: var(--rose) }
.logo-sub { font-size: 9px; font-weight: 800; letter-spacing: .3em; text-transform: uppercase; color: rgba(155, 19, 72, .7) }
.nav-pills { display: flex; align-items: center; gap: 4px; background: rgba(23, 16, 22, .05); border-radius: 999px; padding: 6px }
.nav-pills a { position: relative; border-radius: 999px; padding: 8px 16px; font-size: 13.5px; font-weight: 700; color: rgba(23, 16, 22, .65); text-decoration: none; transition: .25s }
.nav-pills a:hover { color: var(--ink) }
.nav-pills a.active { color: #fff; background: var(--ink); box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .5) }
.nav-cta { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; background: linear-gradient(90deg, #F43F7A, #B81A55); color: #fff; font-size: 13.5px; font-weight: 800; padding: 10px 20px; text-decoration: none; box-shadow: 0 14px 30px -10px rgba(244, 63, 122, .65) }
.nav-cta:hover { color: #fff; transform: translateY(-1px) }
.nav-phone { display: inline-flex; align-items: center; gap: 8px; border-radius: 999px; border: 1px solid rgba(23, 16, 22, .1); background: #fff; padding: 10px 16px; font-size: 13px; font-weight: 800; color: var(--ink); text-decoration: none }
.nav-phone:hover { border-color: rgba(244, 63, 122, .4) }
.burger { width: 44px; height: 44px; border-radius: 50%; background: var(--ink); color: #fff; border: none; font-size: 20px; display: flex; align-items: center; justify-content: center }
.mobile-menu { position: fixed; inset: 0; z-index: 1200; background: rgba(21, 10, 21, .97); backdrop-filter: blur(20px); display: flex; flex-direction: column; opacity: 0; pointer-events: none; transition: .35s }
.mobile-menu.open { opacity: 1; pointer-events: auto }
.mobile-menu a.mlink { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255, 255, 255, .1); padding: 16px 0; font-family: 'Fraunces', serif; font-size: 34px; color: #fff; text-decoration: none }
.mobile-menu a.mlink:hover { color: #FF8DB8 }

/* HERO */
.hero { padding: 132px 0 0; overflow: hidden }
.hero-bg { position: absolute; inset: 0; pointer-events: none }
.blob { position: absolute; border-radius: 50%; filter: blur(110px) }
.hero-badge { display: inline-flex; align-items: center; gap: 10px; border: 1px solid rgba(244, 63, 122, .25); background: rgba(255, 255, 255, .85); border-radius: 999px; padding: 6px 16px 6px 6px; font-size: 13px; font-weight: 700; box-shadow: 0 8px 24px -12px rgba(0, 0, 0, .2) }
.hero-badge .pill { background: linear-gradient(90deg, #F43F7A, #9B1348); color: #fff; border-radius: 999px; padding: 4px 12px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase }
.hero h1 { font-size: clamp(2.7rem, 6.2vw, 4.6rem); line-height: .98; font-weight: 600 }
.hero h1 .bloom { font-style: italic; color: var(--rose-deep); position: relative; display: inline-block }
.scribble { position: absolute; left: 0; bottom: -8px; width: 100%; height: 14px }
.hero-lead { font-size: 16px; color: var(--muted); line-height: 1.7; max-width: 480px; margin-top: 22px }
.play-btn { width: 48px; height: 48px; border-radius: 50%; background: var(--ink); color: #fff; display: flex; align-items: center; justify-content: center; position: relative; flex-shrink: 0 }
.play-btn::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--ink); animation: pulseRing 2.4s ease-out infinite }
@keyframes pulseRing { 0% { transform: scale(1); opacity: .6 } 100% { transform: scale(1.8); opacity: 0 } }
.avatars { display: flex }
.avatars span { width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--paper); display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; color: #fff; margin-left: -10px }
.avatars span:first-child { margin-left: 0 }
.mini-stat { border: 1px solid var(--line); background: rgba(255, 255, 255, .7); backdrop-filter: blur(8px); border-radius: 16px; padding: 12px 16px }
.mini-stat strong { font-family: 'Fraunces', serif; font-size: 22px; display: block; line-height: 1 }
.mini-stat small { font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted) }
.dash-wrap { perspective: 1200px; max-width: 440px; margin: 0 auto; position: relative }
.dash-glow { position: absolute; inset: 24px; border-radius: 36px; background: linear-gradient(135deg, rgba(244, 63, 122, .3), rgba(255, 184, 0, .2), rgba(109, 59, 255, .25)); filter: blur(28px) }
.dash { position: relative; z-index: 2; border-radius: 30px; border: 1px solid rgba(255, 255, 255, .6); background: rgba(255, 255, 255, .92); backdrop-filter: blur(20px); padding: 24px; box-shadow: 0 40px 90px -24px rgba(23, 16, 22, .35); transition: transform .25s ease-out; transform-style: preserve-3d }
.dash-balance { font-family: 'Fraunces', serif; font-size: 38px; font-weight: 700; line-height: 1; letter-spacing: -.02em }
.float-chip { position: absolute; z-index: 3; box-shadow: 0 24px 50px -12px rgba(0, 0, 0, .3) }
.float-dark { top: 40px; left: -28px; background: #171016; color: #fff; border-radius: 16px; padding: 12px 16px; display: flex; gap: 10px; align-items: center; transform: rotate(-6deg); animation: floaty 5s ease-in-out infinite }
.float-goal { top: -30px; right: -16px; background: rgba(255, 255, 255, .96); border: 1px solid var(--line); border-radius: 16px; padding: 12px 18px 12px 12px; display: flex; gap: 12px; align-items: center; transform: rotate(3deg); animation: floaty 4.6s ease-in-out infinite .4s; backdrop-filter: blur(8px) }
.float-cardb { bottom: -30px; right: -14px; width: 210px; background: linear-gradient(135deg, #2A1430, #9B1348, #F43F7A); border-radius: 16px; padding: 16px; color: #fff; transform: rotate(5deg); animation: floaty 6s ease-in-out infinite .8s; overflow: hidden }
.float-cardb::before { content: ''; position: absolute; top: 0; left: -80%; width: 60%; height: 100%; background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .3), transparent); transform: skewX(-20deg); animation: sheen 4s ease-in-out infinite }
@keyframes sheen { 0% { left: -80% } 60%, 100% { left: 130% } }
@keyframes floaty { 0%, 100% { translate: 0 0 } 50% { translate: 0 -12px } }
.live-dot { width: 10px; height: 10px; border-radius: 50%; background: #3DDC84; position: relative; flex-shrink: 0 }
.live-dot::after { content: ''; position: absolute; inset: 0; border-radius: 50%; background: #3DDC84; animation: ping 1.6s ease-out infinite }
@keyframes ping { 0% { transform: scale(1); opacity: .8 } 100% { transform: scale(2.6); opacity: 0 } }
.marquee-band { overflow: hidden; padding: 14px 0 }
.marquee-dark { background: var(--ink); transform: rotate(-1.2deg) scale(1.02); box-shadow: 0 16px 40px -12px rgba(0, 0, 0, .4) }
.marquee-rose { background: linear-gradient(90deg, #F43F7A, #E0447C, #9B1348); transform: rotate(.8deg) scale(1.02) }
.marquee-track { display: flex; gap: 34px; width: max-content; animation: marq 26s linear infinite }
.marquee-track.rev { animation: marqRev 30s linear infinite }
.marquee-dark:hover .marquee-track, .marquee-rose:hover .marquee-track { animation-play-state: paused }
@keyframes marq { to { transform: translateX(-50%) } }
@keyframes marqRev { from { transform: translateX(-50%) } to { transform: translateX(0) } }

/* ABOUT */
.about-img-main { border-radius: 32px; overflow: hidden; position: relative; box-shadow: 0 30px 80px -24px rgba(23, 16, 22, .35) }
.about-img-main img { height: 520px; width: 100%; object-fit: cover; transition: transform 1.2s ease }
.about-img-main:hover img { transform: scale(1.04) }
.about-quote { background: rgba(255, 255, 255, .82); backdrop-filter: blur(16px); border-radius: 18px; padding: 16px 22px 16px 16px }
.about-years { background: var(--lime); border-radius: 18px; padding: 16px 20px; text-align: center }
.about-years strong { font-family: 'Fraunces', serif; font-size: 34px; display: block; line-height: 1 }
.about-badge-float { position: absolute; top: -24px; right: -12px; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 12px 20px 12px 12px; display: flex; gap: 12px; align-items: center; box-shadow: 0 20px 50px -16px rgba(0, 0, 0, .25); transform: rotate(3deg); animation: floaty 5s ease-in-out infinite; z-index: 3 }
.about-mini { border-radius: 24px; overflow: hidden; height: 170px }
.about-mini img { width: 100%; height: 100%; object-fit: cover; transition: .7s }
.about-mini:hover img { transform: scale(1.07) }
.feat { border: 1px solid var(--line); background: #fff; border-radius: 18px; padding: 16px; display: flex; gap: 12px; transition: .3s; height: 100% }
.feat:hover { transform: translateY(-4px); border-color: rgba(244, 63, 122, .3); box-shadow: 0 20px 40px -16px rgba(244, 63, 122, .35) }
.feat-ico { width: 40px; height: 40px; border-radius: 12px; background: var(--rose-soft); color: var(--rose-deep); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; transition: .3s }
.feat:hover .feat-ico { background: var(--rose); color: #fff }
.counter-pill { display: inline-flex; align-items: center; gap: 24px; border: 1px solid var(--line); background: rgba(255, 255, 255, .7); backdrop-filter: blur(8px); border-radius: 999px; padding: 12px 26px }

/* SERVICES */
.services-sec { background: var(--plum-deep); overflow: hidden }
.svc-giant { font-family: 'Fraunces', serif; position: absolute; bottom: -30px; left: 0; white-space: nowrap; font-size: 19vw; font-weight: 700; line-height: 1; color: rgba(255, 255, 255, .035); pointer-events: none; user-select: none }
.cat-pill { display: inline-flex; align-items: center; gap: 10px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .05); color: rgba(255, 255, 255, .75); padding: 8px 20px 8px 8px; font-size: 13.5px; font-weight: 800; cursor: pointer; transition: .3s; white-space: nowrap }
.cat-pill:hover { border-color: rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .1); color: #fff }
.cat-pill.active { background: #fff; color: var(--ink); border-color: transparent; box-shadow: 0 16px 40px -12px rgba(0, 0, 0, .5) }
.cat-pill .cico { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 15px; flex-shrink: 0 }
.cat-pill .count { border-radius: 999px; padding: 2px 8px; font-size: 11px; font-weight: 800; background: rgba(255, 255, 255, .1) }
.cat-pill.active .count { background: rgba(23, 16, 22, .08) }
.svc-search { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .15); border-radius: 999px; color: #fff; padding: 14px 18px 14px 46px; font-size: 14px; font-weight: 600; width: 100%; outline: none; transition: .3s }
.svc-search::placeholder { color: rgba(255, 255, 255, .4) }
.svc-search:focus { border-color: rgba(255, 141, 184, .6); background: rgba(255, 255, 255, .12) }
.svc-card { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); border-radius: 26px; padding: 26px; cursor: pointer; transition: .35s; position: relative; overflow: hidden; height: 100%; backdrop-filter: blur(8px) }
.svc-card:hover { border-color: rgba(255, 141, 184, .4); background: rgba(255, 255, 255, .09); transform: translateY(-6px) }
.svc-card::before { content: ''; position: absolute; right: -60px; top: -60px; width: 170px; height: 170px; border-radius: 50%; background: rgba(244, 63, 122, 0); filter: blur(30px); transition: .5s }
.svc-card:hover::before { background: rgba(244, 63, 122, .25) }
.svc-ico { width: 48px; height: 48px; border-radius: 16px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 21px; box-shadow: 0 12px 26px -8px rgba(0, 0, 0, .5); transition: .3s }
.svc-card:hover .svc-ico { transform: rotate(-8deg) scale(1.1) }
.svc-hl { position: absolute; top: 16px; right: 16px; background: var(--lime); color: var(--ink); border-radius: 999px; padding: 4px 10px; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase }
.svc-tag { background: rgba(255, 255, 255, .1); border-radius: 999px; padding: 4px 12px; font-size: 11.5px; font-weight: 800; color: #FFD3E4 }
.svc-go { width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; display: flex; align-items: center; justify-content: center; transition: .3s }
.svc-card:hover .svc-go { background: var(--rose); transform: rotate(45deg) }
.svc-blurb { border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); border-radius: 18px; backdrop-filter: blur(8px) }

/* CALC */
.calc-shell { background: linear-gradient(135deg, #221122, #2A1430, #150A15); border-radius: 36px; box-shadow: 0 40px 100px -30px rgba(21, 10, 21, .6); overflow: hidden }
.calc-result { border: 1px solid rgba(255, 255, 255, .15); background: rgba(255, 255, 255, .07); border-radius: 28px; backdrop-filter: blur(16px) }
input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 8px; border-radius: 99px; background: linear-gradient(to right, var(--rose) var(--fill, 50%), rgba(255, 255, 255, .15) var(--fill, 50%)); outline: none; cursor: pointer }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 6px solid var(--rose); box-shadow: 0 8px 20px rgba(244, 63, 122, .4); transition: .2s }
input[type=range]::-webkit-slider-thumb:hover { transform: scale(1.15) }
input[type=range]::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 6px solid var(--rose) }
.stat-row { background: rgba(255, 255, 255, .07); border-radius: 14px; padding: 12px 16px }

/* WHY */
.why-card { background: #fff; border: 1px solid var(--line); border-radius: 26px; padding: 26px; position: relative; overflow: hidden; transition: .3s; height: 100% }
.why-card:hover { transform: translateY(-6px); box-shadow: 0 28px 60px -20px rgba(244, 63, 122, .35) }
.why-num { font-family: 'Fraunces', serif; position: absolute; right: 16px; bottom: -14px; font-size: 64px; font-weight: 700; line-height: 1; color: rgba(23, 16, 22, .05); user-select: none }
.why-ico { width: 52px; height: 52px; border-radius: 18px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 22px; box-shadow: 0 12px 26px -8px rgba(0, 0, 0, .35); transition: .3s }
.why-card:hover .why-ico { transform: rotate(-8deg) scale(1.1) }
.trust-strip { border: 1px solid var(--line); background: #fff; border-radius: 28px }
.trust-cell { background: var(--paper); border-radius: 18px; padding: 16px; display: flex; gap: 12px; align-items: center }

/* PROCESS */
.process-sec { background: var(--cream); overflow: hidden }
.step-card { background: #fff; border: 1px solid var(--line); border-radius: 26px; padding: 26px; text-align: center; transition: .3s; height: 100%; position: relative }
.step-card:hover { transform: translateY(-8px); box-shadow: 0 28px 60px -20px rgba(23, 16, 22, .25) }
.step-ico { width: 64px; height: 64px; border-radius: 22px; display: flex; align-items: center; justify-content: center; font-size: 26px; margin: 0 auto; transition: .3s }
.step-card:hover .step-ico { transform: rotate(8deg) scale(1.1) }
.step-n { position: absolute; top: 14px; right: 16px; width: 32px; height: 32px; border-radius: 50%; background: var(--ink); color: #fff; font-family: 'Fraunces', serif; font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 14px }

/* TESTIMONIALS */
.testi-sec { background: var(--plum-deep); overflow: hidden }
.testi-main { border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); border-radius: 32px; overflow: hidden; backdrop-filter: blur(12px); min-height: 340px }
.testi-slide { display: none; animation: slideIn .5s ease }
.testi-slide.active { display: grid }
@keyframes slideIn { from { opacity: 0; transform: translateX(50px) } to { opacity: 1; transform: translateX(0) } }
.testi-dot { height: 8px; border-radius: 99px; border: none; transition: .3s; cursor: pointer; background: rgba(255, 255, 255, .2); width: 8px; padding: 0 }
.testi-dot.active { width: 32px; background: var(--rose) }
.testi-arrow { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .3s; border: 1px solid rgba(255, 255, 255, .15); background: transparent; color: #fff; font-size: 18px }
.testi-arrow.solid { background: var(--rose); border-color: transparent }
.testi-arrow:hover { background: #fff; color: var(--ink) }
.testi-arrow.solid:hover { background: #FF5C95; color: #fff }
.mini-chip { display: inline-flex; align-items: center; gap: 10px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); padding: 6px 16px 6px 6px; cursor: pointer; transition: .3s; color: rgba(255, 255, 255, .85); font-size: 12.5px; font-weight: 700; white-space: nowrap }
.mini-chip:hover { border-color: rgba(255, 255, 255, .3) }
.mini-chip.active { border-color: rgba(244, 63, 122, .6); background: rgba(244, 63, 122, .15) }
.mini-chip .av { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: #fff }

/* FAQ */
.faq-item { border: 1px solid var(--line); background: rgba(255, 255, 255, .7); border-radius: 22px; overflow: hidden; transition: .3s }
.faq-item.open { border-color: rgba(244, 63, 122, .3); background: #fff; box-shadow: 0 24px 60px -20px rgba(244, 63, 122, .3) }
.faq-q { width: 100%; background: none; border: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 20px 20px 24px; text-align: left; cursor: pointer }
.faq-num { font-family: 'Fraunces', serif; font-weight: 700; font-size: 15px; color: rgba(23, 16, 22, .3) }
.faq-item.open .faq-num { color: var(--rose) }
.faq-toggle { width: 36px; height: 36px; border-radius: 50%; background: var(--rose-soft); color: var(--rose-deep); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: .3s; font-size: 16px }
.faq-item.open .faq-toggle { background: var(--ink); color: #fff; transform: rotate(180deg) }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .4s ease }
.faq-a p { padding: 0 24px 24px 62px; margin: 0; font-size: 14px; line-height: 1.7; color: var(--muted) }
.faq-promo { background: linear-gradient(135deg, #9B1348, #E0447C, #F43F7A); border-radius: 30px; color: #fff; box-shadow: 0 30px 80px -24px rgba(244, 63, 122, .6); position: relative; overflow: hidden }

/* CONTACT */
.chip { border-radius: 999px; border: 1px solid rgba(23, 16, 22, .12); background: var(--paper); padding: 8px 16px; font-size: 13px; font-weight: 700; color: rgba(23, 16, 22, .7); cursor: pointer; transition: .25s }
.chip:hover { border-color: rgba(244, 63, 122, .4) }
.chip.active { background: var(--ink); color: #fff; border-color: transparent; box-shadow: 0 10px 24px -8px rgba(0, 0, 0, .4) }
.form-bloom { width: 100%; border-radius: 16px; border: 1.5px solid #F0D5E4; background: #FFF5FA; padding: 14px 16px; font-size: 14px; font-weight: 600; outline: none; transition: .3s; color: var(--ink) }
.form-bloom::placeholder { color: rgba(23, 16, 22, .3) }
.form-bloom:focus { border-color: var(--rose); background: #fff; box-shadow: 0 0 0 4px rgba(244, 63, 122, .12) }
.contact-info { background: var(--ink); border-radius: 30px; color: #fff; overflow: hidden }
.info-row { display: flex; align-items: center; gap: 16px; border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); border-radius: 18px; padding: 16px; transition: .3s; text-decoration: none; color: #fff }
.info-row:hover { transform: translateX(6px); border-color: rgba(244, 63, 122, .4); background: rgba(255, 255, 255, .1); color: #fff }
.urgent-box { background: var(--lime); color: var(--ink); border-radius: 18px; padding: 20px }

/* NEWSLETTER */
.nl-banner { background: var(--lime); border-radius: 36px; overflow: hidden; position: relative }
.nl-form-card { background: var(--ink); border-radius: 26px; color: #fff; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .5) }
.nl-input { width: 100%; border-radius: 16px; border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .1); padding: 14px 16px; font-size: 14px; font-weight: 600; color: #fff; outline: none; transition: .3s }
.nl-input::placeholder { color: rgba(255, 255, 255, .35) }
.nl-input:focus { border-color: var(--lime) }
.nl-giant { font-family: 'Fraunces', serif; position: absolute; right: 0; bottom: -40px; font-size: 150px; font-weight: 700; line-height: 1; color: rgba(23, 16, 22, .06); user-select: none; pointer-events: none }

/* FOOTER */
footer { background: var(--plum-deep); color: #fff; overflow: hidden }
.foot-giant { font-family: 'Fraunces', serif; text-align: center; font-size: clamp(80px, 18vw, 160px); font-weight: 700; line-height: .85; color: rgba(255, 255, 255, .045); user-select: none; margin: 0 }
.foot-link { color: rgba(255, 255, 255, .7); text-decoration: none; font-size: 14px; font-weight: 600; transition: .25s; background: none; border: none; padding: 0; cursor: pointer }
.foot-link:hover { color: #FF8DB8 }
.soc { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .12); display: inline-flex; align-items: center; justify-content: center; color: rgba(255, 255, 255, .6); font-size: 13px; font-weight: 800; text-decoration: none; transition: .3s }
.soc:hover { background: var(--rose); border-color: var(--rose); color: #fff }

/* MODAL */
.modal-content { border-radius: 28px; overflow: hidden; border: none }
.modal-head { background: linear-gradient(135deg, #9B1348, #E0447C, #F43F7A); color: #fff; padding: 28px }
.legal { border-bottom: 1px solid rgba(23, 16, 22, .08); padding-bottom: 16px; margin-bottom: 16px }
.legal:last-child { border: none }
.legal h6 { color: var(--rose-deep); font-weight: 800; font-size: 14px; margin-bottom: 6px }
.legal p { font-size: 13.5px; color: #4C434E; margin: 0; line-height: 1.65 }

/* TOAST */
.toast-bloom { position: fixed; bottom: 24px; right: 16px; z-index: 2000; background: rgba(255, 255, 255, .94); backdrop-filter: blur(16px); border: 1px solid rgba(255, 255, 255, .4); border-left: 5px solid var(--rose); border-radius: 16px; padding: 16px 20px; box-shadow: 0 20px 60px -12px rgba(23, 16, 22, .35); display: flex; gap: 12px; align-items: flex-start; max-width: min(360px, calc(100vw - 2rem)); transform: translateX(120%); transition: transform .45s cubic-bezier(.22, 1, .36, 1) }
.toast-bloom.show { transform: translateX(0) }
.no-scrollbar::-webkit-scrollbar { display: none }
.no-scrollbar { scrollbar-width: none }
.mask-fade-x { -webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent) }
.back-top { position: fixed; bottom: 24px; left: 16px; z-index: 1500; width: 48px; height: 48px; border-radius: 50%; background: var(--ink); color: var(--lime); border: none; font-size: 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 16px 40px -10px rgba(0, 0, 0, .5); opacity: 0; pointer-events: none; transition: .35s; cursor: pointer }
.back-top.show { opacity: 1; pointer-events: auto }
.back-top:hover { background: var(--rose); color: #fff }

@media(max-width:991px) {
    .nav-pills, .nav-phone { display: none !important }
    .navbar-bloom { border-radius: 20px }
    .hero { padding-top: 120px }
    .about-img-main img { height: 380px }
    .float-dark { left: -6px }
    .float-goal { right: -6px }
    .float-cardb { right: 0 }
    .testi-slide.active { grid-template-columns: 1fr !important }
}
@media(max-width:576px) {
    .hero h1 { font-size: 2.5rem }
    .dash-balance { font-size: 32px }
    .float-cardb { width: 170px; padding: 12px }
    .topbar { padding: 8px 8px 0 }
}
.custom-scroll-x::-webkit-scrollbar { height: 6px; }
.custom-scroll-x::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.05); border-radius: 10px; margin: 0 20px; }
.custom-scroll-x::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.25); border-radius: 10px; }
.custom-scroll-x::-webkit-scrollbar-thumb:hover { background: var(--rose); }

/* Standalone page padding */
.page-pad { padding-top: 140px !important; }