/* Home page. Builds on /app.css (tokens, buttons, chips, the phone booking bar). */
.land main{display:grid;gap:56px}
.land main>section>h2{font-family:var(--display);font-weight:800;font-size:clamp(24px,4.5vw,34px);letter-spacing:-.01em;margin:0 0 6px}
.land .bn{font-family:var(--display);font-weight:800;font-size:clamp(22px,4vw,28px);line-height:1;margin:0;color:var(--fg)}
.land header.top{align-items:center}
.nav-cta{padding:8px 16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* Hero */
.hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px;align-items:center}
.kicker{font:600 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--magenta);margin:0 0 10px}
.hero h1{font-size:clamp(34px,6.4vw,60px);line-height:1.02}
.lede{font-size:18px;color:var(--muted);margin:16px 0 22px;max-width:52ch}
.big-cta{font-size:18px;padding:16px 28px;border-radius:12px;box-shadow:0 8px 24px -10px var(--accent)}
.ticks{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:6px}
.ticks li{padding-left:24px;position:relative}
.ticks li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700}
.rating{margin:14px 0 0}
.rating .stars{color:var(--hl-line);letter-spacing:2px}
.rating a,.foot-land a,#social a,#reviewsMore a:not(.btn){color:var(--accent)}

/* Placeholders for photos and videos: replace with real media */
.media{aspect-ratio:16/10;border-radius:20px}
.ph-photo,.ph-video{position:relative;display:grid;place-items:center;overflow:hidden;color:#fff;
  background:radial-gradient(120% 90% at 20% 15%,rgba(255,63,180,.85),transparent 55%),radial-gradient(100% 80% at 85% 90%,rgba(212,175,55,.7),transparent 60%),#24182f}
.ph-video{background:radial-gradient(120% 90% at 80% 10%,rgba(255,179,71,.8),transparent 55%),radial-gradient(100% 80% at 10% 90%,rgba(255,63,180,.75),transparent 60%),#1d1428}
.ph-label{position:absolute;left:12px;bottom:10px;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;background:rgba(0,0,0,.45);padding:4px 8px;border-radius:6px}
.play{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.92);position:relative}
.play::after{content:"";position:absolute;left:26px;top:20px;border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent #24182f}

/* Why us */
.band{background:var(--surface-2);border-radius:20px;padding:24px}
.why{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.why h3{font-family:var(--display);font-size:19px;margin:0 0 6px}
.why p{margin:0;color:var(--muted)}

/* Packages */
.pkgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:16px}
.pkg{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:20px;display:grid;gap:10px;align-content:start}
.pkg h3{font-family:var(--display);font-size:22px;margin:0}
.pkg .when{font:13px var(--mono);color:var(--muted);margin:0}
.pkg .from{font:700 30px var(--mono);color:var(--accent);margin:0}
.pkg .from span{font:500 13px var(--body);color:var(--muted)}
.pkg .ticks{margin:0}
.pkg .btn{justify-self:start;margin-top:4px}

/* Extras */
.extras{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:16px}
.extra{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:10px}
.extra img,.extra .mini{width:96px;height:72px;object-fit:cover;border-radius:8px}
.extra .mini .ph-label{left:6px;bottom:6px;font-size:9px}
.extra h3{font-size:15px;margin:0}
.extra p{margin:2px 0 0;font-size:13px;color:var(--muted)}
.extra .price{font:600 13px var(--mono);color:var(--accent)}
.extra.rig{border-color:var(--hl-line);background:linear-gradient(135deg,rgba(255,63,180,.12),var(--surface))}

/* How it works */
.steps{list-style:none;counter-reset:s;padding:0;margin:16px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.steps li{counter-increment:s;display:grid;gap:6px;border-top:2px solid var(--accent);padding-top:12px}
.steps li::before{content:"0" counter(s);font:600 12px var(--mono);color:var(--accent)}
.steps b{font-family:var(--display);font-size:18px}
.steps span{color:var(--muted)}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0 10px}
.tile{aspect-ratio:1;border-radius:12px}
.tile .play{width:44px;height:44px}
.tile .play::after{left:17px;top:13px;border-width:9px 0 9px 15px}

/* Reviews */
.reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:16px 0}
.review{margin:0;border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:20px;display:grid;gap:12px}
.review blockquote{margin:0;font-size:16px}
.review blockquote::before{content:"“";font:800 40px/0 var(--display);color:var(--magenta);vertical-align:-14px;margin-right:4px}
.review figcaption{font-weight:700}
.review figcaption span{font-weight:400;color:var(--muted)}

/* FAQ */
.faq{display:grid;gap:8px;margin-top:16px;max-width:820px}
.faq details{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:0 16px}
.faq summary{cursor:pointer;font-weight:700;padding:14px 0;list-style-position:outside}
.faq details p{margin:0 0 14px;color:var(--muted)}

/* Closing call to action */
.final{text-align:center;background:linear-gradient(135deg,var(--hl-from),#ffd7ec 60%,var(--hl-to));border:1px solid var(--hl-line);border-radius:24px;padding:40px 20px;color:var(--hl-ink)}
.final h2{color:var(--hl-ink)}
.final p{margin:0 0 20px}
.foot-land{border-top:1px solid var(--line);margin-top:48px;padding-top:20px;text-align:center}

@media (max-width:860px){
  .hero{grid-template-columns:minmax(0,1fr)}
  .nav-cta,.land header .chip{display:none}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .land main{gap:44px}
}
@media (max-width:560px){
  .big-cta{display:flex;justify-content:center;width:100%}
  .lede{font-size:16px}
}
.land-bar b{font:700 16px var(--display);color:var(--fg)}

/* Real media from the admin's Home page tab */
.reel{position:relative;overflow:hidden;background:#000;display:grid;place-items:center}
.reel img,.reel iframe,.reel video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.reel video{object-fit:contain}
.reel-play{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(transparent 55%,rgba(0,0,0,.35));border:0;cursor:pointer}
.reel-play:hover .play{transform:scale(1.06)}
button.tile{position:relative;border:0;padding:0;cursor:pointer;overflow:hidden;display:grid;place-items:center;background:#000;color:#fff}
button.tile .ph-label{z-index:1}
button.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
button.tile:hover img{transform:scale(1.04)}
button.tile .play{position:relative;z-index:1}
button.tile:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
#viewer{border:0;border-radius:16px;padding:0;background:#000;color:#fff;width:min(960px,94vw);max-height:92vh;overflow:hidden}
#viewer::backdrop{background:rgba(10,6,16,.8)}
#viewer img{display:block;width:100%;max-height:82vh;object-fit:contain}
#viewer p{margin:0;padding:10px 16px}
.vframe{aspect-ratio:16/9}
.vframe iframe,.vframe video{width:100%;height:100%;border:0;display:block}
.vclose{position:absolute;top:8px;right:8px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font:600 24px/1 var(--body);cursor:pointer}
@media (prefers-reduced-motion:reduce){button.tile img{transition:none}}