/* Production homepage refinements. Every rule is scoped to the public home. */

body.home-background[data-homepage-authenticated="1"] #profileAccountMenuWrap,
body.home-background[data-homepage-authenticated="1"] #dashboardButton {
  display: none !important;
}
body.home-background:not([data-homepage-authenticated="1"]) #homeView.gd-home .gd-hero-cta {
  display: none !important;
}

#homeView.gd-home .gd-card {
  --gd-rarity: var(--gd-gold-400);
  /* The official card sits this far below the top of .gd-card so the tilted
     portrait has somewhere to lift into. The glare uses the same value to
     align itself to the template exactly. */
  --card-headroom: 4.4cqw;
  --gd-tilt-x: 0deg;
  --gd-tilt-y: 0deg;
  --gd-tilt-scale: 1;
  --gd-tilt-lift: 0px;
  --gd-shadow-x: 0px;
  --gd-shadow-y: 18px;
  --gd-shine-x: 50%;
  --gd-shine-y: 40%;
  --gd-shine-opacity: 0;
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 25;
  padding: 0;
  margin: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  clip-path: none;
  cursor: pointer;
  transform: none;
  transform-origin: center;
  transition: transform .5s cubic-bezier(.2,.72,.2,1);
}
#homeView.gd-home .gd-card:hover,
#homeView.gd-home .gd-card.is-selected {
  transform: none;
  box-shadow: none;
}
#homeView.gd-home .gd-card.is-selected { filter: brightness(1.04); }
#homeView.gd-home .gd-card:focus-visible { outline: 2px solid var(--gd-gold-200); outline-offset: 5px; }
#homeView.gd-home .gd-card.is-tilting,
#homeView.gd-home .gd-card.is-tilting:hover {
  z-index: 30;
  transform: perspective(900px) rotateX(var(--gd-tilt-x)) rotateY(var(--gd-tilt-y)) translateY(var(--gd-tilt-lift)) scale(var(--gd-tilt-scale));
  transform-style: preserve-3d;
  filter: drop-shadow(var(--gd-shadow-x) var(--gd-shadow-y) 20px rgba(0,0,0,.54));
  transition-duration: .1s;
  transition-timing-function: linear;
}
#homeView.gd-home .gd-card-physical {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  pointer-events: none;
}
#homeView.gd-home .gd-card-physical > .footballer-card-shell {
  /* Re-declared so the shell uses the card-relative headroom rather than the
     shared clamp(10px,4.4%,20px): on a rail thumbnail that clamp bottoms out at
     10px, which both overflows .gd-card's own box and leaves the glare layer
     measuring a different rectangle from the one the frame occupies. */
  --card-headroom: 4.4cqw;
  width: 100%;
  padding-top: var(--card-headroom);
}
#homeView.gd-home .gd-official-footballer-card .footballer-card-name-line { gap: 2.5cqw !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-name-line .footballer-card-name,
#homeView.gd-home .gd-official-footballer-card .footballer-card-name-line .footballer-card-name.name-long,
#homeView.gd-home .gd-official-footballer-card .footballer-card-name-line .footballer-card-name.name-very-long { font-size: 8.8cqw !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-name-flag { width: 8.6cqw !important; height: 6.45cqw !important; flex-basis: 8.6cqw !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-meta { min-height: 5cqw !important; gap: 1.4cqw !important; margin-top: 2cqw !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-meta .footballer-card-position { font-size: 4.15cqw !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-meta .footballer-card-age { font-size: 3.45cqw !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-meta i { width: 1.2cqw !important; height: 1.2cqw !important; flex-basis: 1.2cqw !important; }
#homeView.gd-home .gd-card-physical > .footballer-card-shell > .footballer-card-rating {
  display: grid !important;
  width: 32cqw !important;
  min-width: 0 !important;
  justify-items: start !important;
}
#homeView.gd-home .gd-card-physical > .footballer-card-shell > .footballer-card-rating > strong {
  width: auto !important;
  font-size: 18cqw !important;
  text-align: left !important;
}
/* Potential is a squad-management number, not a showcase one. The homepage
   cards advertise the player, so they carry the rating alone. */
