/* =========================================================
   LPME — base template (global chrome + home sections)
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden;}
body{
  margin:0;
  font-family:'Arimo',system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif;
  color:#111;
  background:#F6F2E6;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
:root{
  --cream:#F6F2E6;
  --gold:#d7bf7a;
  --gold2:#e6c549;
  --red:#ac0000;
  --dark:#0b0b0b;
}

/* Home & other dark pages */
body.home,body.itemid-101{background:#0b0b0b;color:#fff;}
body.video-page,body.studios-page,body.news-page{background:#0b0b0b;color:#fff;}

/* Full-height section helper */
.lp-section{position:relative;width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.lp-section.auto{min-height:auto;}

/* ---------- Top-center logo (styled fully in custom.css) ---------- */

/* ---------- Burger button ---------- */
.sm-btn-110{position:fixed;top:0;right:0;padding-right:22px;padding-top:24px;z-index:10001;cursor:pointer;}
.sm-btn-110 .menu-icon-cont{display:block;}
/* icon morph handled in burger.css */

/* ---------- Page loader (full-screen overlay, fades out) ---------- */
#lp-loader{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;background:#000;transition:opacity .6s ease,visibility 0s linear .6s;}
#lp-loader img{width:120px;height:auto;opacity:.9;animation:lp-loader-pulse 1.4s ease-in-out infinite;}
#lp-loader.done{opacity:0;visibility:hidden;pointer-events:none;}
@keyframes lp-loader-pulse{0%,100%{opacity:.35;}50%{opacity:.95;}}

/* ---------- Off-canvas menu (right-side panel) ---------- */
/* dim backdrop (real element so it reliably catches outside clicks) */
#lp-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9998;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s;}
body.lp-burger #lp-backdrop{opacity:1;visibility:visible;transition:opacity .45s ease,visibility 0s;}
nav.off-menu_110{
  position:fixed;top:0;right:0;height:100%;width:min(88vw,440px);z-index:10000;
  background:var(--cream);
  display:flex;flex-direction:column;justify-content:center;
  box-shadow:-20px 0 60px rgba(0,0,0,.3);
  transform:translateX(100%);
  visibility:hidden;
  transition:transform .5s cubic-bezier(.2,.8,.2,1),visibility 0s linear .5s;
}
nav.off-menu_110.lp-burger,
body.lp-burger nav.off-menu_110{
  transform:translateX(0);visibility:visible;
  transition:transform .5s cubic-bezier(.2,.8,.2,1),visibility 0s;
}
nav.off-menu_110 .sm-logo{position:absolute;top:26px;left:40px;}
nav.off-menu_110 .sm-logo img{width:58px;height:auto;}
nav.off-menu_110 .sm-levels{width:100%;}
nav.off-menu_110 dl.level1{list-style:none;margin:0;padding:0 40px;}
nav.off-menu_110 dt.level1{margin:0;}
nav.off-menu_110 dd{display:none;}
nav.off-menu_110 .link a{
  display:inline-block;
  font-family:'Tinos',serif;
  font-size:clamp(20px,2.3vw,27px);
  line-height:1.7;
  color:#111;
  letter-spacing:.02em;
  transition:color .25s ease,padding-left .25s ease;
}
nav.off-menu_110 .link a:hover{color:var(--red);padding-left:8px;}
/* social items smaller */
nav.off-menu_110 dt.off-nav-123 .link a,
nav.off-menu_110 dt.off-nav-124 .link a,
nav.off-menu_110 dt.off-nav-125 .link a{
  font-family:'Arimo',sans-serif;font-size:clamp(10px,1vw,12px);letter-spacing:.16em;text-transform:uppercase;color:#666;
}

/* ---------- Footer ---------- */
.lp-footer{background:#050505;color:#cfcfcf;padding:70px 6vw 40px;border-top:1px solid rgba(215,191,122,.22);box-shadow:0 -1px 30px rgba(0,0,0,.55) inset;}
.lp-footer .foot-grid{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;gap:48px;justify-content:space-between;}
.lp-footer .foot-col{min-width:150px;}
.lp-footer h4{font-family:'Arimo',sans-serif;font-size:13px;letter-spacing:.18em;color:var(--gold);margin:0 0 18px;font-weight:600;text-transform:uppercase;}
.lp-footer a,.lp-footer p{font-family:'Arimo',sans-serif;font-size:14px;color:#cfcfcf;line-height:2;letter-spacing:.04em;}
.lp-footer a:hover{color:#fff;}
.lp-footer .foot-social a{margin-right:10px;}
.lp-footer .foot-logo{width:120px;margin:40px auto 0;opacity:.9;}
.lp-footer .foot-bottom{max-width:1200px;margin:30px auto 0;border-top:1px solid rgba(255,255,255,.08);padding-top:20px;text-align:center;font-size:12px;color:#8a8a8a;letter-spacing:.06em;}

/* ========================================================
   HOME sections
   ======================================================== */
/* 1 — hero video */
.home-hero{background:#000;}
.home-hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.home-hero .hero-logo{position:absolute;top:26px;left:50%;transform:translateX(-50%);z-index:4;width:96px;height:auto;filter:brightness(0) invert(1);pointer-events:none;}
.home-hero .lpme-scroll-wrap{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);z-index:3;}

/* === LPME Scroll Indicator (gold) — user's exact styling === */
.lpme-scroll-wrap{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.lpme-scroll-line{width:2px;height:64px;background:rgb(230,197,73);border-radius:2px;overflow:hidden;position:relative;margin-bottom:10px;}
.lpme-scroll-line::after{content:"";position:absolute;left:0;right:0;top:-40%;width:100%;height:32%;background:rgba(255,255,255,0.9);border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.5) inset;animation:lpmeScrollSlug 2.2s ease-in-out infinite;}
.lpme-scroll-text{font-size:12px;letter-spacing:3px;color:rgb(230,197,73);font-family:"Gill Sans","Arimo",sans-serif;text-transform:uppercase;}
@keyframes lpmeScrollSlug{0%{top:-40%}50%{top:35%}100%{top:110%}}

/* 2 — tagline */
.home-tagline{background:#0b0b0b;text-align:center;padding:8vh 6vw;}
.home-tagline .tag-fx{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.5;}
.home-tagline .tag{position:relative;z-index:1;
  font-family:'Vollkorn',serif;color:#fff;font-weight:400;
  font-size:clamp(22px,3.1vw,34px);line-height:1.5;letter-spacing:2px;text-transform:uppercase;
}
.home-tagline .tag .accent{font-family:'Carattere',cursive;color:var(--gold);text-transform:none;font-weight:400;}
.home-tagline .tag .accent.big{font-size:1.7em;}

/* 4 — what we do (compact, sits just above services) */
.home-what{background:#0b0b0b;flex-direction:column;text-align:center;gap:6px;min-height:auto;padding:9vh 4vw 3vh;}
.home-what .eyebrow{font-family:'Arimo',sans-serif;color:var(--gold2);font-size:clamp(15px,1.6vw,18px);letter-spacing:1px;}
.home-what .title{font-family:'Tinos',serif;color:#fff;font-size:clamp(34px,5vw,64px);font-weight:400;margin:.2em 0 0;}

/* 5 — services grid */
.home-services{background:#0b0b0b;flex-direction:column;padding:6vh 4vw;}
.svc-grid{width:100%;max-width:1280px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.svc-card{position:relative;aspect-ratio:1/1;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;}
.svc-card .svc-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.42);transition:transform .6s ease,filter .5s ease;}
.svc-card:hover .svc-bg,.svc-card.is-tapping .svc-bg{transform:scale(1.06);filter:brightness(.28);}
.svc-card .svc-content{position:relative;z-index:2;color:#fff;padding:20px;}
.svc-card h3{font-family:'Tinos',serif;font-weight:400;font-size:clamp(22px,2.4vw,30px);letter-spacing:.08em;margin:0 0 14px;}
.svc-card ul{list-style:none;margin:0;padding:0;opacity:0;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease;}
.svc-card:hover ul,.svc-card.is-tapping ul{opacity:1;transform:translateY(0);}
.svc-card li{font-family:'Arimo',sans-serif;font-size:14px;letter-spacing:.06em;line-height:1.9;color:#eaeaea;}
@media(max-width:820px){.svc-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.svc-grid{grid-template-columns:1fr;}}

/* 6 — about teaser (matches live: gold scroll bar → gold eyebrow → big serif headline → LEARN MORE) */
.home-about{background:#0b0b0b;flex-direction:column;text-align:center;gap:26px;padding:8vh 6vw;}
.home-about .eyebrow{font-family:'Arimo',sans-serif;color:var(--gold2);font-size:clamp(14px,1.5vw,17px);letter-spacing:.14em;text-transform:uppercase;margin:0;}
.home-about .headline{font-family:'Tinos',serif;color:#fff;font-weight:400;text-transform:uppercase;font-size:clamp(30px,4.4vw,58px);line-height:1.2;margin:0;letter-spacing:.02em;}
.home-about .headline .amp{font-family:'Carattere',cursive;color:var(--gold);text-transform:none;padding:0 .12em;}

/* tab-hero: keep Dolby/PMC logos on their own row so DISCOVER MORE stays centered below */
.home-tabs .lpme-logos{display:flex;justify-content:center;width:100%;}
/* inline-flex so the gold underline hugs the text width (not full width) */
.home-tabs .lpme-cta{display:inline-flex !important;flex-direction:column;align-items:center;}

/* remove the small logo at the top of the off-canvas menu */
nav.off-menu_110 .sm-logo{display:none !important;}

/* gold CTA (also used in tab hero via custom.css .lpme-cta) */
.lp-cta{display:inline-flex;flex-direction:column;align-items:center;gap:10px;margin-top:14px;}
.lp-cta a{color:var(--gold);text-transform:uppercase;letter-spacing:.08em;transition:letter-spacing .26s ease;font-family:'Arimo',sans-serif;font-size:14px;}
.lp-cta .lp-cta-line{height:2px;background:var(--gold);width:calc(100% + 16px);transition:transform .26s ease;}
.lp-cta:hover a{letter-spacing:4px;}
.lp-cta:hover .lp-cta-line{transform:scaleX(.6);}

/* home tab hero wrapper as a normal 100vh section */
.home-tabs{background:#000;}
.home-tabs .lpme-tabs-wrap{position:relative;inset:auto;width:100%;height:100vh;}

/* burger-dark marker (used by site.js to whiten burger over dark areas) */
.burger-dark{}

/* ---- MOBILE: menu panel scrolls + top-aligned so no items get clipped ---- */
@media (max-width:600px){
  nav.off-menu_110{width:min(100vw,340px);justify-content:flex-start;overflow-y:auto;padding:88px 0 40px;}
  nav.off-menu_110 dl.level1{padding:0 32px;}
  nav.off-menu_110 .link a{font-size:22px;line-height:1.55;}
  nav.off-menu_110 dt.off-nav-123 .link a,
  nav.off-menu_110 dt.off-nav-124 .link a,
  nav.off-menu_110 dt.off-nav-125 .link a{font-size:11px;}
}

/* ---- MOBILE: tighten section heights/gaps (phone only) ---- */
@media (max-width:600px){
  .lp-section{min-height:auto;}
  .home-hero{min-height:90vh;}
  .home-tabs{min-height:auto;}
  .home-tabs .lpme-tabs-wrap{height:auto;min-height:70vh;}
  .home-tagline{padding:8vh 6vw;}
  .home-services{padding:7vh 5vw;}
  .home-about{padding:8vh 6vw;gap:16px;}
  .home-what{padding:7vh 5vw 2vh;}
  .lp-block{padding:7vh 6vw;}
  .lp-hero{min-height:90vh;}
  .lp-hero-simple{min-height:auto;padding:16vh 6vw 8vh;}
  .about-beast{min-height:80vh;}
  .about-mv .row,.about-mv .row-mission{min-height:auto;}
  .about-values .av-head{padding:5vh 6vw 1vh;}
  .contact-section{padding:8vh 6vw;}
  .contact-inquiry{padding:8vh 7vw;}
}
