/* =====================================================================
   PAKSA — GROUP OF COMPANIES (page-specific, additive stylesheet)
   Every selector below is new — nothing here edits or overrides a rule
   from style.css. Safe to link on top of the existing stylesheet.
   ===================================================================== */

/* ---------- page intro (no hero on this page, so it needs its own
   top padding to clear the fixed .site-header) ---------- */
.group-hero{position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(160deg,var(--deep),var(--navy) 65%,#132a6e);
  color:#fff;padding:170px 9vw 90px}
.group-hero:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:70px 70px;
  mask-image:radial-gradient(circle at 25% 20%,black,transparent 68%)}
.group-hero .eyebrow{position:relative;z-index:1;color:var(--wow-orange,var(--orange))}
.group-hero h1{position:relative;z-index:1;margin:0 0 20px;
  font:700 clamp(44px,6.6vw,100px)/.9 "Space Grotesk",sans-serif;letter-spacing:-.06em}
.group-hero h1 em{font-family:"Manrope";font-weight:500;font-style:normal;
  color:transparent;-webkit-text-stroke:1.4px #fff}
.group-hero p{position:relative;z-index:1;max-width:560px;margin:0;
  font-size:15px;line-height:1.8;color:rgba(255,255,255,.68)}

/* ---------- the three-card row ---------- */
.group-section{background:var(--paper);padding:110px 9vw 140px}
.group-row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:14px}

.group-card{position:relative;overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;justify-content:flex-end;
  min-height:460px;border-radius:26px;padding:32px 28px 30px;
  color:#fff;text-decoration:none;
  opacity:0;transform:translateY(40px);
  transition:transform .7s var(--ease),box-shadow .55s var(--ease),opacity .7s var(--ease)}
.group-card.show{opacity:1;transform:none}
.group-card.show:hover{transform:translateY(-10px);box-shadow:0 35px 70px rgba(6,16,50,.3)}
.group-card:nth-child(2){transition-delay:.1s}
.group-card:nth-child(3){transition-delay:.2s}

.group-card:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(200deg,rgba(255,255,255,.14),transparent 45%,rgba(4,12,36,.48))}

.group-card-no{position:relative;z-index:3;margin-bottom:auto;
  font:700 11px "Space Grotesk",sans-serif;letter-spacing:.2em;opacity:.7}
.group-card-body{position:relative;z-index:3}
.group-card-tag{display:block;margin-bottom:12px;
  font:700 9px "DM Sans",sans-serif;letter-spacing:.2em;text-transform:uppercase;opacity:.78}