#homeView.gd-home .footballer-card-rating > small { display: none !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-art.template-single-portrait img { transform: translateX(calc(-50% + 1.9cqw)) !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-stats { gap: 1.5cqw !important; }
#homeView.gd-home .gd-official-footballer-card .card-main-stat,
#homeView.gd-home .gd-official-footballer-card .card-main-stat.stat-elite { min-height: 10.8cqw !important; gap: .9cqw !important; padding-bottom: 1.5cqw !important; }
#homeView.gd-home .gd-official-footballer-card .card-main-stat b,
#homeView.gd-home .gd-official-footballer-card .card-main-stat.stat-elite b { font-size: 2.6cqw !important; }
#homeView.gd-home .gd-official-footballer-card .card-main-stat strong,
#homeView.gd-home .gd-official-footballer-card .card-main-stat.stat-elite strong { font-size: 4.5cqw !important; }
#homeView.gd-home .gd-official-footballer-card .card-main-stat::after { height: max(1px,.55cqw) !important; }
#homeView.gd-home .gd-official-footballer-card .footballer-card-footer { font-size: 2.7cqw !important; }

/* Laminate reflection. The glare box is laid over exactly the rectangle the
   template image occupies (below the headroom, 2:3 like the frame) and is then
   masked by the template's own alpha, so the light can never reach past the
   printed card — including the chamfered corners — whatever frame art is used. */
#homeView.gd-home .gd-card-glare {
  position: absolute;
  top: var(--card-headroom, 0px);
  right: 0;
  bottom: auto;
  left: 0;
  aspect-ratio: 2 / 3;
  z-index: 12;
  display: none;
  pointer-events: none;
  background-image:
    linear-gradient(112deg,transparent 25%,rgba(255,248,225,.06) 37%,rgba(255,255,250,.72) 47%,rgba(255,219,159,.28) 53%,rgba(147,218,255,.14) 58%,transparent 70%),
    radial-gradient(ellipse 42% 28% at var(--gd-shine-x) var(--gd-shine-y),rgba(255,249,231,.22),transparent 72%);
  background-size: 230% 190%,100% 100%;
  background-position: var(--gd-shine-x) var(--gd-shine-y),center;
  background-repeat: no-repeat;
  mix-blend-mode: screen;
  opacity: var(--gd-shine-opacity);
  -webkit-mask-image: var(--card-template-mask);
  mask-image: var(--card-template-mask);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  transition: opacity .42s ease;
}
#homeView.gd-home .gd-card.is-tilting .gd-card-glare,
#homeView.gd-home .gd-card.is-settling .gd-card-glare { display: block; }

#homeView.gd-home .gd-features,
#homeView.gd-home .gd-showcase,
#homeView.gd-home .gd-footer {
  content-visibility: auto;
  contain-intrinsic-size: auto 900px;
}

