/*
Theme Name: Studio Doral
Theme URI: https://studiodoral.com
Author: Studio Doral
Description: Custom theme for the Studio Doral production facility landing page.
Version: 1.0
Text Domain: studiodoral
*/

* { box-sizing: border-box; }

:root{
  --void:#0A0B0D;
  --panel:#101114;
  --panel-dark:#08090A;
  --cyc:#F1EEE7;
  --tally:#E8342B;
  --blue:#4C7CFB;
  --steel:#7A8290;
  --amber:#F5A623;
}

html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter',sans-serif;
  background:var(--void);
  color:var(--cyc);
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;}

.mono{font-family:'IBM Plex Mono',monospace;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:3px;text-transform:uppercase;
  color:var(--tally);display:flex;align-items:center;gap:10px;justify-content:center;margin-bottom:22px;
}
.dot{width:9px;height:9px;border-radius:50%;background:var(--tally);box-shadow:0 0 12px var(--tally);animation:pulse 1.4s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.35;transform:scale(.75);}}

/* HEADER / NAV */
.site-header{position:absolute;top:0;left:0;right:0;z-index:50;background:transparent;padding:38px 24px 20px;}
.site-header-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;}
.site-logo{display:inline-flex;align-items:center;}
.site-logo img,.site-logo-img{height:77px;width:auto;filter:drop-shadow(0 2px 10px rgba(0,0,0,.6));}
.custom-logo{height:77px;width:auto;filter:drop-shadow(0 2px 10px rgba(0,0,0,.6));}
.site-nav a{margin-left:28px;font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:1px;text-transform:uppercase;text-decoration:none;color:var(--steel);transition:.2s;text-shadow:0 2px 8px rgba(0,0,0,.7);}
.site-nav a:hover{color:var(--cyc);}

/* HERO */
.hero{position:relative;min-height:92vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px 24px;isolation:isolate;
background-size:cover;background-position:center 35%;background-repeat:no-repeat;}
.hero-overlay{position:absolute;inset:0;z-index:-3;
background:linear-gradient(180deg,rgba(10,11,13,.55) 0%,rgba(10,11,13,.35) 35%,rgba(10,11,13,.65) 75%,rgba(10,11,13,.92) 100%);}
.grid-bg{position:absolute;inset:0;z-index:-2;opacity:.5;
background-image:linear-gradient(rgba(76,124,251,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(76,124,251,.14) 1px,transparent 1px);
background-size:56px 56px;animation:drift 22s linear infinite;mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 40%,transparent 90%);}
@keyframes drift{0%{background-position:0 0;}100%{background-position:56px 56px;}}
.sweep{position:absolute;inset:0;z-index:-1;opacity:.6;background:conic-gradient(from 0deg at 50% 30%,transparent 0deg,rgba(76,124,251,.10) 40deg,transparent 90deg);animation:sweep 9s linear infinite;}
@keyframes sweep{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
.hero h1{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(40px,7vw,88px);line-height:1.03;margin:0 0 22px;color:var(--cyc);max-width:1000px;}
.hero h1 span{color:var(--blue);}
.hero p{font-size:19px;line-height:1.6;color:var(--steel);max-width:620px;margin:0 auto 40px;}
.btn-row{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;}
.btn{font-family:'IBM Plex Mono',monospace;font-size:14px;letter-spacing:1px;text-transform:uppercase;padding:16px 34px;border-radius:2px;text-decoration:none;transition:.25s;display:inline-block;border:none;cursor:pointer;}
.btn-primary{background:var(--tally);color:#fff;}
.btn-primary:hover{background:#ff4a3f;}
.btn-ghost{border:1px solid var(--steel);color:var(--cyc);background:transparent;}
.btn-ghost:hover{border-color:var(--cyc);}

/* HUD STAT BAR */
.hud{border-top:1px solid rgba(122,130,144,.25);border-bottom:1px solid rgba(122,130,144,.25);background:var(--panel);}
.hud-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);}
.hud-item{padding:34px 20px;text-align:center;border-right:1px solid rgba(122,130,144,.2);}
.hud-item:last-child{border-right:none;}
.hud-num{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:34px;color:var(--blue);}
.hud-label{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--steel);margin-top:6px;}

