/* ═══════════ Test v2 — full development experience ═══════════ */

/* ░ Liquid-glass tab border: animated iridescent ring + chromatic edge ░ */
@property --ang { syntax:'<angle>'; inherits:false; initial-value:0deg; }
.tabs.liquid::after{
  content:""; position:absolute; inset:-1.5px; border-radius:inherit; padding:1.5px;
  background:conic-gradient(from var(--ang),
    #e9b873, #7fd1c0, #8aa8ff, #d79bff, #ffb0c0, #ffd9a0, #e9b873);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:irid 7s linear infinite; pointer-events:none; opacity:.85;
  filter:saturate(1.3);
}
.tabs.liquid::before{ /* chromatic aberration glow, gently breathing */
  content:""; position:absolute; inset:0; border-radius:inherit; z-index:-1; pointer-events:none;
  box-shadow:-3px 0 14px rgba(255,40,90,.16), 3px 0 14px rgba(40,170,255,.16), 0 0 22px rgba(233,184,115,.10);
  animation:chroma 5s ease-in-out infinite;
}
@keyframes irid{ to{ --ang:360deg } }
@keyframes chroma{ 0%,100%{ box-shadow:-3px 0 14px rgba(255,40,90,.16), 3px 0 14px rgba(40,170,255,.16), 0 0 18px rgba(233,184,115,.08) }
  50%{ box-shadow:-5px 0 20px rgba(255,40,90,.22), 5px 0 20px rgba(40,170,255,.22), 0 0 30px rgba(233,184,115,.16) } }
@media (prefers-reduced-motion: reduce){ .tabs.liquid::after,.tabs.liquid::before{ animation:none } }

/* ░ Reusable glass surface with subtle iridescent border ░ */
.glass{
  position:relative; background:rgba(255,255,255,.045);
  backdrop-filter:blur(16px) saturate(140%); -webkit-backdrop-filter:blur(16px) saturate(140%);
  border:1px solid transparent; border-radius:18px;
  background-clip:padding-box;
  box-shadow:0 18px 50px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
}
.glass::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(135deg, rgba(233,184,115,.6), rgba(127,209,192,.25) 40%, rgba(255,255,255,.05) 70%, rgba(180,150,255,.35));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; opacity:.7;
}

/* ░ Panel base ░ */
.tab-panel.v2{ background:#0a0d0a; color:var(--cream); }
.tab-panel.v2 .hero{ background:#06080a; }
.tab-panel.v2 .v2-scene.hero-track{ height:380vh; } /* tighter scrub than the single-hero tab */
.v2-eyebrow{ font-family:'Cinzel',serif; font-size:12px; letter-spacing:.34em; text-transform:uppercase; color:var(--gold); margin-bottom:18px; }
.v2 h2,.v2 h3,.v2 h4{ font-family:'Cormorant Garamond',serif; font-weight:500; letter-spacing:-.01em; }

/* scroll-reveal */
.v2-reveal{ opacity:0; transform:translateY(30px); transition:opacity .9s var(--ease), transform 1s var(--ease); will-change:opacity,transform; }
.v2-reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .v2-reveal{ opacity:1 !important; transform:none !important; } }

/* ░ Manifesto ░ */
.v2-manifesto{ max-width:1100px; margin:0 auto; padding:18vh clamp(24px,7vw,120px); text-align:center; }
.v2-statement{ font-size:clamp(30px,5vw,68px); line-height:1.08; margin:0 auto 36px; max-width:20ch; }
.v2-statement em{ display:block; font-style:italic; color:var(--gold); }
.v2-lede{ font-size:clamp(15px,1.6vw,20px); font-weight:300; line-height:1.7; color:rgba(245,241,232,.72); max-width:60ch; margin:0 auto; }

/* ░ Stats ░ */
.v2-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; padding:0 clamp(24px,7vw,120px) 14vh; max-width:1300px; margin:0 auto; }
.v2-stat{ padding:34px 26px; text-align:center; }
.v2-num{ display:block; font-family:'Cormorant Garamond',serif; font-size:clamp(44px,5vw,72px); line-height:1; color:var(--cream); }
.v2-num i{ font-style:normal; font-size:.4em; color:var(--gold); margin-left:3px; }
.v2-label{ display:block; margin-top:12px; font-size:12.5px; letter-spacing:.04em; color:rgba(245,241,232,.6); }
.v2-stats .v2-reveal:nth-child(2){ transition-delay:.08s } .v2-stats .v2-reveal:nth-child(3){ transition-delay:.16s } .v2-stats .v2-reveal:nth-child(4){ transition-delay:.24s }

