/*
Theme Name: The Flying Kite Studios
Theme URI: https://www.theflyingkitestudios.com/
Author: The Flying Kite Studios
Description: Custom WordPress theme for The Flying Kite Studios, a podcast & video production studio in Sector 38, Gurugram. Luxury Black + Champagne palette.
Version: 1.1
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: tfks
*/

:root{
  /* -------- Luxury Black + Champagne palette -------- */
  --bg:          #0B0B0D;   /* primary background — deep black */
  --bg-soft:     #17171A;   /* secondary background — soft black, used for alternating panels/cards */
  --gold:        #D6B77A;   /* main accent — champagne gold */
  --gold-light:  #E8D3A3;   /* light accent — warm champagne */
  --gold-deep:   #B8955A;   /* deep accent — gradient end / hover state */
  --gradient-gold: linear-gradient(135deg, #D6B77A 0%, #E8D3A3 55%, #B8955A 100%);
  --text:        #F5F3EE;   /* main text — off white */
  --text-soft:   #9A9A9A;   /* secondary text — soft gray */
  --line:        #2A2A2D;   /* border / divider — dark gray */
  --radius-pill: 999px;
  --max: 1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body.admin-bar .topbar{ top:32px; }
img{ max-width:100%; display:block; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{
  font-family:'Archivo',sans-serif;
  font-weight:800;
  line-height:1.05;
  margin:0 0 .5em;
  letter-spacing:-0.01em;
  color:var(--text);
}
p{ margin:0 0 1em; color:var(--text-soft); max-width:62ch; }
.container{ max-width:var(--max); margin:0 auto; padding:0 24px; }

/* corner-bracket motif (camera-viewfinder framing) */
.bracketed{ position:relative; }
.bracketed::before,.bracketed::after{
  content:""; position:absolute; width:22px; height:22px;
  border:2.5px solid var(--gold); z-index:2;
}
.bracketed::before{ top:-2px; left:-2px; border-right:none; border-bottom:none; }
.bracketed::after{ bottom:-2px; right:-2px; border-left:none; border-top:none; }

/* top bar */
.topbar{ position:sticky; top:0; z-index:50; background:rgba(11,11,13,0.88); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.topbar-inner{ max-width:var(--max); margin:0 auto; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand{ display:flex; align-items:center; gap:10px; font-family:'Archivo',sans-serif; font-weight:800; font-size:1.05rem; color:var(--text); }
.brand img{ height:34px; width:34px; object-fit:contain; border-radius:4px; }
.nav-links{ display:flex; gap:28px; font-size:0.95rem; font-weight:600; }
.nav-links li{ position:relative; }
.nav-links a{ position:relative; padding:4px 0; color:var(--text); display:inline-block; }
.nav-links .menu-item-has-children > a::after{ content:"▾"; font-size:0.6em; margin-left:6px; opacity:.8; vertical-align:middle; }
.nav-links .sub-menu{
  display:none; position:absolute; top:calc(100% + 14px); left:0;
  background:var(--bg-soft); border:1px solid var(--line); min-width:280px;
  padding:8px 0; z-index:60; box-shadow:0 18px 40px rgba(0,0,0,0.45);
}
.nav-links .sub-menu::before{ content:""; position:absolute; top:-3px; left:0; right:0; height:3px; background:var(--gradient-gold); }
.nav-links li.menu-item-has-children:hover > .sub-menu,
.nav-links li.menu-item-has-children.open > .sub-menu{ display:block; }
.nav-links .sub-menu a{ display:block; padding:11px 20px; font-size:0.88rem; font-weight:600; white-space:nowrap; color:var(--text-soft); }
.nav-links .sub-menu a:hover{ color:var(--gold); }
.nav-links .sub-menu a::after{ content:none; }
.nav-links .current-menu-item a,
.nav-links .current_page_item a,
.nav-links a.active{ color:var(--gold); }
.nav-links .current-menu-item a::after,
.nav-links .current_page_item a::after,
.nav-links a.active::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--gradient-gold); }
.topbar-cta{ display:flex; align-items:center; gap:16px; }
.nav-toggle{ display:none; background:none; border:none; cursor:pointer; padding:6px; }
.nav-toggle span{ display:block; width:24px; height:2px; background:var(--text); margin:5px 0; }

/* social icons */
.social-icons{ display:flex; align-items:center; gap:14px; }
.social-icons a{ color:var(--text-soft); display:flex; transition:color .15s ease, transform .15s ease; }
.social-icons a:hover{ color:var(--gold); transform:translateY(-1px); }
.social-icons svg{ width:19px; height:19px; fill:currentColor; }

/* buttons */
.btn{ display:inline-flex; align-items:center; gap:8px; padding:13px 26px; border-radius:var(--radius-pill); font-weight:700; font-size:0.95rem; font-family:'Inter',sans-serif; border:1.5px solid transparent; cursor:pointer; white-space:nowrap; transition:transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease; }
.btn-gold{ background:var(--gradient-gold); color:var(--bg); }
.btn-gold:hover{ filter:brightness(1.08); transform:translateY(-1px); color:var(--bg); }
.btn-ghost{ border-color:var(--gold); color:var(--text); background:transparent; }
.btn-ghost:hover{ background:var(--gradient-gold); color:var(--bg); border-color:transparent; }
.btn-sm{ padding:9px 18px; font-size:0.85rem; }

/* hero */
.hero{ padding:64px 0 56px; }
.hero-grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center; }
.eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:0.85rem; font-weight:700; color:var(--gold); margin-bottom:18px; }
.eyebrow::before{ content:""; width:8px; height:8px; background:var(--gradient-gold); border-radius:50%; }
.hero h1{ font-size:clamp(2.4rem,5vw,3.6rem); }
.hero .lede{ font-size:1.1rem; max-width:46ch; margin-bottom:28px; color:var(--text-soft); }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:28px; }
.hero-facts{ display:flex; flex-wrap:wrap; gap:0; border-top:1px solid var(--line); padding-top:18px; }
.hero-facts span{ font-size:0.82rem; font-weight:600; color:var(--text-soft); padding:4px 18px 4px 0; margin-right:18px; border-right:1px solid var(--line); }
.hero-facts span:last-child{ border-right:none; }
.hero-mosaic{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.hero-mosaic img{ width:100%; height:100%; object-fit:cover; }
.hero-mosaic .m1{ grid-row:span 2; aspect-ratio:3/4; }
.hero-mosaic .m2{ aspect-ratio:4/3; }
.hero-mosaic .m3{ aspect-ratio:4/3; }

/* sections */
section{ padding:72px 0; }
.section-head{ max-width:640px; margin-bottom:44px; }
.section-head .eyebrow{ margin-bottom:14px; }
.section-head h2{ font-size:clamp(1.8rem,3.4vw,2.6rem); }

/* studio sets */
.sets-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.set-card .img-wrap{ aspect-ratio:4/3; overflow:hidden; margin-bottom:16px; background:var(--bg-soft); }
.set-card .img-wrap img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.set-card:hover .img-wrap img{ transform:scale(1.04); }
.set-card .tag{ font-size:0.78rem; font-weight:700; color:var(--gold); text-transform:uppercase; letter-spacing:.04em; }
.set-card h3{ font-size:1.15rem; margin:6px 0 6px; text-transform:uppercase; letter-spacing:.01em; }
.set-card .set-num{ color:var(--gold); font-weight:800; margin-right:4px; }
.chips{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.chip{ font-size:0.75rem; font-weight:600; border:1px solid var(--line); padding:5px 12px; border-radius:var(--radius-pill); color:var(--text-soft); }

/* why grid */
.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.why-item{ background:var(--bg-soft); padding:32px 28px; }
.why-item h3{ font-size:1.05rem; margin-bottom:8px; }
.why-item p{ font-size:0.92rem; margin:0; }

/* steps */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:36px; }
.step .num{ font-family:'Archivo',sans-serif; font-weight:800; font-size:0.85rem; color:var(--gold); margin-bottom:10px; }
.step h3{ font-size:1.15rem; }

/* soft-black band (used for alternating sections — Why, Testimonials) */
.band-dark{ background:var(--bg-soft); position:relative; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.band-dark::before{ content:""; position:absolute; top:-1px; left:0; right:0; height:3px; background:var(--gradient-gold); }

/* testimonials — right-to-left marquee */
.testi-section{ padding-bottom:56px; overflow:hidden; }
.testi-marquee{ overflow:hidden; margin-top:12px; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
.testi-track{ display:flex; gap:22px; width:max-content; padding:4px 24px; animation:tfks-testi-marquee 40s linear infinite; }
.testi-marquee:hover .testi-track{ animation-play-state:paused; }
.testi-card{ display:flex; gap:18px; align-items:flex-start; width:min(31vw,400px); flex:0 0 auto; border:1px solid var(--line); background:var(--bg); padding:24px; }
.testi-photo{ width:72px; height:72px; border-radius:50%; overflow:hidden; flex:0 0 auto; border:2px solid var(--gold); }
.testi-photo img{ width:100%; height:100%; object-fit:cover; }
.testi-body{ min-width:0; }
.testi-quote-mark{ font-family:'Archivo',sans-serif; font-size:1.8rem; line-height:1; color:var(--gold); margin-bottom:2px; }
.testi-body p{ color:var(--text-soft); font-size:0.85rem; line-height:1.55; margin-bottom:12px; }
.testi-name{ font-size:0.9rem; font-weight:700; color:var(--text); }
.testi-role{ font-size:0.78rem; color:var(--text-soft); margin-bottom:8px; }
.testi-body .stars{ color:var(--gold); letter-spacing:2px; font-size:0.82rem; }
@keyframes tfks-testi-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (max-width:900px){
  .testi-card{ width:70vw; }
}
@media (max-width:640px){
  .testi-card{ width:88vw; }
}

/* blog cards */
.blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.blog-card{ display:block; }
.blog-card .img-wrap{ aspect-ratio:16/10; overflow:hidden; margin-bottom:14px; background:var(--bg-soft); }
.blog-card .img-wrap img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.blog-card:hover .img-wrap img{ transform:scale(1.04); }
.blog-card .meta{ font-size:0.78rem; font-weight:700; color:var(--gold); text-transform:uppercase; letter-spacing:.03em; margin-bottom:8px; }
.blog-card h3{ font-size:1.1rem; margin-bottom:8px; }
.blog-card .excerpt{ font-size:0.92rem; }
.blog-card .readmore{ font-size:0.85rem; font-weight:700; color:var(--gold-light); }

/* CTA band */
.cta-band{ text-align:center; padding:80px 0; }
.cta-band h2{ font-size:clamp(1.9rem,4vw,2.8rem); max-width:14ch; margin:0 auto 14px; }
.cta-band p{ margin:0 auto 30px; }
.cta-band .hero-ctas{ justify-content:center; }

/* footer */
footer{ border-top:1px solid var(--line); padding:48px 0 28px; background:var(--bg); }
.footer-grid{ display:grid; grid-template-columns:1.3fr 0.8fr 1fr 0.8fr; gap:40px; margin-bottom:36px; }
.footer-brand .brand{ margin-bottom:14px; }
.footer-brand p{ font-size:0.9rem; }
.footer-col h4{ font-family:'Inter',sans-serif; font-weight:700; font-size:0.85rem; text-transform:uppercase; letter-spacing:.04em; margin-bottom:14px; color:var(--text-soft); }
.footer-col a{ display:block; font-size:0.92rem; padding:5px 0; color:var(--text-soft); }
.footer-col a:hover{ color:var(--gold); }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding-top:24px; border-top:1px solid var(--line); font-size:0.82rem; color:var(--text-soft); }

/* inner page hero */
.page-hero{ padding:52px 0 40px; border-bottom:1px solid var(--line); }
.page-hero .eyebrow{ margin-bottom:14px; }
.page-hero h1{ font-size:clamp(2rem,4.4vw,3rem); }
.page-hero p{ font-size:1.05rem; max-width:56ch; color:var(--text-soft); }

/* about page */
.about-split{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.about-split img{ aspect-ratio:4/3.2; object-fit:cover; width:100%; }
.value-list{ display:grid; gap:18px; margin-top:10px; }
.value-list li{ display:flex; gap:14px; border-bottom:1px solid var(--line); padding-bottom:18px; }
.value-list .mark{ font-family:'Archivo',sans-serif; font-weight:800; color:var(--gold); flex:0 0 auto; }

/* contact page */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; }
.contact-card{ border:1px solid var(--line); padding:30px; margin-bottom:16px; background:var(--bg-soft); }
.contact-card h3{ font-size:1rem; margin-bottom:6px; color:var(--text-soft); }
.contact-card a.big{ font-family:'Archivo',sans-serif; font-weight:800; font-size:1.3rem; color:var(--gold-light); }
.map-embed{ border:1px solid var(--line); aspect-ratio:4/3; width:100%; filter:grayscale(0.3) invert(0.92) contrast(0.9); }
.hours-table{ width:100%; border-collapse:collapse; margin-top:8px; }
.hours-table td{ padding:8px 0; font-size:0.92rem; border-bottom:1px solid var(--line); color:var(--text-soft); }
.hours-table td:last-child{ text-align:right; font-weight:600; color:var(--text); }

/* blog listing / single post / search */
.blog-toolbar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:36px; flex-wrap:wrap; gap:16px; }
.search-form{ display:flex; align-items:center; gap:10px; border:1px solid var(--line); padding:10px 16px; min-width:260px; background:var(--bg-soft); }
.search-form input[type="search"]{ border:none; background:transparent; outline:none; font-family:'Inter',sans-serif; font-size:0.92rem; width:100%; color:var(--text); }
.search-form label{ display:flex; align-items:center; gap:10px; width:100%; color:var(--text-soft); }
.search-form button{ background:none; border:none; cursor:pointer; padding:0; color:var(--text-soft); }
.empty-state{ padding:60px 0; text-align:center; color:var(--text-soft); }

.post-hero-img{ width:100%; aspect-ratio:16/7; object-fit:cover; margin:28px 0 36px; background:var(--bg-soft); }
.post-body{ max-width:70ch; font-size:1.05rem; }
.post-body p{ max-width:none; font-size:1.05rem; color:var(--text-soft); margin-bottom:1.2em; }
.post-body h2{ font-size:1.5rem; margin-top:1.6em; color:var(--text); }
.post-body h3{ font-size:1.2rem; margin-top:1.4em; color:var(--text); }
.post-body img{ margin:1.4em 0; }
.post-body a{ color:var(--gold-light); text-decoration:underline; }
.post-meta-row{ display:flex; gap:18px; align-items:center; flex-wrap:wrap; font-size:0.85rem; color:var(--text-soft); font-weight:600; margin-bottom:6px; }
.post-meta-row .dot{ width:4px; height:4px; background:var(--text-soft); border-radius:50%; }
.back-link{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:0.9rem; margin-bottom:24px; color:var(--gold); }

/* legal / generic page content */
.legal-body{ max-width:74ch; }
.legal-body h2{ font-size:1.3rem; margin-top:1.8em; color:var(--text); }
.legal-body p{ max-width:none; color:var(--text-soft); }
.legal-body a{ color:var(--gold-light); }

/* trusted by */
.trusted-by{ padding:72px 0; }
.trusted-by-inner{ display:grid; grid-template-columns:0.9fr 1.4fr; gap:56px; align-items:center; }
.trusted-by-copy h2{ font-size:clamp(1.7rem,3.2vw,2.4rem); }
.trusted-by-copy p{ margin-bottom:22px; }
.trusted-by-caption{ font-size:0.9rem; color:var(--text-soft); margin-bottom:24px; }
.trusted-by-logos-grid{ display:flex; flex-wrap:wrap; align-items:center; gap:36px 52px; }
.trusted-by-note{ margin-top:26px; font-size:0.85rem; color:var(--gold); font-weight:700; text-align:right; }
.trusted-by-logo{ display:flex; align-items:center; justify-content:center; height:44px; flex:0 0 auto; opacity:.9; transition:opacity .2s ease, transform .2s ease; }
.trusted-by-logo:hover{ opacity:1; transform:translateY(-2px); }
.trusted-by-logo img{ height:100%; width:auto; max-width:150px; object-fit:contain; }
@media (max-width:900px){
  .trusted-by-inner{ grid-template-columns:1fr; }
  .trusted-by-note{ text-align:left; }
}
/* pagination */
.pagination{ display:flex; gap:10px; justify-content:center; margin-top:48px; flex-wrap:wrap; }
.pagination .page-numbers{ border:1px solid var(--line); padding:9px 16px; font-size:0.88rem; font-weight:600; color:var(--text-soft); }
.pagination .page-numbers.current{ background:var(--gradient-gold); color:var(--bg); border-color:transparent; }
.pagination a.page-numbers:hover{ background:var(--bg-soft); color:var(--text); }

/* responsive */
@media (max-width:900px){
  .hero-grid,.about-split,.contact-grid{ grid-template-columns:1fr; }
  .hero-mosaic{ order:-1; }
  .sets-grid,.why-grid,.steps,.blog-grid{ grid-template-columns:repeat(2,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .nav-links{ position:absolute; top:100%; left:0; right:0; background:var(--bg); flex-direction:column; gap:0; border-bottom:1px solid var(--line); display:none; }
  .nav-links.open{ display:flex; }
  .nav-links a{ padding:16px 24px; border-bottom:1px solid var(--line); }
  .nav-links .menu-item-has-children > a::after{ float:right; }
  .nav-links .sub-menu{ position:static; display:none; box-shadow:none; border:none; border-top:1px solid var(--line); min-width:0; }
  .nav-links .sub-menu::before{ content:none; }
  .nav-links li.menu-item-has-children.open > .sub-menu{ display:block; }
  .nav-links .sub-menu a{ padding:14px 24px 14px 40px; }
  .nav-toggle{ display:block; }
  .sets-grid,.why-grid,.steps,.blog-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .hero-mosaic{ grid-template-columns:1fr 1fr; }
}