@font-face {
  font-family: 'Eurostile Extended';
  src: url('../fonts/EurostileExtendedBlack.woff2') format('woff2'),
       url('../fonts/EurostileExtendedBlack.woff') format('woff'),
       url('../fonts/EurostileExtendedBlack.ttf') format('truetype');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}

.gf-page {
  overflow-x: hidden;
}

/* Scroll-entrance initial states — revealed by giias.js. Kept in CSS so nothing flashes before JS runs. */
[data-anim="fade"] { opacity: 0; transform: translateY(28px); }
[data-anim="lines"] > * { opacity: 0; transform: translateY(28px); }
[data-anim="chars"] { visibility: hidden; } /* revealed by JS once split into .gf-char */
.gf-char { display: inline-block; opacity: 0; transform: translateY(24px); }
/* per-char re-apply of the gradient — inline-block chars break the parent's background-clip:text.
   Safe here because the accent gradient is vertical (180deg), so per-char looks identical to continuous. */
.gf-hl__headline-accent .gf-char {
  background: linear-gradient(180deg, #f7e8c0 0%, #e2c789 50%, #b08f54 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@media (prefers-reduced-motion: reduce) {
  [data-anim="fade"],
  [data-anim="lines"] > *,
  .gf-char { opacity: 1; transform: none; }
  [data-anim="chars"] { visibility: visible; }
}

.gf-banner {
  width: 100%;
  line-height: 0;
}

.gf-banner__img {
  width: 100%;
  height: auto;
  display: block;
}

.gf-guest {
  width: 100%;
  line-height: 0;
}

.gf-guest__img {
  width: 100%;
  height: auto;
  display: block;
}

.gf-map {
  width: 100%;
  height: 500px;
}

/* Section 2 — "date, location highlight" (Figma node 1622:731), canvas 1440x301 */
.gf-date {
  position: relative;
  overflow: hidden;
  background: #141310;
  aspect-ratio: 1440 / 301;
}

.gf-date__glow {
  position: absolute;
  left: -26.32%;
  top: -270.76%;
  width: 152.57%;
  height: 730%;
  mix-blend-mode: screen;
  opacity: .89;
  pointer-events: none;
}

/* Figma node 2508:38 — centered label / date / location stack, no GIIAS logo.
   px values are read off the 1440-wide canvas, so vw == design px / 14.4 */
.gf-date__inner {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(10px, 1.11vw, 16px);
  padding: 0 16px;
}

.gf-date__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(12px, 1.39vw, 20px);
}

.gf-date__label {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: clamp(16px, 1.5vw, 22px);
  letter-spacing: .1em;
  text-transform: uppercase;
  text-align: center;
  color: #e7e1d7;
  white-space: nowrap;
}

.gf-date__when {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 2.78vw, 40px);
  letter-spacing: .07em;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  white-space: nowrap;
}

.gf-date__loc {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: clamp(20px, 2.19vw, 32px);
  letter-spacing: .03em;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  white-space: nowrap;
}

/* Section 3 — "about section" (Figma node 1738:273), canvas 1440x675 */
.gf-about {
  position: relative;
  overflow: hidden;
  background: #06070a;
  aspect-ratio: 1440 / 675;
}

.gf-about__media {
  position: absolute;
  inset: 0;
}

.gf-about__car {
  position: absolute;
  left: -5%;
  top: -3.7%;
  width: 109.31%;
  height: 109.63%;
  object-fit: cover;
  pointer-events: none;
}

.gf-about__glow {
  position: absolute;
  pointer-events: none;
}

.gf-about__glow--1 {
  left: -31.6%;
  top: 81.78%;
  width: 170.49%;
  height: 55.85%;
}

.gf-about__glow--2 {
  left: -27.71%;
  top: 81.78%;
  width: 148.33%;
  height: 47.56%;
}

