/* ============================================================
   Sadik Anwar — shared site styles
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,500&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root{
  --cream:#F5F1E6;
  --cream-deep:#ECE5D3;
  --ink:#1C1A17;
  --muted:#6E6759;
  --maroon:#7A2331;
  --maroon-deep:#591926;
  --gold:#C9A24B;
  --gold-soft:#E4CD8C;
  --navy:#12162A;
  --navy-deep:#0B0E1C;
  --line:rgba(28,26,23,.12);
  --pad:clamp(20px,5vw,64px);
  --radius:10px;
  --shadow-sm:0 2px 10px rgba(28,26,23,.08);
  --shadow-md:0 14px 34px rgba(28,26,23,.14);
  --shadow-gold:0 10px 26px rgba(201,162,75,.28);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Fraunces',serif;
  font-weight:600;
  line-height:1.08;
  letter-spacing:-.01em;
  margin:0 0 .5em;
  color:var(--ink);
}
p{ margin:0 0 1em; color:var(--ink); }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ list-style:none; margin:0; padding:0; }

.wrap{ max-width:1180px; margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Inter',sans-serif; font-weight:700; font-size:.7rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--maroon);
  margin-bottom:16px;
}
.eyebrow svg{ width:30px; height:9px; }
.eyebrow svg path{ stroke:var(--maroon); }
.eyebrow.navy{ color:var(--navy); }
.eyebrow.navy svg path{ stroke:var(--navy); }
.eyebrow.gold-on-dark{ color:var(--gold-soft); }
.eyebrow.gold-on-dark svg path{ stroke:var(--gold-soft); }

hr.divider{ border:none; border-top:1px solid var(--line); margin:0; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 28px; border-radius:999px;
  font-family:'Inter',sans-serif; font-weight:600; font-size:.92rem;
  border:1.5px solid transparent; cursor:pointer;
  transition:transform .25s ease, box-shadow .25s ease, background-color .25s ease, color .25s ease, border-color .25s ease;
}
.btn-primary{
  background:#fff; color:var(--ink); border-color:#fff;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}
.btn-primary:hover{ background:var(--gold); border-color:var(--gold); color:var(--navy-deep); transform:translateY(-2px); box-shadow:var(--shadow-gold); }
.btn-ghost{ border-color:rgba(255,255,255,.5); color:#fff; }
.btn-ghost:hover{ background:rgba(255,255,255,.1); border-color:#fff; transform:translateY(-2px); }
.btn-maroon{ background:var(--maroon); color:#fff; border-color:var(--maroon); box-shadow:0 8px 20px rgba(122,35,49,.28); }
.btn-maroon:hover{ background:var(--maroon-deep); border-color:var(--maroon-deep); transform:translateY(-2px); box-shadow:0 12px 26px rgba(122,35,49,.36); }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(245,241,230,.88);
  backdrop-filter:blur(10px) saturate(1.1);
  border-bottom:1px solid var(--line);
}
.nav{
  max-width:1180px; margin:0 auto; padding:18px var(--pad);
  display:flex; align-items:center; justify-content:space-between;
}
.brand{ font-family:'Fraunces',serif; font-size:1.25rem; font-weight:600; color:var(--ink); }
.brand .dot{ color:var(--maroon); }
.nav-links{ display:flex; align-items:center; gap:30px; }
.nav-links a{
  font-size:.88rem; font-weight:500; color:var(--ink); opacity:.72;
  position:relative; padding-bottom:4px; transition:opacity .2s ease;
}
.nav-links a::after{
  content:''; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background:var(--maroon); transform:scaleX(0); transform-origin:left;
  transition:transform .3s ease;
}
.nav-links a:hover{ opacity:1; }
.nav-links a:hover::after,
.nav-links a.active::after{ transform:scaleX(1); }
.nav-links a.active{ opacity:1; color:var(--maroon); }

.nav-toggle{
  display:none; width:38px; height:38px; border:none; background:none; cursor:pointer;
  flex-direction:column; align-items:center; justify-content:center; gap:5px; position:relative; z-index:70;
}
.nav-toggle span{
  width:22px; height:2px; background:var(--ink); border-radius:2px;
  transition:transform .3s ease, opacity .3s ease;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:0; z-index:60;
  background:var(--navy-deep);
  display:flex; flex-direction:column; justify-content:center;
  padding:0 var(--pad);
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .35s ease, transform .35s ease, visibility 0s linear .35s;
}
.mobile-menu.open{
  opacity:1; visibility:visible; transform:translateY(0);
  transition:opacity .35s ease, transform .35s ease, visibility 0s;
}
.mobile-menu a{
  display:block; font-family:'Fraunces',serif; font-size:1.9rem; font-weight:500;
  color:#EDE7D6; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.1);
  opacity:0; transform:translateX(-14px);
  transition:opacity .35s ease, transform .35s ease, color .2s ease;
  position:relative;
}
.mobile-menu.open a{ opacity:1; transform:translateX(0); }
.mobile-menu a:nth-child(1){ transition-delay:.05s; }
.mobile-menu a:nth-child(2){ transition-delay:.1s; }
.mobile-menu a:nth-child(3){ transition-delay:.15s; }
.mobile-menu a:nth-child(4){ transition-delay:.2s; }
.mobile-menu a:nth-child(5){ transition-delay:.25s; }
.mobile-menu a:nth-child(6){ transition-delay:.3s; }
.mobile-menu a:nth-child(7){ transition-delay:.35s; }
.mobile-menu a:nth-child(8){ transition-delay:.4s; }
.mobile-menu a.active{ color:var(--gold-soft); }
.mobile-menu a:hover{ color:var(--gold-soft); padding-left:10px; }

@media (max-width:860px){
  .nav-links{ display:none; }
  .nav-toggle{ display:flex; }
}

/* ---------- Hero (cinematic, home) — auto-changing photo slideshow ---------- */
.hero-cinema{
  position:relative; min-height:88vh; overflow:hidden;
  background:var(--navy-deep);
  display:flex; align-items:flex-end;
}
.hero-slides{ position:absolute; inset:0; z-index:0; }
.hero-slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transition:opacity 1.6s ease;
}
.hero-slide.is-active{ opacity:1; }
.hero-cinema-overlay{
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(120% 90% at 18% 0%, rgba(122,35,49,.35) 0%, transparent 55%),
    linear-gradient(180deg, rgba(18,22,42,.35) 0%, rgba(11,14,28,.6) 55%, rgba(11,14,28,.94) 100%);
}
.hero-cinema::after{
  /* faint film-grain, sits above photos for a cohesive cinematic finish */
  content:'';
  position:absolute; inset:0; z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  mix-blend-mode:overlay; pointer-events:none;
}
.hero-cinema-content{
  position:relative; z-index:2; width:100%;
  padding-top:clamp(120px,20vw,190px); padding-bottom:clamp(64px,9vw,96px);
}
.hero-cinema-text{ max-width:820px; }
.hero-cinema-content h1{ color:#fff; font-size:clamp(2.4rem,5.6vw,4.4rem); max-width:820px; }
.hero-cinema-content h1 em{ color:var(--gold-soft); font-style:italic; }
.hero-cinema-content .lede{ color:#D9D2BE; max-width:540px; font-size:1.1rem; margin-top:22px; }
.hero-cinema-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:32px; }
.hero-cinema-stats{ display:flex; gap:clamp(24px,5vw,52px); flex-wrap:wrap; margin-top:44px; position:relative; z-index:2; }
.hero-stat b{ font-family:'Fraunces',serif; font-size:1.6rem; color:#fff; display:block; }
.hero-stat span{ font-size:.78rem; color:#B9B29C; letter-spacing:.03em; }

.hero-scroll-cue{
  position:absolute; z-index:2; right:var(--pad); bottom:26px;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  color:#EDE7D6; font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; opacity:.75;
}
.hero-scroll-cue .line{ width:1px; height:34px; background:linear-gradient(180deg,rgba(255,255,255,.9),transparent); animation:scrollPulse 1.8s ease-in-out infinite; }
@keyframes scrollPulse{ 0%,100%{ transform:scaleY(.6); opacity:.5; } 50%{ transform:scaleY(1); opacity:1; } }

/* Compact hero for interior pages */
.hero-cinema.sm{ min-height:46vh; align-items:flex-end; }
.hero-cinema-content.compact{ padding-top:clamp(96px,15vw,140px); padding-bottom:52px; }
.breadcrumb{ font-size:.78rem; color:#B9B29C; margin-bottom:14px; }
.breadcrumb a{ color:var(--gold-soft); }

/* ---------- Sections / cards ---------- */
section{ padding:clamp(56px,8vw,96px) 0; }
.section-head{ max-width:640px; margin-bottom:48px; }
.section-head p{ color:var(--muted); }

.grid{ display:grid; gap:26px; }
.grid-2{ grid-template-columns:1fr 1fr; }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){ .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; } }

.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:30px; box-shadow:var(--shadow-sm);
}

.pillar-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:30px; transition:transform .3s ease, box-shadow .3s ease;
}
.pillar-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.pillar-num{ font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); font-weight:700; }
.pillar-card h3{ margin-top:10px; font-size:1.3rem; }
.pillar-card p{ color:var(--muted); font-size:.94rem; }
.pillar-card .go{ display:inline-block; margin-top:14px; font-weight:600; font-size:.86rem; color:var(--maroon); }
.pillar-card .go:hover{ text-decoration:underline; }

