/* Gulf section — 3D carousel-inspired animation
   Vanilla HTML/CSS/JS. Existing markup/content/layout preserved. */
.home-gulf-section .home-gulf-grid{
  --gulf-gold:#d4af37;
  perspective:1400px;
  transform-style:preserve-3d;
  position:relative;
}
.home-gulf-section .home-gulf-card{
  position:relative;
  transform-style:preserve-3d;
  backface-visibility:hidden;
  transform:translate3d(0,var(--gulf-y,0),var(--gulf-z,0)) rotateY(var(--gulf-ry,0deg)) rotateX(var(--gulf-rx,0deg)) scale(var(--gulf-scale,1));
  will-change:transform,box-shadow,filter;
  transition:transform .85s cubic-bezier(.22,.61,.36,1),box-shadow .7s ease,border-color .55s ease,filter .55s ease;
  overflow:hidden;
}
/* Soft 3D depth rail */
.home-gulf-section .home-gulf-grid::before{
  content:"";
  position:absolute;
  left:3%;right:3%;top:51%;height:2px;
  background:linear-gradient(90deg,transparent,rgba(212,175,55,.12) 8%,rgba(212,175,55,.62) 50%,rgba(212,175,55,.12) 92%,transparent);
  box-shadow:0 0 18px rgba(212,175,55,.18);
  z-index:0;
}
/* Moving golden orbit light */
.home-gulf-section .home-gulf-grid::after{
  content:"";
  position:absolute;
  top:calc(51% - 5px);
  left:3%;
  width:10px;height:10px;border-radius:50%;
  background:radial-gradient(circle,#fff 0 18%,#d4af37 40% 62%,transparent 72%);
  box-shadow:0 0 18px rgba(212,175,55,.95),0 0 34px rgba(212,175,55,.35);
  opacity:0;
  pointer-events:none;
  z-index:5;
}
.home-gulf-section.gulf-3d-active .home-gulf-grid::after{opacity:1;animation:gulfOrbit 6.6s ease-in-out infinite;}
@keyframes gulfOrbit{0%{left:3%;transform:scale(.7)}50%{left:50%;transform:scale(1.3)}100%{left:97%;transform:scale(.7)}}

/* Entry animation: cards arrive as a gentle 3D fan */
.home-gulf-section:not(.gulf-3d-ready) .home-gulf-card{opacity:0;transform:translateY(28px) rotateX(-18deg) scale(.96)}
.home-gulf-section.gulf-3d-ready .home-gulf-card{animation:gulfEntry .85s cubic-bezier(.22,.61,.36,1) both;animation-delay:calc(var(--gulf-i,0) * 90ms);}
@keyframes gulfEntry{0%{opacity:0;transform:translateY(28px) rotateX(-18deg) scale(.96)}70%{opacity:1;transform:translateY(-4px) rotateX(3deg) scale(1.015)}100%{opacity:1;transform:translateY(0) rotateX(0) scale(1)}}

/* Active card: moves toward the viewer like a carousel face */
.home-gulf-section .home-gulf-card.gulf-3d-active-card{
  --gulf-y:-12px;--gulf-z:42px;--gulf-ry:0deg;--gulf-rx:0deg;--gulf-scale:1.045;
  border-color:var(--gulf-gold);
  box-shadow:0 30px 55px rgba(70,50,8,.22),0 0 0 1px rgba(212,175,55,.12),0 0 32px rgba(212,175,55,.16);
  filter:saturate(1.06) contrast(1.01);
  z-index:4;
}
.home-gulf-section .home-gulf-card.gulf-3d-left{--gulf-y:-4px;--gulf-z:12px;--gulf-ry:5deg;--gulf-scale:.995;filter:saturate(.98)}
.home-gulf-section .home-gulf-card.gulf-3d-right{--gulf-y:-4px;--gulf-z:12px;--gulf-ry:-5deg;--gulf-scale:.995;filter:saturate(.98)}
.home-gulf-section .home-gulf-card.gulf-3d-far-left{--gulf-ry:8deg;--gulf-z:0px;--gulf-scale:.985}
.home-gulf-section .home-gulf-card.gulf-3d-far-right{--gulf-ry:-8deg;--gulf-z:0px;--gulf-scale:.985}

/* Gold glass sweep on active face */
.home-gulf-section .home-gulf-card::after{
  content:"";
  position:absolute;top:-30%;bottom:-30%;left:-75%;width:30%;
  background:linear-gradient(105deg,transparent,rgba(255,249,210,.78),rgba(212,175,55,.18),transparent);
  transform:skewX(-18deg);
  opacity:0;pointer-events:none;z-index:6;
}
.home-gulf-section .home-gulf-card.gulf-3d-active-card::after{opacity:1;animation:gulfSweep 1.05s ease 1;}
@keyframes gulfSweep{from{left:-75%}to{left:145%}}
.home-gulf-section .home-gulf-card::before{
  content:"";position:absolute;inset:-1px;border-radius:13px;border:1px solid transparent;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
  pointer-events:none;z-index:5;transition:border-color .5s ease,box-shadow .6s ease;
}
.home-gulf-section .home-gulf-card.gulf-3d-active-card::before{border-color:rgba(212,175,55,.72);box-shadow:0 0 26px rgba(212,175,55,.15),inset 0 1px 0 #fff;}

.home-gulf-section .home-gulf-flag{
  transform-style:preserve-3d;
  backface-visibility:visible;
  transition:transform .85s cubic-bezier(.22,.61,.36,1),filter .6s ease;
}
.home-gulf-section .home-gulf-card.gulf-3d-active-card .home-gulf-flag{
  transform:translateY(-6px) translateZ(22px) scale(1.16) rotateY(8deg);
  filter:drop-shadow(0 12px 14px rgba(58,42,10,.24));
}
.home-gulf-section .home-gulf-card.gulf-3d-active-card h3{color:#a86f00;transition:color .45s ease}
.home-gulf-section .home-gulf-card:hover{
  --gulf-y:-10px;--gulf-z:26px;--gulf-scale:1.035;--gulf-ry:0deg!important;
  border-color:var(--gulf-gold);z-index:8;
  box-shadow:0 26px 45px rgba(84,61,13,.20),0 0 28px rgba(212,175,55,.14);
}
.home-gulf-section .home-gulf-card:hover .home-gulf-flag{transform:translateY(-5px) translateZ(18px) scale(1.1) rotateY(8deg)}

@media(max-width:1050px){
  .home-gulf-section .home-gulf-grid::before,.home-gulf-section .home-gulf-grid::after{display:none}
  .home-gulf-section .home-gulf-card.gulf-3d-far-left,.home-gulf-section .home-gulf-card.gulf-3d-far-right{--gulf-ry:3deg}
}
@media(max-width:650px){
  .home-gulf-section .home-gulf-card.gulf-3d-active-card{--gulf-y:-8px;--gulf-z:14px;--gulf-scale:1.02}
  .home-gulf-section .home-gulf-card.gulf-3d-left,.home-gulf-section .home-gulf-card.gulf-3d-right{--gulf-y:-3px;--gulf-z:5px;--gulf-ry:2deg}
}
@media(prefers-reduced-motion:reduce){
  .home-gulf-section .home-gulf-card,.home-gulf-section .home-gulf-card.gulf-3d-active-card,.home-gulf-section .home-gulf-card.gulf-3d-left,.home-gulf-section .home-gulf-card.gulf-3d-right,.home-gulf-section .home-gulf-card.gulf-3d-far-left,.home-gulf-section .home-gulf-card.gulf-3d-far-right{animation:none!important;transition:none!important;transform:none!important}
  .home-gulf-section .home-gulf-grid::after{display:none!important}
}
