:root {
    --bg: #e5e7eb;
    --surface: #ffffff;
    --surface-alt: #f3f4f6;
    --text: #1e2025;
    --muted: #5b616b;
    --line: #d4d8df;
    --dark: #1e2025;
    --accent: #80c342;
    --radius: 22px;
    --shadow: 0 16px 44px rgba(31, 31, 31, 0.09);
    --container: 1380px;
    --duration: 200ms;
}

/* --- Homepage redesign 2026 --- */
:root {
    --ink: #10231b;
    --forest: #0c2f22;
    --green: #7bcf3b;
    --green-bright: #9bea58;
    --mint: #eaf7e3;
    --cream: #f8f7f1;
    --soft-line: #dfe8df;
    --home-radius: 28px;
    --container: 1180px;
}

html { scroll-behavior: smooth; }
body {
    background: #fff;
    color: var(--ink);
    overflow-x: hidden;
}

.fx-grain { opacity: .012; }
.container { width: min(var(--container), calc(100% - 40px)); }

.topbar {
    position: absolute;
    top: 0;
    width: 100%;
    padding-top: 18px;
}
.topbar-inner {
    margin-top: 0;
    min-height: 64px;
    padding: 8px 10px 8px 18px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 18px;
    box-shadow: 0 16px 40px rgba(8,39,26,.12);
}
.brand-logo { height: 38px; }
.desktop-nav { gap: 26px; }
.desktop-nav a { color: #405249; font-size: 13px; }
.topbar-actions .btn { min-height: 42px; border-radius: 11px; font-size: 13px; }

.btn { transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary {
    background: linear-gradient(135deg, var(--green-bright), var(--green));
    color: #102617;
    box-shadow: 0 10px 25px rgba(92,184,46,.25);
}
.btn-outline { background: #fff; border-color: #b9cbbd; color: var(--ink); }
.btn-lg { min-height: 54px; padding: 14px 20px; border-radius: 14px; }
.btn span { margin-left: 8px; }

.home-hero {
    position: relative;
    min-height: 790px;
    padding: 142px 0 92px;
    overflow: hidden;
    background:
        radial-gradient(circle at 76% 55%, rgba(134,224,74,.2), transparent 27%),
        linear-gradient(118deg, #f3f8ef 0%, #f7f8f2 52%, #e4f4db 100%);
}
.home-hero::after {
    content: "";
    position: absolute;
    left: -5%;
    right: -5%;
    bottom: -34px;
    height: 75px;
    border-radius: 50%;
    background: #fff;
}
.hero-orb { position: absolute; border-radius: 50%; filter: blur(1px); opacity: .7; }
.hero-orb-one { width: 380px; height: 380px; right: -160px; top: 80px; border: 1px solid rgba(91,166,50,.17); }
.hero-orb-two { width: 160px; height: 160px; left: -70px; bottom: 80px; background: rgba(167,227,125,.16); }
.hero-layout { display: grid; grid-template-columns: .94fr 1.06fr; align-items: center; gap: 64px; }
.hero-copy { padding-top: 26px; }
.hero-kicker, .section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #4e8f2f;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.hero-kicker i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(123,207,59,.16); }
.hero-copy h1 {
    max-width: none;
    margin: 23px 0 22px;
    color: var(--ink);
    font-size: clamp(50px, 5.15vw, 74px);
    line-height: .98;
    letter-spacing: -.065em;
}
.hero-copy h1 em { color: #64b52f; font-family: Georgia, serif; font-weight: 400; }
.hero-copy > p { max-width: 530px; margin: 0 0 28px; color: #506158; font-size: 17px; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 25px; }
.hero-text-link { color: var(--ink); font-size: 14px; font-weight: 800; text-decoration: none; }
.hero-proof { display: flex; align-items: center; gap: 12px; margin-top: 35px; }
.proof-avatars { display: flex; }
.proof-avatars span {
    display: grid; place-items: center; width: 32px; height: 32px; margin-left: -7px;
    border: 2px solid #fff; border-radius: 50%; background: #244c3c; color: #fff; font-size:12px; font-weight: 800;
}
.proof-avatars span:first-child { margin-left: 0; background: #98d76d; color: #183524; }
.hero-proof strong, .hero-proof small { display: block; }
.hero-proof strong { font-size: 13px; }
.hero-proof small { color: #6a776f; font-size:12px; margin-top: 2px; }

.hero-visual { position: relative; min-height: 540px; }
.hero-photo {
    position: absolute; inset: 5px 18px 70px 40px; overflow: hidden;
    border-radius: 42% 42% 31% 31% / 34% 34% 18% 18%;
    box-shadow: 0 28px 70px rgba(14,49,34,.22);
}
.hero-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 50%, rgba(5,25,16,.42)); }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; display:block; }
.photo-pill {
    position:absolute; z-index:2; left:28px; top:28px; display:flex; align-items:center; gap:8px;
    padding:10px 13px; border:1px solid rgba(255,255,255,.45); border-radius:999px;
    background:rgba(12,37,27,.65); backdrop-filter:blur(10px); color:#fff; font-size:12px; font-weight:700;
}
.photo-pill i, .artist-status i { width:7px; height:7px; background:#85e14b; border-radius:50%; box-shadow:0 0 0 4px rgba(133,225,75,.16); }
.match-card {
    position:absolute; z-index:3; left:-8px; right:0; bottom:5px; margin:auto; width:84%;
    padding:17px; border:1px solid rgba(255,255,255,.85); border-radius:20px;
    background:rgba(255,255,255,.93); backdrop-filter:blur(12px); box-shadow:0 20px 50px rgba(9,42,27,.18);
}
.match-card-top { display:flex; align-items:center; gap:10px; }
.match-avatar { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; background:var(--forest); color:#fff; font-size:12px; font-weight:800; }
.match-card-top div { flex:1; }
.match-card-top strong,.match-card-top small { display:block; }
.match-card-top strong { font-size:12px; }
.match-card-top small { margin-top:3px; color:#7a887f; font-size:12px; }
.match-card-top b { color:#64b52f; font-size:16px; }
.sound-wave { height:32px; display:flex; align-items:center; gap:3px; margin:8px 0; overflow:hidden; }
.sound-wave i { width:3px; height:var(--h); border-radius:3px; background:linear-gradient(#92dc5e,#53a52c); opacity:.75; }
.match-tags { display:flex; gap:6px; }
.match-tags span { padding:5px 8px; border-radius:999px; background:#eff5ec; color:#54665b; font-size:12px; font-weight:700; }
.floating-note { position:absolute; z-index:4; padding:12px 15px; border-radius:14px; background:#fff; box-shadow:0 16px 35px rgba(16,54,37,.15); }
.floating-note small,.floating-note strong { display:block; }
.floating-note small { color:#7b887f; font-size:12px; }
.floating-note strong { margin-top:2px; font-size:13px; }
.floating-note-price { right:-25px; top:110px; transform:rotate(3deg); }
.floating-note-fast { left:-36px; top:255px; transform:rotate(-3deg); }

.trust-band { padding:34px 0 28px; border-bottom:1px solid #edf1ec; background:#fff; }
.trust-inner { display:grid; grid-template-columns:1.35fr repeat(4,1fr); align-items:center; }
.trust-inner p { color:#8a968e; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.09em; }
.trust-inner article { border-left:1px solid #e5ebe5; padding-left:26px; }
.trust-inner strong,.trust-inner span { display:block; }
.trust-inner strong { font-size:21px; letter-spacing:-.04em; }
.trust-inner span { margin-top:4px; color:#78857d; font-size:12px; }

.home-section { padding-top:112px; }
.home-heading { margin-bottom:42px; }
.home-heading h2 { margin:10px 0 0; font-size:clamp(36px,4.3vw,55px); line-height:1.08; letter-spacing:-.055em; }
.home-heading > p { color:#69786f; line-height:1.65; }
.home-heading.centered { text-align:center; }
.home-heading.centered .section-kicker { justify-content:center; }
.home-heading.centered > p { margin:14px auto 0; }
.split-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; }
.split-heading > p { max-width:390px; margin:0; }

.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.process-grid article { position:relative; min-height:290px; padding:30px; border:1px solid var(--soft-line); border-radius:var(--home-radius); background:#fbfcf9; overflow:hidden; }
.process-grid article::after { content:""; position:absolute; width:130px; height:130px; right:-55px; bottom:-55px; border:1px solid #dcebd7; border-radius:50%; }
.process-grid .process-featured { background:var(--mint); border-color:#cfe8c4; transform:translateY(18px); }
.process-number { color:#8a9a90; font:italic 18px Georgia,serif; }
.process-icon { display:grid; place-items:center; width:58px; height:58px; margin:38px 0 20px; border-radius:18px; background:#fff; color:#5eaa31; font-size:26px; box-shadow:0 10px 30px rgba(34,83,54,.08); }
.process-grid h3 { margin:0 0 10px; font-size:19px; letter-spacing:-.025em; }
.process-grid p { margin:0; color:#69786f; font-size:13px; line-height:1.7; }

.artist-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.artist-card { border:1px solid var(--soft-line); border-radius:24px; background:#fff; overflow:hidden; transition:.25s ease; }
.artist-card:hover { transform:translateY(-6px); box-shadow:0 20px 45px rgba(17,50,35,.1); }
.artist-image { position:relative; height:325px; overflow:hidden; background:#e9eee9; }
.artist-image::after { content:""; position:absolute; inset:0; background:linear-gradient(transparent 63%,rgba(4,24,15,.52)); }
.artist-image img { width:100%; height:100%; object-fit:cover; display:block; }
.artist-status { position:absolute; z-index:2; left:16px; top:16px; display:flex; align-items:center; gap:7px; padding:7px 10px; border-radius:999px; background:rgba(9,34,23,.72); color:#fff; font-size:12px; }
.artist-index { position:absolute; z-index:2; right:17px; bottom:12px; color:rgba(255,255,255,.8); font:italic 26px Georgia,serif; }
.artist-body { display:flex; justify-content:space-between; gap:12px; padding:18px; }
.artist-body h3 { margin:0 0 5px; font-size:17px; }
.artist-body p { margin:0; color:#738078; font-size:12px; }
.artist-rating { text-align:right; white-space:nowrap; }
.artist-rating strong,.artist-rating small { display:block; }
.artist-rating strong { color:#4e9828; font-size:12px; }
.artist-rating small { margin-top:6px; color:#869088; font-size:12px; }
.section-action { margin-top:35px; text-align:center; }

.benefits-wrap { margin-top:120px; padding:105px 0; background:var(--forest); color:#fff; }
.light-heading .section-kicker { color:#94df62; }
.benefit-bento { display:grid; grid-template-columns:1.2fr .8fr .8fr; gap:14px; }
.benefit-bento article { padding:28px; border:1px solid rgba(255,255,255,.1); border-radius:25px; background:rgba(255,255,255,.055); }
.benefit-bento h3 { margin:20px 0 8px; font-size:18px; }
.benefit-bento p { margin:0; color:#aebdb5; font-size:12px; line-height:1.7; }
.benefit-icon { display:grid; place-items:center; width:42px; height:42px; border:1px solid rgba(145,226,91,.35); border-radius:13px; background:rgba(128,207,76,.1); color:#9be969; font-size:19px; }
.mini-match { display:flex; align-items:center; gap:9px; margin-top:28px; padding:12px; border-radius:14px; background:#fff; color:var(--ink); }
.mini-avatar { display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#b7e59b;font-size:12px;font-weight:800; }
.mini-match div { flex:1; }
.mini-match strong,.mini-match small { display:block; font-size:12px; }
.mini-match small { margin-top:3px;color:#728078; }
.mini-match b { color:#62ad34; }
.big-stat { display:block; margin-top:30px; color:#9dea67; font-size:33px; letter-spacing:-.05em; }
.price-bars { display:flex; align-items:end; gap:7px; height:52px; margin-top:23px; }
.price-bars i { width:24%; height:45%; border-radius:5px 5px 0 0; background:#76bd48; opacity:.45; }
.price-bars i:nth-child(2) { height:85%; opacity:.8; }
.price-bars i:nth-child(3) { height:65%; }
.benefit-bento .benefit-wide { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:24px 28px; }
.benefit-wide div { display:grid; grid-template-columns:auto 1fr; column-gap:16px; align-items:center; }
.benefit-wide .benefit-icon { grid-row:1/3; }
.benefit-wide h3 { margin:0 0 5px; }

.story-grid { display:grid; grid-template-columns:1.6fr .75fr; gap:18px; }
.story-featured { min-height:380px; display:grid; grid-template-columns:.9fr 1.1fr; overflow:hidden; border-radius:var(--home-radius); background:#f1f6ed; }
.story-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.story-copy { padding:45px; align-self:center; }
.stars { color:#68b938; letter-spacing:.16em; font-size:12px; }
.story-copy blockquote { margin:18px 0 24px; font:24px/1.5 Georgia,serif; color:#20352b; }
.story-copy strong,.story-copy small { display:block; }
.story-copy small { margin-top:4px;color:#7b887f;font-size:12px; }
.story-small { display:flex; flex-direction:column; justify-content:center; padding:34px; border-radius:var(--home-radius); background:var(--forest); color:#fff; }
.story-small > p { margin:22px 0 40px; font:20px/1.55 Georgia,serif; color:#eaf1ec; }
.story-small > div { display:flex; align-items:center; gap:10px; }
.story-small .avatar { display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#94df62;color:#173120;font-size:12px; }
.story-small strong { font-size:12px; }
.story-small small { display:block;margin-top:4px;color:#99aaa0;font-weight:400; }

#faq.home-section, #faq.container { padding-top:105px; }
#faq .section-head { text-align:center; margin-bottom:35px; }
#faq .section-head h2 { font-size:48px; letter-spacing:-.05em; }
#faq .faq-list { max-width:820px; margin:auto; display:grid; gap:10px; }
#faq .faq-item { border:1px solid var(--soft-line); border-radius:16px; background:#fff; overflow:hidden; }
#faq .faq-item h3 { margin:0; }
#faq .faq-trigger { width:100%; display:flex; justify-content:space-between; padding:19px 22px; border:0; background:none; color:var(--ink); font:700 14px Manrope,sans-serif; text-align:left; cursor:pointer; }
#faq .faq-icon { display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#eef5ea;color:#5ca832; }
#faq .faq-panel { display:none; padding:0 22px 18px; }
#faq .faq-panel.open { display:block; }
#faq .faq-panel p { margin:0; color:#6c7b72; font-size:13px; line-height:1.7; }

.final-cta { position:relative; min-height:310px; margin-top:110px; padding:58px 64px; display:flex; justify-content:space-between; align-items:center; gap:30px; overflow:hidden; border-radius:32px; background:linear-gradient(125deg,#0d3526,#174c35); color:#fff; }
.final-cta::before { content:""; position:absolute; width:380px;height:380px;right:-120px;top:-150px;border:1px solid rgba(145,226,91,.2);border-radius:50%; }
.final-cta > * { position:relative; z-index:1; }
.final-cta h2 { margin:10px 0 12px; font-size:clamp(34px,4vw,50px); line-height:1.08; letter-spacing:-.055em; }
.final-cta p { color:#acbeb4; font-size:12px; }
.cta-vinyl { position:absolute; width:190px;height:190px;right:225px;bottom:-125px;border:28px solid rgba(138,216,83,.09);border-radius:50%; }

.site-footer { margin-top:70px; padding-top:50px; background:#f7f8f4; border:0; }
.footer-wave { display:none; }
.footer-copy { padding:18px 0; border-top:1px solid #e2e8e1; }

@media (max-width: 900px) {
    .desktop-nav { display:none; }
    .menu-toggle { display:flex; }
    .hero-layout { grid-template-columns:1fr; gap:35px; }
    .home-hero { padding-top:125px; min-height:auto; }
    .hero-copy { text-align:center; }
    .hero-copy > p { margin-left:auto; margin-right:auto; }
    .hero-actions,.hero-proof { justify-content:center; }
    .hero-visual { min-height:500px; max-width:650px; width:100%; margin:auto; }
    .trust-inner { grid-template-columns:repeat(4,1fr); gap:18px; }
    .trust-inner > p { grid-column:1/-1;text-align:center; }
    .process-grid,.artist-grid { grid-template-columns:1fr 1fr; }
    .process-grid article:last-child,.artist-card:last-child { grid-column:1/-1; }
    .split-heading { display:block; }
    .split-heading > p { margin-top:15px; }
    .benefit-bento { grid-template-columns:1fr 1fr; }
    .benefit-large { grid-column:1/-1; }
    .story-grid { grid-template-columns:1fr; }
}

/* Keep homepage presentation above the legacy component layer. */
body .home-hero .hero-layout { grid-template-columns: .94fr 1.06fr; align-items: center; gap: 64px; }
body .home-hero .hero-copy {
    min-height: 0;
    padding: 26px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
body .home-hero .hero-copy::before,
body .home-hero .hero-copy::after { display: none; }
body .home-hero .hero-copy h1 {
    max-width: none;
    margin: 23px 0 22px;
    color: var(--ink);
    font-size: clamp(50px, 5.15vw, 74px);
    line-height: .98;
    letter-spacing: -.065em;
}
body .home-hero .hero-copy > p {
    max-width: 530px;
    margin: 0 0 28px;
    color: #506158;
    font-size: 17px;
    line-height: 1.75;
}
body .home-hero .hero-actions { margin: 0; }
body .final-cta {
    min-height: 310px;
    margin-top: 110px;
    padding: 58px 64px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    border: 0;
    border-radius: 32px;
    background: linear-gradient(125deg,#0d3526,#174c35);
    color: #fff;
    box-shadow: none;
}
body .final-cta h2 { margin: 10px 0 12px; color: #fff; font-size: clamp(34px,4vw,50px); line-height: 1.08; }
body .final-cta p { color: #acbeb4; }

@media (max-width: 900px) {
    body .home-hero .hero-layout { grid-template-columns: 1fr; gap: 35px; }
    body .home-hero .hero-copy { text-align: center; width: 100%; }
    body .home-hero .hero-copy > p { margin-left: auto; margin-right: auto; }
}

@media (max-width: 620px) {
    body .home-hero .hero-copy h1 { font-size: 44px; }
    body .home-hero .hero-copy > p { font-size: 14px; }
    body .final-cta { min-height: 0; margin-top: 80px; padding: 42px 26px; display: block; border-radius: 28px; text-align: center; }
}

@media (max-width: 620px) {
    .container { width:min(100% - 24px,var(--container)); }
    .topbar-actions > .btn { display:none; }
    .home-hero { padding-top:112px; padding-bottom:75px; }
    .hero-copy h1 { font-size:44px; }
    .hero-copy > p { font-size:14px; }
    .hero-actions { flex-direction:column; gap:17px; }
    .hero-visual { min-height:400px; }
    .hero-photo { inset:0 5px 55px; border-radius:30px; }
    .match-card { width:94%; }
    .floating-note { display:none; }
    .trust-inner { grid-template-columns:1fr 1fr; }
    .trust-inner article { padding:15px 10px; text-align:center; }
    .home-section { padding-top:80px; }
    .home-heading h2 { font-size:37px; }
    .process-grid,.artist-grid,.benefit-bento { grid-template-columns:1fr; }
    .process-grid article:last-child,.artist-card:last-child,.benefit-large { grid-column:auto; }
    .process-grid .process-featured { transform:none; }
    .artist-image { height:300px; }
    .benefits-wrap { margin-top:85px; padding:75px 0; }
    .benefit-bento .benefit-wide { grid-column:auto; display:block; }
    .benefit-wide .btn { margin-top:24px; width:100%; }
    .story-featured { grid-template-columns:1fr; }
    .story-photo { height:250px; }
    .story-copy { padding:28px; }
    .story-copy blockquote { font-size:20px; }
    .final-cta { margin-top:80px; padding:42px 26px; display:block; text-align:center; }
    .final-cta .btn { margin-top:20px; }
    .footer-grid { grid-template-columns:1fr 1fr; }
}

* { box-sizing: border-box; }

html,
body {
    margin: 0;
    padding: 0;
    font-family: Manrope, system-ui, sans-serif;
    color: var(--text);
    background: radial-gradient(circle at 8% 0%, #f1f3f5, #e5e7eb 45%, #dde1e7 100%);
}

.fx-grain {
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: 0.02;
    background-image: radial-gradient(#000 0.5px, transparent 0.5px);
    background-size: 4px 4px;
    z-index: 0;
}

.container {
    width: min(var(--container), calc(100% - 24px));
    margin-inline: auto;
    position: relative;
    z-index: 1;
}

.mt-20 { margin-top: 20px; }
.mt-32 { margin-top: 32px; }
.mt-48 { margin-top: 48px; }

.topbar {
    position: sticky;
    top: 10px;
    z-index: 30;
}

.topbar-inner {
    margin-top: 10px;
    background: #ffffffe0;
    backdrop-filter: blur(8px);
    border: 1px solid #cde9dc;
    border-radius: 16px;
    min-height: 72px;
    padding: 10px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    box-shadow: 0 8px 20px rgba(128, 195, 66, 0.12);
}

.nav-left {
    display: flex;
    align-items: center;
    gap: 24px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--text);
    text-decoration: none;
}

.brand-logo {
    width: auto;
    height: 36px;
    display: block;
}

.brand-mark {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: linear-gradient(140deg, #9ad05f, #80c342);
}

.brand-text {
    font-weight: 800;
    font-size: 22px;
    letter-spacing: -0.02em;
}

.desktop-nav {
    display: inline-flex;
    align-items: center;
    gap: 18px;
}

.desktop-nav a,
.muted-link,
.mobile-menu a,
.site-footer a {
    color: var(--muted);
    text-decoration: none;
    font-weight: 600;
}

.desktop-nav a:hover,
.mobile-menu a:hover,
.site-footer a:hover,
.muted-link:hover {
    color: #2f7d5b;
}

.desktop-nav a.active { color: var(--text); }

.topbar-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.menu-toggle {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #fff;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
}

.menu-toggle span {
    width: 18px;
    height: 2px;
    background: var(--text);
}

.mobile-menu { display: none; }
.mobile-menu.open { display: block; }
.mobile-menu-inner {
    margin-top: 8px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--shadow);
    padding: 14px;
    display: grid;
    gap: 10px;
}

.page-shell { padding-top: 20px; padding-bottom: 28px; }

.hero-card {
    background: var(--surface-alt);
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 28px;
    box-shadow: var(--shadow);
}

.hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    align-items: center;
}

.hero-copy h1 {
    margin: 0;
    font-size: clamp(36px, 5.8vw, 68px);
    line-height: 0.95;
    letter-spacing: -0.045em;
    max-width: 10ch;
}

.hero-main-title {
    position: relative;
    display: inline-block;
}

.hero-title-text {
    position: relative;
    z-index: 1;
    display: block;
}

.hero-copy p {
    margin: 16px 0 24px;
    color: var(--muted);
    max-width: 44ch;
}

.hero-collage {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.hero-collage img {
    width: 100%;
    height: 170px;
    object-fit: cover;
    border-radius: 16px;
    display: block;
}

.search-strip {
    margin-top: 18px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 8px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr auto;
    gap: 8px;
    align-items: center;
}

.search-strip > div {
    padding: 8px 14px;
}

.search-strip small {
    display: block;
    font-size: 12px;
    color: #8a8d93;
}

.search-strip strong {
    font-size: 14px;
}

.search-btn {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: var(--dark);
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}

.section { margin-top: 24px; }

.section-head { margin-bottom: 14px; }
.section-head.center { text-align: center; }
.section-head h2 {
    margin: 0;
    font-size: clamp(28px, 4vw, 52px);
    letter-spacing: -0.035em;
}
.section-head p {
    margin: 6px 0 0;
    color: var(--muted);
}

.cards-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.thumb-card,
.listing-card,
.host-card,
.nearby-grid article,
.testimonial {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
}

.thumb-card { padding: 10px; }
.thumb-card img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    border-radius: 12px;
}
.thumb-card h3 { margin: 10px 0 4px; font-size: 18px; }
.thumb-card p { margin: 0; color: var(--muted); font-size: 14px; }

.panel {
    background: #f8f9fb;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 20px;
}

.listing-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.listing-card {
    overflow: hidden;
    padding-bottom: 10px;
}

.listing-card img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    display: block;
}

.listing-card h3 {
    margin: 10px 10px 6px;
    font-size: 15px;
}

.listing-meta {
    display: flex;
    justify-content: space-between;
    margin: 0 10px;
    color: var(--muted);
    font-size: 13px;
}

.center { text-align: center; }

.how-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.how-grid article {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 16px;
}

.icon-bubble {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e5e7eb;
    font-weight: 800;
}

.how-grid h3 { margin: 10px 0 6px; }
.how-grid p { margin: 0; color: var(--muted); }

.hosts-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

.host-card {
    text-align: center;
    padding: 12px;
}

.host-card img {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
}

.host-card strong {
    display: block;
    margin-top: 8px;
}

.host-card span {
    color: var(--muted);
    font-size: 13px;
}

.actions-row {
    display: inline-flex;
    gap: 10px;
}

.nearby-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.nearby-grid article {
    padding: 12px;
    font-weight: 700;
}

.nearby-grid span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 500;
}

.newsletter {
    background: #f8f9fb;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 20px;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 18px;
    align-items: center;
}

.newsletter h2 {
    margin: 0;
    font-size: clamp(28px, 4vw, 46px);
}

.newsletter p,
.newsletter li { color: var(--muted); }

.newsletter ul { margin: 10px 0 0; padding-left: 18px; }

.newsletter img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    border-radius: 16px;
}

.news-input {
    margin-top: 14px;
    display: flex;
    gap: 8px;
}

.news-input input {
    flex: 1;
    min-height: 44px;
    border-radius: 12px;
    border: 1px solid #d1d5db;
    padding: 10px 12px;
}

.testimonial {
    text-align: center;
    padding: 22px;
}

.testimonial blockquote {
    margin: 6px auto 12px;
    max-width: 60ch;
    color: #3a3e44;
    font-size: 18px;
    line-height: 1.55;
}

.testimonial strong { display: block; }

.site-footer {
    margin-top: 36px;
    border-top: 1px solid var(--line);
    padding: 30px 0 22px;
    background: transparent;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 14px;
}

.site-footer p { color: var(--muted); }
.site-footer a { display: block; margin: 0 0 6px; }

.footer-wave {
    margin-top: 16px;
    height: 10px;
    opacity: 0.42;
    background: linear-gradient(90deg, #b7e081, #80c342, #2f7d5b);
}

.footer-copy {
    text-align: center;
    color: var(--muted);
    font-size: 13px;
    margin-top: 10px;
}

.btn {
    border: 1px solid transparent;
    min-height: 44px;
    border-radius: 12px;
    padding: 10px 14px;
    font: inherit;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.btn-primary {
    background: linear-gradient(135deg, #96cf56, #80c342);
    color: #1f291f;
    box-shadow: 0 8px 18px rgba(128, 195, 66, 0.28);
}

.btn-dark {
    background: linear-gradient(135deg, #2f7d5b, #1f5f43);
    color: #fff;
}
.btn-ghost { background: #fff; color: var(--text); border-color: var(--line); }
.btn-danger {
    background: linear-gradient(135deg, #ef4444, #b91c1c);
    color: #fff;
    box-shadow: 0 8px 18px rgba(239, 68, 68, 0.22);
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid #d9d9d9;
    border-radius: 11px;
    min-height: 44px;
    padding: 10px 11px;
    font: inherit;
    color: var(--text);
    background: #fff;
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible,
.search-btn:focus-visible,
.menu-toggle:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(75, 85, 99, 0.24);
}

.notice {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 10px 12px;
    background: #fff;
}

.notice ul { margin: 6px 0 0; padding-left: 18px; }
.notice-success { border-color: #d1d5db; background: #f9fafb; color: #374151; }
.notice-error { border-color: #d1d5db; background: #f9fafb; color: #374151; }

.success-modal {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(17, 24, 39, 0.52);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--duration) ease;
}

.success-modal.open {
    opacity: 1;
    pointer-events: auto;
}

.success-modal-card {
    width: min(520px, 100%);
    border: 1px solid rgba(255, 255, 255, 0.76);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 34px 90px rgba(17, 24, 39, 0.22);
    padding: 28px;
    text-align: center;
    transform: translateY(16px) scale(0.98);
    transition: transform var(--duration) ease;
}

.success-modal.open .success-modal-card {
    transform: translateY(0) scale(1);
}

.success-modal-card h2 {
    margin: 8px 0 10px;
    font-size: 30px;
    letter-spacing: -0.03em;
}

.success-modal-card p {
    color: var(--muted);
    line-height: 1.62;
}

.success-modal-card .btn {
    width: 100%;
    margin-top: 10px;
}

.wizard-overlay {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 14px;
    background: rgba(10, 17, 24, 0.62);
    backdrop-filter: blur(4px);
    z-index: 60;
}

.wizard-overlay.open { display: flex; }

.wizard {
    width: min(1040px, 100%);
    max-height: calc(100vh - 28px);
    overflow: auto;
    border-radius: 22px;
    border: 1px solid #ffffff3d;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.25);
    padding: 16px;
}

.wizard-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.wizard-head h2 { margin: 0; }

.wizard-progress {
    height: 9px;
    border-radius: 999px;
    background: #eceff2;
    margin: 12px 0 8px;
    overflow: hidden;
}

.wizard-progress span {
    display: block;
    height: 100%;
    width: 20%;
    background: linear-gradient(90deg, #6b7280, #4b5563);
    transition: width var(--duration) ease;
}

.wizard-step-label { margin: 0 0 10px; color: var(--muted); font-size: 14px; }
.wizard-step { display: none; }
.wizard-step.active { display: block; }
.wizard-step h3 { margin: 0 0 10px; font-size: 22px; }

.wizard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.field { display: grid; gap: 6px; }
.field.full { grid-column: 1 / -1; }
.field-hint { color: var(--muted); font-size: 12px; }
.field-hint.resolved { color: #2f7d5b; font-weight: 700; }

.select-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.select-cards-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.select-card {
    position: relative;
    border: 1px solid #d8dde2;
    border-radius: 14px;
    min-height: 54px;
    padding: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    background: #fff;
    cursor: pointer;
    justify-content: center;
    text-align: center;
    transition: border-color var(--duration) ease, box-shadow var(--duration) ease, background var(--duration) ease, color var(--duration) ease;
}

.select-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.select-card:has(input:checked) {
    border-color: #2f7d5b;
    background: #eef8f2;
    color: #2f7d5b;
    box-shadow: 0 0 0 1px #2f7d5b inset, 0 10px 22px rgba(47, 125, 91, 0.12);
}

.select-card:has(input:focus-visible) {
    box-shadow: 0 0 0 3px rgba(47, 125, 91, 0.22);
}

.addon-card:has(input:checked) {
    background: linear-gradient(145deg, #f7fff2, #eef8f2);
}

.terms-check {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: #4b5563;
    font-size: 13px;
    font-weight: 700;
}

.terms-check.full { grid-column: 1 / -1; }

.terms-check a { color: inherit; font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }

.terms-check input {
    width: 18px;
    min-height: 18px;
    margin-top: 1px;
    accent-color: #80c34b;
}

.wizard-layout-final {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 10px;
}

.wizard-summary {
    border: 1px solid #dae0e5;
    border-radius: 16px;
    padding: 12px;
    background: #fbfdfd;
    position: sticky;
    top: 8px;
    align-self: start;
}

.wizard-summary h4 { margin: 0 0 8px; }
.wizard-summary p { margin: 0 0 8px; color: var(--muted); }
.wizard-summary ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; color: var(--muted); }
.wizard-summary li { display: flex; justify-content: space-between; gap: 8px; }
.wizard-summary strong { color: var(--text); }
.wizard-summary .summary-dj-count {
    align-items: center;
    margin-top: 5px;
    padding: 10px;
    border: 1px solid #cfe6c5;
    border-radius: 11px;
    background: #edf8e8;
}
.wizard-summary .summary-dj-count strong {
    padding: 5px 8px;
    border-radius: 999px;
    color: #2f7628;
    background: #fff;
    white-space: nowrap;
}
.wizard-summary small { display: block; margin-top: 8px; color: var(--muted); }

.wizard-actions {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 14px;
}

.reveal { opacity: 1; transform: none; }

.mobile-cta {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 40;
    min-height: 48px;
    border-radius: 14px;
    border: 0;
    background: var(--dark);
    color: #fff;
    font: inherit;
    font-weight: 800;
    display: none;
}

.footer-brand .brand-logo {
    height: 34px;
}

@media (max-width: 1100px) {
    .cards-row,
    .listing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hosts-grid,
    .nearby-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .desktop-nav,
    .muted-link,
    .topbar-actions > .btn { display: none; }

    .menu-toggle { display: inline-flex; }

    .hero-grid,
    .newsletter,
    .how-grid,
    .cards-row,
    .listing-grid,
    .hosts-grid,
    .nearby-grid,
    .wizard-grid,
    .wizard-layout-final,
    .select-cards,
    .footer-grid,
    .search-strip {
        grid-template-columns: 1fr;
    }

    .hero-card,
    .panel,
    .newsletter,
    .wizard { border-radius: 18px; padding: 16px; }

    .hero-collage img { height: 140px; }

    .search-strip {
        border-radius: 18px;
    }

    .search-btn {
        width: 100%;
        border-radius: 12px;
    }

    .mobile-cta { display: block; }
    .footer-copy { margin-bottom: 72px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation: none !important;
        transition-duration: 1ms !important;
        scroll-behavior: auto !important;
    }
}

/* Restored content compatibility */
.hero { margin-top: 22px; }

.hero-layout {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 16px;
    align-items: stretch;
}

.hero-copy,
.hero-side {
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) + 2px);
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 42%, #f3f4f6 100%);
    box-shadow: var(--shadow);
}

.hero-copy {
    padding: clamp(18px, 2.4vw, 28px);
    position: relative;
    overflow: visible;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
}

.hero-copy > * {
    position: relative;
    z-index: 1;
}

.hero-copy::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(280px 280px at var(--spot-x, 65%) var(--spot-y, 38%), rgba(17, 24, 39, 0.07), transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #eaf7dc;
    color: #2f7d5b;
    padding: 7px 11px;
    font-size: 12px;
    font-weight: 700;
}

h1 {
    font-size: clamp(36px, 5.8vw, 66px);
    line-height: 1.02;
    letter-spacing: -0.042em;
    margin: 14px 0 10px;
    max-width: 12.6ch;
}

.headline-accent {
    background: linear-gradient(90deg, #2f7d5b, #80c342);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    position: relative;
}

.headline-accent::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 8px;
    background: linear-gradient(90deg, rgba(128, 195, 66, 0.34), rgba(47, 125, 91, 0.24));
    border-radius: 999px;
}

.hero-copy p {
    margin: 0;
    color: var(--muted);
    font-size: clamp(16px, 1.4vw, 20px);
    line-height: 1.72;
    max-width: 58ch;
}

.hero-actions {
    margin-top: clamp(20px, 4vw, 56px);
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.hero-copy small {
    margin-top: 10px;
    display: block;
    color: var(--muted);
}

.waveform {
    margin-top: 26px;
    display: flex;
    align-items: end;
    gap: 6px;
    height: 34px;
}

.waveform span {
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, #2f7d5b, #96cf56);
    height: 8px;
    animation: wave 1.6s ease-in-out infinite;
}

.waveform span:nth-child(odd) { animation-duration: 1.2s; }
.waveform span:nth-child(3n) { animation-duration: 1.8s; }

.waveform-bg {
    position: absolute;
    top: 52%;
    left: -42px;
    right: -42px;
    transform: translateY(-50%);
    margin-top: 0;
    height: 96px;
    justify-content: center;
    gap: 14px;
    opacity: 0.38;
    pointer-events: none;
    z-index: 0;
}

.waveform-bg span {
    width: 9px;
    height: 30px;
}

@keyframes wave {
    0%, 100% { transform: scaleY(0.5); opacity: 0.55; }
    50% { transform: scaleY(1.6); opacity: 1; }
}

.hero-side { padding: clamp(16px, 1.8vw, 22px); }
.quote-card { display: grid; gap: 8px; }

.quote-top {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 10px;
}

.quote-top h2 { margin: 0; font-size: 21px; }

.quote-price {
    font-size: clamp(28px, 3.6vw, 42px);
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #2f7d5b;
}

.quote-card p { margin: 0; color: var(--muted); font-size: 14px; }

.quote-controls {
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 8px 10px;
    background: #fff;
    display: grid;
    gap: 4px;
}

.quick-field {
    display: grid;
    gap: 5px;
}

.quick-field label {
    color: var(--muted);
    font-size:12px;
    font-weight: 700;
}

.quick-field input,
.quick-date-trigger {
    width: 100%;
    min-height: 36px;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    padding: 7px 10px;
    outline: none;
    transition: border-color var(--duration) ease, box-shadow var(--duration) ease, background var(--duration) ease;
}

.quick-date-trigger {
    cursor: pointer;
    text-align: left;
}

.quick-field input:focus,
.quick-date-trigger:focus {
    border-color: #2f7d5b;
    background: #eef8f2;
    box-shadow: 0 0 0 1px #2f7d5b inset;
}

.quick-date-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(17, 24, 39, 0.58);
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms ease;
}

.quick-date-modal.open {
    opacity: 1;
    pointer-events: auto;
}

.quick-date-dialog {
    width: min(560px, 100%);
    border: 1px solid var(--line);
    border-radius: 24px;
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 28px 80px rgba(17, 24, 39, 0.28);
    padding: 18px;
    transform: translateY(14px) scale(0.98);
    transition: transform 220ms ease;
}

.quick-date-modal.open .quick-date-dialog {
    transform: translateY(0) scale(1);
}

.quick-date-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.quick-date-head strong {
    flex: 1;
    font-size: 20px;
    text-align: center;
}

.quick-date-head button,
.quick-date-grid button {
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: #fff;
    color: var(--text);
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    transition: border-color var(--duration) ease, box-shadow var(--duration) ease, background var(--duration) ease, transform var(--duration) ease;
}

.quick-date-head button {
    min-width: 82px;
    padding: 8px 10px;
}

.quick-date-back[hidden] {
    visibility: hidden;
    display: block;
}

.quick-date-back[hidden] + strong {
    text-align: left;
}

.quick-date-stage {
    overflow: hidden;
}

.quick-date-stage.slide-forward .quick-date-grid {
    animation: quickDateForward 180ms ease both;
}

.quick-date-stage.slide-back .quick-date-grid {
    animation: quickDateBack 180ms ease both;
}

.quick-date-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.quick-date-grid button {
    min-height: 44px;
    padding: 8px;
}

.quick-date-head button:hover,
.quick-date-grid button:hover {
    border-color: #2f7d5b;
    background: #eef8f2;
    box-shadow: 0 0 0 1px #2f7d5b inset;
    transform: translateY(-1px);
}

@keyframes quickDateForward {
    from { opacity: 0; transform: translateX(18px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes quickDateBack {
    from { opacity: 0; transform: translateX(-18px); }
    to { opacity: 1; transform: translateX(0); }
}

.quick-radio-group {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
    padding-bottom: 2px;
}

.quick-radio-group p {
    margin: 0;
    grid-column: 1 / -1;
    font-size:12px;
    font-weight: 700;
    color: var(--muted);
}

.quick-radio-option {
    position: relative;
    margin: 0;
}

.quick-radio-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.quick-radio-option span {
    min-height: 30px;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    background: #fff;
    color: #4b5563;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 5px 8px;
    transition: border-color var(--duration) ease, box-shadow var(--duration) ease, background var(--duration) ease;
}

.quick-radio-option input:checked + span {
    border-color: #2f7d5b;
    background: #eef8f2;
    box-shadow: 0 0 0 1px #2f7d5b inset;
}

.quick-radio-option input:focus-visible + span {
    box-shadow: 0 0 0 3px rgba(47, 125, 91, 0.26);
}

label { font-size: 13px; font-weight: 700; color: #4b5563; }

.quote-addons { display: flex; gap: 8px; flex-wrap: wrap; }

.quote-addons label {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: 999px;
    border: 1px solid #d1d5db;
    padding: 7px 11px;
    background: #fff;
}

.quote-addons input { min-height: auto; width: auto; padding: 0; border: 0; }

.quote-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #2f7d5b;
    font-size: 13px;
    font-weight: 600;
}

.pulse-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #2f7d5b;
    box-shadow: 0 0 0 rgba(47, 125, 91, 0.4);
    animation: pulse 1.8s infinite;
}

@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(47, 125, 91, 0.4); }
    70% { box-shadow: 0 0 0 10px rgba(47, 125, 91, 0); }
    100% { box-shadow: 0 0 0 0 rgba(47, 125, 91, 0); }
}

.dj-avatars {
    display: flex;
    align-items: center;
    width: 100%;
    padding-left: 2px;
}

.dj-avatars span {
    position: relative;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    margin-left: -9px;
    overflow: hidden;
    border-radius: 50%;
    background:
        radial-gradient(circle at 25% 24%, rgba(255, 255, 255, 0.72), transparent 22%),
        radial-gradient(circle at 72% 30%, #7c6df2 0%, transparent 34%),
        radial-gradient(circle at 70% 78%, #ffb86b 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #80c34b 0%, transparent 38%),
        #6b5ce7;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size:12px;
    font-weight: 800;
    color: #fff;
    text-shadow: 0 1px 6px rgba(17, 24, 39, 0.34);
    box-shadow: 0 10px 22px rgba(17, 24, 39, 0.16);
    opacity: 0.94;
    border: 2px solid rgba(255, 255, 255, 0.76);
}

.dj-avatars span:first-child {
    margin-left: 0;
}

.dj-avatars span::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 255, 255, 0.38) 0.7px, transparent 0.7px);
    background-size: 3px 3px;
    mix-blend-mode: overlay;
    opacity: 0.42;
    pointer-events: none;
}

.dj-avatars span:nth-child(1) {
    background:
        radial-gradient(circle at 26% 22%, rgba(255, 255, 255, 0.74), transparent 21%),
        radial-gradient(circle at 68% 26%, #7367f0 0%, transparent 38%),
        radial-gradient(circle at 72% 76%, #ffb36b 0%, transparent 42%),
        radial-gradient(circle at 20% 72%, #b6a3ff 0%, transparent 36%),
        #6556d9;
}

.dj-avatars span:nth-child(2) {
    background:
        radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 74% 32%, #ff7a90 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #ffd166 0%, transparent 40%),
        radial-gradient(circle at 24% 70%, #ff4d6d 0%, transparent 44%),
        #ff5c7a;
}

.dj-avatars span:nth-child(3) {
    background:
        radial-gradient(circle at 24% 22%, rgba(255, 255, 255, 0.72), transparent 23%),
        radial-gradient(circle at 24% 58%, #bde7ff 0%, transparent 40%),
        radial-gradient(circle at 75% 72%, #ff9f43 0%, transparent 42%),
        radial-gradient(circle at 72% 24%, #496f3d 0%, transparent 44%),
        #80c34b;
}

.dj-avatars span:nth-child(4) {
    background:
        radial-gradient(circle at 26% 24%, rgba(255, 255, 255, 0.72), transparent 24%),
        radial-gradient(circle at 76% 30%, #60a5fa 0%, transparent 38%),
        radial-gradient(circle at 72% 76%, #80c34b 0%, transparent 42%),
        radial-gradient(circle at 22% 74%, #2f7d5b 0%, transparent 40%),
        #38bdf8;
}

.dj-avatars span:nth-child(5) {
    background:
        radial-gradient(circle at 28% 24%, rgba(255, 255, 255, 0.68), transparent 22%),
        radial-gradient(circle at 70% 28%, #f472b6 0%, transparent 38%),
        radial-gradient(circle at 72% 76%, #facc15 0%, transparent 40%),
        radial-gradient(circle at 22% 72%, #fb7185 0%, transparent 42%),
        #ec4899;
}

.dj-avatars span:nth-child(6) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.72), transparent 23%),
        radial-gradient(circle at 74% 28%, #22d3ee 0%, transparent 38%),
        radial-gradient(circle at 76% 76%, #a78bfa 0%, transparent 42%),
        radial-gradient(circle at 24% 72%, #0ea5e9 0%, transparent 38%),
        #0284c7;
}

.dj-avatars span:nth-child(7) {
    background:
        radial-gradient(circle at 26% 22%, rgba(255, 255, 255, 0.72), transparent 22%),
        radial-gradient(circle at 72% 26%, #f97316 0%, transparent 38%),
        radial-gradient(circle at 72% 76%, #fde68a 0%, transparent 40%),
        radial-gradient(circle at 24% 72%, #dc2626 0%, transparent 42%),
        #ea580c;
}

.dj-avatars span:nth-child(8) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.72), transparent 24%),
        radial-gradient(circle at 72% 28%, #14b8a6 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #84cc16 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #166534 0%, transparent 40%),
        #0f766e;
}

.dj-avatars span:nth-child(9) {
    background:
        radial-gradient(circle at 25% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #818cf8 0%, transparent 38%),
        radial-gradient(circle at 72% 76%, #f0abfc 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #4f46e5 0%, transparent 40%),
        #6366f1;
}

.dj-avatars span:nth-child(10) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #fb923c 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #80c34b 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #f43f5e 0%, transparent 40%),
        #f97316;
}

.dj-avatars span:nth-child(11) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #c084fc 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #22d3ee 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #7c3aed 0%, transparent 40%),
        #8b5cf6;
}

.dj-avatars span:nth-child(12) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #fda4af 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #fdba74 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #be123c 0%, transparent 40%),
        #fb7185;
}

.dj-avatars span:nth-child(13) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #bef264 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #38bdf8 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #15803d 0%, transparent 40%),
        #65a30d;
}

.dj-avatars span:nth-child(14) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #93c5fd 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #f0abfc 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #1d4ed8 0%, transparent 40%),
        #2563eb;
}

.dj-avatars span:nth-child(15) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #fef08a 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #fb7185 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #ca8a04 0%, transparent 40%),
        #eab308;
}

.dj-avatars span:nth-child(16) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #5eead4 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #80c34b 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #0f766e 0%, transparent 40%),
        #14b8a6;
}

.dj-avatars span:nth-child(17) {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.7), transparent 22%),
        radial-gradient(circle at 72% 28%, #fdba74 0%, transparent 38%),
        radial-gradient(circle at 74% 76%, #c4b5fd 0%, transparent 42%),
        radial-gradient(circle at 22% 72%, #c2410c 0%, transparent 40%),
        #f97316;
}

.dj-avatars .dj-more {
    background: linear-gradient(145deg, rgba(17, 24, 39, 0.92), rgba(47, 125, 91, 0.92));
    font-size:12px;
    opacity: 1;
}

.trust-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }

.trust-strip article {
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
    padding: 14px;
    text-align: center;
    box-shadow: 0 8px 22px rgba(17, 24, 34, 0.06);
}

.trust-strip strong { display: block; color: #80c34b; font-size: 30px; letter-spacing: -0.03em; }
.trust-strip span { color: #80c34b; font-size: 13px; }

.steps-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }

.step-card,
.bento,
.faq-item,
.final-cta,
.dj-card,
.testimonial {
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
    box-shadow: 0 8px 22px rgba(17, 24, 34, 0.06);
}

.step-card { padding: 14px; }

.step-num {
    display: inline-flex;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    color: #2f7d5b;
    background: #eef8f2;
    margin-bottom: 8px;
}

.step-card svg {
    width: 100%;
    height: 70px;
    fill: none;
    stroke: #80c34b;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 8px 18px rgba(128, 195, 75, 0.22));
}

.step-card h3 { margin: 6px 0; font-size: 20px; }

.step-card p,
.bento p,
.testimonial p { margin: 0; color: var(--muted); line-height: 1.63; }

.dj-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }

.dj-card { overflow: hidden; }
.dj-card img { width: 100%; height: 180px; object-fit: cover; display: block; }
.dj-card-body { padding: 12px; }
.dj-card-body h3 { margin: 0 0 6px; }
.dj-card-body p { margin: 0 0 4px; color: var(--muted); font-size: 14px; }

.dj-card-foot {
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 12px;
    color: #2f7d5b;
    background: #eef8f2;
    border: 1px solid #cde9dc;
}

.bento-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 10px; }
.bento { padding: 14px; }
.bento-lg { grid-row: span 2; background: linear-gradient(160deg, #fff 0%, #f3f4f6 100%); }
.bento h3 { margin: 0 0 6px; }
.bento ul { margin: 10px 0 0; padding-left: 18px; color: var(--muted); line-height: 1.6; }

.testimonials-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 10px; }
.testimonial header { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }

.avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(145deg, #e5e7eb, #cbd5e1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
    color: #374151;
}

.testimonial small { color: var(--muted); display: block; }
.rating { margin-left: auto; color: #4b5563; font-weight: 700; }
.testimonial-featured { background: linear-gradient(160deg, #fff, #f3f4f6); }

.faq-list { display: grid; gap: 8px; }
.faq-item { overflow: hidden; }

.faq-trigger {
    width: 100%;
    border: 0;
    border-radius: 0;
    background: transparent;
    min-height: 56px;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px;
    cursor: pointer;
    font: inherit;
    font-weight: 700;
}

.faq-icon { font-size: 24px; line-height: 1; color: #4b5563; }
.faq-panel { max-height: 0; overflow: hidden; transition: max-height var(--duration) ease; }
.faq-panel p { margin: 0; padding: 0 14px 14px; color: var(--muted); line-height: 1.66; }
.faq-panel.open { max-height: 220px; }

.final-cta {
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: linear-gradient(130deg, #4b5563, #374151);
    color: #fff;
    border-color: #4b5563;
}

.final-cta p { color: #e5e7eb; }

.dj-auth-page,
.dj-panel-page {
    min-height: 100vh;
    padding: 34px 20px;
    background:
        radial-gradient(circle at 18% 14%, rgba(128, 195, 75, 0.2), transparent 26%),
        radial-gradient(circle at 82% 18%, rgba(59, 130, 246, 0.12), transparent 24%),
        linear-gradient(180deg, #f9fafb 0%, #eef2f7 100%);
}

.dj-auth-card,
.dj-panel-shell {
    width: min(1180px, 100%);
    margin: 0 auto;
}

.dj-auth-card {
    width: min(760px, 100%);
    border: 1px solid rgba(255, 255, 255, 0.74);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 24px 70px rgba(17, 24, 39, 0.1);
    padding: 28px;
}

.dj-auth-card-narrow { width: min(520px, 100%); }

.dj-auth-card h1,
.dj-dashboard-hero h1 {
    margin: 8px 0 10px;
    font-size: clamp(36px, 6vw, 58px);
    letter-spacing: -0.04em;
}

.dj-auth-card p,
.dj-dashboard-hero p,
.dj-panel-card p {
    color: var(--muted);
    line-height: 1.64;
}

.dj-auth-form,
.dj-profile-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.dj-auth-form .full,
.dj-profile-form .full {
    grid-column: 1 / -1;
}

.check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
}

.check-row input {
    width: auto;
    min-height: auto;
}

.auth-switch {
    margin: 18px 0 0;
    text-align: center;
}

.auth-switch a {
    color: #2f7d5b;
    font-weight: 800;
}

.dj-panel-head,
.dj-dashboard-hero,
.dj-panel-card {
    border: 1px solid rgba(255, 255, 255, 0.74);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 24px 70px rgba(17, 24, 39, 0.1);
}

.dj-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-radius: 22px;
    padding: 12px 16px;
    margin-bottom: 14px;
}

.dj-dashboard-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    align-items: center;
    gap: 18px;
    border-radius: 26px;
    padding: 26px;
    margin: 14px 0;
}

.dj-public-card {
    border-radius: 22px;
    padding: 18px;
    background: linear-gradient(145deg, #111827, #2f7d5b);
    color: #fff;
    min-height: 220px;
    display: grid;
    align-content: end;
    gap: 6px;
    overflow: hidden;
    position: relative;
}

.dj-public-card::before {
    content: "";
    position: absolute;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    right: -52px;
    top: -58px;
    background:
        radial-gradient(circle at 28% 28%, rgba(255, 255, 255, 0.72), transparent 20%),
        radial-gradient(circle at 70% 35%, #93c5fd 0%, transparent 36%),
        radial-gradient(circle at 72% 74%, #80c34b 0%, transparent 42%),
        #2563eb;
    opacity: 0.9;
}

.dj-avatar-gradient {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
    background:
        radial-gradient(circle at 30% 24%, rgba(255, 255, 255, 0.8), transparent 22%),
        radial-gradient(circle at 75% 32%, #fda4af 0%, transparent 38%),
        radial-gradient(circle at 72% 76%, #93c5fd 0%, transparent 42%),
        #7c3aed;
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22);
    position: relative;
    z-index: 1;
}

.dj-public-card strong,
.dj-public-card span,
.dj-public-card small {
    position: relative;
    z-index: 1;
}

.dj-panel-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.9fr);
    gap: 14px;
    align-items: start;
}

.dj-panel-card {
    border-radius: 24px;
    padding: 22px;
}

.dj-panel-card h2 {
    margin: 0 0 8px;
    font-size: 28px;
    letter-spacing: -0.03em;
}

.dj-offers-list {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.dj-offer-item {
    display: grid;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    padding: 14px;
}

.dj-offer-item strong,
.dj-offer-item span,
.dj-offer-item small {
    display: block;
}

.dj-offer-item span,
.dj-offer-item small {
    color: var(--muted);
    margin-top: 4px;
}

.dj-offer-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.offers-page {
    min-height: 100vh;
    padding: 34px 20px;
    background:
        radial-gradient(circle at 18% 14%, rgba(128, 195, 75, 0.18), transparent 26%),
        radial-gradient(circle at 82% 20%, rgba(59, 130, 246, 0.12), transparent 24%),
        linear-gradient(180deg, #f9fafb 0%, #eef2f7 100%);
}

.offers-shell {
    width: min(1040px, 100%);
    margin: 0 auto;
}

.offers-verify-shell {
    width: min(640px, 100%);
}

.offers-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 22px;
}

.offer-status-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 8px 12px;
    color: #2f7d5b;
    background: #eef8f2;
    border: 1px solid #cde9dc;
    font-size: 13px;
    font-weight: 800;
}

.offers-hero,
.verify-card,
.client-offer-card,
.client-offer-empty {
    border: 1px solid rgba(255, 255, 255, 0.74);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 24px 70px rgba(17, 24, 39, 0.1);
}

.offers-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 26px;
    margin-bottom: 14px;
}

.offers-hero h1,
.verify-card h1 {
    margin: 4px 0 10px;
    font-size: clamp(34px, 6vw, 54px);
    letter-spacing: -0.04em;
}

.offers-hero p,
.verify-card p,
.client-offer-card p,
.client-offer-empty p {
    color: var(--muted);
    line-height: 1.64;
}

.offers-summary {
    min-width: 190px;
    border-radius: 18px;
    padding: 16px;
    background: #eef8f2;
    color: #2f7d5b;
}

.offers-summary strong,
.offers-summary span {
    display: block;
}

.offers-list {
    display: grid;
    gap: 12px;
}

.client-offer-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px;
}

.client-offer-card h2,
.client-offer-empty h2 {
    margin: 0 0 8px;
}

.client-offer-price {
    text-align: right;
}

.client-offer-price strong {
    display: block;
    font-size: 28px;
    color: #2f7d5b;
}

.client-offer-price span {
    color: var(--muted);
    font-size: 13px;
}

.client-offer-empty,
.verify-card {
    padding: 28px;
    text-align: center;
}

.success-icon {
    width: 58px;
    height: 58px;
    margin: 0 auto 12px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    background: #eef8f2;
    color: #2f7d5b;
    box-shadow: 0 16px 36px rgba(128, 195, 75, 0.18);
}

.success-icon svg {
    width: 30px;
    height: 30px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.verify-form {
    display: grid;
    gap: 10px;
    margin: 18px 0 10px;
    text-align: left;
}

.verify-form label {
    font-size: 13px;
    font-weight: 800;
    color: #374151;
}

.verify-form input {
    text-align: center;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: 0.16em;
}

@media (max-width: 1220px) {
    .hero-layout,
    .footer-grid,
    .wizard-layout-final,
    .trust-strip,
    .steps-grid,
    .dj-grid,
    .bento-grid,
    .testimonials-grid,
    .select-cards { grid-template-columns: 1fr 1fr; }

    .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bento-lg { grid-row: auto; }
}

@media (max-width: 900px) {
    .hero-layout,
    .trust-strip,
    .steps-grid,
    .dj-grid,
    .bento-grid,
    .testimonials-grid,
    .wizard-grid,
    .wizard-layout-final,
    .select-cards,
    .footer-grid { grid-template-columns: 1fr; }

    .hero-side,
    .hero-copy,
    .step-card,
    .bento,
    .final-cta,
    .wizard { border-radius: 18px; }

    .hero { margin-top: 16px; }
    h1 { font-size: clamp(42px, 12vw, 52px); }

    .hero-layout {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .hero-copy,
    .hero-side {
        min-width: 0;
        width: 100%;
        min-height: auto;
    }

    .quote-card,
    .quote-top,
    .quote-controls,
    .quick-radio-group,
    .quick-field {
        min-width: 0;
        width: 100%;
    }

    .quote-top {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .quick-radio-group {
        grid-template-columns: 1fr;
    }

    .dj-auth-form,
    .dj-profile-form,
    .dj-dashboard-hero,
    .dj-panel-grid,
    .dj-offer-actions {
        grid-template-columns: 1fr;
    }

    .offers-hero,
    .client-offer-card {
        grid-template-columns: 1fr;
        display: grid;
    }

    .offers-summary,
    .client-offer-price {
        width: 100%;
        text-align: left;
    }

    .success-modal-card,
    .verify-card,
    .offers-hero,
    .client-offer-card,
    .client-offer-empty {
        border-radius: 18px;
    }
}

/* Homepage cascade guard — intentionally last. */
body .home-hero .hero-layout { grid-template-columns:.94fr 1.06fr; align-items:center; gap:64px; }
body .home-hero .hero-copy { min-height:0; padding:26px 0 0; border:0; border-radius:0; background:transparent; box-shadow:none; }
body .home-hero .hero-copy::before, body .home-hero .hero-copy::after { display:none; }
body .home-hero .hero-copy h1 { max-width:none; margin:23px 0 22px; color:var(--ink); font-size:clamp(50px,5.15vw,74px); line-height:.98; letter-spacing:-.065em; }
body .home-hero .hero-copy > p { max-width:530px; margin:0 0 28px; color:#506158; font-size:17px; line-height:1.75; }
body .home-hero .hero-actions { margin:0; }
body .final-cta { min-height:310px; margin-top:110px; padding:58px 64px; display:flex; justify-content:space-between; align-items:center; gap:30px; border:0; border-radius:32px; background:linear-gradient(125deg,#0d3526,#174c35); color:#fff; box-shadow:none; }
body .final-cta h2 { margin:10px 0 12px; color:#fff; font-size:clamp(34px,4vw,50px); line-height:1.08; }
body .final-cta p { color:#acbeb4; }
@media (max-width:900px) {
    body .home-hero .hero-layout { grid-template-columns:1fr; gap:35px; }
    body .home-hero .hero-copy { text-align:center; width:100%; }
    body .home-hero .hero-copy > p { margin-left:auto; margin-right:auto; }
}
@media (max-width:620px) {
    body .home-hero .hero-copy h1 { font-size:44px; }
    body .home-hero .hero-copy > p { font-size:14px; }
    body .final-cta { min-height:0; margin-top:80px; padding:42px 26px; display:block; border-radius:28px; text-align:center; }
}

/* Animated music ambience in the homepage hero. */
.hero-ambient {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}
.home-hero .hero-layout { z-index: 2; }
.ambient-rings {
    position: absolute;
    width: 580px;
    height: 580px;
    right: -155px;
    top: 65px;
    animation: ambient-drift 14s ease-in-out infinite alternate;
}
.ambient-rings i {
    position: absolute;
    inset: calc(var(--ring, 0) * 58px);
    border: 1px solid rgba(91, 170, 48, .14);
    border-radius: 50%;
}
.ambient-rings i:nth-child(1) { --ring: 0; }
.ambient-rings i:nth-child(2) { --ring: 1; border-style: dashed; animation: ambient-spin 28s linear infinite; }
.ambient-rings i:nth-child(3) { --ring: 2; border-color: rgba(124, 206, 70, .22); }
.ambient-wave {
    position: absolute;
    left: -10%;
    width: 120%;
    height: 150px;
    opacity: .38;
    background-repeat: repeat-x;
    background-size: 720px 150px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
}
.ambient-wave-one {
    bottom: 78px;
    background-image: url("data:image/svg+xml,%3Csvg width='720' height='150' viewBox='0 0 720 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 78 C70 20 130 136 205 78 S340 20 415 78 S550 136 625 78 S690 28 720 65' fill='none' stroke='%237bcf3b' stroke-opacity='.26' stroke-width='2'/%3E%3C/svg%3E");
    animation: ambient-wave-move 22s linear infinite;
}
.ambient-wave-two {
    bottom: 40px;
    background-image: url("data:image/svg+xml,%3Csvg width='720' height='150' viewBox='0 0 720 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 82 C95 138 145 22 235 82 S380 138 470 82 S620 22 720 82' fill='none' stroke='%230c2f22' stroke-opacity='.11' stroke-width='1.5'/%3E%3C/svg%3E");
    animation: ambient-wave-move-reverse 30s linear infinite;
}
.ambient-equalizer {
    position: absolute;
    left: 4%;
    bottom: 56px;
    display: flex;
    align-items: center;
    gap: 7px;
    height: 70px;
    opacity: .17;
    transform: rotate(-4deg);
}
.ambient-equalizer i {
    width: 3px;
    height: var(--level);
    border-radius: 4px;
    background: linear-gradient(180deg, #74c63e, #347e51);
    transform-origin: center;
    animation: ambient-bar 1.8s ease-in-out infinite alternate;
    animation-delay: calc(var(--n) * -85ms);
}
.ambient-spark {
    position: absolute;
    color: rgba(73, 146, 37, .35);
    animation: ambient-spark 5s ease-in-out infinite;
}
.spark-one { top: 22%; left: 7%; font-size: 18px; }
.spark-two { top: 29%; right: 8%; font-size: 25px; animation-delay: -1.8s; }
.spark-three { top: 62%; right: 3%; font-size: 34px; animation-delay: -3.2s; }

@keyframes ambient-drift {
    from { transform: translate3d(0, -10px, 0) scale(.98); }
    to { transform: translate3d(-32px, 25px, 0) scale(1.04); }
}
@keyframes ambient-spin { to { transform: rotate(360deg); } }
@keyframes ambient-wave-move {
    from { background-position-x: 0; }
    to { background-position-x: 720px; }
}
@keyframes ambient-wave-move-reverse {
    from { background-position-x: 720px; }
    to { background-position-x: 0; }
}
@keyframes ambient-bar {
    0% { transform: scaleY(.32); opacity: .45; }
    55% { transform: scaleY(1); opacity: 1; }
    100% { transform: scaleY(.58); opacity: .7; }
}
@keyframes ambient-spark {
    0%, 100% { transform: translateY(0) rotate(0); opacity: .2; }
    50% { transform: translateY(-18px) rotate(35deg); opacity: .65; }
}

@media (max-width: 620px) {
    .ambient-rings { width: 380px; height: 380px; right: -210px; top: 110px; }
    .ambient-wave { opacity: .24; }
    .ambient-equalizer { left: -20px; bottom: 35px; transform: scale(.72) rotate(-4deg); }
}
@media (prefers-reduced-motion: reduce) {
    .ambient-rings,
    .ambient-rings i,
    .ambient-wave,
    .ambient-equalizer i,
    .ambient-spark { animation: none !important; }
}

/* Local hero image positioning. */
.home-hero .hero-photo {
    background: linear-gradient(145deg, #dff2d3, #b8dcaa);
}
.home-hero .hero-photo img {
    object-position: 50% 50%;
    transform: none;
}
.home-hero .hero-photo img[alt] {
    color: transparent;
    font-size: 0;
}
.home-hero .photo-pill {
    top: 36px;
    left: 76px;
    max-width: calc(100% - 110px);
    white-space: nowrap;
}
@media (max-width: 620px) {
    .home-hero .photo-pill {
        top: 28px;
        left: 44px;
        max-width: calc(100% - 70px);
    }
}

/* Merge the navbar strip visually with the hero background. */
body .topbar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 18px 0 14px;
    background: transparent;
    border: 0;
    box-shadow: none;
}
body .topbar::after {
    display: none;
}
body .topbar-inner {
    position: relative;
    z-index: 2;
}

/* Hero DJ carousel and animated live metrics. */
.hero-photo img,
.match-card {
    transition: opacity .42s ease, transform .55s cubic-bezier(.22, 1, .36, 1), filter .42s ease;
}
.hero-visual.is-switching .hero-photo img {
    opacity: 0;
    transform: scale(1.045);
    filter: blur(5px);
}
.hero-visual.is-switching .match-card {
    opacity: 0;
    transform: translateY(14px) scale(.975);
}
.match-card-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.hero-carousel-dots {
    display: flex;
    align-items: center;
    gap: 5px;
}
.hero-carousel-dots button {
    width: 5px;
    height: 5px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #cbd7cd;
    cursor: pointer;
    transition: width .25s ease, background .25s ease;
}
.hero-carousel-dots button.active {
    width: 17px;
    background: #71c43d;
}
.floating-note-price {
    animation: metric-float-price 4.4s ease-in-out infinite, metric-glow 3.2s ease-in-out infinite;
}
.floating-note-fast {
    animation: metric-float-fast 4.8s ease-in-out infinite .6s, metric-glow 3.5s ease-in-out infinite 1s;
}
.floating-note strong span,
.floating-note-price strong {
    display: inline-block;
    transition: opacity .32s ease, transform .32s ease;
}
.hero-visual.is-switching .floating-note strong span,
.hero-visual.is-switching .floating-note-price strong {
    opacity: 0;
    transform: translateY(-7px);
}
@keyframes metric-float-price {
    0%, 100% { transform: rotate(3deg) translateY(0); }
    50% { transform: rotate(1.5deg) translateY(-9px); }
}
@keyframes metric-float-fast {
    0%, 100% { transform: rotate(-3deg) translateY(0); }
    50% { transform: rotate(-1.5deg) translateY(8px); }
}
@keyframes metric-glow {
    0%, 100% { box-shadow: 0 16px 35px rgba(16,54,37,.15); }
    50% { box-shadow: 0 20px 44px rgba(91,176,47,.28); }
}
@media (prefers-reduced-motion: reduce) {
    .hero-photo img,
    .match-card,
    .floating-note-price,
    .floating-note-fast { animation: none !important; transition: none !important; }
}
.artist-profile-link {
    display: flex;
    justify-content: space-between;
    margin: -5px 18px 17px;
    padding-top: 13px;
    border-top: 1px solid #e5ece4;
    color: #4c982c;
    font-size:12px;
    font-weight: 800;
    text-decoration: none;
}

/* Wide production logo. */
img.brand-logo {
    width: 170px;
    height: auto;
    max-height: 42px;
    object-fit: contain;
}
@media (max-width: 620px) {
    img.brand-logo { width: 142px; max-height: 36px; }
}

.login-icon-button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border: 1px solid #d9e4d8;
    border-radius: 11px;
    background: #fff;
    color: #415249;
    font-size:12px;
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.login-icon-button svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}
.login-icon-button:hover {
    transform: translateY(-2px);
    border-color: #83c95a;
    box-shadow: 0 8px 20px rgba(50, 111, 59, .1);
}
@media (max-width: 760px) {
    .login-icon-button {
        width: 42px;
        padding: 0;
        justify-content: center;
        border-radius: 12px;
    }
    .login-icon-button span { display: none; }
}
.field-hint-placeholder{visibility:hidden}.wizard-choice-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.visual-wizard-card{min-height:82px;padding:9px;flex-direction:column;gap:5px}.visual-wizard-card>i{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;color:#277051;background:#edf5f0;font-size:16px;font-style:normal}.visual-wizard-card>span{font-size:12px;line-height:1.15}.visual-wizard-card>em{position:absolute;right:7px;top:7px;width:17px;height:17px;border-radius:50%;display:none;place-items:center;color:#fff;background:#72bd48;font-size:12px;font-style:normal}.visual-wizard-card:has(input:checked)>i{color:#fff;background:#17654f}.visual-wizard-card:has(input:checked)>em{display:grid}.genre-wizard-grid .visual-wizard-card{min-height:74px}.wizard-step .field>label>small{color:var(--muted);font-size:12px;font-weight:500}@media(max-width:900px){.wizard-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:560px){.wizard-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-wizard-card{min-height:72px}}
.wizard-overlay{background:rgba(4,25,18,.76);backdrop-filter:blur(10px)}.wizard{position:relative;isolation:isolate;padding:24px;border:1px solid rgba(119,184,83,.28);background:radial-gradient(circle at 92% 5%,rgba(151,225,99,.2),transparent 28%),radial-gradient(circle at 5% 92%,rgba(52,129,93,.12),transparent 30%),linear-gradient(145deg,#fff 0%,#f8fbf6 55%,#f1f8ed 100%);box-shadow:0 34px 100px rgba(2,35,24,.38)}.wizard:before,.wizard:after{content:"";position:absolute;z-index:-1;border:1px solid rgba(95,177,58,.13);border-radius:50%;pointer-events:none}.wizard:before{width:330px;height:330px;right:-180px;top:-185px;box-shadow:0 0 0 38px rgba(95,177,58,.045),0 0 0 78px rgba(95,177,58,.025)}.wizard:after{width:190px;height:190px;left:-115px;bottom:-115px;box-shadow:0 0 0 28px rgba(17,94,69,.035)}.wizard-head{padding-bottom:15px;border-bottom:1px solid rgba(33,92,67,.1)}.wizard-head h2{font-size:27px;letter-spacing:-.04em}.wizard-head h2:before{content:"ZNAJDŹ IDEALNEGO DJ-A";display:block;margin-bottom:4px;color:#62a93d;font-size:12px;font-weight:900;letter-spacing:.15em}.wizard-head .btn{border-color:#cddbd1;background:rgba(255,255,255,.68);backdrop-filter:blur(8px)}.wizard-progress{height:7px;margin:16px 0 7px;background:rgba(18,69,51,.08);box-shadow:inset 0 1px 2px rgba(0,0,0,.05)}.wizard-progress span{position:relative;background:linear-gradient(90deg,#0f614b,#83d44b);box-shadow:0 0 18px rgba(112,199,66,.38)}.wizard-progress span:after{content:"";position:absolute;right:0;top:50%;width:13px;height:13px;border:3px solid #fff;border-radius:50%;background:#82d34a;box-shadow:0 2px 9px rgba(46,119,34,.35);transform:translate(50%,-50%)}.wizard-step-label{margin-bottom:14px;color:#668073;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.wizard-step.active{animation:wizard-step-enter .35s ease both}.wizard-step h3{margin-bottom:15px;font-size:26px;letter-spacing:-.04em}.wizard-step h3:after{content:"";width:34px;height:3px;margin-top:8px;border-radius:4px;display:block;background:linear-gradient(90deg,#0e634c,#8bd752)}@keyframes wizard-step-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.visual-wizard-card{border-color:rgba(35,95,68,.13);background:rgba(255,255,255,.82);box-shadow:0 7px 18px rgba(8,55,38,.045);backdrop-filter:blur(6px);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease}.visual-wizard-card:nth-child(3n+2){background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(238,248,232,.82))}.visual-wizard-card:hover{z-index:2;border-color:#8acb61;box-shadow:0 12px 28px rgba(43,111,65,.12);transform:translateY(-3px)}.visual-wizard-card>i{box-shadow:inset 0 0 0 1px rgba(36,100,73,.05);transition:.25s}.visual-wizard-card:has(input:checked){background:linear-gradient(145deg,#f5fcec,#e8f6df);box-shadow:0 0 0 1px #6fba48 inset,0 13px 30px rgba(75,143,51,.14)}.visual-wizard-card:has(input:checked)>i{box-shadow:0 7px 15px rgba(16,101,76,.22);transform:scale(1.06)}.wizard-grid>.field{padding:13px;border:1px solid rgba(37,95,70,.1);border-radius:13px;background:rgba(255,255,255,.7);box-shadow:0 5px 15px rgba(11,62,43,.025)}.wizard-grid>.field.full.radius-field,.wizard-grid>.field.full:has(.radius-map){padding:0;border:0;background:transparent;box-shadow:none}.wizard-grid .field>label{color:#183b2e;font-size:12px;font-weight:800}.wizard-grid .field>input,.wizard-grid .field>select{min-height:48px;border-color:#d2dfd5;border-radius:11px;background:#fff;transition:.2s}.wizard-grid .field>input:focus,.wizard-grid .field>select:focus{border-color:#77bd51;box-shadow:0 0 0 4px rgba(125,204,74,.13)}.radius-options label span{box-shadow:0 4px 10px rgba(11,61,42,.04)}.wizard-summary{padding:19px;border-color:#cbdcca;background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(237,247,231,.92));box-shadow:0 14px 34px rgba(14,69,46,.09)}.wizard-summary h4{font-size:17px}.wizard-summary>p{padding:13px;border-radius:11px;background:#0d513e;color:rgba(255,255,255,.7)}.wizard-summary>p strong{display:block;margin-top:4px;color:#a8ed78;font-size:23px}.wizard-summary li{padding:9px 0;border-bottom:1px solid rgba(28,84,60,.09);font-size:12px}.wizard-actions{margin-top:19px;padding-top:15px;border-top:1px solid rgba(29,85,61,.1)}.wizard-actions .btn{min-width:125px;min-height:45px;border-radius:11px}.wizard-actions .btn-primary{box-shadow:0 10px 25px rgba(84,158,47,.22)}@media(max-width:600px){.wizard{padding:16px}.wizard-head h2{font-size:22px}.wizard-step h3{font-size:22px}.wizard:before{opacity:.55}.wizard-grid>.field{padding:10px}}
.wizard{overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.wizard::-webkit-scrollbar{display:none;width:0;height:0}.wizard-overlay{overflow:hidden}
.wizard-overlay{background:rgba(2,24,17,.86);backdrop-filter:blur(12px)}.wizard{border-color:rgba(145,219,91,.18);color:#f7fbf8;background:radial-gradient(circle at 88% 8%,rgba(130,211,74,.13),transparent 27%),radial-gradient(circle at 5% 95%,rgba(66,143,103,.16),transparent 30%),linear-gradient(145deg,#073425,#0a402e 58%,#073526);box-shadow:0 38px 110px rgba(0,15,10,.58)}.wizard:before,.wizard:after{border-color:rgba(143,218,88,.12)}.wizard-head{border-color:rgba(255,255,255,.1)}.wizard-head h2{color:#fff}.wizard-head h2:before{color:#8cdc55}.wizard-head .btn{border-color:rgba(255,255,255,.18);color:#fff;background:rgba(255,255,255,.07)}.wizard-head .btn:hover{border-color:#8bd753;color:#c7f5a6;background:rgba(139,215,83,.1)}.wizard-progress{background:rgba(255,255,255,.1)}.wizard-progress span{background:linear-gradient(90deg,#65b83d,#9bea60);box-shadow:0 0 22px rgba(135,223,79,.4)}.wizard-step-label{color:rgba(210,229,217,.6)}.wizard-step h3{color:#fff}.wizard-step h3:after{background:linear-gradient(90deg,#8fe158,rgba(143,225,88,0))}.visual-wizard-card,.visual-wizard-card:nth-child(3n+2){border-color:rgba(177,220,188,.16);color:#f5faf6;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 10px 24px rgba(0,20,13,.12);backdrop-filter:blur(8px)}.visual-wizard-card:hover{border-color:rgba(151,224,98,.62);background:linear-gradient(145deg,rgba(141,215,87,.14),rgba(255,255,255,.045));box-shadow:0 14px 32px rgba(0,22,14,.22)}.visual-wizard-card>i{color:#96e45e;background:rgba(133,211,78,.09);box-shadow:inset 0 0 0 1px rgba(143,221,86,.32)}.visual-wizard-card>span{color:#fff}.visual-wizard-card:has(input:checked){border-color:#8bd853;color:#fff;background:linear-gradient(145deg,rgba(129,208,74,.23),rgba(58,128,84,.14));box-shadow:0 0 0 1px rgba(142,222,86,.38) inset,0 15px 34px rgba(0,19,12,.25)}.visual-wizard-card:has(input:checked)>i{color:#123a20;background:#99e65f}.visual-wizard-card:has(input:checked)>em{color:#123a20;background:#9be862}.wizard-grid>.field{border-color:rgba(181,220,190,.13);background:rgba(255,255,255,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 8px 20px rgba(0,22,14,.1)}.wizard-grid .field>label{color:#f3f8f4}.wizard-grid .field>label>small,.wizard .field-hint{color:rgba(207,225,213,.58)}.wizard .field-hint.resolved{color:#9ce66a}.wizard-grid .field>input,.wizard-grid .field>select{border-color:rgba(255,255,255,.15);color:#173b2e;background:#f8fbf8;box-shadow:0 7px 18px rgba(0,19,12,.1)}.wizard-grid .field>input::placeholder{color:#87988f}.wizard-grid .field>input:focus,.wizard-grid .field>select:focus{border-color:#94dc61;box-shadow:0 0 0 4px rgba(144,220,93,.18),0 8px 20px rgba(0,18,11,.15)}.radius-field>label{color:#fff!important}.radius-field>small{color:rgba(209,228,216,.58)!important}.radius-options label span{border-color:rgba(179,220,189,.17);color:#e9f2ec;background:rgba(255,255,255,.065);box-shadow:none}.radius-options label input:checked+span{border-color:#92dc5c;color:#12391d;background:#9ae463;box-shadow:0 8px 20px rgba(114,207,61,.2)}.radius-map{border-color:rgba(169,217,181,.19);background:#163d2f}.wizard-summary{border-color:rgba(167,218,178,.18);color:#fff;background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 16px 38px rgba(0,20,13,.2)}.wizard-summary h4{color:#fff}.wizard-summary>p{color:rgba(228,240,232,.7);background:rgba(2,34,23,.42)}.wizard-summary>p strong{color:#9ce762}.wizard-summary ul{color:rgba(216,231,221,.62)}.wizard-summary li{border-color:rgba(255,255,255,.09)}.wizard-summary strong{color:#fff}.wizard-summary .summary-dj-count{border-color:rgba(143,218,90,.25);background:rgba(132,211,75,.11)}.wizard-summary .summary-dj-count strong{color:#173a21;background:#9ae365}.wizard-summary small{color:rgba(209,226,215,.52)}.terms-check{color:rgba(230,240,233,.8)}.wizard-actions{border-color:rgba(255,255,255,.1)}.wizard-actions .btn-ghost{border-color:rgba(255,255,255,.17);color:#fff;background:rgba(255,255,255,.055)}.wizard-actions .btn-primary{border-color:#97e15e;color:#173c20;background:linear-gradient(135deg,#a4ed6b,#80d044);box-shadow:0 12px 28px rgba(106,198,57,.27)}.wizard-actions .btn-primary:hover{background:linear-gradient(135deg,#b2f47e,#8cdc52);transform:translateY(-1px)}.wizard .radius-place-label{border-color:rgba(143,218,89,.22);color:#fff;background:rgba(7,57,40,.88)}.wizard .radius-place-label small{color:rgba(222,237,227,.6)}.wizard .radius-visual-area{border-color:#9be465;color:#123a20;background:rgba(157,229,103,.86)}@media(max-width:600px){.wizard{background:radial-gradient(circle at 90% 4%,rgba(130,211,74,.12),transparent 22%),linear-gradient(160deg,#073526,#0a402e)}}
.wizard-overlay{background:rgba(16,20,19,.76)}.wizard{border-color:rgba(255,255,255,.14);background:radial-gradient(circle at 88% 6%,rgba(150,220,96,.08),transparent 26%),radial-gradient(circle at 4% 96%,rgba(255,255,255,.045),transparent 28%),linear-gradient(145deg,#17201d,#1c2723 58%,#151e1b)}.wizard:before,.wizard:after{border-color:rgba(255,255,255,.07);box-shadow:none}.visual-wizard-card,.visual-wizard-card:nth-child(3n+2){border-color:rgba(255,255,255,.13);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.045))}.visual-wizard-card:hover{border-color:rgba(174,220,140,.45);background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.065))}.visual-wizard-card>i{color:#b0dc91;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}.visual-wizard-card:has(input:checked){border-color:#92ce69;background:linear-gradient(145deg,rgba(143,205,99,.18),rgba(255,255,255,.07))}.wizard-grid>.field{border-color:rgba(255,255,255,.11);background:rgba(255,255,255,.055)}.radius-options label span{border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.065)}.wizard-summary{border-color:rgba(255,255,255,.13);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.045))}.wizard-summary>p{background:rgba(0,0,0,.2)}.wizard-summary .summary-dj-count{border-color:rgba(151,209,108,.22);background:rgba(151,209,108,.09)}.wizard .radius-place-label{background:rgba(22,29,26,.9)}.wizard .radius-map{background:#252d2a}@media(max-width:600px){.wizard{background:radial-gradient(circle at 90% 4%,rgba(150,220,96,.07),transparent 22%),linear-gradient(160deg,#17201d,#1c2723)}}
.wizard-overlay{background:rgba(26,35,31,.58);backdrop-filter:blur(11px)}.wizard{border-color:#dce7de;color:#153126;background:radial-gradient(circle at 90% 5%,rgba(149,218,98,.15),transparent 27%),radial-gradient(circle at 4% 96%,rgba(61,137,98,.08),transparent 29%),linear-gradient(145deg,#ffffff,#f7faf6 58%,#eef6eb);box-shadow:0 38px 100px rgba(16,48,35,.24)}.wizard:before,.wizard:after{border-color:rgba(67,133,88,.1)}.wizard-head{border-color:#e1e9e2}.wizard-head h2,.wizard-step h3{color:#122d22}.wizard-head .btn{border-color:#d5dfd7;color:#29473b;background:rgba(255,255,255,.82)}.wizard-head .btn:hover{border-color:#8bc664;color:#2c6e32;background:#f2faed}.wizard-progress{background:#e5ece6}.wizard-step-label{color:#72847b}.visual-wizard-card,.visual-wizard-card:nth-child(3n+2){border-color:#dce6de;color:#173126;background:linear-gradient(145deg,#fff,#f7faf7);box-shadow:0 8px 20px rgba(25,67,48,.055)}.visual-wizard-card:hover{border-color:#9bcf78;background:linear-gradient(145deg,#fff,#f1f8ed);box-shadow:0 13px 28px rgba(46,101,58,.1)}.visual-wizard-card>i{color:#34784a;background:#edf6eb;box-shadow:inset 0 0 0 1px #dcebd8}.visual-wizard-card>span{color:#173126}.visual-wizard-card:has(input:checked){border-color:#80bd58;color:#19411f;background:linear-gradient(145deg,#f7fced,#eaf6e3);box-shadow:0 0 0 1px rgba(113,178,70,.35) inset,0 13px 28px rgba(74,134,55,.11)}.wizard-grid>.field{border-color:#dde7df;background:rgba(255,255,255,.82);box-shadow:0 7px 17px rgba(24,65,47,.04)}.wizard-grid .field>label,.radius-field>label{color:#193629!important}.wizard-grid .field>label>small,.wizard .field-hint,.radius-field>small{color:#7c8d84!important}.wizard .field-hint.resolved{color:#43833e!important}.wizard-grid .field>input,.wizard-grid .field>select{border-color:#d4dfd6;color:#17372b;background:#fff;box-shadow:0 5px 14px rgba(22,60,44,.045)}.radius-options label span{border-color:#d9e4db;color:#3f594d;background:#fff;box-shadow:0 5px 13px rgba(23,62,45,.04)}.radius-map{border-color:#d8e4d9;background:#eef3ee}.wizard-summary{border-color:#d4e2d4;color:#19372a;background:linear-gradient(145deg,#fff,#eff7eb);box-shadow:0 14px 32px rgba(27,72,49,.09)}.wizard-summary h4{color:#173426}.wizard-summary>p{color:#6f8378;background:#f5f9f3}.wizard-summary ul{color:#718278}.wizard-summary li{border-color:#e0e8e1}.wizard-summary strong{color:#173427}.wizard-summary .summary-dj-count{border-color:#cfe4c4;background:#eef8e8}.wizard-summary small{color:#7b8c82}.terms-check{color:#54675d}.wizard-actions{border-color:#e0e8e1}.wizard-actions .btn-ghost{border-color:#d5dfd7;color:#345044;background:#fff}.wizard .radius-place-label{border-color:#d9e5da;color:#18382a;background:rgba(255,255,255,.94)}.wizard .radius-place-label small{color:#71857a}.wizard .radius-visual-area{border-color:#7dbe54;color:#173a20;background:rgba(164,229,112,.9)}@media(max-width:600px){.wizard{background:radial-gradient(circle at 90% 4%,rgba(151,218,101,.13),transparent 22%),linear-gradient(160deg,#fff,#f0f7ed)}}
.event-type-wizard-grid .visual-wizard-card{min-height:82px;padding:14px 24px;align-items:center;justify-content:center;text-align:center}
.event-type-wizard-grid .visual-wizard-card>span{font-size:17px;font-weight:900;line-height:1.15;letter-spacing:.04em;text-transform:uppercase}
@media(max-width:560px){.event-type-wizard-grid .visual-wizard-card{min-height:76px;padding:12px 22px}.event-type-wizard-grid .visual-wizard-card>span{font-size:15px}}
.guest-count-card{position:relative;overflow:hidden;padding:24px;border:1px solid #dbe7dc;border-radius:22px;background:linear-gradient(145deg,#fff,#f3f8f1);box-shadow:0 18px 45px rgba(23,68,46,.09)}.guest-count-card:after{content:"";position:absolute;right:-95px;top:-110px;width:250px;height:250px;border:1px solid rgba(111,183,68,.16);border-radius:50%;box-shadow:0 0 0 38px rgba(111,183,68,.045),0 0 0 76px rgba(111,183,68,.025);pointer-events:none}.guest-count-heading{position:relative;z-index:1;display:flex;align-items:center;gap:13px}.guest-count-heading>span{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;color:#2b763d;background:#eaf5e6;font-size:23px;box-shadow:inset 0 0 0 1px #d7ead0}.guest-count-heading div{display:grid;gap:3px}.guest-count-heading strong{color:#153428;font-size:15px}.guest-count-heading small{color:#71847a;font-size:12px}.guest-count-value{position:relative;z-index:1;margin:27px 0 18px;display:flex;align-items:baseline;gap:9px}.guest-count-value output{color:#15392a;font-size:58px;font-weight:800;line-height:.85;letter-spacing:-.065em}.guest-count-value span{color:#5fa73d;font-size:17px;font-weight:800}.guest-count-range{--guest-progress:20%;position:relative;z-index:1;width:100%;height:9px;margin:8px 0;appearance:none;border:0;border-radius:10px;background:linear-gradient(90deg,#76c548 var(--guest-progress),#dfe8e0 var(--guest-progress));cursor:pointer}.guest-count-range::-webkit-slider-thumb{width:25px;height:25px;appearance:none;border:5px solid #fff;border-radius:50%;background:#65b83e;box-shadow:0 3px 12px rgba(54,127,49,.35)}.guest-count-range::-moz-range-thumb{width:16px;height:16px;border:5px solid #fff;border-radius:50%;background:#65b83e;box-shadow:0 3px 12px rgba(54,127,49,.35)}.guest-count-scale{display:flex;justify-content:space-between;color:#87968e;font-size:12px}.guest-count-manual{position:relative;z-index:1;margin-top:23px;padding-top:18px;border-top:1px solid #e0e9e1;display:flex;align-items:center;justify-content:space-between;gap:18px;color:#294639;font-size:12px;font-weight:800}.guest-count-input{min-width:145px;display:flex;align-items:center;border:1px solid #d5e1d6;border-radius:12px;background:#fff;box-shadow:0 5px 14px rgba(22,60,44,.045)}.guest-count-input input{width:100%;min-height:46px;padding:0 4px 0 15px;border:0;outline:0;color:#17372b;background:transparent;font-size:16px;font-weight:800}.guest-count-input small{padding-right:14px;color:#789087;font-size:12px}.guest-count-presets{position:relative;z-index:1;margin-top:14px;display:flex;flex-wrap:wrap;gap:7px}.guest-count-presets button{min-width:54px;padding:7px 11px;border:1px solid #d9e4da;border-radius:999px;color:#486055;background:#fff;font-size:12px;font-weight:800;cursor:pointer;transition:.2s}.guest-count-presets button:hover,.guest-count-presets button.active{border-color:#82c35b;color:#285f31;background:#edf7e8;transform:translateY(-1px)}@media(max-width:600px){.guest-count-card{padding:18px}.guest-count-heading{align-items:flex-start}.guest-count-heading small{line-height:1.45}.guest-count-value output{font-size:48px}.guest-count-manual{align-items:flex-start;flex-direction:column}.guest-count-input{width:100%}}
.dj-join-button{min-height:42px;padding:9px 15px!important;border:1px solid #b9d8ad!important;color:#245e32!important;background:linear-gradient(135deg,#f5fbf1,#e8f6e1)!important;box-shadow:0 7px 18px rgba(70,132,54,.09);white-space:nowrap}.dj-join-button:hover{border-color:#80be5a!important;background:linear-gradient(135deg,#f9fff5,#ddf2d3)!important;box-shadow:0 10px 23px rgba(70,132,54,.15);transform:translateY(-1px)}.dj-join-icon{width:23px;height:23px;display:inline-grid;place-items:center;border-radius:7px;color:#fff;background:#397d49;font-size:12px}.hero-dj-path{width:max-content;max-width:100%;margin-top:12px;padding:8px 12px 8px 9px;border:1px solid rgba(92,146,80,.16);border-radius:12px;display:flex;align-items:center;gap:8px;color:#607268;background:rgba(255,255,255,.57);font-size:12px;box-shadow:0 7px 20px rgba(32,78,51,.045);backdrop-filter:blur(8px)}.hero-dj-path-icon{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;color:#2f7540;background:#e8f4e4;font-size:12px}.hero-dj-path a{color:#337b38;font-weight:900;text-decoration:none}.hero-dj-path a:hover{text-decoration:underline}.hero-dj-path b{display:inline-block;margin-left:2px;transition:transform .2s}.hero-dj-path a:hover b{transform:translateX(3px)}.mobile-dj-join{padding:12px 14px!important;border:1px solid #bddaaf;border-radius:11px;color:#2c6937!important;background:#edf8e8;font-weight:900!important}@media(max-width:1000px){.dj-join-button{display:none}}@media(max-width:760px){.hero-dj-path{width:100%;justify-content:center;flex-wrap:wrap;text-align:center}.hero-dj-path>span:not(.hero-dj-path-icon){width:calc(100% - 38px);text-align:left}.hero-dj-path a{margin-left:34px}}
.benefits-wrap .benefit-wide .btn-primary,.final-cta .btn-primary{min-height:50px;border:2px solid #c9ff91!important;color:#102719!important;background:linear-gradient(135deg,#b9f273,#91dc4f)!important;font-size:13px;font-weight:900;line-height:1.25;letter-spacing:.005em;text-shadow:none;box-shadow:0 10px 26px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.55)}.benefits-wrap .benefit-wide .btn-primary:hover,.final-cta .btn-primary:hover{border-color:#e1ffbd!important;color:#091b10!important;background:linear-gradient(135deg,#c8f98c,#a0e65e)!important;box-shadow:0 13px 31px rgba(0,0,0,.3),0 0 0 3px rgba(198,247,139,.13)}.benefits-wrap .benefit-wide .btn-primary:focus-visible,.final-cta .btn-primary:focus-visible{outline:3px solid #fff;outline-offset:4px}.benefits-wrap .benefit-wide .btn-primary span,.final-cta .btn-primary span{color:inherit}@media(max-width:620px){.benefits-wrap .benefit-wide .btn-primary,.final-cta .btn-primary{width:100%;min-height:54px;padding:14px 18px;font-size:14px}.final-cta .btn-primary{margin-top:22px}}
.seo-discovery{margin-top:110px}.seo-about{padding:48px;border:1px solid #dfe8e0;border-radius:28px;display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;background:radial-gradient(circle at 5% 10%,rgba(146,211,100,.13),transparent 27%),linear-gradient(145deg,#fff,#f5f8f4);box-shadow:0 20px 50px rgba(25,61,45,.07)}.seo-about h2{max-width:500px;margin:12px 0 0;color:#123326;font-size:clamp(30px,3.4vw,48px);line-height:1.08;letter-spacing:-.055em}.seo-about-copy{display:grid;gap:14px}.seo-about-copy p{margin:0;color:#596d62;font-size:13px;line-height:1.8}.seo-link-groups{margin-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:20px}.seo-link-panel{padding:28px;border:1px solid #dfe8e0;border-radius:24px;background:#fff;box-shadow:0 12px 34px rgba(27,65,48,.055)}.seo-link-panel>header{display:flex;align-items:center;gap:12px;margin-bottom:21px}.seo-link-panel>header>span{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;color:#347840;background:#eaf5e5;font-size:18px}.seo-link-panel header small{display:block;color:#67a447;font-size:12px;font-weight:900;letter-spacing:.13em}.seo-link-panel h3{margin:4px 0 0;color:#18372a;font-size:19px}.seo-city-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.seo-city-links a{padding:10px 12px;border:1px solid #e2e9e2;border-radius:10px;display:flex;justify-content:space-between;color:#365144;background:#fafcf9;font-size:12px;font-weight:800;text-decoration:none;transition:.2s}.seo-city-links a span{color:#6db146}.seo-city-links a:hover{border-color:#9bce7c;color:#296b34;background:#f1f8ed;transform:translateY(-1px)}.seo-event-links{display:grid;gap:8px}.seo-event-links a{min-height:46px;padding:8px 12px;border:1px solid #e1e9e2;border-radius:11px;display:grid;grid-template-columns:31px 1fr auto;align-items:center;gap:10px;color:#304e40;background:#fbfcfa;font-size:12px;font-weight:800;text-decoration:none;transition:.2s}.seo-event-links i{width:31px;height:31px;display:grid;place-items:center;border-radius:9px;color:#347941;background:#eaf5e6;font-style:normal}.seo-event-links b{color:#6eb34a}.seo-event-links a:hover{border-color:#9dce80;background:#f2f9ee;transform:translateX(2px)}.seo-landing{padding-top:86px}.seo-landing-hero{position:relative;overflow:hidden;padding:100px 0 92px;background:radial-gradient(circle at 83% 15%,rgba(146,222,91,.2),transparent 28%),linear-gradient(145deg,#f8fbf5,#eef6e9)}.seo-landing-hero:after{content:"";position:absolute;right:-140px;top:-200px;width:520px;height:520px;border:1px solid rgba(89,167,61,.12);border-radius:50%;box-shadow:0 0 0 55px rgba(94,172,63,.035),0 0 0 110px rgba(94,172,63,.02)}.seo-landing-hero .container{position:relative;z-index:1}.seo-breadcrumbs{margin-bottom:35px;display:flex;align-items:center;gap:8px;color:#74867c;font-size:12px}.seo-breadcrumbs a{color:#4d765d;text-decoration:none}.seo-landing-hero h1{max-width:820px;margin:15px 0 20px;color:#102f23;font-size:clamp(42px,5.4vw,72px);line-height:1.02;letter-spacing:-.065em}.seo-landing-hero p{max-width:730px;margin:0 0 28px;color:#52675c;font-size:15px;line-height:1.75}.seo-results{padding-top:90px}.seo-results>header{max-width:700px}.seo-results h2,.seo-guide h2{margin:10px 0;color:#153428;font-size:clamp(30px,3.3vw,46px);line-height:1.1;letter-spacing:-.05em}.seo-results header p{color:#6a7d72;font-size:13px}.seo-profile-grid{margin-top:28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.seo-profile-card{overflow:hidden;border:1px solid #dfe8e0;border-radius:18px;display:grid;grid-template-columns:82px 1fr auto;align-items:center;color:#19382b;background:#fff;text-decoration:none;box-shadow:0 10px 28px rgba(29,68,50,.06);transition:.2s}.seo-profile-card:hover{border-color:#99cb7b;transform:translateY(-2px)}.seo-profile-card img{width:82px;height:92px;object-fit:cover}.seo-profile-card>span{padding:10px 13px;display:grid;gap:5px}.seo-profile-card strong{font-size:12px}.seo-profile-card small{color:#75857c;font-size:12px;line-height:1.4}.seo-profile-card>b{padding-right:14px;color:#70b34b}.seo-guide{margin-top:85px;padding:43px;border-radius:26px;display:grid;grid-template-columns:.85fr 1.15fr;gap:55px;color:#fff;background:linear-gradient(135deg,#0c3a2a,#174b36)}.seo-guide h2{color:#fff}.seo-guide p{margin:0 0 14px;color:#b8c9bf;font-size:12px;line-height:1.8}@media(max-width:900px){.seo-about,.seo-guide{grid-template-columns:1fr;gap:25px}.seo-link-groups{grid-template-columns:1fr}.seo-profile-grid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.seo-discovery{margin-top:75px}.seo-about{padding:28px 22px}.seo-link-panel{padding:21px}.seo-city-links{grid-template-columns:1fr}.seo-landing{padding-top:70px}.seo-landing-hero{padding:70px 0}.seo-landing-hero h1{font-size:42px}.seo-profile-grid{grid-template-columns:1fr}.seo-guide{padding:28px 22px}}