#homeView.gd-home .gd-hero { background: transparent; }
#homeView.gd-home .gd-hero-canvas {
  mask-image: linear-gradient(180deg,#000 0%,#000 76%,rgba(0,0,0,.96) 82%,rgba(0,0,0,.6) 93%,transparent 100%);
  -webkit-mask-image: linear-gradient(180deg,#000 0%,#000 76%,rgba(0,0,0,.96) 82%,rgba(0,0,0,.6) 93%,transparent 100%);
}
#homeView.gd-home .gd-hero-brand img { width: 50px; height: 50px; }
#homeView.gd-home .gd-hero-heading { margin-top: 0; }
#homeView.gd-home .gd-hero-pedestal { left: 1110px; bottom: 322px; width: 285px; }
#homeView.gd-home .gd-pull-rail { gap: 12px; overflow: visible; padding: 18px 14px; margin: -18px -14px; }
#homeView.gd-home .gd-pull-rail .gd-card.is-tilting { z-index: 40; }

/* Keep the two-line hero copy optically centred and inside its stage at every width. */
#homeView.gd-home .gd-hero-copy { display:grid; justify-items:center; text-align:center; }
#homeView.gd-home .gd-hero-heading { width:100%; max-width:100%; white-space:normal; text-align:center; }
#homeView.gd-home .gd-hero-heading span { display:block; font-size:.9em; line-height:1.05; letter-spacing:0; }

@media (min-width:1101px) {
  #homeView.gd-home .gd-hero-heading { width:640px; max-width:640px; margin-inline:-60px; }
}

#homeView.gd-home .gd-features {
  margin-top: clamp(-210px,-10.5vw,-118px);
  padding: clamp(215px,15vw,295px) clamp(24px,3vw,58px) clamp(92px,7vw,140px);
}
#homeView.gd-home .gd-features::before { height: clamp(180px,15vw,290px); background: linear-gradient(180deg,rgba(11,9,6,.78),rgba(8,6,4,.46) 42%,transparent); }
#homeView.gd-home .gd-features-inner { max-width: 1680px; }
#homeView.gd-home .gd-features-grid { gap: clamp(32px,2.7vw,54px); }
#homeView.gd-home .gd-feature-art img {
  object-position: 64% center;
  transform: translate3d(0,var(--gd-feature-shift,0),0) scale(1.06);
  transition: transform 1.1s var(--gd-ease-out-soft),filter 1.1s ease;
  will-change: transform;
}
#homeView.gd-home .gd-feature-card:nth-child(1) .gd-feature-art img { object-position: 68% center; }
#homeView.gd-home .gd-feature-card:nth-child(2) .gd-feature-art img { object-position: 62% center; }
#homeView.gd-home .gd-feature-card:nth-child(3) .gd-feature-art img { object-position: 70% center; }
#homeView.gd-home .gd-feature-card:hover .gd-feature-art img {
  transform: translate3d(0,var(--gd-feature-shift,0),0) scale(1.095);
  filter: brightness(1.08) saturate(1.04);
}
#homeView.gd-home .gd-feature-card::after {
  content: "";
  position: absolute;
  z-index: 3;
  inset: -45% -70%;
  pointer-events: none;
  background: linear-gradient(112deg,transparent 42%,rgba(221,177,89,.075) 49%,transparent 56%);
  transform: translateX(-28%);
  animation: gdFeatureReflection 11s ease-in-out infinite;
}
#homeView.gd-home .gd-feature-card:nth-child(2)::after { animation-delay: -3.5s; }
#homeView.gd-home .gd-feature-card:nth-child(3)::after { animation-delay: -7s; }
@keyframes gdFeatureReflection {
  0%,24% { transform: translateX(-30%); opacity: 0; }
  43% { opacity: 1; }
  66%,100% { transform: translateX(30%); opacity: 0; }
}

#homeView.gd-home .gd-showcase-heading { margin-top: 0; }
#homeView.gd-home .gd-showcase-cards {
  left: 620px;
  right: 80px;
  top: 115px;
  bottom: 145px;
  display: block;
  perspective: 1400px;
  overflow: visible;
}
#homeView.gd-home .gd-fan-slot {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: var(--gd-fan-width,220px);
  transform: translate(-50%,-50%) translate(var(--gd-fan-x,0),var(--gd-fan-y,0)) rotate(var(--gd-fan-rotate,0deg));
  transform-origin: 50% 92%;
}
#homeView.gd-home .gd-showcase-cards .gd-fan-slot .gd-card,
#homeView.gd-home .gd-showcase-cards .gd-fan-slot .gd-card:not(.is-lead),
#homeView.gd-home .gd-showcase-cards .gd-fan-slot .gd-card:hover { width: 100%; max-width: none; transform: none; }
#homeView.gd-home .gd-showcase-cards .gd-fan-slot .gd-card.is-tilting,
#homeView.gd-home .gd-showcase-cards .gd-fan-slot .gd-card.is-tilting:hover {
  transform: perspective(900px) rotateX(var(--gd-tilt-x)) rotateY(var(--gd-tilt-y)) translateY(var(--gd-tilt-lift)) scale(var(--gd-tilt-scale));
}
#homeView.gd-home .gd-fan-slot-1 { --gd-fan-width: 276px; --gd-fan-x: -355px; --gd-fan-y: 46px; --gd-fan-rotate: -11deg; z-index: 1; }
#homeView.gd-home .gd-fan-slot-2 { --gd-fan-width: 304px; --gd-fan-x: -194px; --gd-fan-y: 16px; --gd-fan-rotate: -5deg; z-index: 3; }
#homeView.gd-home .gd-fan-slot-3 { --gd-fan-width: 330px; --gd-fan-y: -10px; z-index: 5; }
#homeView.gd-home .gd-fan-slot-4 { --gd-fan-width: 304px; --gd-fan-x: 194px; --gd-fan-y: 16px; --gd-fan-rotate: 5deg; z-index: 4; }
#homeView.gd-home .gd-fan-slot-5 { --gd-fan-width: 276px; --gd-fan-x: 355px; --gd-fan-y: 46px; --gd-fan-rotate: 11deg; z-index: 2; }

