
/* Premium baseline */
body.premium { background:#0a0a0d; color:#e6e8ee; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
.nav-sticky{ position: sticky; top:0; z-index: 50; backdrop-filter: blur(8px); background: rgba(10,10,13,0.6); border-bottom: 1px solid rgba(255,255,255,0.08); }
.nav-inner{ max-width: 1200px; margin:0 auto; padding:.75rem 1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand span{ font-weight:800; letter-spacing:.06em; }
nav a{ color:#e6e8ee; text-decoration:none; margin-left:1rem; opacity:.9; }
nav a:hover{ opacity:1; }

.hero-full{ position:relative; min-height:88vh; display:grid; place-items:center; text-align:center; }
.hero-full .hero-bg{ position:absolute; inset:0; overflow:hidden; }
.hero-full .hero-bg iframe{ position:absolute; inset:0; width:100%; height:100%; }
.hero-full .hero-overlay{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(10,10,13,.55), rgba(10,10,13,.75)); }
.hero-full .hero-content{ position:relative; max-width:1000px; padding:0 1rem; }
.hero-full .tagline{ font-size: clamp(1.25rem, 2.2vw, 2rem); line-height:1.45; font-weight:700; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.35); }
.cta-row{ margin-top:1.25rem; display:flex; gap:.75rem; justify-content:center; }
.btn{ display:inline-block; padding:.8rem 1.1rem; border-radius:999px; border:1px solid rgba(255,255,255,0.3); color:#fff; text-decoration:none; }
.btn.primary{ background:#e11d48; border-color:#e11d48; }
.btn:hover{ filter:brightness(1.05); }

.section{ max-width:1200px; margin:3rem auto; padding:0 1rem; }
.section h2{ font-size:1.6rem; margin-bottom:1rem; }

.card-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap:1rem; }
.card{ background:#11131a; border:1px solid rgba(255,255,255,0.08); border-radius:16px; overflow:hidden; text-decoration:none; color:#e6e8ee; }
.card .media{ height:160px; background: linear-gradient(180deg, #12141c, #0d0f15); }
.card .body{ padding:1rem; }
.card .link{ color:#9ab3ff; font-size:.95rem; }
.card:hover{ transform: translateY(-3px); transition: transform .15s ease; }

.trust{ border-top:1px solid rgba(255,255,255,0.08); border-bottom:1px solid rgba(255,255,255,0.08); background:#0c0d12; }
.trust-inner{ max-width:1200px; margin:0 auto; padding:.8rem 1rem; display:flex; gap:1rem; align-items:center; }
.trust-inner ul{ display:flex; gap:1rem; list-style:none; padding:0; margin:0; opacity:.85; }

.featured-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap:1rem; }
.feature-card{ position:relative; background:#11131a; border:1px solid rgba(255,255,255,0.08); border-radius:16px; overflow:hidden; display:block; color:#e6e8ee; text-decoration:none; }
.feature-card img{ width:100%; display:block; }
.feature-card .caption{ padding:.85rem 1rem; }

.portfolio-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap:1rem; }
.portfolio-card{ background:#11131a; border:1px solid rgba(255,255,255,0.08); border-radius:16px; overflow:hidden; display:block; color:#e6e8ee; text-decoration:none; }
.portfolio-card img{ width:100%; display:block; }
.portfolio-card .body{ padding:.85rem 1rem; }

/* Docs autoplay card */
.portfolio-card.video-card-docs { position: relative; }
.portfolio-card .video-wrap { position: relative; width: 100%; padding-top: 56.25%; overflow: hidden; background: #000; }
.portfolio-card .video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.unmute-btn { position: absolute; right: 10px; bottom: 10px; z-index: 3; background: rgba(0,0,0,0.6); color:#fff; border: 1px solid rgba(255,255,255,0.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn:hover { background: rgba(0,0,0,0.8); }

.about-two{ display:grid; grid-template-columns:1.2fr .8fr; gap:1.25rem; align-items:center; }
.about-two .photo img{ width:100%; border-radius:16px; display:block; }

.contact-cta{ text-align:center; }
.contact-form{ max-width:720px; margin:1rem auto 0; text-align:left; }
.contact-form .form-row{ display:flex; gap:.75rem; margin-bottom:.75rem; }
.contact-form input, .contact-form textarea{ width:100%; background:#0f1117; border:1px solid rgba(255,255,255,0.12); color:#e6e8ee; border-radius:10px; padding:.8rem; }
@media (max-width:900px){ .about-two{ grid-template-columns:1fr; } .hero-full{ min-height:70vh; } }
@media (max-width:720px){ .contact-form .form-row{ flex-direction:column; } }

/* Service card video embed */
.media.thumb.video-wrap.service-video { position: relative; height: auto; padding-top: 56.25%; background:#000; }
.media.thumb.video-wrap.service-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.unmute-btn--service { position: absolute; right: 10px; bottom: 10px; z-index: 3; background: rgba(0,0,0,0.6); color:#fff; border: 1px solid rgba(255,255,255,0.35); border-radius: 999px; padding: .45rem .6rem; cursor: pointer; font-size: .95rem; line-height: 1; }
.unmute-btn--service:hover { background: rgba(0,0,0,0.8); }


/* Documentaries card video + poster */
.video-card-docs .video-wrap { position: relative; padding-top: 56.25%; background:#000; }
.video-card-docs .video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border:0; }
.video-card-docs .video-wrap .poster { position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.9); }
.video-card-docs .unmute-btn--docs { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.video-card-docs .unmute-btn--docs:hover { background:rgba(0,0,0,.8); }



/* Videography & Photography service video */
.media.thumb.video-wrap.service-video-vp { position: relative; height:auto; padding-top:56.25%; background:#000; }
.media.thumb.video-wrap.service-video-vp iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.unmute-btn--vp { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--vp:hover { background:rgba(0,0,0,.8); }



/* Music Videos service video */
.media.thumb.video-wrap.service-video-mv { position: relative; height:auto; padding-top:56.25%; background:#000; }
.media.thumb.video-wrap.service-video-mv iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.unmute-btn--mv { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--mv:hover { background:rgba(0,0,0,.8); }



/* Logos & Graphic Design service video */
.media.thumb.video-wrap.service-video-lgd { position: relative; height:auto; padding-top:56.25%; background:#000; }
.media.thumb.video-wrap.service-video-lgd video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border:0; }
.unmute-btn--lgd { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--lgd:hover { background:rgba(0,0,0,.8); }



/* Commercials & Brand Packages service video */
.media.thumb.video-wrap.service-video-cbp { position: relative; height:auto; padding-top:56.25%; background:#000; }
.media.thumb.video-wrap.service-video-cbp .poster { position:absolute; inset:0; background: linear-gradient(180deg, #12141c, #0d0f15); }
.media.thumb.video-wrap.service-video-cbp iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.unmute-btn--cbp { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--cbp:hover { background:rgba(0,0,0,.8); }



/* Aerial Cinematography (Drone) service video */
.media.thumb.video-wrap.service-video-drone { position: relative; height:auto; padding-top:56.25%; background:#000; }
.media.thumb.video-wrap.service-video-drone .poster { position:absolute; inset:0; background: linear-gradient(180deg, #12141c, #0d0f15); }
.media.thumb.video-wrap.service-video-drone iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.unmute-btn--drone { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--drone:hover { background:rgba(0,0,0,.8); }



/* Music Videos video */
.video-card-music .video-wrap,
.service-video-music { position: relative; width:100%; padding-top:56.25%; background:#000; }
.video-card-music .video-wrap .poster,
.service-video-music .poster { position:absolute; inset:0; background: linear-gradient(180deg, #12141c, #0d0f15); }
.video-card-music .video-wrap iframe,
.service-video-music iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.unmute-btn--music { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--music:hover { background:rgba(0,0,0,.8); }



/* Service-level Documentaries card */
.media.thumb.video-wrap.service-video-docs { position: relative; height:auto; padding-top:56.25%; background:#000; }
.media.thumb.video-wrap.service-video-docs .poster { position:absolute; inset:0; background: linear-gradient(180deg, #12141c, #0d0f15); }
.media.thumb.video-wrap.service-video-docs iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.unmute-btn--docs-service { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--docs-service:hover { background:rgba(0,0,0,.8); }



/* Product Commercials autoplay video (dual-source) */
.service-video-product { position: relative; width:100%; background:#000; }
.service-video-product video { width:100%; height:auto; display:block; object-fit:cover; }
.unmute-btn--product { position:absolute; right:10px; bottom:10px; z-index:3; background:rgba(0,0,0,.6); color:#fff;
  border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.45rem .6rem; cursor:pointer; font-size:.95rem; line-height:1; }
.unmute-btn--product:hover { background:rgba(0,0,0,.82); }


.hero--yt .yt-hero-wrap{position:relative;width:100%;background:#000}.hero--yt .yt-hero-embed{position:relative;width:100%;padding-top:56.25%;overflow:hidden}.hero--yt .yt-hero-embed iframe,.hero--yt .yt-hero-embed #homeYTHolder{position:absolute;top:0;left:0;width:100%;height:100%}.yt-unmute-btn{position:absolute;right:14px;bottom:14px;z-index:5;background:rgba(0,0,0,.6);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:.5rem .7rem;font-size:1rem;line-height:1;cursor:pointer}.yt-unmute-btn:hover{background:rgba(0,0,0,.82)}


/* === YT HERO: Proper full-bleed cover, ratio-safe, centered (injected) === */
.hero--yt{min-height:100vh}
.hero--yt .yt-hero-wrap{position:relative;width:100vw;height:100vh;overflow:hidden;background:#000}
.hero--yt .yt-hero-embed{position:absolute;inset:0;overflow:hidden}
.hero--yt .yt-hero-embed iframe{
  position:absolute;top:50%;left:50%;
  width:100vw;height:56.25vw;transform:translate(-50%,-50%);
  pointer-events:none!important
}
@media (max-aspect-ratio: 16/9){
  .hero--yt .yt-hero-embed iframe{width:177.78vh;height:100vh}
}
.yt-unmute-btn{position:absolute;right:14px;bottom:14px;z-index:5;background:rgba(0,0,0,.6);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:.5rem .7rem;font-size:1rem;line-height:1;cursor:pointer}
.yt-unmute-btn:hover{background:rgba(0,0,0,.82)}

