@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&display=swap");
:root {
  --a-red: #941e1b;
  --a-cream: #f5ecd9;
  --a-ink: #2c201d;
  --a-green: #294d28;
  --a-gold: #f5d37b;
  --a-line: rgba(245, 236, 217, 0.28);
}
html,
body {
  margin: 0;
  padding: 0;
  background: var(--a-red);
}
body.aangan-page {
  font-family: Inter, Arial, sans-serif;
  color: var(--a-cream);
  overflow-x: hidden;
}
.aangan-page main {
  overflow: hidden;
}
.aangan-hero {
  height: 394px;
  margin-top: 171px;
  position: relative;
  background: var(--a-red);
  overflow: hidden;
}
.aangan-hero-bg {
  position: absolute;
  left: 24.3%;
  bottom: 16px;
  width: 53.6%;
  height: 215px;
  background: url("../images/aangan/Mandawa 5.jpg") center/cover no-repeat;
  filter: brightness(0.32);
}
.aangan-hero-bg-2 {
    position: absolute;
    left: 82.6%;
    bottom: 62px;
    width: 12.6%;
    height: 250px;
    background: url(../images/aangan/hero_bg_2.webp) left / cover no-repeat;
    filter: brightness(0.32);
}
.aangan-back {
  position: absolute;
  top: 31px;
  left: 4.1%;
  z-index: 3;
  color: #f8eee0;
  text-decoration: none;
  font-size: 11px;
  letter-spacing: 2.4px;
}
.aangan-back span {
  font-size: 18px;
  margin-right: 7px;
}
.aangan-back:hover {
  color: #fff;
  opacity: 0.75;
}
.aangan-hero-title {
  position: absolute;
  right: 4.2%;
  top: 40px;
  z-index: 2;
  text-align: right;
}
.aangan-hero-title h1 {
  margin: 0;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 220px;
  line-height: 0.85;
  font-weight: 500;
  letter-spacing: -6px;

  background: url("../images/aangan/title.jpg") left top / cover no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: #ffffff7d;
}
.aangan-devanagari {
  font-family: 'General Sans', serif;
  color: var(--a-gold);
  font-size: 100px;
  font-weight: 700;
  line-height: 1;
  margin-top: 27px;
}
.aangan-meta {
  display: grid;
  grid-template-columns: 1.1fr 1fr 0.85fr 1.2fr;
  gap: 45px;
  background: var(--a-cream);
  color: #a44a42;
  padding: 21px 4.1% 22px;
  min-height: 117px;
  box-sizing: border-box;
}
.aangan-meta div {
  display: flex;
  flex-direction: column;
}
.aangan-meta span {
  font-size: 11px;
  letter-spacing: 2.5px;
  color: #a69a83;
  margin-bottom: 14px;
}
.aangan-meta strong {
  font-family: General Sans, serif;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 400;
  color: #a4473e;
}
.aangan-brief {
  background: var(--a-red);
  padding: 72px 4.1% 0;
  border-bottom: 2px solid rgba(246, 240, 223, 0.42);
}
.brief-main {
  display: grid;
  grid-template-columns: 62% 38%;
  padding-bottom: 25px;
}
.brief-main h2 {
  font:
    300 37px/1.3 General Sans,
    serif;
  margin: 0;
  color: #f8f1e3;
}
.brief-main aside {
  border-left: 2px solid rgba(246, 240, 223, 0.42);
  padding-left: 47px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.brief-main aside em {
  font:
    italic 28px/1.25 Playfair Display,
    serif;
}
.brief-support {
  font:
    400 20px/1.5 Georgia,
    serif;
  margin: 20px;
  padding: 40px 0 40px;
  border-right: 2px solid rgba(246, 240, 223, 0.42);
  max-width: 95%;
}
.idea-intro {
  border-top: 1px solid var(--a-line);
  padding: 50px 0 72px;
}
.idea-intro span,
.idea-heading span,
.experience-copy span,
.vision-copy span {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 2px;
}
.idea-intro h2 {
  font:
    500 37px/1.25 Georgia,
    "Times New Roman",
    serif;
  margin: 28px 0 0;
}
.aangan-idea {
  padding: 48px 4.55% 54px;
  background: var(--a-red);
}
.idea-heading h2 {
  font:
    500 38px/1.25 Georgia,
    "Times New Roman",
    serif;
  margin: 28px 0 100px;
}
.idea-grid {
  display: grid;
  grid-template-columns: 50% 50%;
}
.idea-photo {
  width: 100%;
  height: 148px;
  object-fit: cover;
  display: block;
}
.idea-note {
  border-top: 1px solid rgba(246, 240, 223, 0.25);
  padding-top: 30px;
  max-width: 78%;
  margin-left: auto;
}
.idea-note p {
  font:
    italic 19px/1.5 Playfair Display,
    serif;
  margin: 0;
}
.aangan-experience {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--a-cream);
  color: var(--a-ink);
}
.experience-copy {
  padding: 120px 8.4% 100px;
}
.experience-copy span {
  color: #a22c27;
}
.experience-copy h2 {
  font:
    500 38px/1.35 Georgia,
    "Times New Roman",
    serif;
  margin: 34px 0 0;
}
.experience-photo {
  min-height: 498px;
  overflow: hidden;
}
.experience-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 1s;
}
.experience-photo:hover img {
  transform: scale(1.02);
}
.aangan-vision {
  background: var(--a-red);
}
.vision-images {
  height: 298px;
  display: grid;
  grid-template-columns: 2fr 1fr;
}
.vision-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.vision-copy {
  padding: 50px 4.4% 58px;
  color: var(--a-cream);
  margin-top: 20px;
}
.vision-copy h2 {
  font:
    500 37px/1.55 General Sans,
    serif;
  margin: 30px 0 0;
  max-width: 1160px;
}
.aangan-brand {
  background: var(--a-cream);
  color: var(--a-ink);
  padding: 48px 4.4% 54px;
}
.aangan-section-head {
  display: flex;
  align-items: center;
  gap: 22px;
}
.aangan-section-head span {
  margin: 0;
  color: rgb(137 29 26);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 2px;
}
.photography span {
  color: var(--a-cream);
}
.moodboard span {
  color: var(--a-cream);
}
.coming-soon span {
  color: var(--a-cream);
}
.aangan-section-head i {
  height: 1px;
  background: currentColor;
  opacity: 0.25;
  flex: 1;
}
.brand-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 27px;
  margin-top: 25px;
}
.brand-logo-card {
  overflow: hidden;
}
.brand-logo-card img {
  width: 100%;
  height: 438px;
  display: block;
  object-fit: cover;
  object-position: center;
}
.brand-swatches {
  display: grid;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 10px;
}
.swatch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  font:
    italic 15px Georgia,
    serif;
}
.swatch small {
  font:
    14px Inter,
    sans-serif;
  letter-spacing: 1px;
  opacity: 0.55;
}
.swatch.maroon {
  background: #991f1c;
  color: #f7ebd9;
}
.swatch.cream {
  background: #f4ead7;
  border: 1px solid #e0d4c1;
}
.swatch.green {
  background: #294d28;
  color: #f4ead7;
}
.brand-type {
  background: #eee1c9;
  padding: 30px;
  color: #766c5e;
  display: flex;
  flex-direction: column;
}
.brand-type span {
  font-size: 16px;
  letter-spacing: 2px;
  margin-bottom: 25px;
}
.brand-type small {
  font-size: 12px;
  letter-spacing: 2px;
  margin-top: 8px;
}
.brand-type strong {
  font:
    400 46px/1.1 "Playfair Display",
    serif;
  color: #29201d;
  margin: 8px 0 2px;
}
.brand-type em {
  font-size: 12px;
  margin-top: 12px;
  margin-bottom: 12px;
}
.brand-type b {
  font:
    italic 16px/1.35 Georgia,
    serif;
  color: #5e5046;
}
.aangan-moodboard {
  background: var(--a-red);
  padding: 50px 4.4% 48px;
}
.mood-row {
  display: grid;
  gap: 17px;
}
.mood-row-one {
  grid-template-columns: 1fr 1.15fr 1fr;
  margin-top: 26px;
}
.mood-row-one img {
  width: 100%;
  height: 466px;
  object-fit: cover;
}
.mood-row-two {
  grid-template-columns: 1.1fr 0.75fr 1.25fr;
  margin-top: 17px;
}
.mood-row-two > img {
  width: 100%;
  height: 545px;
  object-fit: cover;
}
.mood-stack {
  display: grid;
  grid-template-rows: 2fr 1fr;
  gap: 17px;
}
.mood-stack img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 0;
}
.aangan-socials {
  background: var(--a-red);
  padding: 43px 4.35% 50px;
}
.social-grid {
  display: grid;
  grid-template-columns: 1.65fr 0.85fr 0.85fr;
  gap: 19px;
  margin-top: 27px;
}
.social-grid > img,
.social-column img {
  width: 100%;
  display: block;
  object-fit: cover;
}
.social-pool {
  height: 697px;
}
.social-column {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 31px;
}
.social-column img {
  height: 100%;
}
.social-grid-two {
  grid-template-columns: 1.1fr 0.78fr 1.1fr;
  margin-top: 31px;
}
.social-grid-two img {
  height: 376px;
  object-fit: cover;
}
.aangan-video-section {
  background: var(--a-cream);
  padding: 47px 4.35% 65px;
  color: #8f241f;
}