/* Ambient cards. Placement and travel are driven from home-design.js against
   the page's real geometry — see the ambient controller there. Everything below
   is presentation only: the script owns `transform` and never writes layout. */
#homeView.gd-home .gd-floating-cards { position: absolute; inset: 0; z-index: 7; overflow: clip; pointer-events: none; }
#homeView.gd-home .gd-floating-card {
  --gd-ambient-opacity: .38;
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: clamp(74px,4.4vw,92px);
  opacity: 0;
  /* `contain: paint` used to be here and it cropped the card: the breathe below
     carries the artwork a little past this box, and paint containment clipped
     exactly that overhang — chopped corners and truncated frames. Layout
     containment gives the same isolation without cutting anything. */
  contain: layout;
  will-change: opacity;
  transition: opacity .9s ease;
}
/* Owned exclusively by the travel animation in home-design.js. Nothing else
   writes this transform, so scrolling can never compete with it. */
#homeView.gd-home .gd-floating-card-drift {
  display: block;
  width: 100%;
  transform: translate3d(-9999px,0,0);
  transform-origin: 50% 50%;
  will-change: transform;
}
/* Only cards the placement pass actually found room for are ever shown. */
#homeView.gd-home .gd-floating-card.is-placed { opacity: var(--gd-ambient-opacity); }
#homeView.gd-home .gd-floating-card.is-mid-depth { --gd-ambient-opacity: .30; width: clamp(64px,3.8vw,80px); filter: saturate(.88) brightness(.9); }
#homeView.gd-home .gd-floating-card.is-far-depth { --gd-ambient-opacity: .23; width: clamp(56px,3.3vw,69px); filter: saturate(.78) brightness(.8); }
#homeView.gd-home .gd-floating-card .gd-card { pointer-events: none; cursor: default; transform: none; animation: gdAmbientCard var(--gd-breathe-duration,22s) ease-in-out var(--gd-breathe-delay,0s) infinite; will-change: transform; }
/* Ambient cards are set dressing, so they carry no rarity caption: at this size
   it would be an unreadable smudge competing with real content. */
#homeView.gd-home .gd-floating-card .footballer-card-shell.has-card-template::after { content: none; }
@keyframes gdAmbientCard {
  0%,100% { transform: translate3d(calc(var(--gd-ambient-x,8px) * -.55),calc(var(--gd-ambient-y,-12px) * -.55),0) rotate(calc(var(--gd-ambient-r,1.5deg) * -.55)) scale(.99); }
  50% { transform: translate3d(var(--gd-ambient-x,8px),var(--gd-ambient-y,-12px),0) rotate(var(--gd-ambient-r,1.5deg)) scale(var(--gd-ambient-scale,1.015)); }
}

/* ---------------------------------------------------------------------- */
/* Footer social icons — Discord join link                                 */
/* Base color/size rules live in styles.css under the existing #homeView.  */
/* gd-footer-social-icons block (shared with the Twitch icon); this only    */
/* layers on the restrained hover/focus lift the brief asked for, scoped    */
/* narrowly enough not to touch Twitch's existing behaviour.                */
/* ---------------------------------------------------------------------- */
#homeView.gd-home .gd-footer-social-icons a {
  display: inline-flex;
  padding: 4px;
  margin: -4px;
  border-radius: 6px;
  transform: translateY(0);
  transition: color var(--gd-dur-fast) var(--gd-ease-standard),
              transform var(--gd-dur-fast) var(--gd-ease-standard);
}
#homeView.gd-home .gd-footer-social-icons a:hover,
#homeView.gd-home .gd-footer-social-icons a:focus-visible {
  transform: translateY(-1px);
}
#homeView.gd-home .gd-footer-social-icons a:focus-visible {
  outline: 2px solid var(--gd-gold-200);
  outline-offset: 2px;
}

/* ---------------------------------------------------------------------- */
/* Antique match ball                                                      */
/* The lane spans the showcase section and clips, so the ball can start     */
/* beyond the page edge without ever creating horizontal overflow. Its      */
/* resting place is `left`/`bottom` here; home-design.js only writes         */
/* `transform`, so the untransformed layout box stays readable as the        */
/* protected region the ambient cards must avoid.                            */
/* ---------------------------------------------------------------------- */
#homeView.gd-home .gd-ball-lane {
  /* 30% smaller than the original clamp(150px,26vw,560px) — this is also the
     value used under prefers-reduced-motion, where sizeBall() in
     home-design.js never runs to override it with the measured size. */
  --gd-ball-size: clamp(105px,18.2vw,392px);
  --gd-ball-inset: clamp(14px,1.6vw,34px);
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(16px,2.2vw,46px);
  height: var(--gd-ball-size);
  z-index: 6;
  overflow: clip;
  pointer-events: none;
}
#homeView.gd-home .gd-ball-lane.is-crowded-out { display: none; }
#homeView.gd-home .gd-ball-lane picture { display: contents; }
/* Translation lives on the carrier and rotation on the image, so the grounding
   shadow stays flat on the floor instead of swinging round with the ball. */