/* ░ Story ░ */
.v2-story{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(30px,5vw,80px); align-items:center; max-width:1300px; margin:0 auto; padding:10vh clamp(24px,7vw,120px); }
.v2-story-media{ position:relative; height:min(70vh,640px); border-radius:20px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.v2-parallax{ position:absolute; inset:-12% 0; background-size:cover; background-position:center; will-change:transform; }
.v2-media-tag{ position:absolute; left:18px; bottom:16px; font-family:'Cinzel',serif; font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--cream); background:rgba(10,13,10,.5); backdrop-filter:blur(8px); padding:7px 13px; border-radius:100px; }
.v2-story-text h3{ font-size:clamp(30px,4vw,56px); line-height:1.04; margin:6px 0 20px; }
.v2-story-text > p{ font-size:clamp(15px,1.5vw,18px); font-weight:300; line-height:1.7; color:rgba(245,241,232,.74); }
.v2-ticks{ list-style:none; margin:28px 0 0; padding:0; }
.v2-ticks li{ position:relative; padding:14px 0 14px 30px; border-top:1px solid rgba(255,255,255,.08); font-size:14.5px; color:rgba(245,241,232,.82); }
.v2-ticks li::before{ content:""; position:absolute; left:0; top:18px; width:14px; height:8px; border-left:1.5px solid var(--gold); border-bottom:1.5px solid var(--gold); transform:rotate(-45deg); }
.v2-ticks .v2-reveal:nth-child(2){ transition-delay:.1s } .v2-ticks .v2-reveal:nth-child(3){ transition-delay:.2s }

/* ░ Masterplan ░ */
.v2-plan{ max-width:1300px; margin:0 auto; padding:10vh clamp(24px,7vw,120px); }
.v2-plan-head h3{ font-size:clamp(28px,4vw,54px); line-height:1.04; margin-top:6px; }
.v2-plan-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(28px,4vw,64px); align-items:center; margin-top:48px; }
.v2-plan-map{ padding:14px; border-radius:20px; }
.v2-plan-map svg{ width:100%; height:auto; display:block; border-radius:12px; }
.v2-plan-legend{ list-style:none; margin:0; padding:0; counter-reset:lg; }
.v2-plan-legend li{ display:flex; align-items:baseline; gap:14px; padding:18px 0; border-top:1px solid rgba(255,255,255,.08); font-size:15px; color:rgba(245,241,232,.78); }
.v2-plan-legend b{ color:var(--cream); font-weight:600; }
.v2-dot{ flex:none; width:11px; height:11px; border-radius:50%; background:var(--c); box-shadow:0 0 12px var(--c); transform:translateY(2px); }
.v2-plan-legend .v2-reveal:nth-child(2){ transition-delay:.08s } .v2-plan-legend .v2-reveal:nth-child(3){ transition-delay:.16s } .v2-plan-legend .v2-reveal:nth-child(4){ transition-delay:.24s }

/* ░ Section heads ░ */
.v2-sec-head{ text-align:center; max-width:60ch; margin:0 auto 56px; }
.v2-sec-head h3{ font-size:clamp(28px,4vw,56px); line-height:1.04; margin-top:6px; }

/* ░ Residences ░ */
.v2-residences{ max-width:1300px; margin:0 auto; padding:12vh clamp(24px,7vw,120px); }
.v2-cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.v2-card{ padding:30px 26px 28px; min-height:230px; display:flex; flex-direction:column; transition:transform .5s var(--ease), box-shadow .5s var(--ease); }
.v2-card:hover{ transform:translateY(-8px); }
.v2-card-tag{ font-family:'Cinzel',serif; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); }
.v2-card h4{ font-size:clamp(26px,2.6vw,34px); margin:14px 0 6px; }
.v2-card-meta{ font-size:13px; color:rgba(245,241,232,.6); }
.v2-card-price{ margin-top:auto; padding-top:20px; font-size:14px; color:rgba(245,241,232,.7); }
.v2-card-price b{ font-family:'Cormorant Garamond',serif; font-size:26px; color:var(--cream); margin-left:4px; }
.v2-card.featured{ background:rgba(233,184,115,.07); }
.v2-cards .v2-reveal:nth-child(2){ transition-delay:.08s } .v2-cards .v2-reveal:nth-child(3){ transition-delay:.16s } .v2-cards .v2-reveal:nth-child(4){ transition-delay:.24s }

