/* =====================================================================
   GLASS TEST (Rodada 67) — frosted glass over the water photo.
   To go back to the previous look: remove the glass.css <link> from portfolio.html.
   ===================================================================== */
/* the photo behind everything (fixed), darkened so text stays readable */
body.v2::before{
 background:
  linear-gradient(180deg,rgba(10,11,13,.35) 0%,rgba(10,11,13,.15) 40%,rgba(10,11,13,.45) 100%),
  url("assets/glass-bg-water-1650.webp") 50% 40%/cover no-repeat,#111316}
@media(max-width:700px){body.v2::before{background:linear-gradient(180deg,rgba(10,11,13,.35),rgba(10,11,13,.2) 45%,rgba(10,11,13,.5)),url("assets/glass-bg-water-portrait.webp") 50% 40%/cover no-repeat,#111316}}
html:has(body.v2){background:#0d0e10}
body.v2{background:transparent}

/* section panels: frosted glass — the photo shows through, blurred */
body.v2 :is(.v2-intro,.v2-work,.v2-practice,.v2-photos,.v2-classes,.v2-about,.v2-partners,.v2-cta,.v2-contact){
 background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.02) 35%,rgba(255,255,255,.01)),rgba(20,22,26,.32);
 border:1px solid rgba(255,255,255,.14);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 0 1px rgba(255,255,255,.02),0 40px 90px -40px rgba(0,0,0,.7);
 backdrop-filter:blur(40px) saturate(160%) brightness(.9);-webkit-backdrop-filter:blur(40px) saturate(160%) brightness(.9)}
body.v2 .v2-cta{background:radial-gradient(60% 70% at 50% 55%,rgba(255,204,51,.10),transparent 70%),rgba(22,24,28,.46)}
@media(max-width:700px){
 body.v2 :is(.v2-intro,.v2-work,.v2-practice,.v2-photos,.v2-classes,.v2-about,.v2-partners,.v2-cta,.v2-contact){backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.015) 35%),rgba(20,22,26,.40)}
}
/* small panels inside: a second, lighter layer of glass */
body.v2 .partner,body.v2 .class-card .cc-back,body.v2 .practice-list details,body.v2 .af-block{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
/* the header pill matches */
body.v2 .v2-header{border-color:rgba(255,255,255,.16)}

/* transitions like the reference: things appear out of a blur and dissolve in, no sliding */
body.v2 .rv{transform:scale(.985);filter:blur(16px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);transition-delay:var(--rd,0ms)}
body.v2 .rv.rv-txt{filter:blur(12px)}
body.v2 .rv.rv-in{opacity:1;transform:none;filter:none}
@media(prefers-reduced-motion:reduce){body.v2 .rv{filter:none;transform:none}}

/* Services list (Rodada 70): each item is its own rounded glass card that pops up under the mouse */
body.v2 .practice-list{display:grid;gap:14px}
body.v2 .practice-list details,body.v2 .practice-list details:last-child{border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:0 30px;
 background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 30px -22px rgba(0,0,0,.6);
 transition:transform .5s var(--ease),border-color .4s,background-color .4s,box-shadow .5s var(--ease)}
body.v2 .practice-list summary{color:#8b8f95;padding:26px 0}
body.v2 .practice-list summary::before{left:-16px}
body.v2 .practice-list details[open]{border-color:rgba(255,255,255,.2);background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.04))}
body.v2 .practice-list details p{margin:-6px 0 28px}
@media(hover:hover) and (pointer:fine){
 body.v2 .practice-list details:hover{transform:translateY(-6px) scale(1.012);border-color:rgba(255,255,255,.3);
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.05));box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 34px 60px -30px rgba(0,0,0,.75)}
 body.v2 .practice-list details:hover summary{color:var(--ink)}
}
@media(max-width:700px){body.v2 .practice-list{gap:10px}body.v2 .practice-list details,body.v2 .practice-list details:last-child{padding:0 20px;border-radius:18px}body.v2 .practice-list summary{padding:20px 0}body.v2 .practice-list summary::before{left:-12px}}
@media(prefers-reduced-motion:reduce){body.v2 .practice-list details:hover{transform:none}}

/* Project window (photos opened from a card): same frosted glass as the rest, grows out of the card (site.js) */
body.v2 #project-dialog{background:rgba(18,20,24,.78);border:1px solid rgba(255,255,255,.14);border-radius:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 40px 120px -30px rgba(0,0,0,.8);
 backdrop-filter:blur(30px) saturate(150%);-webkit-backdrop-filter:blur(30px) saturate(150%)}
body.v2 #project-dialog::backdrop{background:rgba(6,7,9,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
body.v2 #project-dialog .dialog-top{background:rgba(18,20,24,.7);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom-color:rgba(255,255,255,.1)}
body.v2 #project-dialog #project-media{background:transparent}
@media(max-width:700px){body.v2 #project-dialog{border-radius:0;border:0}}