#homeView.gd-home .gd-ball-carrier {
  position: absolute;
  left: var(--gd-ball-inset);
  bottom: 0;
  display: block;
  width: var(--gd-ball-size);
  transform: translate3d(-190%,0,0);
  will-change: transform;
  /* Grounding for a heavy object: a close, dark contact shadow rather than a
     wide halo. Scaled from the ball's own size so it holds at any width. */
  filter: drop-shadow(0 calc(var(--gd-ball-size) * .045) calc(var(--gd-ball-size) * .085) rgba(0,0,0,.55));
}
#homeView.gd-home .gd-ball {
  display: block;
  width: 100%;
  height: auto;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  will-change: transform;
}
#homeView.gd-home .gd-ball-shadow {
  position: absolute;
  left: var(--gd-ball-inset);
  bottom: 0;
  display: block;
  width: calc(var(--gd-ball-size) * 1.04);
  height: calc(var(--gd-ball-size) * .13);
  margin-left: calc(var(--gd-ball-size) * -.02);
  transform: translate3d(-190%,40%,0);
  background: radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.62),rgba(0,0,0,.28) 44%,transparent 72%);
  pointer-events: none;
  will-change: transform,opacity;
}

#homeView.gd-home .gd-features.is-visible .gd-feature-card {
  opacity: 1;
  transform: none;
  transition: opacity var(--gd-dur-reveal) var(--gd-ease-out-soft),transform var(--gd-dur-reveal) var(--gd-ease-out-soft),border-color var(--gd-dur-base) var(--gd-ease-standard),box-shadow var(--gd-dur-base) var(--gd-ease-standard);
}

@media (min-width: 1101px) {
  #homeView.gd-home .gd-hero-copy { top: 425px; }
}
@media (max-width: 1100px) and (min-width: 761px) {
  #homeView.gd-home .gd-features-grid { gap: 20px; }
}
@media (max-width: 900px) {
  /* The stacked mobile footer fills the width, so there is no empty ground for
     the ball to rest on — it would end up sitting on the legal links. Better
     absent than crammed in. */
  #homeView.gd-home .gd-ball-lane { display: none; }
  #homeView.gd-home .gd-showcase-mobile .gd-showcase-cards { position: relative; display: block; width: 100%; height: 370px; padding: 0; overflow: visible; }
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot { --gd-fan-width:150px; --gd-fan-x:0px; --gd-fan-y:0px; --gd-fan-rotate:0deg; top:48%; }
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-1 { --gd-fan-width:150px; --gd-fan-x:-242px; --gd-fan-y:30px; --gd-fan-rotate:-9deg; }
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-2 { --gd-fan-width:168px; --gd-fan-x:-128px; --gd-fan-y:10px; --gd-fan-rotate:-4deg; }
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-3 { --gd-fan-width:184px; --gd-fan-y:-8px; }
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-4 { --gd-fan-width:168px; --gd-fan-x:128px; --gd-fan-y:10px; --gd-fan-rotate:4deg; }
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-5 { --gd-fan-width:150px; --gd-fan-x:242px; --gd-fan-y:30px; --gd-fan-rotate:9deg; }
  #homeView.gd-home .gd-floating-cards { display: none; }
}
@media (max-width: 760px) {
  #homeView.gd-home .gd-hero-mobile .gd-hero-brand img { width: 40px; height: 40px; }
  #homeView.gd-home .gd-hero-mobile .gd-hero-heading { width:min(100%,20rem); margin-top:clamp(150px,37vh,300px); margin-inline:auto; font-size:clamp(1.5rem,8.2vw,2.32rem); }
  #homeView.gd-home .gd-features,
  #homeView.gd-home .gd-feature-card { opacity: 1; transform: none; }
}
@media (max-width: 540px) {
  #homeView.gd-home .gd-showcase-mobile .gd-showcase-cards { display:flex; height:auto; gap:14px; overflow-x:auto; overflow-y:hidden; padding:16px 4px 28px; scroll-snap-type:x proximity; }
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot,
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-1,
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-2,
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-3,
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-4,
  #homeView.gd-home .gd-showcase-mobile .gd-fan-slot-5 { position:relative; inset:auto; flex:0 0 170px; width:170px; transform:none; scroll-snap-align:center; }
}
@media (prefers-reduced-motion: reduce) {
  #homeView.gd-home .gd-card,
  #homeView.gd-home .gd-card.is-tilting { transform:none !important; transition:none !important; }
  #homeView.gd-home .gd-card-glare { opacity:0 !important; }
  /* Ambient cards keep their placed positions but stop travelling; the script
     skips the motion loop entirely under this preference. */
  #homeView.gd-home .gd-floating-card { transition:none !important; }
  #homeView.gd-home .gd-floating-card.is-placed { --gd-ambient-opacity:.22 !important; }
  #homeView.gd-home .gd-floating-card .gd-card { animation:none !important; transform:none !important; will-change:auto; }
  #homeView.gd-home .gd-ball,
  #homeView.gd-home .gd-ball-shadow { transition:none !important; }
  #homeView.gd-home .gd-feature-art img { transform:none !important; will-change:auto; }
  #homeView.gd-home .gd-feature-card::after { animation:none; opacity:0; }
}