/* SECTIONS */
.section{padding:110px 24px;max-width:1180px;margin:0 auto;}
.section-head{text-align:center;max-width:680px;margin:0 auto 64px;}
.section-head h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(30px,4vw,44px);color:var(--cyc);margin:14px 0 16px;}
.section-head p{color:var(--steel);font-size:17px;line-height:1.6;}

/* FULL-BLEED SECTION WITH BACKGROUND IMAGE */
.section-bg{position:relative;background-size:cover;background-position:center;isolation:isolate;}
.section-bg-overlay{position:absolute;inset:0;z-index:-1;background:rgba(10,11,13,.87);}
.section-inner{max-width:1180px;margin:0 auto;padding:110px 24px;}

/* STAGE CARDS */
.stages{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.stage-card{background:var(--panel);border:1px solid rgba(122,130,144,.22);border-left:3px solid var(--tally);padding:34px 28px;transition:.3s;}
.stage-card:nth-child(2){border-left-color:var(--blue);}
.stage-card:nth-child(3){border-left-color:var(--amber);}
.stage-card:hover{transform:translateY(-6px);border-color:rgba(241,238,231,.35);}
.stage-tag{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--steel);letter-spacing:2px;}
.stage-card h3{font-family:'Space Grotesk',sans-serif;font-size:26px;margin:10px 0 18px;color:var(--cyc);}
.stage-sqft{font-family:'Space Grotesk',sans-serif;font-size:46px;font-weight:700;color:var(--cyc);}
.stage-sqft small{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--steel);font-weight:400;}
.stage-list{margin-top:18px;padding:0;list-style:none;font-size:14px;color:var(--steel);line-height:2;}
.stage-list li:before{content:"— ";color:var(--blue);}

/* AMENITIES */
.amenities{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:rgba(122,130,144,.2);}
.amenity{background:var(--void);padding:34px 24px;}
.amenity h4{font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:1px;text-transform:uppercase;color:var(--blue);margin:0 0 10px;}
.amenity p{color:var(--steel);font-size:14px;line-height:1.6;margin:0;}

/* GALLERY */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:6px;}
.gallery img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(35%) contrast(1.05);transition:.4s;}
.gallery a:hover img{filter:grayscale(0%) contrast(1.1);transform:scale(1.04);}
.gallery a{overflow:hidden;display:block;}
.g-tall{grid-row:span 2;}
.g-wide{grid-column:span 2;}

/* LIGHTBOX */
.lightbox{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:40px;
opacity:0;visibility:hidden;transition:opacity .35s ease;}
.lightbox.is-open{opacity:1;visibility:visible;}
.lightbox-backdrop{position:absolute;inset:0;background:rgba(10,11,13,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);}
.lightbox-image{position:relative;max-width:90vw;max-height:88vh;width:auto;height:auto;object-fit:contain;
border-radius:2px;box-shadow:0 30px 80px rgba(0,0,0,.5);
transform:scale(.94);opacity:0;transition:transform .35s ease,opacity .35s ease;}
.lightbox.is-open .lightbox-image{transform:scale(1);opacity:1;}
.lightbox-close{position:absolute;top:28px;right:32px;z-index:201;width:44px;height:44px;border-radius:50%;
background:rgba(255,255,255,.06);border:1px solid rgba(122,130,144,.35);color:var(--cyc);
font-size:26px;line-height:1;font-family:'Inter',sans-serif;cursor:pointer;
display:flex;align-items:center;justify-content:center;transition:.2s;}
.lightbox-close:hover{background:var(--tally);border-color:var(--tally);color:#fff;transform:rotate(90deg);}
@media(max-width:600px){
.lightbox-close{top:16px;right:16px;width:38px;height:38px;font-size:22px;}
.lightbox{padding:16px;}
}

/* CONTACT FORM */
.form-wrap{max-width:760px;margin:0 auto;background:var(--panel);border:1px solid rgba(122,130,144,.22);padding:44px;}
.sd-honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-bottom:22px;}
.form-field{margin:0;}
.form-field label{display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--steel);margin-bottom:8px;}
.form-field input,.form-field textarea{
width:100%;background:var(--void);border:1px solid rgba(122,130,144,.35);color:var(--cyc);font-family:'Inter',sans-serif;font-size:15px;padding:13px 14px;border-radius:2px;outline:none;transition:.2s;}
.form-field input:focus,.form-field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue);}
.form-field textarea{min-height:130px;resize:vertical;}
.form-field-full{margin-bottom:26px;}
.form-submit{text-align:center;}
.form-submit .btn{border:none;cursor:pointer;}
.form-status{border-radius:2px;font-size:14px;padding:14px 18px;margin-bottom:24px;font-family:'Inter',sans-serif;}
.form-status-success{background:rgba(76,124,251,.12);border:1px solid rgba(76,124,251,.4);color:var(--cyc);}
.form-status-error{background:rgba(232,52,43,.1);border:1px solid rgba(232,52,43,.4);color:var(--cyc);}
.form-status a{color:var(--blue);}
.form-fallback{color:var(--steel);font-size:14px;text-align:center;}