.aangan-video-stage {
  width: 100%;
  height: 493px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 21px;
  gap: 0;
}

.aangan-video-card {
  flex: 0 0 auto;
  position: relative;
  overflow: hidden;
  display: block;
  background: #111;
  transition:
    transform 0.6s ease,
    opacity 0.5s ease;
}

.aangan-video-card video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
  margin: 0;
  padding: 0;
  border: 0;
}

/* FAR CARDS */

.aangan-video-far {
  width: 174px;
  height: 335px;
  opacity: 0.25;
}

/* SIDE CARDS */

.aangan-video-side {
  width: 205px;
  height: 384px;
  opacity: 0.58;
  filter: saturate(0.7);
}

/* CENTER CARD */

.aangan-video-center {
  width: 300px;
  height: 444px;
  z-index: 2;
  opacity: 1;
  filter: none;
}

/* HOVER */

.aangan-video-card:hover {
  transform: translateY(-3px);
}
.aangan-coming {
  background: var(--a-green);
  padding: 51px 4.35% 110px;
  text-align: center;
}
.aangan-coming .aangan-section-head {
  text-align: left;
}
.aangan-coming h2 {
  font:
    italic 500 35px Georgia,
    serif;
  margin: 102px 0 0;
}
.aangan-next {
  background: var(--a-red);
  min-height: 260px;
  padding: 74px 20px;
  box-sizing: border-box;
  text-align: center;
  color: var(--a-cream);
}
.aangan-next h2 {
  font:
    italic 500 35px Georgia,
    serif;
  margin: 0 0 28px;
}
.aangan-next a {
  display: inline-block;
  background: var(--a-gold);
  color: var(--a-red);
  padding: 14px 44px;
  text-decoration: none;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  transition: transform 0.25s;
}
.aangan-next a:hover {
  transform: translateY(-2px);
}
.reveal {
  opacity: 1;
  transform: none;
}
.aangan-js-ready .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 0.75s ease,
    transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.aangan-js-ready .reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (max-width: 1200px) {
  .aangan-hero-title h1 {
    font-size: 95px;
  }
  .brief-main h2,
  .experience-copy h2,
  .vision-copy h2,
  .idea-heading h2 {
    font-size: 32px;
  }
  .aangan-hero-bg {
    left: 20%;
    width: 650px;
  }
  .social-pool {
    height: 500px;
  }
}
@media (max-width: 991.98px) {
  .aangan-hero {
    margin-top: 0;
    height: 500px;
  }
  .aangan-hero-bg {
    left: 10%;
    bottom: 60px;
    width: 80%;
    height: 210px;
  }
  .aangan-hero-title {
    top: 145px;
    right: 8%;
  }
  .aangan-hero-title h1 {
    font-size: 76px;
  }
  .aangan-devanagari {
    font-size: 43px;
  }
  .aangan-meta {
    grid-template-columns: 1fr 1fr;
    padding: 24px 28px;
  }
  .aangan-brief {
    padding: 50px 28px 0;
  }
  .brief-main {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .brief-main aside {
    border-left: 0;
    border-top: 1px solid var(--a-line);
    padding: 25px 0 0;
  }
  .brief-support {
    max-width: none;
  }
  .aangan-idea {
    padding: 45px 28px;
  }
  .idea-heading h2 {
    margin-bottom: 55px;
  }
  .idea-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  .idea-photo {
    height: auto;
    aspect-ratio: 3.8/1;
  }
  .idea-note {
    max-width: none;
  }
  .aangan-experience {
    grid-template-columns: 1fr;
  }
  .experience-copy {
    padding: 70px 28px;
  }
  .experience-photo {
    min-height: 430px;
  }
  .vision-images {
    height: auto;
    grid-template-columns: 1fr;
  }
  .vision-images img {
    height: 300px;
  }
  .vision-copy {
    padding: 45px 28px;
  }
  .vision-copy h2 {
    font-size: 31px;
  }
  .brand-grid {
    grid-template-columns: 1fr;
  }
  .brand-logo-card img {
    height: auto;
  }
  .aangan-moodboard,
  .aangan-socials,
  .aangan-brand {
    padding-left: 28px;
    padding-right: 28px;
  }
  .mood-row-one,
  .mood-row-two,
  .social-grid,
  .social-grid-two {
    grid-template-columns: 1fr;
  }
  .mood-row-one img,
  .mood-row-two > img,
  .social-pool,
  .social-grid-two img {
    height: auto;
    aspect-ratio: 4/3;
  }
  .mood-stack {
    min-height: 600px;
  }
  .aangan-video-stage {
    width: 100%;
    height: auto;
    gap: 12px;
  }

  .aangan-video-far {
    display: none;
  }

  .aangan-video-side {
    width: 24%;
    height: 360px;
  }

  .aangan-video-center {
    width: 40%;
    height: 520px;
  }
  .aangan-coming {
    padding-left: 28px;
    padding-right: 28px;
  }
  .aangan-next {
    min-height: 240px;
  }
  .desktop-only {
    display: none;
  }
}
@media (max-width: 600px) {
  .aangan-meta {
    grid-template-columns: 1fr;
  }
  .aangan-hero-bg {
    left: 5%;
    width: 90%;
  }
  .aangan-hero-title {
    top: 130px;
    right: 7%;
  }
  .aangan-hero-title h1 {
    font-size: 59px;
  }
  .aangan-devanagari {
    font-size: 35px;
  }
  .brief-main h2,
  .idea-heading h2,
  .experience-copy h2,
  .vision-copy h2 {
    font-size: 28px;
  }
  .brand-logo-card img {
    object-position: left center;
  }
  .aangan-video-stage {
    display: block;
    width: 100%;
    height: auto;
  }

  .aangan-video-side,
  .aangan-video-far {
    display: none;
  }

  .aangan-video-center {
    width: min(300px, 86vw);
    height: 444px;
    margin: 0 auto;
  }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .reveal,
  .experience-photo img,
  .aangan-next a,
  .aangan-video-card {
    transition: none !important;
  }
}

/* =========================================================
   Animation enhancement layer — Aangan only
   Existing visual rules above remain unchanged.
   ========================================================= */
.aangan-page .aangan-hero-bg,
.aangan-page .aangan-hero-bg-2 {
  will-change: transform;
  transition: transform 1.2s cubic-bezier(.2,.7,.2,1);
}

.aangan-page .aangan-hero-bg {
  transform: translate3d(0, var(--aangan-parallax-y, 0px), 0) scale(1.035);
}

.aangan-page .aangan-hero-bg-2 {
  transform: translate3d(0, var(--aangan-parallax-y, 0px), 0) scale(1.025);
}

.aangan-page .aangan-back,
.aangan-page .aangan-hero-title h1,
.aangan-page .aangan-devanagari {
  opacity: 0;
  will-change: transform, opacity;
}

.aangan-page .aangan-back {
  transform: translate3d(-14px, 0, 0);
  transition: opacity .65s ease .1s, transform .75s cubic-bezier(.2,.7,.2,1) .1s;
}

.aangan-page .aangan-hero-title h1 {
  transform: translate3d(0, 28px, 0) scale(.97);
  transition: opacity .9s ease .12s, transform 1s cubic-bezier(.16,1,.3,1) .12s;
}

.aangan-page .aangan-devanagari {
  transform: translate3d(0, 18px, 0);
  transition: opacity .7s ease .3s, transform .8s cubic-bezier(.2,.7,.2,1) .3s;
}

.aangan-page.aangan-hero-ready .aangan-back,
.aangan-page.aangan-hero-ready .aangan-hero-title h1,
.aangan-page.aangan-hero-ready .aangan-devanagari {
  opacity: 1;
  transform: none;
}

.aangan-page .aangan-meta > div,
.aangan-page .aangan-brief .brief-main h2,
.aangan-page .aangan-brief .brief-main aside,
.aangan-page .aangan-brief .brief-support,
.aangan-page .idea-heading,
.aangan-page .idea-photo,
.aangan-page .idea-note,
.aangan-page .experience-copy,
.aangan-page .experience-photo,
.aangan-page .vision-images img,
.aangan-page .vision-copy,
.aangan-page .aangan-section-head,
.aangan-page .brand-logo-card,
.aangan-page .brand-swatches .swatch,
.aangan-page .brand-type,
.aangan-page .mood-row img,
.aangan-page .mood-stack,
.aangan-page .social-grid > img,
.aangan-page .social-column,
.aangan-page .social-grid-two img,
.aangan-page .aangan-video-card,
.aangan-page .aangan-coming h2,
.aangan-page .aangan-next h2,
.aangan-page .aangan-next a {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition:
    opacity .75s ease var(--aangan-reveal-delay, 0ms),
    transform .85s cubic-bezier(.2,.7,.2,1) var(--aangan-reveal-delay, 0ms);
}

.aangan-page .idea-photo,
.aangan-page .experience-photo,
.aangan-page .vision-images img,
.aangan-page .brand-logo-card,
.aangan-page .mood-row img,
.aangan-page .social-grid > img,
.aangan-page .social-column,
.aangan-page .social-grid-two img {
  clip-path: inset(6% 0 6% 0);
  transition:
    opacity .8s ease var(--aangan-reveal-delay, 0ms),
    transform .95s cubic-bezier(.2,.7,.2,1) var(--aangan-reveal-delay, 0ms),
    clip-path .95s cubic-bezier(.2,.7,.2,1) var(--aangan-reveal-delay, 0ms);
}

.aangan-page .aangan-meta > div.is-visible,
.aangan-page .aangan-brief .brief-main h2.is-visible,
.aangan-page .aangan-brief .brief-main aside.is-visible,
.aangan-page .aangan-brief .brief-support.is-visible,
.aangan-page .idea-heading.is-visible,
.aangan-page .idea-photo.is-visible,
.aangan-page .idea-note.is-visible,
.aangan-page .experience-copy.is-visible,
.aangan-page .experience-photo.is-visible,
.aangan-page .vision-images img.is-visible,
.aangan-page .vision-copy.is-visible,
.aangan-page .aangan-section-head.is-visible,
.aangan-page .brand-logo-card.is-visible,
.aangan-page .brand-swatches .swatch.is-visible,
.aangan-page .brand-type.is-visible,
.aangan-page .mood-row img.is-visible,
.aangan-page .mood-stack.is-visible,
.aangan-page .social-grid > img.is-visible,
.aangan-page .social-column.is-visible,
.aangan-page .social-grid-two img.is-visible,
.aangan-page .aangan-video-card.is-visible,
.aangan-page .aangan-coming h2.is-visible,
.aangan-page .aangan-next h2.is-visible,
.aangan-page .aangan-next a.is-visible {
  opacity: 1;
  transform: none;
  clip-path: inset(0);
}

.aangan-page .aangan-video-card {
  transition:
    opacity .7s ease var(--aangan-reveal-delay, 0ms),
    transform .8s cubic-bezier(.2,.7,.2,1) var(--aangan-reveal-delay, 0ms);
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .aangan-page .aangan-hero-bg,
  .aangan-page .aangan-hero-bg-2,
  .aangan-page .aangan-back,
  .aangan-page .aangan-hero-title h1,
  .aangan-page .aangan-devanagari,
  .aangan-page .aangan-meta > div,
  .aangan-page .aangan-brief .brief-main h2,
  .aangan-page .aangan-brief .brief-main aside,
  .aangan-page .aangan-brief .brief-support,
  .aangan-page .idea-heading,
  .aangan-page .idea-photo,
  .aangan-page .idea-note,
  .aangan-page .experience-copy,
  .aangan-page .experience-photo,
  .aangan-page .vision-images img,
  .aangan-page .vision-copy,
  .aangan-page .aangan-section-head,
  .aangan-page .brand-logo-card,
  .aangan-page .brand-swatches .swatch,
  .aangan-page .brand-type,
  .aangan-page .mood-row img,
  .aangan-page .mood-stack,
  .aangan-page .social-grid > img,
  .aangan-page .social-column,
  .aangan-page .social-grid-two img,
  .aangan-page .aangan-video-card,
  .aangan-page .aangan-coming h2,
  .aangan-page .aangan-next h2,
  .aangan-page .aangan-next a {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    transition: none !important;
  }
}


/* Animation variation layer — intentionally additive */
.aangan-page .motion-left { transform: translate3d(-52px, 18px, 0); }
.aangan-page .motion-right { transform: translate3d(52px, 18px, 0); }
.aangan-page .motion-up { transform: translate3d(0, 42px, 0); }
.aangan-page .motion-scale { transform: translate3d(0, 22px, 0) scale(.93); }
.aangan-page .motion-clip { transform: translate3d(0, 30px, 0) scale(1.035); clip-path: inset(7% 2% 7% 2%); }
.aangan-page .motion-left.is-visible,
.aangan-page .motion-right.is-visible,
.aangan-page .motion-up.is-visible,
.aangan-page .motion-scale.is-visible,
.aangan-page .motion-clip.is-visible { opacity: 1; transform: none; clip-path: inset(0); }
.aangan-page .motion-left, .aangan-page .motion-right, .aangan-page .motion-up, .aangan-page .motion-scale, .aangan-page .motion-clip { transition-delay: var(--aangan-reveal-delay, 0ms); }
.aangan-page .aangan-back:hover { transform: translateX(-7px); opacity: .8; }
.aangan-page .brand-logo-card:hover, .aangan-page .aangan-video-card:hover { transform: translate3d(0,-8px,0) scale(1.012); }