/* Targeted mobile composition: use the canonical desktop hero itself, fitted
   by width so the complete central G.O.A.T crest reads as an emblem instead
   of the meaningless edge produced by portrait `cover`. */
@media (max-width:760px){
  #homeView.gd-home .gd-hero-mobile{
    background-image:
      url('/gd2-hero.png'),
      url('/gd2-features-bg-final.png')!important;
    background-position:center top,center bottom!important;
    background-size:100% auto,cover!important;
    background-repeat:no-repeat!important;
    background-color:#050403!important;
  }
  #homeView.gd-home .gd-hero-mobile::before{
    background:linear-gradient(180deg,rgba(5,4,3,.02) 0,rgba(5,4,3,.08) 20%,rgba(5,4,3,.28) 48%,rgba(5,4,3,.48) 100%)!important;
  }
  #homeView.gd-home .gd-hero-mobile .gd-hero-heading{margin-top:clamp(155px,53vw,230px)!important}
}

/* Desktop uses the final stadium-section artwork. Keep the same asset on
   tablets and phones; responsive changes are crop/position only. */
@media (max-width:1100px){
  #homeView.gd-home .gd-features{
    background-image:url('/gd2-features-bg-final.png')!important;
    background-position:center top!important;
    background-size:cover!important;
  }
}

/* A low phone viewport needs the complete legal/navigation set without the
   generous desktop vertical rhythm. Links remain visible and tappable. */
@media (orientation:landscape) and (max-height:500px) and (max-width:1000px){
  #homeView.gd-home .gd-footer{content-visibility:visible!important;contain-intrinsic-size:none!important;height:auto!important;padding:18px 24px 14px!important}
  #homeView.gd-home .gd-footer::before{top:-28px;height:29px}
  #homeView.gd-home .gd-footer-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:16px!important}
  #homeView.gd-home .gd-footer-brand{gap:8px!important}
  #homeView.gd-home .gd-footer-brand img{width:36px!important;height:36px!important}
  #homeView.gd-home .gd-footer-brand strong{font-size:.76rem!important}
  #homeView.gd-home .gd-footer-brand small{margin-top:1px!important;font-size:.58rem!important}
  #homeView.gd-home .gd-footer-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px!important}
  #homeView.gd-home .gd-footer-col{min-width:0!important;gap:5px!important}
  #homeView.gd-home .gd-footer-col-title{font-size:.55rem!important}
  #homeView.gd-home .gd-footer-col a{font-size:.62rem!important;line-height:1.2!important}
  #homeView.gd-home .gd-footer-social{gap:7px!important}
  #homeView.gd-home .gd-footer-social-icons{gap:10px!important}
  #homeView.gd-home .gd-footer-social-icons svg{width:16px!important;height:16px!important}
  #homeView.gd-home .gd-footer-bottom{margin-top:12px!important;padding-top:9px!important;gap:8px 16px!important;font-size:.56rem!important;line-height:1.2!important}
}