/* PADEL NAVES — clean stylesheet v2 */
:root{
  --green:#0a8a3f; --green-deep:#0c6a30;
  --blue:#1d4d8c; --blue-deep:#133960;
  --gold:#d4a83c; --gold-bright:#e5bc3a;
  --ink:#0a0a0c; --ink-2:#14141a;
  --bone:#f5f1ea; --bone-2:#c9c2b4;
  --f-display:"Anton",sans-serif;
  --f-serif:"Fraunces","Playfair Display",Georgia,serif;
  --f-body:"Inter",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",monospace;
  --pad:clamp(20px,4vw,64px);
  --pad-section:clamp(80px,12vh,160px);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow-x:hidden}
body{background:var(--ink);color:var(--bone);font-family:var(--f-body);line-height:1.55;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .8 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");opacity:.04;mix-blend-mode:overlay}
.container{max-width:1240px;margin:0 auto;padding:0 var(--pad)}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:18px var(--pad);background:linear-gradient(180deg,rgba(10,10,12,.85),rgba(10,10,12,0));backdrop-filter:blur(12px) saturate(140%);-webkit-backdrop-filter:blur(12px) saturate(140%)}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--f-display);font-size:18px;letter-spacing:.1em;text-transform:uppercase}
.brand em{font-family:var(--f-serif);font-style:italic;color:var(--gold);text-transform:none;font-weight:700;font-size:19px}
.ball{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f3da7a 0%,var(--gold) 30%,var(--green) 60%,var(--blue-deep) 100%);box-shadow:0 4px 12px rgba(212,168,60,.3),inset -2px -2px 6px rgba(0,0,0,.3)}
.links{display:flex;gap:28px}
.links a{font-family:var(--f-body);font-weight:500;font-size:13px;letter-spacing:.04em;color:var(--bone-2);transition:color .2s}
.links a:hover{color:var(--gold)}
.cta{padding:10px 22px;border-radius:999px;background:var(--green);color:#fff;font-family:var(--f-body);font-weight:600;font-size:13px;letter-spacing:.04em;transition:background .2s,transform .2s}
.cta:hover{background:var(--green-deep);transform:translateY(-1px)}
@media (max-width:720px){.links{display:none}}

/* HERO CINEMA */
.cinema{height:800vh;position:relative}
.stage{height:100vh;width:100vw;overflow:hidden;background:#000;position:relative}
.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stage::before{content:"";position:absolute;inset:0;z-index:10;background:linear-gradient(180deg,rgba(10,10,12,.5) 0%,rgba(10,10,12,0) 30%,rgba(10,10,12,0) 70%,rgba(10,10,12,.8) 100%);pointer-events:none}
.phases{position:absolute;inset:0;z-index:20;pointer-events:none}
.phases>div{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0 var(--pad);padding-top:80px;opacity:0;transition:opacity .6s cubic-bezier(.16,1,.3,1)}
.phases>div.active{opacity:1}
.title-block{text-align:center;max-width:800px}
.eyebrow{display:inline-block;font-family:var(--f-mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);padding:6px 14px;background:rgba(0,0,0,.5);border:1px solid rgba(212,168,60,.3);border-radius:999px;margin-bottom:28px;backdrop-filter:blur(8px)}
.title-block h1{font-family:var(--f-display);font-size:clamp(56px,11vw,180px);line-height:.92;letter-spacing:-.02em;text-transform:uppercase;color:#fff;text-shadow:0 8px 40px rgba(0,0,0,.9)}
.title-block h1 em{font-family:var(--f-serif);font-style:italic;color:var(--gold);text-transform:none;font-weight:700}
.lede{margin-top:32px;font-family:var(--f-serif);font-size:clamp(16px,1.6vw,22px);font-style:italic;color:var(--bone);max-width:560px;margin-left:auto;margin-right:auto;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.scroll-hint{margin-top:60px;font-family:var(--f-mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--bone-2);animation:bob 1.8s ease-in-out infinite}
.scroll-hint span{color:var(--gold)}
@keyframes bob{50%{transform:translateY(6px)}}

/* Phases 1..7 */
.phases>div:not(:first-child){align-items:flex-start;padding-top:30vh}
.phase{max-width:540px;padding:32px 38px;background:linear-gradient(135deg,rgba(10,10,12,.92) 0%,rgba(10,10,12,.6) 70%,transparent 100%);border-left:3px solid var(--gold);border-radius:0 14px 14px 0;backdrop-filter:blur(14px) saturate(140%);box-shadow:0 24px 60px rgba(0,0,0,.6)}
.phase .t{font-family:var(--f-display);font-size:clamp(36px,5.5vw,76px);line-height:.95;letter-spacing:-.01em;text-transform:uppercase;color:#fff}
.phase .s{margin-top:16px;font-family:var(--f-serif);font-size:17px;font-style:italic;color:var(--bone-2);line-height:1.45}
.phases>div[data-p="1"]{justify-content:flex-start;padding-left:6vw}
.phases>div[data-p="2"]{justify-content:flex-end;padding-right:6vw}
.phases>div[data-p="2"] .phase{border-left:none;border-right:3px solid var(--gold);border-radius:14px 0 0 14px;background:linear-gradient(225deg,rgba(10,10,12,.92),transparent);text-align:right}
.phases>div[data-p="3"]{align-items:flex-end;padding-bottom:16vh;justify-content:flex-start;padding-left:6vw}
.phases>div[data-p="4"]{align-items:flex-end;padding-bottom:16vh;justify-content:flex-end;padding-right:6vw}
.phases>div[data-p="4"] .phase{border-left:none;border-right:3px solid var(--gold);border-radius:14px 0 0 14px;background:linear-gradient(315deg,rgba(10,10,12,.92),transparent);text-align:right}
.phases>div[data-p="5"]{padding-top:50vh;justify-content:flex-start;padding-left:6vw}
.phases>div[data-p="6"]{padding-top:50vh;justify-content:flex-end;padding-right:6vw}
.phases>div[data-p="6"] .phase{border-left:none;border-right:3px solid var(--gold);border-radius:14px 0 0 14px;background:linear-gradient(270deg,rgba(10,10,12,.92),transparent);text-align:right}
.phases>div[data-p="7"]{align-items:flex-end;padding-bottom:16vh;justify-content:center}
.phases>div[data-p="7"] .phase{border-left:none;border-bottom:3px solid var(--gold);border-radius:14px 14px 0 0;text-align:center;max-width:600px}

/* HUD */
.hud{position:absolute;bottom:28px;left:0;right:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-2);pointer-events:none}
.progress{flex:1;height:2px;margin:0 28px;background:rgba(255,255,255,.15)}
.progress>div{height:100%;background:var(--gold);width:0;transition:width .1s linear;box-shadow:0 0 8px rgba(212,168,60,.6)}
.hud-arrow{color:var(--gold);margin-left:6px}

/* BLOCKS */
.block{padding:var(--pad-section) 0;position:relative}
.block.dark{background:var(--ink-2)}
.block .kicker{font-family:var(--f-mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:24px}
.block h2{font-family:var(--f-display);font-size:clamp(40px,7vw,96px);line-height:.95;letter-spacing:-.01em;text-transform:uppercase;margin-bottom:48px}
.block h2 em{font-family:var(--f-serif);font-style:italic;color:var(--gold);text-transform:none;font-weight:700}
.block .lead{font-family:var(--f-serif);font-size:clamp(18px,1.8vw,26px);font-style:italic;color:var(--bone);max-width:760px;margin-bottom:24px}
.block p{font-size:16px;color:var(--bone-2);max-width:660px;margin-bottom:16px}
.block p em{color:var(--gold);font-style:italic;font-family:var(--f-serif)}
.grid-2{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;margin-top:40px}
@media (max-width:800px){.grid-2{grid-template-columns:1fr;gap:32px}}

/* CARDS */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.cards{grid-template-columns:1fr}}
.card{padding:32px 28px;background:rgba(255,255,255,.04);border:1px solid rgba(212,168,60,.15);border-radius:14px;transition:transform .3s,border-color .3s,background .3s}
.card:hover{transform:translateY(-4px);border-color:rgba(212,168,60,.5);background:rgba(255,255,255,.07)}
.card-num{font-family:var(--f-mono);font-size:11px;letter-spacing:.3em;color:var(--gold);margin-bottom:16px}
.card-title{font-family:var(--f-display);font-size:28px;line-height:1;text-transform:uppercase;color:#fff;margin-bottom:14px}
.card-desc{font-size:14px;color:var(--bone-2);line-height:1.55;margin-bottom:18px}
.card-meta{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);padding-top:14px;border-top:1px solid rgba(212,168,60,.15)}

/* STATS */
.stats{background:var(--bone);color:var(--ink);padding:80px 0}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
@media (max-width:800px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
.stat .num{font-family:var(--f-display);font-size:clamp(48px,7vw,96px);line-height:1;color:var(--green)}
.stat .label{font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);opacity:.7;margin-top:12px}

/* TOUR (video 2) */
.tour .video-wrap{margin-top:48px;max-width:560px;margin-left:auto;margin-right:auto;border-radius:18px;overflow:hidden;border:1px solid rgba(212,168,60,.2);box-shadow:0 32px 80px rgba(0,0,0,.6);background:#000}
.tour video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover}
.video-meta{margin-top:18px;display:flex;justify-content:space-between;align-items:center;font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-2);flex-wrap:wrap;gap:12px}
.video-meta a{color:var(--gold);text-decoration:underline}

/* CONTACT */
.contact{text-align:center}
.contact h2{max-width:800px;margin:0 auto 32px}
.contact .lead{margin:0 auto 40px}
.cta-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.btn-primary,.btn-secondary{padding:16px 36px;border-radius:999px;font-family:var(--f-body);font-weight:600;font-size:15px;letter-spacing:.02em;transition:transform .2s,background .2s}
.btn-primary{background:var(--green);color:#fff}
.btn-primary:hover{background:var(--green-deep);transform:translateY(-2px)}
.btn-secondary{background:transparent;color:var(--bone);border:1px solid rgba(245,241,234,.3)}
.btn-secondary:hover{border-color:var(--gold);color:var(--gold)}

/* FOOTER */
.foot{padding:40px 0;border-top:1px solid rgba(212,168,60,.1);font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-2)}
.foot .container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}
.foot-meta{opacity:.6}