.group-card-name{margin:0 0 14px;font:700 clamp(24px,2.3vw,32px)/1.08 "Space Grotesk",sans-serif;letter-spacing:-.02em}
.group-card-desc{max-width:280px;margin:0 0 20px;font-size:12.5px;line-height:1.7;color:rgba(255,255,255,.75)}
.group-card-cta{display:inline-flex;align-items:center;gap:12px;width:max-content;
  font:700 10px "DM Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:7px}
.group-card-cta span{display:inline-block;transition:transform .35s var(--ease)}
.group-card.show:hover .group-card-cta span{transform:translateX(6px)}

/* ---- card A — PAKSA IDEAAS (interiors) ---- */
.group-card-a{background:linear-gradient(150deg,#173080,#081943 72%)}
.group-card-a .group-glow{position:absolute;z-index:2;width:280px;height:280px;right:-90px;top:-90px;
  border-radius:50%;background:radial-gradient(circle,rgba(244,81,19,.35),transparent 65%);
  animation:groupPulse 6s ease-in-out infinite}
.group-card-a .group-arch{position:absolute;z-index:2;right:40px;bottom:-70px;width:150px;height:220px;
  border:20px solid rgba(246,243,237,.85);border-bottom:0;border-radius:90px 90px 0 0;
  transform:rotate(-10deg);opacity:.9}

/* ---- card B — PAKSA PVT LTD (the parent / 5 wings) ---- */
.group-card-b{background:linear-gradient(150deg,#0c287c,#061642 72%)}
.group-card-b .group-orbit-ring{position:absolute;z-index:2;left:50%;top:36%;width:230px;height:230px;margin:-115px 0 0 -115px;
  border:1px solid rgba(255,255,255,.18);border-radius:50%;animation:groupOrbitSpin 22s linear infinite}
.group-card-b .group-orbit-ring:after{content:"";position:absolute;inset:26px;border-radius:50%;
  border:1px solid rgba(255,255,255,.12);animation:groupOrbitSpin 16s linear infinite reverse}
.group-card-b .group-orbit-core{position:absolute;z-index:2;left:50%;top:36%;width:66px;height:66px;margin:-33px 0 0 -33px;
  border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff9a5c,var(--wow-orange,var(--orange)) 65%);
  box-shadow:0 0 40px rgba(244,81,19,.5)}
.group-card-b .group-orbit-dot{position:absolute;z-index:2;width:9px;height:9px;border-radius:50%;
  background:#fff;box-shadow:0 0 10px rgba(255,255,255,.65);transform:translate(-50%,-50%)}
.group-card-b .gd1{left:50%;top:15%;animation:groupDrift 6s ease-in-out infinite}
.group-card-b .gd2{left:76%;top:28%;animation:groupDrift 7s ease-in-out infinite .6s}
.group-card-b .gd3{left:70%;top:55%;animation:groupDrift 5.5s ease-in-out infinite 1.1s}
.group-card-b .gd4{left:30%;top:55%;animation:groupDrift 6.4s ease-in-out infinite .3s}
.group-card-b .gd5{left:24%;top:28%;animation:groupDrift 5.8s ease-in-out infinite .9s}

/* ---- card C — PRIMEGLOBE INTERNATIONAL (trade) ---- */
.group-card-c{background:linear-gradient(150deg,#061642,#0c287c 78%)}
.group-card-c .group-globe{position:absolute;z-index:2;right:-30px;top:-30px;width:220px;height:220px;
  border:1px solid rgba(255,255,255,.25);border-radius:50%;animation:groupOrbitSpin 26s linear infinite}
.group-card-c .group-globe:before,.group-card-c .group-globe:after{content:"";position:absolute;inset:18px;border-radius:50%;
  border:1px solid rgba(255,255,255,.16)}
.group-card-c .group-globe:after{transform:rotate(60deg);
  border-top-color:var(--wow-orange,var(--orange));border-bottom-color:var(--wow-orange,var(--orange))}
.group-card-c .group-route{position:absolute;z-index:2;height:2px;opacity:.85;transform:rotate(-26deg);
  background:var(--wow-orange,var(--orange))}
.group-card-c .gr1{width:70px;right:24px;top:58%}
.group-card-c .gr2{width:112px;right:62px;top:50%}
.group-card-c .gr3{width:44px;right:132px;top:66%}

/* ---------- shared keyframes ---------- */
@keyframes groupOrbitSpin{to{transform:rotate(360deg)}}
@keyframes groupPulse{0%,100%{transform:scale(1);opacity:.8}50%{transform:scale(1.16);opacity:1}}
@keyframes groupDrift{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.7)}}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .group-hero{padding:140px 6vw 70px}
  .group-section{padding:80px 6vw 100px}
  .group-row{grid-template-columns:1fr;gap:18px}
  .group-card{min-height:400px}
}
@media(max-width:560px){
  .group-hero{padding:120px 6vw 60px}
  .group-card{min-height:360px;padding:26px 22px 24px}
  .group-card-desc{max-width:none}
}
@media(prefers-reduced-motion:reduce){
  .group-card{transition:opacity .3s ease}
  .group-card.show:hover{transform:none}
  .group-glow,.group-orbit-ring,.group-orbit-ring:after,.group-orbit-dot,.group-globe{animation:none}
}