/*
Theme Name: Entegre Coming Soon — Outdoor Billboard (v5 Final)
Theme URI: https://entegrepack.com
Author: Entegre
Description: Final Coming Soon theme with simplified text block, YouTube billboard (with unmute), sectoral background and optional product mockups.
Version: 1.4.0
License: GPL-2.0-or-later
Text Domain: entegre-billboard-final-v5
*/
:root{--brand:#702fff;--dark:#0c1b2a;--ink:#0f172a;--muted:#64748b;--bg:#f7f8fb;--card:#ffffff;--steel:#e5e7eb}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink)}
a{color:var(--brand);text-decoration:none}
.header{display:flex;align-items:center;justify-content:space-between;padding:20px 28px}
.logo{font-weight:900;letter-spacing:.2px;color:var(--dark);font-size:20px}
.badge{padding:6px 10px;border-radius:999px;background:rgba(112,47,255,.10);color:var(--brand);font-weight:700;font-size:12px}
.hero{display:flex;align-items:center;justify-content:center;min-height:76vh;padding:28px}
.card{background:var(--card);border-radius:20px;box-shadow:0 16px 40px rgba(0,0,0,.06);padding:36px;max-width:1180px;width:100%}
.grid{display:grid;grid-template-columns:1.05fr 1fr;gap:28px}
@media (max-width: 1024px){.grid{grid-template-columns:1fr}.h1{font-size:32px}.scene{min-height:360px}}
.h1{font-size:44px;line-height:1.05;margin:0 0 12px 0;color:var(--dark);font-weight:900}
.h1 .brand{color:var(--brand)}
.lead{font-size:18px;color:var(--muted);margin:0 0 24px 0}
.scene{position:relative;border-radius:18px;background:linear-gradient(180deg,#e9eef7 0%, #dfe6f2 100%);border:1px solid var(--steel);overflow:hidden;min-height:420px}
.factory{position:absolute;inset:0;
  background:
    linear-gradient(to bottom, rgba(255,255,255,.0) 60%, rgba(0,0,0,.06) 100%),
    url('https://images.unsplash.com/photo-1582407947304-fd86f028f716?q=80&w=1600&auto=format&fit=crop');
  background-size:cover;background-position:center;
  filter:saturate(.95) contrast(1.05)}
.billboard{position:absolute;left:50%;transform:translateX(-50%);bottom:90px;width:min(86%, 880px)}
.mast{position:absolute;bottom:100%;left:12%;width:4px;height:130px;background:#d1d5db;box-shadow:0 0 0 4px rgba(0,0,0,.02)}
.mast::after{content:"";position:absolute;left:-80px;top:0;width:160px;height:6px;background:#d1d5db}
.frame{background:#0b1220;border-radius:14px;border:10px solid #0b1220;box-shadow:0 18px 40px rgba(0,0,0,.40), 0 6px 16px rgba(0,0,0,.25)}
.screen{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:#000}
.screen iframe{position:absolute;inset:0;width:100%;height:100%;display:block}
.label{position:absolute;left:14px;top:14px;background:rgba(17,24,39,.65);color:#fff;padding:6px 10px;border-radius:10px;font-size:12px;backdrop-filter:blur(3px)}
.crowd{position:absolute;left:50%;transform:translateX(-50%);bottom:0;height:90px;width:86%;display:flex;align-items:flex-end;justify-content:space-around;pointer-events:none}
.person{width:18px;height:54px;background:#f3f4f6;border-radius:8px}
.person::after{content:"";display:block;width:18px;height:18px;background:#fde68a;border-radius:50%;margin-top:-10px}
.prop{position:absolute;bottom:86px;opacity:.96;filter:drop-shadow(0 10px 20px rgba(0,0,0,.18))}
.prop.left{left:12px;max-width:18%}
.prop.right{right:12px;max-width:18%}
@media (max-width: 1024px){.prop{display:none}}
.controls{margin-top:10px;display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.btn{padding:10px 14px;border-radius:10px;border:1px solid var(--steel);background:#fff;cursor:pointer;font-weight:700}
.btn.primary{background:var(--brand);color:#fff;border-color:transparent}
.footer{padding:26px;text-align:center;color:#6b7280;font-size:13px}