/* ============ AIOOS — luxury pass ============ */

/* ---------- signature serif accent on gradient words ---------- */
h1 .g, .h2 .g{
  font-family:'Instrument Serif', Georgia, serif;
  font-style:italic; font-weight:400;
  font-size:1.07em; letter-spacing:-.01em; padding-right:.08em;
}
h1{font-weight:700; letter-spacing:-2.6px}

/* refined selection + scrollbar */
::selection{background:#0A1222; color:#fff}
html{scrollbar-width:thin; scrollbar-color:#B9C8DE transparent}

/* ---------- metallic gradient hairlines on glass ---------- */
nav{
  border:1px solid transparent;
  background:
    linear-gradient(rgba(255,255,255,.42), rgba(255,255,255,.42)) padding-box,
    linear-gradient(120deg, rgba(45,108,246,.4), rgba(34,211,238,.35) 45%, rgba(124,92,252,.4)) border-box;
}
.gcard{
  border:1px solid transparent;
  background:
    linear-gradient(rgba(255,255,255,.88), rgba(255,255,255,.88)) padding-box,
    linear-gradient(130deg, rgba(45,108,246,.45), rgba(255,255,255,.9) 40%, rgba(34,211,238,.45)) border-box;
}
.gl{
  border:1px solid transparent;
  background:
    linear-gradient(rgba(255,255,255,.72), rgba(255,255,255,.72)) padding-box,
    linear-gradient(135deg, rgba(45,108,246,.32), rgba(255,255,255,.85) 38%, rgba(34,211,238,.3) 70%, rgba(124,92,252,.32)) border-box;
}

/* ---------- CTA shine sweep ---------- */
.cta, .cta-white, .pbtn.light, .pbtn.solid{position:relative; overflow:hidden}
.cta::before, .cta-white::before{
  content:""; position:absolute; top:-10%; left:-70%; width:42%; height:120%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
  transform:skewX(-22deg);
}
@media (prefers-reduced-motion:no-preference){
  .cta::before, .cta-white::before{animation:shineSweep 4.8s cubic-bezier(.6,.1,.3,1) infinite}
}
@keyframes shineSweep{0%,72%{left:-70%}92%,100%{left:160%}}

/* nav links: quiet luxury hover */
.nav-links a{position:relative; padding-bottom:3px}
.nav-links a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:1.5px;
  background:linear-gradient(90deg,var(--blue),#22D3EE); transition:width .3s cubic-bezier(.2,.7,.3,1)}
.nav-links a:hover::after{width:100%}

/* ---------- stats: gallery numbers ---------- */
.stat .n{font-size:58px; letter-spacing:-2.6px}
.stat .l{margin-top:14px; font-size:13.5px; letter-spacing:.04em; text-transform:uppercase; color:rgba(255,255,255,.6); font-weight:600}

/* ---------- testimonials: serif voice ---------- */
.quote p{font-family:'Instrument Serif', Georgia, serif; font-style:italic; font-weight:400;
  font-size:19.5px; line-height:1.5; letter-spacing:.1px; color:var(--ink)}

/* ---------- pricing: aurora ring on the hero plan ---------- */
@property --luxa{syntax:'<angle>'; initial-value:0deg; inherits:false}
.price-wrap-best{position:relative; border-radius:26px}
.price.best{position:relative; z-index:1}
.price.best::after{
  content:""; position:absolute; inset:-2.5px; border-radius:27px; z-index:-1;
  background:conic-gradient(from var(--luxa), #2D6CF6, #22D3EE 30%, #7C5CFC 55%, #14B8A6 75%, #2D6CF6);
  filter:blur(10px); opacity:.65;
}
@media (prefers-reduced-motion:no-preference){
  .price.best::after{animation:luxSpin 7s linear infinite}
}
@keyframes luxSpin{to{--luxa:360deg}}

/* ---------- CTA band: serif accent + depth ---------- */
.cta-band h2 .g2{font-family:'Instrument Serif', Georgia, serif; font-style:italic; font-weight:400; font-size:1.07em}
.cta-band{box-shadow:0 60px 120px -44px rgba(20,80,200,.75), inset 0 1px 0 rgba(255,255,255,.35)}

/* ---------- footer: giant watermark ---------- */
.footer{overflow:hidden}
.footer .watermark{
  position:absolute; left:50%; bottom:-58px; transform:translateX(-50%);
  font-family:var(--font-head); font-weight:800; font-size:300px; line-height:1; letter-spacing:-.04em;
  color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.07); pointer-events:none; user-select:none; white-space:nowrap;
}

/* ---------- hero scene: depth via parallax (JS sets --px/--py) ---------- */
.gcard{translate:calc(var(--px,0)*var(--depth,1)) calc(var(--py,0)*var(--depth,1)); will-change:translate}
.card-tel{--depth:1.25}
.card-web{--depth:.85}
.card-wa{--depth:1.55}
.s-person img{translate:calc(var(--px,0)*-.35) calc(var(--py,0)*-.35); will-change:translate}

/* eyebrow: couture spacing */
.eyebrow2{letter-spacing:.16em; font-size:11.5px}
.trust .label{letter-spacing:.22em; font-size:11.5px}

/* hero sub: airier */
.sub{font-size:18.5px; line-height:1.66; letter-spacing:-.2px}

@media (max-width:980px){
  .footer .watermark{font-size:140px; bottom:-28px}
  .stat .n{font-size:44px}
}