:root { --bg:#0a0a0a; --panel:#141414; --text:#f5f5f5; --muted:#a8a8a8; --line:#262626; --accent:#fff; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; font-size:15px; line-height:1.55; }
a { color:var(--text); }
.top { position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:18px; padding:12px 20px; background:rgba(10,10,10,.92); border-bottom:1px solid var(--line); backdrop-filter:blur(8px); }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:600; letter-spacing:.02em; }
.logo { height:34px; width:auto; }
.menu { display:flex; gap:16px; margin-left:auto; align-items:center; flex-wrap:wrap; }
.menu a, .linklike { color:var(--muted); text-decoration:none; font-size:14px; background:none; border:0; cursor:pointer; padding:0; font:inherit; }
.menu a:hover, .linklike:hover, .menu a.active { color:#fff; }
.btn { display:inline-block; background:#fff; color:#000; border:1px solid #fff; border-radius:999px; padding:9px 20px; font-size:14px; font-weight:600; text-decoration:none; cursor:pointer; }
.btn.ghost { background:transparent; color:#fff; }
.btn:disabled { opacity:.45; cursor:not-allowed; }
main { max-width:1152px; margin:0 auto; padding:0 20px 64px; }
.hero { position:relative; overflow:hidden; padding:72px 0 40px; text-align:center; border-radius:16px; }
.hero::before { content:""; position:absolute; inset:0; background-image:url("/assets/baby-photo.jpg"); background-size:cover; background-position:center 20%; opacity:.25; pointer-events:none; }
.hero > * { position:relative; z-index:1; }
.eyebrow { color:var(--muted); letter-spacing:.14em; text-transform:uppercase; font-size:12px; margin:0 0 14px; }
.hero h1 { font-size:clamp(38px,6vw,64px); line-height:1.05; margin:0 0 14px; font-weight:700; letter-spacing:-.02em; }
.hero p { color:var(--muted); font-size:17px; margin:0 0 24px; }
.philosophy { text-align:center; padding:56px 0 32px; border-top:1px solid var(--line); }
.philosophy .big { font-size:clamp(28px,4.5vw,44px); font-weight:700; margin:0 0 8px; }
.philosophy .small { color:var(--muted); margin:0; }
section { padding:32px 0; }
h2 { font-size:24px; margin:0 0 6px; }
.sub { color:var(--muted); margin:0 0 16px; }
.row { display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding:6px 2px 14px; }
.row::-webkit-scrollbar { height:6px; } .row::-webkit-scrollbar-thumb { background:#333; border-radius:3px; }
.card { flex:0 0 280px; scroll-snap-align:start; }
.card img { width:100%; height:340px; object-fit:cover; border-radius:12px; display:block; background:#222; }
.card .cap { font-size:13px; color:var(--muted); margin:8px 2px 0; }
.card a { text-decoration:none; }
.rowbtns { display:flex; gap:8px; margin-bottom:8px; }
.chip { background:var(--panel); border:1px solid var(--line); color:var(--text); border-radius:999px; padding:6px 14px; cursor:pointer; font-size:13px; }
.chip.on { background:#fff; color:#000; }
.backdrop { position:relative; }
.backdrop::before { content:""; position:absolute; inset:0; background-size:cover; background-position:center; opacity:.13; pointer-events:none; border-radius:16px; }
.backdrop > * { position:relative; }
.backdrop-videos::before { background-image:url("/assets/camera-on-set.jpg"); }
.backdrop-photos::before { background-image:url("/assets/baby-photo.jpg"); }
form.booking { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:24px; max-width:640px; margin:0 auto; }
form.booking label { display:block; font-size:13px; color:var(--muted); margin:14px 0 6px; }
form.booking input, form.booking select, form.booking textarea { width:100%; background:#0d0d0d; color:#fff; border:1px solid var(--line); border-radius:10px; padding:10px 12px; font:inherit; font-size:15px; }
.days { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.day { background:#0d0d0d; border:1px solid var(--line); color:#fff; border-radius:10px; padding:8px 4px; cursor:pointer; font-size:12px; }
.day.sel { background:#fff; color:#000; }
.day:disabled { opacity:.3; cursor:not-allowed; text-decoration:line-through; }
.slots { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.slot { background:#0d0d0d; border:1px solid var(--line); color:#fff; border-radius:999px; padding:7px 13px; cursor:pointer; font-size:13px; }
.slot.sel { background:#fff; color:#000; }
.slot:disabled { opacity:.3; cursor:not-allowed; text-decoration:line-through; }
.terms-line { display:flex; gap:8px; align-items:flex-start; margin-top:16px; font-size:13px; color:var(--muted); }
.terms-line button { background:none; border:0; color:#fff; text-decoration:underline; cursor:pointer; font:inherit; padding:0; }
.msg { margin-top:14px; font-size:14px; }
.msg.err { color:#ff9a9a; } .msg.ok { color:#9fe6a8; }
details.process summary { cursor:pointer; font-size:14px; color:var(--muted); }
details.process .steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-top:14px; }
.step { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:14px; }
.step h3 { margin:0 0 4px; font-size:15px; } .step p { margin:0; color:var(--muted); font-size:13px; }
.about { display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:start; }
.about img { width:100%; border-radius:16px; }
@media (max-width:700px){ .about{grid-template-columns:1fr} .menu{gap:10px} .days{grid-template-columns:repeat(7,1fr)} }
footer { border-top:1px solid var(--line); text-align:center; color:var(--muted); padding:28px 16px 40px; font-size:13px; }
footer a { color:#fff; }
.lightbox { position:fixed; inset:0; background:rgba(0,0,0,.94); z-index:50; display:flex; align-items:center; justify-content:center; }
.lightbox[hidden], .modal[hidden] { display:none; }
.lightbox img { max-width:92vw; max-height:86vh; border-radius:8px; }
.lightbox button { position:absolute; background:none; border:0; color:#fff; font-size:36px; cursor:pointer; }
#lbClose { top:12px; right:20px; } #lbPrev { left:12px; } #lbNext { right:12px; }
#lbCount { position:absolute; bottom:14px; color:var(--muted); font-size:13px; }
.modal { position:fixed; inset:0; background:rgba(0,0,0,.7); z-index:60; display:flex; align-items:center; justify-content:center; padding:16px; }
.modal-card { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:24px; max-width:440px; width:100%; }
.modal-card h2 { margin-top:0; }