.gf-about__content {
  position: absolute;
  left: 5.56%;
  top: 50%;
  transform: translateY(-50%);
  width: 32.99%;
  min-width: 320px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.gf-about__eyebrow {
  display: flex;
  align-items: center;
  gap: 13px;
}

.gf-about__eyebrow span {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  font-size: clamp(12px, .97vw, 16px);
  letter-spacing: .13em;
  color: #cfaa66;
  white-space: nowrap;
}

.gf-about__eyebrow-line {
  display: block;
  width: 62px;
  height: 2px;
  background: linear-gradient(90deg, rgba(255, 255, 255, .12), #fff);
}

.gf-about__headline {
  margin: 0;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(24px, 2.22vw, 38px);
  line-height: 1.25;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #fff;
}

.gf-about__headline-accent {
  display: block;
  background: linear-gradient(180deg, #f7e8c0 0%, #e2c789 50%, #b08f54 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.gf-about__desc {
  margin: 0;
  max-width: 473px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: clamp(12px, .97vw, 16px);
  line-height: 1.55;
  letter-spacing: .05em;
  text-align: justify;
  color: #fff;
}

.gf-about__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  width: 100%;
  max-width: 475px;
  border-radius: 999px;
  border: 1px solid #f2dfb0;
  background:
    linear-gradient(90deg, rgba(6, 7, 9, .82) 0%, rgba(6, 7, 9, .82) 100%),
    linear-gradient(180deg, #f2dfb0 0%, #c39e60 46%, #6f5631 100%);
  box-shadow: 0 0 24px 2px rgba(186, 148, 86, .22), inset 0 1px 8px 1px rgba(242, 223, 176, .12);
  backdrop-filter: blur(1px);
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 700;
  font-size: clamp(12px, .97vw, 16px);
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
}

/* Section 4 — "prod highlight" (Figma nodes 1738:308 + 1889:489), product part only — activity split into .gf-activity below */
.gf-hl {
  position: relative;
  overflow: hidden;
  background: #000;
}

/* product header + showcase keep their Figma proportions inside this fixed-ratio stage;
   content below (Big City panel) flows and stretches the section */
.gf-hl__stage {
  position: relative;
  aspect-ratio: 1440 / 907;
}

.gf-hl__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gf-hl__pin {
  position: relative;
  z-index: 2;
}

.gf-hl__fade {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -26px;
  height: 7%;
  background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.26) 50%, rgba(0, 0, 0, 0) 100%);

}

.gf-hl__fade-top {
  position: absolute;
  left: 0;
  right: 0;
  top: 0px;
  height: 19%;
  background: linear-gradient(to bottom, #141310, transparent);
  pointer-events: none;
  z-index: 1;
}

.gf-hl__product {
  position: absolute;
  left: 5.56%;
  top: 5.51%;
  width: 88.89%;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(48px, 13.6vw, 196px);
  position: relative;
  z-index: 9999;
}

.gf-hl__product-intro {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 0 1 611px;
}

.gf-hl__showcase {
  position: absolute;
  left: 50%;
  top: 25.36%;
  transform: translateX(-50%);
  width: 86.18%;
  height: 65.82%;
  z-index: 1;
  object-fit: cover;
  border-radius: clamp(16px, 1.8vw, 26px);
}

/* "Big City Display" (Figma node 1889:147) — standalone section, glass panel over the texture bg */
.gf-cities {
  position: relative;
  overflow: hidden;
  background: #000;
  padding: clamp(28px, 3.5vw, 50px) 3.19%;
}

.gf-cities__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Glassmorphism — approximates the Figma Glass effect (light -45° 80%, refraction 80, frost 20) */
.gf-cities__panel {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(28px, 3.5vw, 50px);
  padding: clamp(32px, 3.5vw, 50px) clamp(24px, 6.4vw, 92px);
  border-radius: clamp(20px, 2.4vw, 34px);
  border: 1px solid transparent;
  /* fill (padding-box) + gradient rim (border-box): bright top-left where the light hits, dim bottom-right */
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(20px) saturate(140%);
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, .25),
    inset 0 24px 60px rgba(255, 255, 255, .05),
    0 24px 48px rgba(0, 0, 0, .45);
}

.gf-cities__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  max-width: 510px;
  text-align: center;
}

.gf-cities__title {
  margin: 0;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 2.22vw, 32px);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #fff;
}

.gf-cities__desc {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.67;
  color: #fff;
}

.gf-cities__rows {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(32px, 3.9vw, 56px);
  width: 100%;
}