/* CTA */
.cta{position:relative;padding:120px 24px;text-align:center;background:var(--panel);border-top:1px solid rgba(122,130,144,.25);background-size:cover;background-position:center;isolation:isolate;}
.cta-overlay{position:absolute;inset:0;z-index:-1;background:rgba(16,17,20,.84);}
.cta-logo-icon{height:52px;width:auto;margin:0 auto 20px;}
.cta h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(32px,5vw,52px);margin:14px 0 18px;}
.cta p{color:var(--steel);font-size:17px;max-width:560px;margin:0 auto 36px;}

/* FOOTER */
.site-footer{background:var(--panel-dark);border-top:1px solid rgba(122,130,144,.25);padding:70px 24px 30px;}
.footer-top{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:50px;}
.footer-brand-row{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.footer-logo-icon{height:32px;width:auto;}
.footer-tag{color:var(--steel);font-size:14px;line-height:1.7;max-width:320px;margin-top:0;}
.footer-col h5{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--cyc);margin:0 0 18px;}
.footer-col ul{list-style:none;margin:0;padding:0;}
.footer-col li{margin-bottom:12px;font-size:14px;color:var(--steel);line-height:1.6;}
.footer-col a{color:var(--steel);text-decoration:none;transition:.2s;}
.footer-col a:hover{color:var(--blue);}
.footer-bottom{max-width:1180px;margin:0 auto;border-top:1px solid rgba(122,130,144,.2);padding-top:26px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--steel);letter-spacing:.5px;}

/* STANDARD PAGE (non-front-page) */
.standard-page{max-width:800px;margin:0 auto;padding:140px 24px 100px;}
.standard-page h1{font-family:'Space Grotesk',sans-serif;font-size:42px;color:var(--cyc);margin-bottom:24px;}
.standard-page .entry-content{font-size:17px;line-height:1.8;color:var(--steel);}
.standard-page .entry-content a{color:var(--blue);}

@media(max-width:900px){
.stages{grid-template-columns:1fr;}
.amenities{grid-template-columns:repeat(2,1fr);}
.gallery{grid-template-columns:repeat(2,1fr);}
.hud-inner{grid-template-columns:repeat(2,1fr);}
.hud-item:nth-child(2n){border-right:none;}
.footer-top{grid-template-columns:1fr 1fr;}
.site-nav a{margin-left:16px;font-size:11px;}
.site-logo img,.site-logo-img,.custom-logo{height:58px;}
.hero-watermark{width:340px;opacity:.06;}
}
@media(max-width:560px){
.footer-top{grid-template-columns:1fr;}
.footer-bottom{flex-direction:column;}
.site-nav{display:none;}
.form-grid{grid-template-columns:1fr;}
.form-wrap{padding:28px 22px;}
}
@media(prefers-reduced-motion:reduce){.grid-bg,.sweep,.dot{animation:none;}}