/* reveal-on-scroll */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--navy-deep); color:#C9C2AC; padding:64px 0 26px; }
.site-footer h4{ color:#fff; font-family:'Inter',sans-serif; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:16px; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:32px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-links li{ margin-bottom:10px; }
.footer-links a{ opacity:.8; transition:opacity .2s ease, color .2s ease; }
.footer-links a:hover{ opacity:1; color:var(--gold-soft); }
.social-row{ display:flex; gap:10px; }
.social-row a{
  width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.25);
  display:flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:700;
  transition:background .2s ease, border-color .2s ease;
}
.social-row a:hover{ background:var(--gold-soft); color:var(--navy-deep); border-color:var(--gold-soft); }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:22px; font-size:.8rem; opacity:.7; }
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr 1fr; } }

/* ---------- Page-specific bits ---------- */
.tag-row{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.tag{ font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--maroon); background:rgba(122,35,49,.08); padding:5px 12px; border-radius:999px; }

.shayari-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:36px; text-align:center; }
.shayari-card p{ font-family:'Fraunces',serif; font-style:italic; font-size:1.35rem; line-height:1.6; color:var(--ink); margin-bottom:18px; }
.shayari-card span{ font-size:.78rem; color:var(--muted); letter-spacing:.05em; }

.gallery-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.gallery-grid .g-item{ aspect-ratio:1; border-radius:var(--radius); overflow:hidden; background:linear-gradient(145deg,var(--cream-deep),var(--line)); position:relative; }
.gallery-grid .g-item img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:760px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }

.blog-row{ display:flex; gap:26px; padding:26px 0; border-bottom:1px solid var(--line); align-items:flex-start; }
.blog-row .date{ font-size:.76rem; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; min-width:110px; }
.blog-row h3{ font-size:1.2rem; margin-bottom:6px; }
.blog-row p{ color:var(--muted); font-size:.94rem; margin-bottom:0; }

form.contact-form{ display:flex; flex-direction:column; gap:16px; }
.contact-form label{ font-size:.78rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; display:block; }
.contact-form input, .contact-form textarea{
  width:100%; padding:13px 16px; border:1px solid var(--line); border-radius:8px;
  font-family:'Inter',sans-serif; font-size:.95rem; background:#fff; color:var(--ink);
  transition:border-color .2s ease, box-shadow .2s ease;
}
.contact-form input:focus, .contact-form textarea:focus{
  outline:none; border-color:var(--maroon); box-shadow:0 0 0 3px rgba(122,35,49,.12);
}
.contact-form textarea{ min-height:140px; resize:vertical; }
#form-status{ font-size:.88rem; margin-top:6px; }

.venture-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:32px; }
.venture-card .v-num{ font-family:'Fraunces',serif; font-size:2rem; color:var(--gold); }
.venture-card h3{ font-size:1.3rem; margin-top:8px; }
.venture-card p{ color:var(--muted); }

:focus-visible{ outline:2px solid var(--maroon); outline-offset:3px; }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}