.gf-cities__row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(24px, 3.35vw, 48px);
}

.gf-city {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}

.gf-city__name {
  margin: 0;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(16px, 1.53vw, 22px);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #fff;
}

.gf-city__malls {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: .088em;
  color: #fff;
}

.gf-city__dot {
  margin: 0 4px;
}

.gf-city__date {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: .1em;
  color: #fff;
}

/* Activity section — full-bleed revamp (Figma node 1896:290), canvas 1440x791 */
.gf-activity {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 3.5vw, 50px);
  padding: clamp(28px, 3.5vw, 50px) 0;
}

.gf-activity__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gf-hl__activity {
  position: relative;
  z-index: 1;
  width: min(809px, 90%);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

.gf-hl__eyebrow {
  display: flex;
  align-items: center;
  gap: 13px;
}

.gf-hl__eyebrow--center {
  justify-content: center;
}

.gf-hl__eyebrow span {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  font-size: clamp(12px, .97vw, 16px);
  letter-spacing: .13em;
  color: #cfaa66;
  white-space: nowrap;
}

.gf-hl__eyebrow-line {
  display: block;
  width: 62px;
  height: 2px;
  background: linear-gradient(90deg, rgba(255, 255, 255, .12), #fff);
}

.gf-hl__headline {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 2vw, 38px);
  line-height: 1.25;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #fff;
}

.gf-hl__headline--center {
  align-items: center;
}

.gf-hl__headline-accent {
  background: linear-gradient(180deg, #f7e8c0 0%, #e2c789 50%, #b08f54 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.gf-hl__desc {
  margin: 0;
  max-width: 473px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: clamp(12px, .97vw, 16px);
  line-height: 1.55;
  letter-spacing: .05em;
  text-align: justify;
  color: #fff;
}

.gf-hl__desc--center {
  max-width: 611px;
  text-align: center;
}

.gf-hl__product .gf-hl__desc {
  flex: 0 1 473px;
}

/* Activity carousel (Swiper) — full-bleed */
.gf-hl__carousel {
  position: relative;
  z-index: 1;
}

.gf-hl__carousel {
  width: 100%;
  padding: 0 3%;
  box-sizing: border-box;
  overflow: hidden;
}

.gf-hl__track {
  display: flex;
  align-items: flex-start;
  gap: 0;
  width: max-content;
  will-change: transform;
}

.gf-hl__card {
  position: relative;
  flex: 0 0 clamp(300px, 31vw, 460px);
  margin-right: -21px; /* overlap like the old swiper spaceBetween: -21 */
  height: 448px;
  overflow: hidden;
  background: #000; /* card face below the photo (Figma Vector 14) */
  cursor: pointer;
  /* SVG clipPath (objectBoundingBox) — keeps the Figma curves and scales with slide width */
  clip-path: url(#gfCardClip);
}

/* photo fills the top 341.77/447.74 of the card; the rest is the flat card face */
.gf-hl__card-photo {
  position: absolute;
  inset: 0 0 auto 0;
  width: 100%;
  height: 76.3%;
  object-fit: cover;
  pointer-events: none;
}

/* num sits inline with the title, desc aligns under the title (Figma 2418:140) */
.gf-hl__card-body {
  position: absolute;
  left: 9%;
  right: 14%; /* stays clear of the slanted right edge at this height */
  top: 79%;
  display: grid;
  grid-template-columns: 50px 1fr; /* fixed: the num is a fixed 22px glyph, it must not scale with the card */
  align-items: center;
  column-gap: 11px;
  row-gap: 4px;
  color: #fff;
}

.gf-hl__card-num {
  text-align: center;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: 22px;
  letter-spacing: .13em;
  background: linear-gradient(180deg, #f7e8c0 0%, #e2c789 50%, #b08f54 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.gf-hl__card-title {
  margin: 0;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.gf-hl__card-desc {
  grid-column: 2;
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 1.55;
  letter-spacing: .05em;
}

/* Activity card popup */
.gf-hl__modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gf-hl__modal[hidden] {
  display: none;
}

.gf-hl__modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .75);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.gf-hl__modal-box {
  position: relative;
  width: min(520px, calc(100vw - 48px));
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  border-radius: 24px;
  border: 1px solid rgba(242, 223, 176, .4);
  background: #141310;
  box-shadow: 0 0 40px 4px rgba(186, 148, 86, .25);
}

.gf-hl__modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 1;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 999px;
  background: rgba(0, 0, 0, .55);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.gf-hl__modal-img {
  display: block;
  width: 100%;
  aspect-ratio: 427 / 340;
  object-fit: cover;
}

.gf-hl__modal-body {
  padding: 24px 28px 32px;
  color: #fff;
}

.gf-hl__modal-num {
  display: block;
  margin-bottom: 4px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: 26px;
  letter-spacing: .13em;
  background: linear-gradient(180deg, #f7e8c0 0%, #e2c789 50%, #b08f54 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.gf-hl__modal-title {
  margin: 0 0 10px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: 21px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.gf-hl__modal-desc {
  margin: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: .03em;
}

/* Shared Swiper pagination dots — used by .gf-hl__dots and .gf-lineup__dots */
.gf-hl__dots,
.gf-lineup__dots {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.gf-hl__dots .swiper-pagination-bullet,
.gf-lineup__dots .swiper-pagination-bullet {
  width: 9px;
  height: 9px;
  margin: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, .35);
  opacity: 1;
  cursor: pointer;
  transition: width .2s ease, background .2s ease;
}

.gf-hl__dots .swiper-pagination-bullet-active,
.gf-lineup__dots .swiper-pagination-bullet-active {
  width: 27px;
  border-radius: 999px;
  background: linear-gradient(90deg, #f2dfb0, #6f5631);
}

/* Section 5 — "doorprize section" (Figma node 1738:371), canvas 1440x914 */
.gf-door {
  position: relative;
  overflow: hidden;
  background: #000;
  aspect-ratio: 1440 / 914;
}

.gf-door__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gf-door__products {
  position: absolute;
  left: 0;
  top: 27.02%;
  width: 100%;
  height: 60.59%;
  overflow: hidden;
  pointer-events: none;
}

.gf-door__products img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gf-door__head {
  position: absolute;
  left: 5.56%;
  top: 5.47%;
  width: 42.43%;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.gf-door__headline {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 2.22vw, 38px);
  line-height: 1.25;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #fff;
}

.gf-door__col {
  position: absolute;
  z-index: 1;
}

.gf-door__col--left {
  left: 5.56%;
  top: 31.62%;
  width: 34.38%;
}

.gf-door__col--right {
  left: 67.92%;
  top: 30.31%;
  width: 25.83%;
}

.gf-door__sub {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(13px, 1.39vw, 20px);
  line-height: 1.4;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #fff;
}

.gf-door__sub-plain {
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 600;
  font-size: clamp(11px, 1.11vw, 16px);
  letter-spacing: .1em;
  text-transform: none;
}

.gf-door__prizes {
  position: absolute;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.gf-door__prizes--left {
  left: 8.89%;
  top: 85.45%;
  width: 51.88%;
}

.gf-door__prizes--right {
  left: 70.14%;
  top: 85.45%;
  width: 24.31%;
}

.gf-door__pills {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.gf-door__pill {
  padding: 4px 24px;
  border: 1px solid #bd9c67;
  border-radius: 35px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 700;
  font-size: clamp(10px, .97vw, 14px);
  letter-spacing: .07em;
  text-transform: uppercase;
  color: #fff;
  white-space: nowrap;
}

.gf-door__note {
  margin: 0;
  max-width: 611px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: clamp(9px, .69vw, 10px);
  letter-spacing: .07em;
  text-align: center;
  color: #fff;
}

/* Section 6 — "prod highlight fronx" (Figma node 1845:138), canvas 1440x993 */
.gf-fx {
  position: relative;
  overflow: hidden;
  background: #000;
  aspect-ratio: 1440 / 993;
}

.gf-fx__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gf-fx__panel {
  position: absolute;
  left: 3.19%;
  top: 5.84%;
  width: 93.61%;
  height: 88.32%;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: clamp(24px, 3.5vw, 50px);
  padding: clamp(28px, 3.5vw, 50px) clamp(32px, 4.2vw, 60px);
  box-sizing: border-box;
  background: rgba(255, 255, 255, .1);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
  backdrop-filter: blur(12px) saturate(120%);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: clamp(20px, 2.4vw, 34px);
  overflow: hidden;
}

.gf-fx__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(40px, 9.6vw, 139px);
}

.gf-fx__intro {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 0 1 664px;
}

.gf-fx__desc {
  margin: 0;
  flex: 0 1 438px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: clamp(12px, .97vw, 16px);
  line-height: 1.55;
  letter-spacing: .05em;
  color: #fff;
}

.gf-fx__teaser {
  width: 100%;
}

/* Form section — markup + behavior shared with /GIIAS-2026 (giias2026.js), styles copied from giias2026.css */
.gf-form {
  position: relative;
  overflow: hidden;
  background: #000;
  padding: clamp(48px, 6.25vw, 90px) 5.56%;
}

.gf-form__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Form header (Figma node 1896:446) */
.gf-form__head {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  margin: 0 auto clamp(32px, 4vw, 56px);
  text-align: center;
}

.gf-form__title {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 2.22vw, 32px);
  line-height: 1.25;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #fff;
}

.gf-form__tagline {
  margin: -14px 0 0;
  max-width: 680px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-style: italic;
  font-size: clamp(15px, 1.39vw, 20px);
  line-height: 1.5;
  color: #fff;
}

.gf-form__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 19px;
}

.gf-form__meta-item {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 300;
  font-size: clamp(14px, 1.35vw, 19.4px);
  letter-spacing: .25em;
  text-transform: uppercase;
  color: #fff;
  white-space: nowrap;
}

.gf-form__meta-div {
  width: 1px;
  height: 23px;
  background: rgba(255, 255, 255, .6);
}

.gi-form__form {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1010px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(20px, 2.4vw, 24px);
}

.gi-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 3vw, 24px) clamp(16px, 4vw, 55px);
  width: 100%;
}

.gi-field { display: flex; flex-direction: column; gap: 12px; }

.gi-field__label {
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 500;
  font-size: 14px;
  letter-spacing: .04em;
  color: #fff;
}

.gi-req { color: #dd4242; }

.gi-field input {
  height: 58px;
  border: 1.2px solid #f5f5f5;
  border-radius: 16px;
  background: #f9fafb;
  padding: 0 14px;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 300;
  font-size: 14px;
  color: #333;
  outline: none;
  width: 100%;
  transition: border-color .2s ease;
}
.gi-field input::placeholder { color: rgba(51,51,51,.5); font-size: 13px; font-weight: 200; }
.gi-field input:focus { border-color: #013399; }

/* City dropdown with search */
.gi-field__city-wrap { position: relative; }
.gi-field__city-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 58px;
  border: 1.2px solid #f5f5f5;
  border-radius: 16px;
  background: #f9fafb;
  padding: 0 14px;
  font-family: 'Eurostile Extended', sans-serif;
  font-size: 13px;
  color: rgba(51,51,51,.5);
  cursor: pointer;
  text-align: left;
  transition: border-color .2s ease;
}
.gi-field__city-btn.is-filled { color: #333; }
.gi-field__city-btn[aria-expanded="true"] { border-color: #013399; }
.gi-field__city-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.gi-field__city-btn svg { transition: transform .2s ease; flex-shrink: 0; }
.gi-field__city-val { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gi-field__city-panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0; right: 0;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  z-index: 50;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
  overflow: hidden;
}
.gi-field__city-search-wrap { padding: 10px 10px 6px; border-bottom: 1px solid #f0f0f0; }
.gi-field__city-input {
  width: 100%;
  height: 38px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  background: #f9fafb;
  padding: 0 12px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px;
  color: #111;
  outline: none;
}
.gi-field__city-input:focus { border-color: #013399; }
.gi-field__city-list { list-style: none; margin: 0; padding: 6px 0; max-height: 200px; overflow-y: auto; }
.gi-field__city-item {
  padding: 10px 16px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px;
  color: #111;
  cursor: pointer;
  transition: background .1s ease;
}
.gi-field__city-item:hover { background: #f0f4ff; color: #013399; }
.gi-field__city-empty { padding: 10px 16px; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 12px; color: #999; font-style: italic; }

.gi-field.is-invalid input,
.gi-field.is-invalid .gi-field__city-btn { border-color: #dd4242; }

.gi-form__sep {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(189,189,189,0), #bdbdbd 50%, rgba(189,189,189,0));
}

.gi-form__terms {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  width: 100%;
  max-width: 620px;
  text-align: center;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 200;
  font-size: 11px;
  line-height: 1.6;
  color: #fff;
  cursor: pointer;
}
.gi-form__terms input { margin-top: 2px; flex-shrink: 0; width: 18px; height: 18px; accent-color: #ba9457; }
.gi-form__terms span { flex: 1 1 auto; min-width: 0; }
.gi-form__terms.is-invalid { color: #ff9d9d; }

.gi-form__msg {
  min-height: 20px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
  white-space: pre-line;
}
.gi-form__msg--err { color: #ff8080; }
.gi-form__msg--ok { color: #8fd694; }

.gi-form__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 15px 50px;
  border-radius: 999px;
  border: 1px solid transparent;
  background:
    linear-gradient(rgba(6,7,9,.82), rgba(6,7,9,.82)) padding-box,
    linear-gradient(180deg, #f2dfb0 0%, #c39e60 46%, #6f5631 100%) border-box;
  box-shadow:
    0 0 24px 2px rgba(186,148,86,.22),
    inset 0 1px 8px rgba(242,223,176,.12);
  -webkit-backdrop-filter: blur(1px);
  backdrop-filter: blur(1px);
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .2em;
  text-indent: .2em;
  color: #fff;
  text-transform: uppercase;
  cursor: pointer;
  transition: filter .2s ease, transform .2s ease;
}
.gi-form__submit:hover { filter: brightness(1.08); transform: translateY(-1px); }
.gi-form__submit:disabled { opacity: .6; cursor: not-allowed; transform: none; }

/* Section 7 — "line up section" (Figma node 1738:419), canvas 1440x664 */
.gf-lineup {
  position: relative;
  overflow: hidden;
  background: #000;
  aspect-ratio: 1440 / 664;
}

.gf-lineup__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gf-lineup__inner {
  position: absolute;
  left: 50%;
  top: 7.53%;
  transform: translateX(-50%);
  width: 91.6%;
  max-width: 1319px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(28px, 3.5vw, 50px);
}

.gf-lineup__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  text-align: center;
}

.gf-lineup__title {
  margin: 0;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 2.22vw, 38px);
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #fff;
}

.gf-lineup__desc {
  margin: 0;
  max-width: 611px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 400;
  font-size: clamp(12px, .97vw, 16px);
  line-height: 1.55;
  letter-spacing: .05em;
  text-align: center;
  color: #fff;
}

.gf-lineup__swiper {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding-bottom: 8px;
}

.gf-lineup__card {
  display: block; /* it is an <a> to the auto.suzuki.co.id product page */
  height: clamp(240px, 26vw, 354px);
  border-radius: clamp(24px, 3.6vw, 50px);
  background: rgba(255, 255, 255, .08);
  overflow: hidden;
  text-decoration: none;
  transition: background .25s ease;
}

.gf-lineup__card:hover {
  background: rgba(255, 255, 255, .14);
}

.gf-lineup__name {
  margin: 0;
  padding-top: clamp(18px, 2.3vw, 32px);
  font-family: 'Novelin', sans-serif;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: .02em;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
}

.gf-lineup__photo {
  height: 61.86%;
  margin-top: clamp(8px, 1.6vw, 22px);
  padding: 0 6.78%;
}

.gf-lineup__photo img {
  width: 100%;
  height: 100%;
  /* contain, not cover: the asset is the finished Figma frame (transparent margins
     included), so cropping it would cut into the car */
  object-fit: contain;
}

/* Footer (Figma node 1738:447) */
.gf-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 24px;
  background: #141310;
}

.gf-footer__copy {
  margin: 0;
  font-family: 'Eurostile Extended', sans-serif;
  font-weight: 700;
  font-size: 12px;
  color: #fff;
}