/* LiftLab editorial pass: preserve the original console and real photography. */
:root { --violet:#454545; --violet-soft:#ecece8; --paper:#f5f4f0; --ink:#161616; }
html { scroll-padding-top:108px; }
body { -webkit-font-smoothing:antialiased; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:2px solid #888; outline-offset:5px; }
.section-title { font-size:clamp(38px,4.8vw,66px); font-weight:650; letter-spacing:-.045em; line-height:1.08; text-wrap:balance; }
.section-lead,.split-head>p { font-size:17px; line-height:1.65; max-width:540px; }
.section-label { font-size:11px; font-weight:600; letter-spacing:.18em; color:#60605c; margin-bottom:22px; }
.split-head { align-items:end; gap:64px; }
.split-head>p { max-width:360px; }
.split-head .section-label { font-size:11px !important; line-height:1.5 !important; font-weight:600; margin-top:0 !important; letter-spacing:.18em; }
section.light,section.soft { background:var(--paper); padding:88px 6vw; }
.inside-studio,.selected-work,.reaction-section,.remote-section,.events-section,.contact,.equipment-section { padding:88px 6vw; }
.inside-studio .section-label,.selected-work .section-label,.reaction-section .section-label,.contact .section-label,.remote-section .section-label,.events-section .section-label { color:#aaa; }
.button { font-weight:650; font-size:14px; min-height:48px; }
.button:active,.mobile-booking:active { transform:scale(.98); }
.nav { position:fixed; top:20px; left:50%; transform:translateX(-50%); width:88%; z-index:1000; background:#101010eb; border-color:#ffffff24; padding:10px 14px; backdrop-filter:blur(14px); transition:background .2s; }
.nav.is-scrolled { background:#101010f5; box-shadow:0 8px 30px #0002; }
.nav-links { gap:26px; }
.nav-links a { padding:12px 0; font-size:13px; }
.logo { font-weight:650; letter-spacing:-.03em; }
.logo-image-wrap { box-shadow:none; border:0; }
.hero { min-height:auto; padding:144px 6vw 78px; background:radial-gradient(ellipse at 75% 48%,#202020 0%,transparent 48%),#080808; }
.hero::after { display:none; }
.hero-backdrop { position:absolute; inset:0 0 0 30%; background:url('assets/images/studio-room.webp') center / cover; opacity:.22; filter:grayscale(1); mask-image:linear-gradient(90deg,transparent,#000 65%); pointer-events:none; }
.hero-backdrop::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#080808,transparent 40%,#08080888); }
.hero-backdrop .studio-atmosphere { object-position:center; }
@keyframes liftlabArrival { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:translateY(0); } }
.hero h1 span { animation:liftlabArrival .8s cubic-bezier(.2,.8,.2,1) both; }
.hero h1 span:nth-child(2) { animation-delay:.08s; }
.hero h1 span:nth-child(3) { animation-delay:.16s; }
.hero .visual-wrap { animation:liftlabArrival 1s .18s cubic-bezier(.2,.8,.2,1) both; }
.hero-grid { padding-top:0; gap:80px; grid-template-columns:1.05fr .95fr; }
.hero-copy { min-width:0; }
.hero p.hero-kicker { margin:0 0 26px; font-size:11px; text-transform:uppercase; letter-spacing:.18em; font-weight:600; color:#aaa; }
h1 { font-size:clamp(76px,8.4vw,118px); line-height:.96; font-weight:650; letter-spacing:-.06em; }
h1 span { display:block; }
.hero p.hero-intro { max-width:440px; font-size:17px; line-height:1.65; color:#aaa; margin-top:28px; }
.hero .cta-row { margin-top:28px; }
.hero .stats { gap:18px; border-top:1px solid #ffffff20; padding-top:20px; margin-top:34px; font-size:11px; }
.hero .stats strong { font-size:25px; font-weight:550; margin-bottom:4px; }
.hero .console-caption { display:flex; justify-content:space-between; max-width:none; margin:0 0 16px; color:#999; font:10px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.05em; text-transform:uppercase; }
.hero .visual-card,.hero .glass-panel { padding:0 !important; min-height:0 !important; border:0; background:none; box-shadow:none; overflow:visible; backdrop-filter:none; animation:none; }
.visual-card::before,.visual-card::after,.glass-panel::before,.glass-panel::after { display:none; }
.hero .hero-console-button { width:100%; }
.hero-console-object { width:100%; background:linear-gradient(155deg,#363636,#202020 40%,#111); border:1px solid #ffffff30; border-radius:24px; box-shadow:inset 0 1px 0 #ffffff40,0 24px 80px #0008; transform:perspective(1400px) rotateX(3deg); }
.hero-console-object::before { box-shadow:none; }
.preview-toggle { min-height:44px; }
.preview-seek { min-height:28px; touch-action:pan-y; }
/* Music is the first proof after the console. */
.selected-work { background:#111; border-top:1px solid #ffffff14; border-bottom:0; }
.spotify-grid { gap:30px; margin-top:42px; }
.spotify-card { border:0; border-top:1px solid #ffffff30; border-radius:0; padding:20px 0 0; background:none; box-shadow:none; backdrop-filter:none; }
.spotify-card-header { padding:0 0 22px; }
.spotify-card-header span { font-size:10px; font-weight:500; }
.spotify-card-header h3 { font-weight:550; font-size:28px; letter-spacing:-.025em; }
.spotify-card iframe { border-radius:12px; height:152px; }
.music-fallback { display:inline-flex; align-items:center; min-height:44px; margin-top:10px; color:#aaa; font-size:12px; }
.music-fallback:hover { color:white; }
.reaction-section { background:#111; padding-top:0; border:0; }
.reaction-section .container { border-top:1px solid #ffffff24; padding-top:48px; }
.reaction-section .section-title { font-size:36px; }
.reaction-section .section-lead { margin-top:12px; }
.reaction-grid { margin-top:28px; gap:48px; grid-template-columns:1fr 1fr; }
.reaction-frame,.youtube-preview-card { border-radius:10px; box-shadow:none; }
.reaction-card { border:0; padding:0; border-radius:0; background:none; backdrop-filter:none; }
.reaction-card h3 { font-size:28px; font-weight:550; letter-spacing:-.03em; }
/* Services as an editorial index. */
#services .container { display:grid; grid-template-columns:.9fr 1.1fr; column-gap:90px; align-content:start; }
#services .section-label { grid-column:1; }
#services .section-title { grid-column:1; align-self:start; }
#services .section-lead { grid-column:1; align-self:start; margin-top:20px; }
#services .services-intro { grid-column:1; grid-row:1; }
#services .grid-3 { grid-column:2; grid-row:1; grid-template-columns:1fr; gap:0; margin:0; }
#services .card { border:0; border-top:1px solid #cccac4; border-radius:0; background:none; padding:24px 0; box-shadow:none; }
#services .card:first-child { padding-top:0; border-top:0; }
#services .card:last-child { padding-bottom:0; }
.service-number,.equipment-index { display:block; margin-bottom:12px; font:10px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.1em; text-transform:uppercase; color:#777; }
#services .card h3 { font-size:30px; font-weight:550; letter-spacing:-.035em; margin-bottom:10px; }
#services .card p { font-size:15px; max-width:440px; }
.editorial-link { display:inline-flex; align-items:center; min-height:44px; font-size:12px; font-weight:600; margin-top:8px; }
/* Real photography, cleaner edges. */
.studio-gallery { grid-template-columns:1.18fr .82fr; gap:18px; margin-top:40px; }
.studio-tile,.studio-tile.large { border-radius:12px; min-height:0; box-shadow:none; border:1px solid #ffffff18; }
.studio-tile.large { height:620px; }
.studio-stack { grid-template-rows:1fr 1fr; }
.studio-photo,.studio-atmosphere { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.studio-atmosphere { opacity:0; transition:opacity .5s ease; }
.studio-atmosphere.is-ready { opacity:1; }
.studio-caption { left:26px; right:26px; bottom:26px; }
.studio-caption span { font-size:10px; font-weight:500; }
.studio-caption h3 { font-size:28px; font-weight:550; letter-spacing:-.03em; }
.studio-caption p { font-size:14px; }
.equipment-section { background:#111; color:#fff; border:0; padding-top:0; }
.equipment-section .container { border-top:1px solid #ffffff20; padding-top:44px; }
.equipment-section .section-label { color:#aaa; }
.equipment-section .section-title { color:white; font-size:36px; }
.equipment-section .split-head>p { color:#aaa; }
.equipment-grid { margin-top:32px; gap:28px; }
.equipment-card { padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.equipment-card h3 { color:#eee; font-size:19px; font-weight:550; letter-spacing:-.02em; }
.equipment-card p { color:#aaa; font-size:14px; }
.equipment-list { font-size:13px; color:#ccc; }
.equipment-dot { background:#aaa; }
/* Package comparison: one clearly highlighted choice. */
.price-grid { margin-top:40px; }
#pricing .price-card { padding:28px; border-radius:16px; background:transparent; box-shadow:none; border-color:#d5d3cd; }
#pricing .price-card h3 { font-weight:600; letter-spacing:-.03em; }
.package-badge { color:#555; background:#e9e8e2; font-size:10px; letter-spacing:.04em; font-weight:600; border-radius:4px; padding:7px 9px; }
#pricing .price-card.featured-package { background:#151515; border-color:#151515; }
.price-card.featured-package::before,.price-card.featured-package::after { display:none; }
.price-card.featured-package .package-badge { background:#f1f0eb; color:#111; }
.price { font-weight:600; letter-spacing:-.045em; }
.feature-list { margin:22px 0 24px; gap:10px; font-size:14px; }
.check { background:transparent; color:#555; }
.featured-package .check { color:#ccc; }
.package-fit { font-size:13px !important; }
.package-cta { min-height:48px; font-size:13px; }
.price-card.featured-package .package-cta:hover { color:#fff; border-color:#fff7; }
.package-cta:hover { border-color:#777; }
.remote-card,.remote-price-card { border:0; border-top:1px solid #ffffff30; border-radius:0; background:none; padding:24px 0 0; box-shadow:none; backdrop-filter:none; }
.remote-grid { gap:36px; margin-top:38px; }
.remote-number { background:none; color:#999; border-radius:0; width:auto; height:auto; display:block; font:11px ui-monospace,monospace; margin-bottom:20px; }
.remote-card h3 { font-size:24px; font-weight:550; }
.remote-pricing-grid { margin-top:32px; gap:24px; }
.remote-price-card strong { font-weight:550; font-size:17px; }
/* Portrait-led roster. One image, one name, no nested cards. */
#network { background:#eae9e3; }
.artist-card { padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.artist-image,.artist-photo { display:block; position:relative; height:auto; min-height:0; aspect-ratio:3 / 4; padding:0; border-radius:0; background:#202020; overflow:hidden; margin-bottom:22px; }
.artist-photo img { width:100%; height:100%; display:block; object-fit:cover; filter:grayscale(1) contrast(1.04); transition:transform .6s ease; }
.zesi-photo img { filter:grayscale(1) contrast(1.07) brightness(1.2); }
.artist-card .tag { background:none; color:#62625e; padding:0; border-radius:0; font-size:10px; text-transform:uppercase; letter-spacing:.09em; font-weight:500; margin-bottom:10px; }
.artist-card h3 { font-size:36px; font-weight:550; letter-spacing:-.04em; margin-bottom:12px; }
.artist-card p { font-size:14px; line-height:1.7; max-width:370px; }
.artist-card .spotify-link { border-radius:0; border-bottom:1px solid #aaa; background:none; color:#111; padding:12px 0; margin-top:10px; min-height:44px; font-weight:600; font-size:12px; }
#network .grid-3 { gap:32px; margin-top:40px; }
#djs { border-top:1px solid #d5d3cc; background:#eae9e3; }
#djs .grid-2 { gap:48px; margin-top:36px; }
#djs .artist-card { display:grid; grid-template-columns:.9fr 1.1fr; column-gap:24px; align-content:start; }
#djs .artist-photo { grid-row:1 / span 4; margin:0; }
#djs .tag { align-self:end; margin-top:12px; }
#djs h3 { font-size:28px; }
#djs .spotify-link { justify-self:start; align-self:start; }
.events-card { border:0; border-top:1px solid #ffffff30; border-radius:0; padding:26px 0 0; background:none; box-shadow:none; }
.events-grid { gap:56px; margin-top:40px; }
.events-card h3 { font-size:28px; font-weight:550; letter-spacing:-.03em; }
.events-price { border-radius:4px; }
#label .step { border:0; border-bottom:1px solid #d0cec7; border-radius:0; background:none; padding:18px 0; }
#label .step-number { background:none; color:#777; font:11px ui-monospace,monospace; border-radius:0; padding-top:12px; }
#label .step p { font-size:16px; }
#faq { border-top:1px solid #d5d3cc; }
.faq-grid { margin-top:32px; gap:0 48px; }
.faq-item { border:0; border-bottom:1px solid #ceccc5; border-radius:0; background:none; padding:22px 0; }
.faq-item summary { font-size:16px; font-weight:550; }
/* An inquiry, not a checkout. */
.contact-box { padding:0; border:0; border-radius:0; background:none; grid-template-columns:1fr 1fr; gap:90px; }
.contact .section-title { font-size:clamp(52px,6vw,86px); }
.contact-copy .section-lead { font-size:17px; max-width:350px; }
.direct-contact { display:grid; margin-top:40px; max-width:370px; }
.direct-contact a { display:flex; justify-content:space-between; align-items:center; min-height:52px; gap:12px; padding:14px 0; border-bottom:1px solid #ffffff25; color:#ddd; font-size:15px; }
.direct-contact a:hover { color:#fff; }
.contact-location { font-size:12px; color:#999; margin-top:26px; }
.contact-card { border-radius:12px; background:var(--paper); padding:32px; }
.form-heading { font-size:26px; font-weight:550; letter-spacing:-.035em; }
.booking-selection { color:#666; font-size:13px; line-height:1.6; margin:8px 0 26px; }
.booking-selection.has-selection { color:#161616; }
.form-field label { color:#565650; font-size:10px; font-weight:600; letter-spacing:.1em; }
.form-field input,.form-field select,.form-field textarea { background:#eeede8; border:1px solid #d5d3cc; border-radius:6px; font-size:16px; min-height:48px; }
.form-field textarea { min-height:94px; }
.form-field input:focus,.form-field select:focus,.form-field textarea:focus { border-color:#777; background:#fff; box-shadow:0 0 0 3px #00000008; }
.booking-details { border-top:1px solid #d5d3cc; border-bottom:1px solid #d5d3cc; padding:0; margin:4px 0; }
.booking-details summary { cursor:pointer; padding:16px 0; font-size:12px; line-height:1.6; }
.booking-details summary span,.optional-label { color:#777; font-size:10px; margin-left:6px; font-weight:400; letter-spacing:0; }
.booking-details .form-grid { padding:0 0 18px; }
.form-submit { border-radius:6px; min-height:52px; font-weight:600; }
.form-note { font-size:11px; line-height:1.6; }
.mobile-booking { display:none; }
.reveal { transform:translateY(16px); filter:none; transition-duration:.6s; will-change:auto; }
.reveal.is-visible { filter:none; }
@media (hover:hover) and (pointer:fine) {
  .card:hover,.artist-card:hover,.price-card:hover,.spotify-card:hover,.equipment-card:hover,.remote-card:hover,.events-card:hover,.reaction-card:hover,.step:hover { transform:none; box-shadow:none; }
  .artist-card:hover .artist-image { transform:none; filter:none; }
  .artist-card:hover .artist-photo img { transform:scale(1.02); }
  .studio-tile:hover { transform:none; filter:none; box-shadow:none; }
}
@media (max-width:1100px) {
  #pricing .price-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #pricing .price-grid .price-card,#pricing .price-grid .price-card:nth-child(n + 4) { grid-column:auto; min-width:0; }
  #pricing .price-grid .price-card:last-child:nth-child(odd) { grid-column:1 / -1; }
  .hero-grid { gap:50px; }
  #services .container { column-gap:48px; }
  .contact-box { gap:50px; }
  #djs .artist-card { display:block; }
  #djs .artist-photo { aspect-ratio:4 / 3; margin-bottom:22px; }
}
@media (max-width:980px) {
  body { padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
  .hero { padding-top:112px !important; }
  .hero-grid { grid-template-columns:1fr; padding-top:20px !important; }
  .hero .visual-wrap { width:min(100%,500px); justify-self:center; }
  .hero-copy { max-width:650px; }
  .hero h1 { font-size:76px; }
  .mobile-menu-button { min-width:44px; min-height:44px; }
  .mobile-menu { max-height:calc(100dvh - 174px); overflow-y:auto; }
  .mobile-menu a { min-height:44px; }
  .mobile-booking { position:fixed; z-index:999; bottom:max(14px,env(safe-area-inset-bottom)); left:20px; right:20px; display:flex; align-items:center; justify-content:space-between; min-height:52px; padding:14px 22px; border-radius:8px; background:#f5f4f0; color:#111; border:1px solid #d5d3cc; font-size:14px; font-weight:650; box-shadow:0 4px 24px #0004; }
  .mobile-booking.is-hidden { opacity:0; pointer-events:none; visibility:hidden; }
  .studio-atmosphere { display:none; }
  .spotify-grid { grid-template-columns:1fr; gap:26px; }
  #services .container { display:block; }
  #services .grid-3 { margin-top:32px; }
  .equipment-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:920px) {
  .section-title { font-size:clamp(34px,7vw,52px) !important; line-height:1.1 !important; }
  section.light,section.soft,.inside-studio,.selected-work,.remote-section,.events-section,.contact { padding:64px 24px !important; }
  .reaction-section { padding:0 24px 64px !important; }
  .equipment-section { padding:0 24px 64px !important; }
  .card,.artist-card,.spotify-card,.reaction-card { padding:0 !important; border-radius:0 !important; }
  #services .card { padding:24px 0 !important; }
  .spotify-card { padding-top:20px !important; }
  .artist-image,.artist-photo { min-height:0 !important; border-radius:0 !important; }
  #network .grid-3 { gap:38px !important; }
  #network .artist-photo { aspect-ratio:4 / 4.3; }
  .artist-card h3 { font-size:32px; }
  .artist-card p { max-width:100%; }
  .artist-card .tag { margin-bottom:8px; }
  .studio-gallery { display:block; }
  .studio-tile,.studio-tile.large { min-height:0 !important; border-radius:10px !important; height:340px; }
  .studio-tile.large { height:440px; }
  .studio-stack { margin-top:16px; grid-template-columns:1fr 1fr; grid-template-rows:auto; gap:16px; }
  .studio-caption h3 { font-size:23px; }
  .studio-caption p { font-size:13px; }
  #pricing .price-card { padding:26px !important; border-radius:12px !important; }
  .contact-box { padding:0 !important; border:0 !important; border-radius:0 !important; gap:40px !important; }
  .contact-card { padding:26px !important; border-radius:10px !important; }
  .reaction-card { margin-top:4px; }
  .reaction-frame,.youtube-preview-card { border-radius:10px !important; }
  .events-grid { gap:40px; }
}
@media (max-width:600px) {
  .hero { padding:104px 24px 52px !important; }
  .hero-grid { padding-top:12px !important; gap:32px !important; }
  .hero p.hero-kicker { font-size:9px !important; margin-bottom:18px; }
  .hero h1 { font-size:clamp(50px,13.5vw,76px) !important; line-height:.98 !important; letter-spacing:-.055em; }
  .hero h1 span { display:inline-block; }
  .hero h1 span:last-child { display:block; }
  .hero p.hero-intro { font-size:15px !important; line-height:1.6 !important; margin-top:18px; }
  .hero .cta-row { display:grid; grid-template-columns:1.1fr 1fr; gap:8px; margin-top:22px; }
  .hero .cta-row .button { width:auto !important; padding:12px 10px; font-size:12px; min-height:46px; }
  .hero .stats { grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:10px; margin-top:24px; padding-top:16px; font-size:10px; }
  .hero .stats strong { font-size:22px !important; }
  .hero p.console-caption { font-size:9px !important; line-height:1.4 !important; margin-bottom:12px; }
  .hero .hero-console-object { padding:14px !important; border-radius:18px; }
  .preview-toggle { padding:10px 12px; }
  .preview-copy .preview-title { font-size:11px; }
  .section-label { margin-bottom:18px; font-size:10px; }
  #pricing .section-title { letter-spacing:-.045em !important; line-height:1.1 !important; }
  .section-lead,.split-head>p { font-size:15px !important; }
  .grid-3,.grid-2 { margin-top:30px; }
  .studio-stack { grid-template-columns:1fr; }
  .studio-tile,.studio-tile.large { height:340px; }
  .studio-tile.large { height:400px; }
  .equipment-grid { gap:28px 22px; }
  .equipment-card h3 { font-size:17px; }
  .equipment-card p { display:none; }
  .equipment-list { font-size:12px; }
  .equipment-index { font-size:9px; }
  .remote-grid,.remote-pricing-grid { gap:24px; }
  .remote-pricing-grid { grid-template-columns:1fr 1fr; }
  .remote-card { padding-top:18px; }
  #djs .grid-2 { gap:36px !important; }
  #djs .artist-photo { aspect-ratio:4 / 3; }
  .direct-contact { margin-top:24px; }
  .direct-contact a { font-size:14px; }
  .contact-card { padding:22px !important; }
  .form-field input,.form-field select,.form-field textarea { font-size:16px; }
  .form-grid { gap:14px; }
  .booking-details summary { font-size:11px; }
  .contact .section-title { font-size:50px !important; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; filter:none; }
  .studio-atmosphere { display:none; }
}