/* ░ Amenities ░ */
.v2-amenities{ max-width:1300px; margin:0 auto; padding:8vh clamp(24px,7vw,120px) 12vh; }
.v2-amen-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.v2-amen{ padding:30px 28px; border-radius:16px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.02); transition:background .4s, border-color .4s; }
.v2-amen:hover{ background:rgba(255,255,255,.05); border-color:rgba(233,184,115,.35); }
.v2-amen .ico{ width:28px; height:28px; fill:none; stroke:var(--gold); stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.v2-amen b{ display:block; margin-top:16px; font-size:17px; font-weight:600; color:var(--cream); }
.v2-amen span{ display:block; margin-top:5px; font-size:13px; color:rgba(245,241,232,.6); }
.v2-amen-grid .v2-reveal:nth-child(3n+2){ transition-delay:.08s } .v2-amen-grid .v2-reveal:nth-child(3n+3){ transition-delay:.16s }

/* ░ Phases timeline ░ */
.v2-phases{ max-width:920px; margin:0 auto; padding:8vh clamp(24px,7vw,120px) 12vh; }
.v2-timeline{ list-style:none; margin:0; padding:0; position:relative; }
.v2-timeline::before{ content:""; position:absolute; left:27px; top:10px; bottom:10px; width:1px; background:linear-gradient(180deg,var(--gold),rgba(233,184,115,.1)); }
.v2-step{ display:flex; gap:26px; padding:22px 0; }
.v2-step-no{ flex:none; width:56px; height:56px; border-radius:50%; display:grid; place-items:center; font-family:'Cormorant Garamond',serif; font-size:22px; color:var(--cream); background:#0e1510; border:1px solid rgba(233,184,115,.4); position:relative; z-index:1; }
.v2-step h4{ font-size:26px; margin:4px 0 6px; }
.v2-step p{ font-size:14.5px; color:rgba(245,241,232,.7); line-height:1.6; }
.v2-step-state{ font-family:'Cinzel',serif; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:rgba(245,241,232,.45); }
.v2-step-state.done{ color:#7fd1a0 } .v2-step-state.live{ color:var(--gold) }
.v2-timeline .v2-reveal:nth-child(2){ transition-delay:.1s } .v2-timeline .v2-reveal:nth-child(3){ transition-delay:.2s } .v2-timeline .v2-reveal:nth-child(4){ transition-delay:.3s }

/* ░ Register ░ */
.v2-register{ max-width:760px; margin:0 auto; padding:6vh clamp(24px,7vw,120px) 14vh; }
.v2-reg-card{ padding:clamp(32px,5vw,60px); text-align:center; border-radius:24px; }
.v2-reg-card h3{ font-size:clamp(30px,4vw,52px); line-height:1.04; margin:6px 0 14px; }
.v2-reg-lede{ font-size:15.5px; font-weight:300; color:rgba(245,241,232,.7); max-width:46ch; margin:0 auto 34px; }
.v2-form{ display:grid; grid-template-columns:1fr 1fr; gap:16px; text-align:left; }
.v2-field{ display:flex; flex-direction:column; gap:7px; }
.v2-field:nth-child(3){ grid-column:1 / -1; }
.v2-field label{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:rgba(245,241,232,.55); }
.v2-field input,.v2-field select{ height:50px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:0 16px; color:var(--cream); font-family:'Inter',sans-serif; font-size:15px; transition:border-color .3s, background .3s; }
.v2-field input::placeholder{ color:rgba(245,241,232,.35); }
.v2-field input:focus,.v2-field select:focus{ outline:none; border-color:var(--gold); background:rgba(255,255,255,.06); }
.v2-field input:focus-visible,.v2-field select:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.v2-submit{ grid-column:1 / -1; margin-top:8px; background:var(--gold); color:var(--ink); justify-self:center; }

/* ░ Footer ░ */
.v2-footer{ text-align:center; padding:10vh clamp(24px,7vw,120px) 8vh; border-top:1px solid rgba(255,255,255,.07); }
.v2-foot-brand{ font-family:'Cinzel',serif; font-size:34px; letter-spacing:.28em; color:var(--cream); }
.v2-footer > p{ margin:14px 0 26px; font-size:14px; color:rgba(245,241,232,.6); }
.v2-footer .foot{ color:#6f6a5e; }

/* ░ Responsive ░ */
@media(max-width:900px){
  .v2-stats{ grid-template-columns:repeat(2,1fr); }
  .v2-story{ grid-template-columns:1fr; } .v2-story-media{ height:54vh; }
  .v2-plan-grid{ grid-template-columns:1fr; }
  .v2-cards{ grid-template-columns:repeat(2,1fr); }
  .v2-amen-grid{ grid-template-columns:1fr 1fr; }
  .v2-form{ grid-template-columns:1fr; } .v2-field:nth-child(3){ grid-column:auto; }
}
@media(max-width:560px){
  .v2-stats,.v2-cards,.v2-amen-grid{ grid-template-columns:1fr; }
  .v2-step{ gap:16px; } .v2-step-no{ width:46px; height:46px; font-size:18px; } .v2-timeline::before{ left:22px; }
}