.hero[data-astro-cid-j7pv25f6]{background:var(--dark);color:var(--light);padding:100px 0 80px;position:relative;overflow:hidden}.hero-bg[data-astro-cid-j7pv25f6]{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 50%,rgba(196,80,28,.15) 0%,transparent 60%)}.hero-pattern[data-astro-cid-j7pv25f6]{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.03) 1px,transparent 1px);background-size:32px 32px}.hero-content[data-astro-cid-j7pv25f6]{position:relative;max-width:700px}.hero-eyebrow[data-astro-cid-j7pv25f6]{display:flex;align-items:center;gap:8px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:24px}.eyebrow-dot[data-astro-cid-j7pv25f6]{width:6px;height:6px;background:var(--accent);border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.hero-title[data-astro-cid-j7pv25f6]{font-size:clamp(2.5rem,6vw,4rem; line-height: 1.1; margin-bottom: 20px; } .hero-title em {color: var(--accent); font-style: italic;} .hero-subtitle {font-size: 1.1rem; color: rgba(250,249,245,.7); margin-bottom: 32px; max-width: 540px;} .hero-cta {display: flex; gap: 16px; margin-bottom: 48px; flex-wrap: wrap;} .hero-stats {display: flex; gap: 40px;} .stat strong {display: block; font-family: "Playfair Display",serif; font-size: 1.75rem; color: var(--light);} .stat span {font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: rgba(250,249,245,.5);} .cities-section {padding: 40px 0; border-bottom: 1px solid var(--border);} .cities-grid {display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px;} .city-pill {padding: 8px 18px; background: white; border: 1px solid var(--border); border-radius: 100px; font-size: .875rem; font-weight: 500; transition: all .2s;} .city-pill:hover {background: var(--dark); color: var(--light); border-color: var(--dark);} .categories-section {padding: 80px 0;} .categories-grid {display: grid; grid-template-columns: repeat(5,1fr); gap: 16px;} .cat-card {background: white; border: 1px solid var(--border); border-radius: 12px; padding: 24px 20px; transition: all .2s; display: block;} .cat-card:hover {border-color: var(--accent); transform: translateY(-4px); box-shadow: var(--shadow);} .cat-icon {font-size: 2rem; margin-bottom: 12px;} .cat-card h3 {font-size: 1rem; font-family: "Playfair Display",serif; margin-bottom: 6px;} .cat-card p {font-size: .8rem; color: var(--mid); margin-bottom: 10px; line-height: 1.4;} .cat-meta {font-size: .7rem; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: .08em;} @media (max-width: 900px) {.categories-grid {grid-template-columns: repeat(3,1fr);}} @media (max-width: 600px) {.categories-grid {grid-template-columns: repeat(2,1fr);}} .how-section {background: var(--dark-2); color: var(--light); padding: 80px 0;} .how-inner {display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;} .how-title {font-size: clamp(1.5rem,3vw,2.25rem); margin-bottom: 16px;} .how-title em {color: var(--accent); font-style: italic;} .how-text {color: rgba(250,249,245,.7); margin-bottom: 32px;} .how-steps {display: flex; flex-direction: column; gap: 24px;} .step {display: flex; gap: 16px; align-items: flex-start;} .step-num {font-family: "Playfair Display",serif; font-size: 1.5rem; font-weight: 900; color: var(--accent); min-width: 40px;} .step h4 {font-size: 1rem; margin-bottom: 4px;} .step p {font-size: .85rem; color: rgba(250,249,245,.6);} .how-visual {display: flex; justify-content: center;} .rating-demo {background: var(--dark-3); border-radius: 16px; padding: 28px; width: 100%; max-width: 320px;} .rating-demo-header {display: flex; justify-content: space-between; margin-bottom: 20px; font-size: 1.1rem; font-weight: 700;} .rating-bars {display: flex; flex-direction: column; gap: 8px;} .bar-row {display: flex; align-items: center; gap: 10px; font-size: .8rem;} .bar-label {min-width: 24px; color: rgba(250,249,245,.5);} .bar-track {flex: 1; height: 8px; background: rgba(255,255,255,.1); border-radius: 4px; overflow: hidden;} .bar-fill {height: 100%; border-radius: 4px;} .fill-5 {width: 72%; background: #22c55e;} .fill-4 {width: 18%; background: #84cc16;} .fill-3 {width: 6%; background: #eab308;} .fill-2 {width: 2%; background: #f97316;} .fill-1 {width: 2%; background: #ef4444;} .bar-pct {min-width: 32px; color: rgba(250,249,245,.5); text-align: right;} @media (max-width: 900px) {.how-inner {grid-template-columns: 1fr; gap: 40px;}} .advertise-section {padding: 80px 0; background: var(--accent); color: white;} .advertise-inner {display: flex; justify-content: space-between; align-items: center; gap: 40px;} .advertise-inner h2 {font-size: clamp(1.5rem,3vw,2rem); margin-bottom: 8px;} .advertise-inner h2 em {font-style: italic; opacity: .9;} .advertise-inner p {opacity: .85; max-width: 500px;} .advertise-cta {display: flex; gap: 16px; flex-shrink: 0; flex-wrap: wrap;} .btn-white {background: white; color: var(--accent);} .btn-white:hover {background: var(--dark); color: white;} .btn-outline-white {background: transparent; border: 2px solid white; color: white;} .btn-outline-white:hover {background: white; color: var(--accent);} @media (max-width: 768px) {.advertise-inner {flex-direction: column; text-align: center;} .advertise-cta {justify-content: center;}})}
