:root { color-scheme: dark; --bg:#0a0e13; --panel:#141b24; --panel-2:#1a2430; --muted:#a9b5c5; --text:#f7f8fb; --line:#2b3746; --accent:#f4b86a; --accent-2:#8fd1c7; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:linear-gradient(180deg,#090d12 0%,#101923 48%,#0a0e13 100%); color:var(--text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
p { color:var(--muted); }
.hero { min-height:76vh; display:grid; align-items:end; position:relative; overflow:hidden; background:radial-gradient(circle at 78% 24%,rgba(244,184,106,.19),transparent 27%),radial-gradient(circle at 12% 90%,rgba(143,209,199,.12),transparent 30%),linear-gradient(135deg,#182635,#0b1016 72%); border-bottom:1px solid var(--line); }
.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(6,9,13,.25),transparent 48%,rgba(6,9,13,.3)); pointer-events:none; }
.hero-glow { position:absolute; width:340px; height:340px; border-radius:50%; filter:blur(4px); opacity:.18; pointer-events:none; }
.hero-glow-one { right:-120px; top:-120px; background:var(--accent); }
.hero-glow-two { left:-180px; bottom:-180px; background:var(--accent-2); }
.hero-inner { width:min(1120px,calc(100% - 44px)); margin:0 auto; padding:110px 0 84px; position:relative; z-index:1; }
.hero-topline { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:22px; }
.eyebrow { color:var(--accent); font-size:.72rem; font-weight:850; letter-spacing:.18em; margin:0 0 14px; }
.listing-chip { color:var(--muted); border:1px solid rgba(255,255,255,.16); border-radius:999px; padding:7px 12px; font-size:.78rem; background:rgba(0,0,0,.16); }
.listing-chip strong { color:var(--text); }
h1,h2 { line-height:1.08; margin:0 0 18px; letter-spacing:-.035em; }
h1 { font-size:clamp(2.55rem,6.2vw,6rem); max-width:1000px; }
h2 { font-size:clamp(2rem,4vw,3.35rem); }
.lead { color:#d1d9e3; font-size:clamp(1.05rem,2vw,1.25rem); max-width:760px; }
.hero-meta { display:flex; align-items:center; flex-wrap:wrap; gap:14px 24px; margin:26px 0 30px; color:var(--muted); }
.hero-price { color:var(--accent); font-size:clamp(1.35rem,3vw,2rem); font-weight:850; }
.hero-actions { margin-top:4px; }
.section,.contact-card { width:min(1120px,calc(100% - 44px)); margin:0 auto; padding:96px 0; }
.facts,.two-col { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.facts { padding-top:110px; }
.facts > div:first-child { max-width:650px; }
.fact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.fact-grid div { background:linear-gradient(145deg,var(--panel),#10161f); border:1px solid var(--line); border-radius:18px; padding:20px; min-height:98px; }
.fact-grid strong,.fact-grid span { display:block; }
.fact-grid strong { color:#d1d9e3; font-size:.82rem; margin-bottom:8px; }
.fact-grid span { color:var(--text); font-size:1.07rem; font-weight:700; }
.fact-grid b { font-weight:800; }
.fact-highlight { border-color:rgba(244,184,106,.52) !important; background:linear-gradient(145deg,rgba(244,184,106,.17),var(--panel)) !important; }
.fact-highlight span { color:var(--accent); font-size:1.25rem; }
.selling-points { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:30px; }
.selling-points div { border-left:2px solid var(--accent); padding:3px 0 3px 14px; }
.selling-points strong,.selling-points span { display:block; }
.selling-points strong { color:var(--text); }
.selling-points span { color:var(--muted); font-size:.85rem; margin-top:3px; }
.carousel { position:relative; }
.carousel-viewport { overflow:hidden; border:1px solid var(--line); border-radius:26px; background:#0c1219; }
.carousel-track { display:flex; transform:translate3d(0,0,0); cursor:grab; touch-action:pan-y; user-select:none; }
.carousel-track.dragging { cursor:grabbing; }
.carousel-track::-webkit-scrollbar { display:none; }
.photo-slide { flex:0 0 100%; min-width:100%; min-height:480px; scroll-snap-align:center; position:relative; display:flex; flex-direction:column; justify-content:flex-end; padding:28px; background:linear-gradient(145deg,var(--panel),#0e141c); }
.photo-slide img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.photo-slide::after { content:""; position:absolute; inset:45% 0 0; background:linear-gradient(transparent,rgba(0,0,0,.78)); pointer-events:none; }
.photo-slide span,.photo-slide small { position:relative; z-index:1; }
.photo-slide span { font-size:1.3rem; font-weight:800; }
.photo-slide small { color:#d3dce6; margin-top:4px; }
.photo-slide.placeholder { align-items:center; justify-content:center; text-align:center; }
.photo-slide.placeholder::after { display:none; }
.carousel-nav { position:absolute; z-index:2; top:50%; transform:translateY(-50%); width:46px; height:46px; border:1px solid rgba(255,255,255,.3); border-radius:50%; background:rgba(8,12,17,.7); color:#fff; font-size:2rem; line-height:1; cursor:pointer; }
.carousel-nav:hover,.carousel-nav:focus-visible { background:var(--accent); color:#1b140d; outline:none; }
.carousel-nav.prev { left:16px; }
.carousel-nav.next { right:16px; }
.carousel-footer { display:flex; align-items:center; justify-content:center; gap:14px; color:var(--muted); font-size:.9rem; padding:14px 0 8px; }
.carousel-dots { display:flex; gap:6px; }
.carousel-dots button { width:7px; height:7px; padding:0; border:0; border-radius:50%; background:#526174; cursor:pointer; }
.carousel-dots button.active { background:var(--accent); transform:scale(1.25); }
.carousel-thumbs { display:flex; gap:10px; overflow-x:auto; padding:8px 2px 2px; scrollbar-width:thin; }
.carousel-thumbs button { flex:0 0 82px; height:58px; padding:3px; border:1px solid var(--line); border-radius:10px; background:var(--panel); cursor:pointer; opacity:.65; }
.carousel-thumbs button.active { opacity:1; border-color:var(--accent); }
.carousel-thumbs img { width:100%; height:100%; object-fit:cover; border-radius:7px; }
.location-section { border-top:1px solid var(--line); }
.location-list { display:grid; gap:10px; margin-top:26px; }
.location-list span { color:#d8e0e9; }
.location-list span::before { content:"✓"; color:var(--accent-2); font-weight:900; margin-right:10px; }
.map-placeholder { min-height:330px; border:1px solid #3a4a5c; border-radius:26px; display:grid; place-content:center; justify-items:center; gap:12px; color:var(--muted); background:radial-gradient(circle at 50% 28%,rgba(143,209,199,.13),transparent 32%),linear-gradient(145deg,#16222e,#0f161f); padding:14px; text-align:center; overflow:hidden; }
.map-placeholder iframe { display:block; width:100%; height:330px; min-height:280px; border:0; border-radius:20px; }
.map-fallback { display:grid; justify-items:center; gap:12px; padding:14px; }
.map-placeholder strong { color:var(--text); font-size:1.1rem; }
.map-placeholder small { max-width:280px; }
.map-attribution { font-size:.72rem; color:#8f9baa; }
.map-pin { color:#e14d4d; font-size:3rem; line-height:1; }
.offer-section { display:grid; grid-template-columns:1fr 1fr; gap:70px; border-top:1px solid var(--line); }
.offer-copy { padding-top:10px; }
.offer-note { display:flex; align-items:flex-start; gap:10px; margin-top:28px; color:var(--muted); font-size:.9rem; }
.offer-note span:first-child { color:var(--accent-2); font-weight:900; }
.offer-form { background:linear-gradient(145deg,var(--panel),#0f151d); border:1px solid var(--line); border-radius:24px; padding:28px; box-shadow:0 18px 50px rgba(0,0,0,.16); }
.offer-form label { display:block; color:var(--muted); font-size:.9rem; margin-bottom:15px; }
.offer-form input:not([type="checkbox"]),.offer-form textarea { width:100%; background:#0b1118; color:var(--text); border:1px solid var(--line); border-radius:11px; padding:12px 13px; margin-top:6px; font:inherit; }
.offer-form input:focus,.offer-form textarea:focus { outline:2px solid rgba(244,184,106,.45); outline-offset:1px; border-color:var(--accent); }
.offer-form textarea { min-height:112px; resize:vertical; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.consent-line { display:flex !important; gap:8px; align-items:flex-start; }
.consent-line input { margin-top:4px; accent-color:var(--accent); }
.honeypot { position:absolute; left:-9999px; width:1px !important; height:1px; opacity:0; }
#offer-status { min-height:24px; }
.contact-card { display:flex; justify-content:space-between; align-items:center; gap:32px; border-top:1px solid var(--line); }
.contact-card > div:first-child { max-width:680px; }
.actions { display:flex; gap:12px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--accent); color:#1b140d; border:0; border-radius:999px; padding:13px 20px; font-weight:850; cursor:pointer; transition:transform .2s,filter .2s; }
.button:hover,.button:focus-visible { filter:brightness(1.08); transform:translateY(-2px); outline:none; }
.button.secondary { background:transparent; color:var(--text); border:1px solid var(--line); }
.text-button { background:transparent; border:0; color:var(--muted); cursor:pointer; padding:13px 20px; }
footer { border-top:1px solid var(--line); padding:30px 20px; text-align:center; font-size:.85rem; }
.consent { position:fixed; z-index:10; left:20px; right:20px; bottom:20px; max-width:760px; margin:auto; background:#18212c; border:1px solid #3c4a5b; border-radius:18px; padding:20px; box-shadow:0 18px 60px #0008; }
.consent p { margin:0 0 14px; font-size:.9rem; }
body.modal-open { overflow:hidden; }
.photo-modal { position:fixed; inset:0; z-index:30; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:18px; padding:28px; background:rgba(4,7,11,.96); }
.photo-modal[hidden] { display:none; }
.modal-figure { width:min(1200px,100%); height:min(88vh,900px); margin:0; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:14px; min-width:0; }
.modal-figure img { display:block; max-width:100%; max-height:calc(100% - 42px); object-fit:contain; border-radius:12px; user-select:none; }
.modal-figure figcaption { width:100%; display:flex; justify-content:space-between; gap:16px; color:#d9e2ec; font-size:.95rem; }
.modal-figure figcaption span:last-child { color:var(--muted); }
.modal-close { position:absolute; top:20px; right:22px; z-index:2; width:44px; height:44px; border:1px solid rgba(255,255,255,.25); border-radius:50%; background:rgba(0,0,0,.3); color:#fff; font-size:2rem; line-height:1; cursor:pointer; }
.modal-close:hover,.modal-close:focus-visible { background:var(--accent); color:#1b140d; outline:none; }
.modal-nav { width:48px; height:48px; border:1px solid rgba(255,255,255,.3); border-radius:50%; background:rgba(0,0,0,.35); color:#fff; font-size:2.2rem; line-height:1; cursor:pointer; }
.modal-nav:hover,.modal-nav:focus-visible { background:var(--accent); color:#1b140d; outline:none; }
@media (max-width:800px) { .facts,.two-col,.offer-section { grid-template-columns:1fr; gap:38px; } .section,.contact-card { padding:74px 0; } .facts { padding-top:78px; } .selling-points { grid-template-columns:1fr; } .section-heading { display:block; } .section-heading .muted { text-align:left; margin-top:10px; } .contact-card { display:block; } .contact-card .actions { margin-top:24px; } }
@media (max-width:560px) { .hero-inner,.section,.contact-card { width:min(100% - 30px,1120px); } .hero { min-height:86vh; } .hero-inner { padding:86px 0 54px; } .hero-topline { align-items:flex-start; flex-direction:column; gap:12px; } h1 { font-size:clamp(2.35rem,11vw,4rem); } .hero-meta { align-items:flex-start; flex-direction:column; gap:6px; } .photo-slide { min-height:340px; padding:20px; } .carousel-nav { width:40px; height:40px; } .carousel-nav.prev { left:10px; } .carousel-nav.next { right:10px; } .fact-grid { grid-template-columns:1fr 1fr; } .fact-grid div { padding:16px; } .fact-grid span { font-size:.98rem; } .form-row { grid-template-columns:1fr; gap:0; } .consent { left:12px; right:12px; bottom:12px; } .photo-modal { grid-template-columns:1fr; padding:18px 10px; } .modal-figure { width:100%; height:82vh; } .modal-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:2; } .modal-prev { left:10px; } .modal-next { right:10px; } .modal-figure figcaption { padding:0 10px; } }