
/* Reflection debug/log panel: kept in the DOM (logging still runs and is useful
   for development) but hidden from the production UI. !important overrides the
   inline display:block that the logging functions set on each write. */
#progressReflectionDebug { display: none !important; }
:root {
--gold:#e0bb63; --deep:#040404; --soft:#faeec6; --red:#b22020; --ember:#c43a2a; --muted:#bdad84;
--panel:rgba(14,12,8,.82); --line:rgba(214,177,87,.25);
/* DO ecosystem canonical brand palette (Option 2 — approved brand study).
   Premium Gold = the DO letters, question mark, VOLUTION, and every ™/®.
   Signature DO Green = the connector / arrow, and the PADEL wordmark. */
--brand-gold:#e0bb63; --brand-green:#8bc52e;
}
/* Wordmark colour hierarchy helpers. Applied per-segment to the DO→?®,
   DO→VOLUTION® and DO→PADEL™ marks. background:none + text-fill-color reset
   ensures these solid brand colours win over any gradient-clipped parent. */
.wm-gold{color:var(--brand-gold);-webkit-text-fill-color:var(--brand-gold);background:none}
.wm-green{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green);background:none}
/* .wm keeps a DO wordmark as one continuous unit — it must never wrap onto two
   lines. .wm-arrow is the signature green connector, spaced identically wherever
   it appears so the arrow reads as one shared visual language across the family.
   Refined to a premium signature: the glyph is scaled down (~20%) so it reads as
   an elegant evolution of the original hyphen rather than a dominant graphic arrow,
   and its right side is tucked in so it sits fractionally closer to the following
   character (the ? / PADEL), keeping DO the hero and ? the destination. */
.wm{white-space:nowrap}
.wm-arrow{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green);background:none;font-size:.8em;padding:0 .015em 0 .06em;font-weight:840;vertical-align:.05em}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% 18%,#1a1307 0%,#050505 48%,#000 100%);font-family:Georgia,'Times New Roman',serif;color:var(--soft);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 48%,rgba(214,177,87,.10),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.025),transparent 28%);mix-blend-mode:screen}
.app{max-width:430px;margin:0 auto;min-height:100vh;padding:20px 18px calc(160px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:16px;position:relative}
.brand{text-align:center;letter-spacing:.26em;color:var(--gold);font-size:24px;margin-top:12px;text-shadow:0 0 5px rgba(214,177,87,.10);font-weight:400}
.subbrand{text-align:center;font-size:11.5px;letter-spacing:.30em;color:var(--muted);text-transform:uppercase;margin-top:1px}
.screen{display:none;animation:screenFade .6s cubic-bezier(.22,.9,.36,1) both}
.screen.active{display:block}
#emailGate.active{margin-top:auto}
@keyframes screenFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.card{background:linear-gradient(180deg,rgba(16,12,7,.9),rgba(4,4,4,.94));border:1px solid var(--line);border-radius:24px;padding:22px 20px;box-shadow:0 20px 50px rgba(0,0,0,.55),inset 0 0 44px rgba(214,177,87,.03)}
h1{font-weight:400;text-align:center;line-height:1.18;font-size:29px;margin:8px 0 12px;color:var(--soft);letter-spacing:.03em}
h2{font-weight:400;font-size:20px;line-height:1.3;color:var(--gold);margin:6px 0 14px;letter-spacing:.06em}
.stand-heading{text-align:center}
@media(max-width:480px){.stand-heading{white-space:nowrap;font-size:min(19px,3.8vw);letter-spacing:.02em}}
p{line-height:1.6;color:#e6d8ad;font-size:14px;margin-bottom:6px;letter-spacing:.015em}
.micro{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-align:center}
/* Premium forged buttons */
.btn{
width:100%;
border:1px solid rgba(214,177,87,.45);
background:linear-gradient(175deg,rgba(214,177,87,.32) 0%,rgba(180,140,50,.22) 40%,rgba(130,95,28,.18) 70%,rgba(90,65,18,.25) 100%);
backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);
color:#f4ead4;
border-radius:999px;
padding:16px 20px;
font-size:12.5px;
letter-spacing:.20em;
text-transform:uppercase;
font-weight:500;
box-shadow:
0 10px 28px rgba(0,0,0,.35),
0 2px 6px rgba(0,0,0,.25),
inset 0 1px 0 rgba(255,235,180,.14),
inset 0 -1px 0 rgba(0,0,0,.25);
margin-top:12px;
cursor:pointer;
text-shadow:0 1px 3px rgba(0,0,0,.5);
position:relative;
overflow:hidden;
transition:transform .2s ease,box-shadow .3s ease,border-color .3s ease;
touch-action:manipulation;
-webkit-user-select:none;user-select:none;
min-height:54px;
}
.btn::before{
content:"";position:absolute;inset:0;border-radius:999px;
background:linear-gradient(180deg,rgba(255,245,210,.1) 0%,transparent 45%,rgba(0,0,0,.08) 100%);
pointer-events:none;
}
.btn::after{
content:"";position:absolute;top:0;left:10%;right:10%;height:1px;
background:linear-gradient(90deg,transparent,rgba(214,177,87,.25),transparent);
pointer-events:none;
}
.btn:active{transform:scale(.982);box-shadow:0 4px 14px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,235,180,.08)}
/* Universal premium tap feedback — a very slight press plus a tiny brightness/glow
   pulse, applied by JS to every normal button so the visual response matches the
   thud and the haptic. Uses the existing gold accent only; it changes nothing in the
   resting style, layout or colours and returns the element to its base state when
   the short animation ends. Honours reduced-motion. */
@keyframes doTapPulse{
0%{transform:scale(1);filter:brightness(1) drop-shadow(0 0 0 rgba(214,177,87,0))}
24%{transform:scale(.972);filter:brightness(1.17) drop-shadow(0 0 7px rgba(214,177,87,.45))}
100%{transform:scale(1);filter:brightness(1) drop-shadow(0 0 0 rgba(214,177,87,0))}
}
.do-tap-pulse{animation:doTapPulse .12s cubic-bezier(.2,.7,.3,1)}
@media(prefers-reduced-motion:reduce){.do-tap-pulse{animation:none}}
.btn.secondary{
background:rgba(0,0,0,.35);
backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
color:var(--gold);
border-color:rgba(214,177,87,.25);
box-shadow:0 6px 18px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.04);
}
/* SHARE DO-VOLUTION — premium copy confirmation pill (fallback only, when the native
   share sheet is unavailable). Black-and-gold, no alerts, no browser popups. */
.share-confirm{
position:fixed;left:50%;bottom:36px;transform:translateX(-50%) translateY(12px);
z-index:9999;pointer-events:none;opacity:0;
padding:11px 22px;border-radius:999px;
background:rgba(8,7,4,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
border:1px solid rgba(214,177,87,.28);
box-shadow:0 10px 30px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.05);
color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
font-size:12px;letter-spacing:.08em;white-space:nowrap;
transition:opacity .35s ease,transform .35s ease;
}
.share-confirm.visible{opacity:1;transform:translateX(-50%) translateY(0)}
.btn.dark{
background:linear-gradient(180deg,rgba(18,14,8,.75),rgba(5,5,5,.85));
backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
color:#e6d8ad;
border-color:rgba(214,177,87,.2);
}
.grid{display:grid;gap:10px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* Illuminated black glass fields */
input,select,textarea{
width:100%;
border:1px solid rgba(214,177,87,0.37);
background:rgba(0,0,0,0.45);
backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);
color:#f5e6bc;
border-radius:14px;
padding:14px 15px;
font-size:15px;
outline:none;
font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
font-weight:400;
letter-spacing:.015em;
box-shadow:inset 0 0 18px rgba(214,177,87,0.06);
transition:border-color .35s ease,box-shadow .35s ease;
}
input::placeholder,textarea::placeholder{color:rgba(214,177,87,.35);font-style:normal;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:400;letter-spacing:.02em}
select{color:#f5e6bc;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:400;letter-spacing:.015em}
select option{background:#0a0806;color:#f5e6bc;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif}
input:focus,select:focus,textarea:focus{
border-color:rgba(214,177,87,.75);
box-shadow:0 0 20px rgba(214,177,87,.22),inset 0 0 18px rgba(214,177,87,.08);
}
/* Validation styles */
.field-invalid{border-color:rgba(214,177,87,.65) !important;box-shadow:0 0 14px rgba(214,177,87,.15),inset 0 0 18px rgba(214,177,87,.06) !important}
.validation-msg{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;color:rgba(214,177,87,.55);letter-spacing:.04em;margin-top:5px;display:none;font-weight:400}
.validation-msg.visible{display:block}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill{
-webkit-text-fill-color:#f5e6bc !important;
-webkit-box-shadow:0 0 0px 1000px #050505 inset !important;
box-shadow:0 0 0px 1000px #050505 inset !important;
transition:background-color 9999s ease-in-out 0s;
}
textarea{min-height:108px;resize:vertical;line-height:1.45}
label{display:block;color:var(--gold);font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin:14px 0 7px;opacity:.85}
.footer{margin-top:auto;text-align:center;font-size:10px;color:#efce80;letter-spacing:.14em;padding-top:10px;opacity:1}
.footer-brand{display:block;font-size:11px;color:#efce80;text-shadow:0 0 5px rgba(214,177,87,.12)}
.footer-doctrine{display:block;margin-top:7px;font-size:9.8px;font-weight:400;letter-spacing:.42em;text-transform:uppercase;color:#efce80;text-shadow:0 0 22px rgba(214,177,87,.55)}
.research-invite{display:block;margin-top:12px;font-size:9.4px;font-weight:400;letter-spacing:.24em;text-transform:uppercase;color:#efce80;text-shadow:0 0 20px rgba(214,177,87,.5)}
.footer-link{display:inline-block;margin-top:5px;font-size:11px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:#f4ead4;text-decoration:none;border-bottom:1px solid rgba(214,177,87,.95);padding-bottom:2px;text-shadow:0 0 20px rgba(214,177,87,.5);transition:color .3s ease,border-bottom-color .3s ease}
.footer-link:hover{color:#f4ead4;border-bottom-color:#f4ead4}
/* FIX 5: Character counter */
.char-counter{font-size:11px;color:var(--muted);text-align:right;margin-top:4px;letter-spacing:.04em}
.char-counter.warn{color:var(--red)}
/* ── Fear taxonomy selector (premium black-glass / gold cards) ───────────── */
.fear-flow{margin-top:4px}
.fear-breadcrumb{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;margin:0 0 20px;min-height:16px}
.fear-breadcrumb .crumb{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(214,177,87,.4);transition:color .3s ease;cursor:default}
.fear-breadcrumb .crumb.filled{color:var(--gold);cursor:pointer}
.fear-breadcrumb .crumb.current{color:var(--soft)}
.fear-breadcrumb .crumb-sep{color:rgba(214,177,87,.25);font-size:10px}
.fear-step{display:none}
.fear-step.active{display:block;animation:fearFade .42s ease both}
@keyframes fearFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.fear-step-title{text-align:center;font-family:Georgia,'Times New Roman',serif;font-size:13px;letter-spacing:.20em;text-transform:uppercase;color:var(--gold);opacity:.9;margin:0 0 4px}
.fear-step-sub{text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.6;letter-spacing:.03em;color:#bbaa7d;margin:0 0 18px}
.fear-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fear-card{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;min-height:64px;padding:16px 14px;border:1px solid rgba(214,177,87,.4);border-radius:16px;background:linear-gradient(175deg,rgba(214,177,87,.16) 0%,rgba(180,140,50,.10) 45%,rgba(130,95,28,.08) 72%,rgba(90,65,18,.12) 100%);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#f4ead4;cursor:pointer;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;font-weight:500;letter-spacing:.06em;line-height:1.3;transition:transform .2s ease,box-shadow .3s ease,border-color .3s ease;touch-action:manipulation;-webkit-user-select:none;user-select:none;box-shadow:0 10px 26px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,235,180,.10),inset 0 -1px 0 rgba(0,0,0,.25)}
.fear-card::before{content:"";position:absolute;inset:0;border-radius:16px;background:linear-gradient(180deg,rgba(255,245,210,.07) 0%,transparent 45%,rgba(0,0,0,.06) 100%);pointer-events:none}
.fear-card:active{transform:scale(.97);box-shadow:0 4px 14px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,235,180,.06)}
.fear-card.selected{border-color:var(--gold);background:linear-gradient(175deg,rgba(214,177,87,.34) 0%,rgba(180,140,50,.20) 60%,rgba(130,95,28,.16) 100%);color:#fff6e0;box-shadow:0 0 22px rgba(214,177,87,.30),0 10px 26px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,235,180,.18)}
.fear-card.other-card{font-style:italic;color:var(--gold);background:rgba(0,0,0,.34);border-color:rgba(214,177,87,.28)}
.fear-card.full{grid-column:1 / -1}
.fear-chip-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.fear-chip{position:relative;overflow:hidden;padding:11px 16px;border:1px solid rgba(214,177,87,.38);border-radius:30px;background:linear-gradient(175deg,rgba(214,177,87,.14),rgba(90,65,18,.12));color:#f4ead4;cursor:pointer;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:500;letter-spacing:.05em;transition:transform .2s ease,box-shadow .3s ease,border-color .3s ease;touch-action:manipulation;-webkit-user-select:none;user-select:none;box-shadow:0 6px 16px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,235,180,.08)}
.fear-chip:active{transform:scale(.96)}
.fear-chip.selected{border-color:var(--gold);background:linear-gradient(175deg,rgba(214,177,87,.32),rgba(130,95,28,.18));color:#fff6e0;box-shadow:0 0 18px rgba(214,177,87,.28),inset 0 1px 0 rgba(255,235,180,.16)}
.fear-chip.other-chip{font-style:italic;color:var(--gold);background:rgba(0,0,0,.34);border-color:rgba(214,177,87,.26)}
.fear-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:rgba(214,177,87,.7);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;padding:4px 2px;margin:0 0 14px;transition:color .25s ease;touch-action:manipulation}
.fear-back:active{color:var(--gold)}
/* Legal pages (Privacy / Terms) */
.legal-body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif}
.legal-body h3{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:22px 0 7px;line-height:1.4}
.legal-body h3:first-child{margin-top:0}
.legal-body p{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.75;letter-spacing:.01em;color:#cdbf99;margin:0}
.fear-own-wrap{margin-top:18px}
.fear-own-toggle{display:block;width:100%;text-align:center;background:none;border:none;color:rgba(214,177,87,.55);font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:12.5px;letter-spacing:.04em;cursor:pointer;padding:6px 0;margin-top:14px;transition:color .25s ease;touch-action:manipulation}
.fear-own-toggle:active{color:var(--gold)}
.fear-own-field{display:none;margin-top:10px;animation:fearFade .35s ease both}
.fear-own-field.show{display:block}
#toPaymentBtn.fear-cta-hidden{display:none}
@media(max-width:360px){.fear-card{min-height:58px;font-size:12px;padding:14px 10px}}
/* Vault */
.vault-stage{height:410px;position:relative;display:flex;align-items:center;justify-content:center;perspective:1600px;overflow:visible}
/* FIX 2: Realistic premium vault door */
.vault-wrap{width:320px;height:320px;position:relative;filter:drop-shadow(0 24px 40px rgba(0,0,0,.75))}
.vault-shell{
position:absolute;inset:0;border-radius:50%;
background:
radial-gradient(circle at 38% 30%,#7a6238 0%,#4a381e 14%,#251e12 32%,#0d0b08 52%,#050505 68%,#000 100%);
border:12px solid #4a3820;
box-shadow:
inset 0 0 60px #000,
inset 0 0 30px rgba(0,0,0,.8),
0 0 0 4px rgba(214,177,87,.1),
0 0 0 8px rgba(0,0,0,.5),
0 0 0 10px rgba(214,177,87,.07),
0 0 50px rgba(214,177,87,.14),
0 0 100px rgba(0,0,0,.6);
}
/* Outer ring detail */
.vault-shell::before{
content:"";position:absolute;inset:4px;border-radius:50%;
border:2px solid rgba(214,177,87,.25);
box-shadow:inset 0 0 20px rgba(0,0,0,.6),0 0 6px rgba(214,177,87,.08);
}
.vault-shell::after{
content:"";position:absolute;inset:12px;border-radius:50%;
border:1.5px solid rgba(214,177,87,.16);
box-shadow:inset 0 0 12px rgba(214,177,87,.04);
}
.vault-chamber{
position:absolute;left:12px;right:12px;top:12px;bottom:12px;border-radius:50%;
background:
radial-gradient(circle at 50% 50%,#000 0%,#000 22%,transparent 55%),
radial-gradient(circle at 50% 50%,transparent 42%,rgba(25,20,8,.85) 58%,rgba(50,40,16,.45) 68%,rgba(214,177,87,.1) 76%,transparent 88%),
radial-gradient(circle at 50% 50%,rgba(180,40,30,.08) 0%,rgba(140,25,20,.04) 20%,transparent 45%),
radial-gradient(circle at 50% 28%,#030200 0%,#020101 18%,#010100 42%,#000 100%);
border:4px solid rgba(214,177,87,.5);
display:flex;align-items:center;justify-content:center;text-align:center;padding:42px;
box-shadow:
inset 0 0 130px rgba(0,0,0,1),
inset 0 0 60px rgba(0,0,0,.97),
inset 0 0 25px rgba(214,177,87,.07),
0 0 0 2px rgba(214,177,87,.35),
0 0 0 6px rgba(8,6,2,1),
0 0 0 8px rgba(214,177,87,.18);
overflow:hidden;
}
.vault-chamber::before{content:"";position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle,transparent 48%,rgba(18,14,6,.95) 62%,rgba(45,36,15,.6) 72%,rgba(214,177,87,.18) 80%,rgba(214,177,87,.06) 86%,transparent 94%);border:2px solid rgba(214,177,87,.12);box-shadow:inset 0 0 50px rgba(0,0,0,.85),inset 0 0 18px rgba(214,177,87,.06);animation:pulse 2.8s infinite}
.vault-chamber::after{content:"";position:absolute;top:-10%;left:35%;width:30%;height:65%;background:linear-gradient(180deg,rgba(214,177,87,.14) 0%,rgba(214,177,87,.06) 30%,rgba(214,177,87,.015) 60%,transparent 100%);filter:blur(15px);pointer-events:none;z-index:1;opacity:.75;animation:lightBeamPulse 5s ease-in-out infinite}
@keyframes lightBeamPulse{0%,100%{opacity:.58}50%{opacity:.82}}
.vault-dust{position:absolute;border-radius:50%;background:rgba(214,177,87,.2);pointer-events:none;z-index:1}
.vault-dust:nth-child(1){width:2px;height:2px;top:22%;left:30%;animation:dustFloat1 8s ease-in-out infinite}
.vault-dust:nth-child(2){width:1.5px;height:1.5px;top:45%;left:65%;animation:dustFloat2 11s ease-in-out infinite;animation-delay:-3s}
.vault-dust:nth-child(3){width:1px;height:1px;top:60%;left:42%;animation:dustFloat3 9s ease-in-out infinite;animation-delay:-5s}
.vault-dust:nth-child(4){width:2px;height:2px;top:35%;left:55%;animation:dustFloat1 10s ease-in-out infinite;animation-delay:-2s;opacity:.6}
.vault-dust:nth-child(5){width:1px;height:1px;top:70%;left:35%;animation:dustFloat2 12s ease-in-out infinite;animation-delay:-7s;opacity:.5}
.vault-dust:nth-child(6){width:1.5px;height:1.5px;top:28%;left:58%;animation:dustFloat3 7s ease-in-out infinite;animation-delay:-1s;opacity:.7}
@keyframes dustFloat1{0%{transform:translate(0,0);opacity:.3}25%{transform:translate(8px,-12px);opacity:.5}50%{transform:translate(-4px,-20px);opacity:.25}75%{transform:translate(12px,-8px);opacity:.45}100%{transform:translate(0,0);opacity:.3}}
@keyframes dustFloat2{0%{transform:translate(0,0);opacity:.25}33%{transform:translate(-10px,-15px);opacity:.45}66%{transform:translate(6px,-25px);opacity:.2}100%{transform:translate(0,0);opacity:.25}}
@keyframes dustFloat3{0%{transform:translate(0,0);opacity:.35}30%{transform:translate(5px,-18px);opacity:.15}60%{transform:translate(-8px,-10px);opacity:.4}100%{transform:translate(0,0);opacity:.35}}
/* FIX 2: Premium vault door with depth and metal */
.vault-door{
position:absolute;inset:0;border-radius:50%;
transform-origin:-10% 50%;
transform-style:preserve-3d;
transition:transform 1.75s cubic-bezier(.13,.83,.18,1), filter 1.35s ease, opacity 1.1s ease;
z-index:5;
background:
radial-gradient(circle at 32% 24%,#9a8350 0%,#6b5530 12%,#3a2e1a 28%,#1f170e 45%,#0a0806 65%,#020202 100%);
border:14px solid transparent;
border-image:linear-gradient(135deg,#6b5530,#2a1f10,#4a3718,#8a733f,#3a2c15) 1;
border-radius:50%;
border:14px solid #4a3718;
box-shadow:
inset 0 0 50px #000,
inset 0 0 0 6px rgba(214,177,87,.08),
inset 0 0 0 12px rgba(0,0,0,.5),
inset 0 3px 8px rgba(214,177,87,.15),
inset 0 -3px 8px rgba(0,0,0,.6),
0 0 40px rgba(0,0,0,.9),
0 8px 20px rgba(0,0,0,.7);
}
/* Bevelled outer ring */
.vault-door::before{
content:"";position:absolute;inset:22px;border-radius:50%;
border:8px solid rgba(214,177,87,.18);
box-shadow:
inset 0 0 30px #000,
inset 0 2px 4px rgba(214,177,87,.12),
0 2px 4px rgba(0,0,0,.5);
}
/* Hinge column — removed gold bar; keep pseudo empty for hinge alignment */
.vault-door::after{
content:none;
}
/* Inner steel ring */
.vault-ring-inner{
position:absolute;inset:40px;border-radius:50%;
border:3px solid rgba(214,177,87,.14);
box-shadow:inset 0 0 15px rgba(0,0,0,.5),0 0 8px rgba(214,177,87,.06);
z-index:6;pointer-events:none;
}
.vault-ring-outer{
position:absolute;inset:56px;border-radius:50%;
border:2px solid rgba(214,177,87,.1);
z-index:6;pointer-events:none;
}
/* Bolt/rivet marks */
.vault-bolt{
position:absolute;width:10px;height:10px;border-radius:50%;
background:radial-gradient(circle at 35% 30%,#c9a84c,#5a4220,#2a1e0e);
box-shadow:inset 0 1px 2px rgba(255,255,255,.2),0 1px 3px rgba(0,0,0,.7);
z-index:7;
}
.vault-bolt:nth-child(9){top:18px;left:50%;transform:translateX(-50%)}
.vault-bolt:nth-child(10){bottom:18px;left:50%;transform:translateX(-50%)}
.vault-bolt:nth-child(11){left:18px;top:50%;transform:translateY(-50%)}
.vault-bolt:nth-child(12){right:18px;top:50%;transform:translateY(-50%)}
.vault-bolt:nth-child(5){top:42px;left:42px}
.vault-bolt:nth-child(6){top:42px;right:42px}
.vault-bolt:nth-child(7){bottom:42px;left:42px}
.vault-bolt:nth-child(8){bottom:42px;right:42px}
.vault-bolt:nth-child(5),.vault-bolt:nth-child(7){box-shadow:inset 0 1px 2px rgba(255,255,255,.25),0 1px 3px rgba(0,0,0,.7),0 0 8px rgba(214,177,87,.3)}
/* FIX 4: Inner wheel mechanism */
.vault-wheel{
position:absolute;inset:70px;border-radius:50%;
border:6px solid rgba(214,177,87,.4);
z-index:7;
box-shadow:0 0 20px rgba(214,177,87,.12),inset 0 0 15px rgba(0,0,0,.6);
transition:transform .3s ease;
}
.vault-wheel::before,.vault-wheel::after{
content:"";position:absolute;
background:linear-gradient(90deg,#4a3718,#d6b157,#4a3718);
left:50%;top:50%;transform:translate(-50%,-50%);
border-radius:6px;
}
.vault-wheel::before{width:100%;height:6px}
.vault-wheel::after{width:6px;height:100%}
/* Diagonal spokes */
.vault-wheel-spoke{
position:absolute;inset:0;z-index:7;pointer-events:none;
}
.vault-wheel-spoke::before,.vault-wheel-spoke::after{
content:"";position:absolute;
background:linear-gradient(90deg,#4a3718,#b8952e,#4a3718);
left:50%;top:50%;
border-radius:4px;
}
.vault-wheel-spoke::before{width:100%;height:4px;transform:translate(-50%,-50%) rotate(45deg)}
.vault-wheel-spoke::after{width:100%;height:4px;transform:translate(-50%,-50%) rotate(-45deg)}
/* Wheel hub */
.vault-wheel-hub{
position:absolute;
left:50%;top:50%;
width:28px;height:28px;
transform:translate(-50%,-50%);
border-radius:50%;
background:radial-gradient(circle at 38% 32%,#e8c65a,#8a6b2e,#3a2c15);
border:2px solid rgba(214,177,87,.5);
box-shadow:0 0 12px rgba(214,177,87,.3),inset 0 1px 3px rgba(255,255,255,.2);
z-index:8;
pointer-events:none;
}
/* Wheel idle glow */
@keyframes wheelIdleGlow{
0%,100%{box-shadow:0 0 20px rgba(214,177,87,.1),inset 0 0 15px rgba(0,0,0,.6)}
50%{box-shadow:0 0 28px rgba(214,177,87,.2),inset 0 0 15px rgba(0,0,0,.5)}
}
.vault-door .vault-wheel{animation:wheelIdleGlow 4s ease-in-out infinite}
/* Wheel spin on seal */
@keyframes wheelSpin{
0%{transform:rotate(0deg)}
100%{transform:rotate(720deg)}
}
.vault-wrap.closing-now .vault-wheel,
.vault-wrap.closing-now .vault-wheel-spoke{
animation:wheelSpin 1.2s cubic-bezier(.2,.8,.3,1) forwards !important;
}
/* FIX 3: DO engraving on vault door */
.door-do{
position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:9;
font-size:52px;font-weight:800;letter-spacing:.06em;
color:transparent;
background:linear-gradient(170deg,#e8c65a 0%,#d6b157 30%,#a8852e 55%,#7a5f1e 80%,#d6b157 100%);
-webkit-background-clip:text;
background-clip:text;
filter:drop-shadow(0 2px 4px rgba(0,0,0,.8)) drop-shadow(0 0 18px rgba(214,177,87,.4));
text-shadow:none;
pointer-events:none;
}
/* Emboss/engrave effect overlay */
.door-do::before{
content:"DO";position:absolute;
font-size:52px;font-weight:800;letter-spacing:.06em;
color:rgba(0,0,0,.35);
transform:translate(1px,2px);
z-index:-1;
}
.door-do::after{
content:"DO";position:absolute;
font-size:52px;font-weight:800;letter-spacing:.06em;
color:rgba(255,230,160,.12);
transform:translate(-1px,-1px);
z-index:-1;
}
.vault-hinge{position:absolute;left:-13px;width:20px;height:74px;border-radius:999px;background:linear-gradient(90deg,#5a3d12,#f3d37a,#7a551b);box-shadow:0 0 18px rgba(214,177,87,.35);z-index:9}
.vault-hinge.top{top:70px}.vault-hinge.bottom{bottom:70px}
.entry-glow{animation:entryGlow 4.2s ease-in-out infinite}
@keyframes entryGlow{0%,100%{opacity:.35}50%{opacity:.55;text-shadow:0 0 20px rgba(214,177,87,.4)}}
/* Side-view open door element */
.vault-side-door{
display:none;
position:absolute;
left:-38px;top:50%;transform:translateY(-50%);
width:38px;height:260px;
z-index:12;
border-radius:6px 3px 3px 6px;
background:linear-gradient(90deg,
#0a0704 0%,#1a1208 4%,#3a2c15 10%,#6b5530 18%,#c69b3f 28%,
#d6b157 35%,#c69b3f 42%,#8a6b2e 52%,#5b421d 64%,
#3a2c15 76%,#1a1208 88%,#0a0704 100%);
box-shadow:
6px 0 24px rgba(0,0,0,.85),
12px 0 40px rgba(0,0,0,.6),
-2px 0 8px rgba(0,0,0,.9),
inset 2px 0 6px rgba(214,177,87,.15),
inset -2px 0 4px rgba(0,0,0,.7),
inset 0 3px 6px rgba(214,177,87,.1),
inset 0 -3px 6px rgba(0,0,0,.5);
pointer-events:none;
}
.vault-side-door::before{
content:"";position:absolute;
left:8px;top:0;bottom:0;width:2px;
background:linear-gradient(180deg,rgba(214,177,87,.06),rgba(214,177,87,.18) 20%,rgba(214,177,87,.06) 50%,rgba(214,177,87,.18) 80%,rgba(214,177,87,.06));
}
.vault-side-door::after{
content:"";position:absolute;
right:4px;top:0;bottom:0;width:1px;
background:linear-gradient(180deg,transparent,rgba(0,0,0,.8) 15%,rgba(0,0,0,.9) 50%,rgba(0,0,0,.8) 85%,transparent);
}
.vault-side-bolt{
position:absolute;left:50%;transform:translateX(-50%);
width:12px;height:12px;border-radius:50%;
background:radial-gradient(circle at 35% 30%,#c9a84c,#5a4220,#2a1e0e);
box-shadow:inset 0 1px 2px rgba(255,255,255,.25),0 1px 3px rgba(0,0,0,.8),0 0 6px rgba(0,0,0,.5);
}
.vault-side-do{
position:absolute;left:50%;top:50%;
transform:translate(-50%,-50%) rotate(-90deg);
font-size:16px;font-weight:800;letter-spacing:.04em;
color:transparent;
background:linear-gradient(170deg,#e8c65a,#a8852e,#d6b157);
-webkit-background-clip:text;background-clip:text;
filter:drop-shadow(0 1px 2px rgba(0,0,0,.8));
pointer-events:none;opacity:.6;
}
/* Vault open state — door swings partially open to left, side-door hidden */
.vault-wrap.open .vault-door{
opacity:1;
pointer-events:none;
transform:translateX(-110px) rotateY(-62deg);
transition:transform 1.75s cubic-bezier(.13,.83,.18,1),opacity .6s ease;
}
.vault-wrap.open .vault-side-door{
display:none;
}
@keyframes sideDoorAppear{
from{opacity:0;transform:translateY(-50%) translateX(40px)}
to{opacity:1;transform:translateY(-50%) translateX(0)}
}
.vault-wrap.open .vault-chamber{
background:
radial-gradient(circle at 50% 50%,#000 0%,#000 30%,rgba(0,0,0,.88) 40%,transparent 54%),
radial-gradient(circle at 50% 50%,transparent 32%,rgba(16,12,4,.98) 46%,rgba(42,34,12,.58) 58%,rgba(214,177,87,.17) 68%,transparent 80%),
radial-gradient(circle at 50% 48%,rgba(140,30,24,.07) 0%,rgba(110,22,18,.04) 20%,rgba(80,16,12,.015) 36%,transparent 50%),
radial-gradient(circle at 50% 24%,#000 0%,#000 16%,#000 44%,#000 100%);
box-shadow:
inset 0 0 170px rgba(0,0,0,1),
inset 0 0 100px rgba(0,0,0,.99),
inset 0 0 45px rgba(0,0,0,.96),
inset 0 0 16px rgba(214,177,87,.035),
0 0 0 2.5px rgba(214,177,87,.46),
0 0 0 6px rgba(5,4,1,1),
0 0 0 10px rgba(214,177,87,.26);
}
.vault-wrap.open .fear-text{
background:radial-gradient(ellipse at 50% 50%,rgba(130,26,20,.12) 0%,rgba(100,20,16,.07) 28%,rgba(70,14,10,.025) 48%,transparent 70%);
border-radius:50%;
padding:30px 20px;
}
.vault-wrap.open .vault-chamber::before{
background:radial-gradient(circle,transparent 44%,rgba(14,11,4,.97) 56%,rgba(38,30,12,.65) 66%,rgba(214,177,87,.2) 74%,rgba(214,177,87,.12) 82%,rgba(214,177,87,.04) 88%,transparent 94%);
border:2.5px solid rgba(214,177,87,.14);
box-shadow:inset 0 0 60px rgba(0,0,0,.9),inset 0 0 24px rgba(214,177,87,.05),inset 0 0 4px rgba(214,177,87,.08);
animation:chamberInnerDrift 30s ease-in-out infinite;
}
@keyframes chamberInnerDrift{0%,100%{transform:rotate(0deg) scale(1);opacity:.9}25%{transform:rotate(.25deg) scale(1.002);opacity:.87}50%{transform:rotate(-.18deg) scale(.998);opacity:.92}75%{transform:rotate(.12deg) scale(1.001);opacity:.88}}
/* Sealing state — door swings back to closed */
.vault-wrap.closing-now .vault-side-door{
display:none;
}
@keyframes sideDoorClose{
0%{opacity:1;transform:translateY(-50%) translateX(0);width:38px}
60%{opacity:.8;transform:translateY(-50%) translateX(30px);width:24px}
100%{opacity:0;transform:translateY(-50%) translateX(60px);width:0px}
}
.vault-wrap.closing-now .vault-door{
opacity:1!important;visibility:visible!important;
transform:translateX(0) rotateY(0deg) scale(1)!important;
transition:transform 1.18s cubic-bezier(.12,.84,.18,1),opacity .3s ease!important;
}
.vault-wrap.sealed .vault-side-door{display:none}
.vault-wrap.sealed .vault-chamber{background:radial-gradient(circle at 50% 48%,#241902,#070707 58%,#000 100%);box-shadow:inset 0 0 78px rgba(214,177,87,.18),inset 0 0 90px #000}
/* FIX 5: Responsive fear text sizing */
.fear-text{
position:relative;z-index:2;max-width:232px;width:100%;
color:#b43829;
font-family:'Trebuchet MS',Arial,sans-serif;
font-weight:700;letter-spacing:.07em;
line-height:1.5;
text-transform:uppercase;
word-break:normal;
overflow-wrap:normal;
text-shadow:0 0 10px rgba(150,38,28,.24),0 0 28px rgba(130,28,22,.12),0 0 52px rgba(100,18,14,.05);
animation:emberBreath 3.2s ease-in-out infinite;
white-space:normal;
word-spacing:.05em;
padding:4px;
text-align:center;
margin:0 auto;
display:flex;align-items:center;justify-content:center;
}
.fear-text.size-xl{font-size:clamp(36px,9vw,52px);letter-spacing:.14em;line-height:1.15}
.fear-text.size-lg{font-size:clamp(26px,6.5vw,38px);letter-spacing:.1em;line-height:1.2}
.fear-text.size-md{font-size:clamp(18px,4.5vw,26px);letter-spacing:.07em;line-height:1.3}
.fear-text.size-sm{font-size:clamp(13px,3.2vw,18px);letter-spacing:.05em;line-height:1.35}
.fear-text.size-xs{font-size:clamp(10px,2.4vw,14px);letter-spacing:.04em;line-height:1.4}
/* Long Vault entries: compose the words to suit the round Vault — shorter lines
   near the top and bottom, wider lines through the middle — instead of a narrow
   central column. The lines are computed from the real Vault geometry so the
   text always sits inside the circle and never clips. */
.fear-text.circular{
max-width:none;width:100%;
flex-direction:column;
white-space:normal;
letter-spacing:normal;
padding:6px;
}
.vault-wrap.open .fear-text.circular{padding:6px}
.fear-text.circular .vline{display:block;width:100%;white-space:nowrap;text-align:center}
.do-remains{position:relative;z-index:3;color:var(--gold);font-size:56px;letter-spacing:.06em;text-shadow:0 0 28px rgba(214,177,87,.65);display:none}
.vault-wrap.closing-now .fear-text{animation:fearLockedAway 1.1s cubic-bezier(.4,0,1,1) forwards}
.vault-wrap.sealed .fear-text{opacity:0!important;visibility:hidden!important;animation:none!important}
@keyframes cleanVanish{to{opacity:0;transform:scale(.88);filter:blur(10px)}}
@keyframes fearLockedAway{0%{opacity:.82;transform:scale(1);filter:blur(0)}60%{opacity:.7;transform:scale(.96);filter:blur(1px)}100%{opacity:0;transform:scale(.85);filter:blur(8px)}}
/* Vault seal light effects */
@keyframes fearRedPulse{0%{text-shadow:0 0 8px rgba(200,60,50,.35),0 0 22px rgba(180,40,35,.18)}30%{text-shadow:0 0 18px rgba(220,40,35,.7),0 0 40px rgba(200,30,25,.4),0 0 60px rgba(178,32,32,.2)}100%{text-shadow:0 0 8px rgba(200,60,50,.35),0 0 22px rgba(180,40,35,.18)}}
@keyframes vaultGoldBloom{0%{opacity:0;transform:scale(1.15)}12%{opacity:1;transform:scale(1.05)}30%{opacity:.85;transform:scale(.95)}55%{opacity:.4;transform:scale(.6)}100%{opacity:0;transform:scale(.3)}}
.vault-gold-bloom{position:absolute;inset:-20%;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgba(255,250,230,.95),rgba(255,235,180,.7) 20%,rgba(214,177,87,.55) 40%,rgba(214,177,87,.2) 60%,transparent 80%);pointer-events:none;z-index:4;opacity:0}
.vault-wrap.sealing .fear-text{animation:fearRedPulse .6s ease-in-out 1!important;text-align:center!important;margin:0 auto!important}
.vault-wrap.sealing .vault-gold-bloom{animation:vaultGoldBloom 1.8s cubic-bezier(.2,0,.4,1) .15s forwards}
.vault-wrap.sealed .do-remains{display:block;animation:screenFade 1.4s ease both}
@keyframes vaultSealFlash{0%{opacity:0}8%{opacity:1}25%{opacity:.7}50%{opacity:.35}100%{opacity:0}}
.vault-wrap.closing-now .vault-chamber::before{
animation:vaultSealFlash 1.2s cubic-bezier(.25,0,.4,1) forwards!important;
background:radial-gradient(circle at 50% 50%,rgba(255,252,240,1),rgba(255,235,180,.85) 25%,rgba(214,177,87,.5) 50%,transparent 75%)!important;
inset:-10%!important;border-radius:50%!important;z-index:10!important;
}
@keyframes pulse{50%{opacity:.55;transform:scale(1.02)}}
@keyframes emberBreath{0%,100%{opacity:.76;text-shadow:0 0 8px rgba(150,38,28,.2),0 0 22px rgba(130,28,22,.1)}50%{opacity:.58;text-shadow:0 0 12px rgba(150,38,28,.28),0 0 32px rgba(130,28,22,.14)}}
@keyframes dissolve{to{opacity:0;transform:scale(.72);filter:blur(8px)}}
.entry-copy{text-align:center;margin-top:-10px}
.throb{animation:throb 3.8s ease-in-out infinite}
@keyframes throb{50%{filter:drop-shadow(0 0 18px rgba(214,177,87,.38))}}
.vault-awakening .vault-chamber{animation:chamberAwaken 2.8s cubic-bezier(.4,0,.2,1) 2 both}
@keyframes chamberAwaken{0%,100%{box-shadow:inset 0 0 130px rgba(0,0,0,1),inset 0 0 60px rgba(0,0,0,.97),inset 0 0 25px rgba(214,177,87,.07),0 0 0 2px rgba(214,177,87,.35),0 0 0 6px rgba(8,6,2,1),0 0 0 8px rgba(214,177,87,.18)}50%{box-shadow:inset 0 0 90px rgba(0,0,0,.88),inset 0 0 45px rgba(214,177,87,.15),inset 0 0 80px rgba(214,177,87,.08),0 0 0 2px rgba(214,177,87,.5),0 0 0 6px rgba(8,6,2,1),0 0 0 8px rgba(214,177,87,.3)}}
.vault-awakening .entry-glow{animation:textAwaken 2.8s cubic-bezier(.4,0,.2,1) 2 both!important}
@keyframes textAwaken{0%,100%{opacity:.38;text-shadow:none}50%{opacity:.62;text-shadow:0 0 22px rgba(214,177,87,.4),0 0 44px rgba(214,177,87,.12)}}
.vault-awakening .vault-ring-inner{animation:ringAwaken 2.8s cubic-bezier(.4,0,.2,1) 2 both}
@keyframes ringAwaken{0%,100%{border-color:rgba(214,177,87,.14);box-shadow:inset 0 0 15px rgba(0,0,0,.5),0 0 8px rgba(214,177,87,.06)}50%{border-color:rgba(214,177,87,.26);box-shadow:inset 0 0 12px rgba(0,0,0,.4),0 0 14px rgba(214,177,87,.13)}}
.status{font-size:12px;color:var(--muted);text-align:center;min-height:18px;margin-top:8px;letter-spacing:.06em}
.choice{border:1px solid rgba(214,177,87,.22);padding:14px 15px;border-radius:16px;background:rgba(0,0,0,.2);cursor:pointer;transition:border-color .3s ease,box-shadow .3s ease;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:400;letter-spacing:.04em;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.choice.active{border-color:rgba(214,177,87,.65);box-shadow:0 0 18px rgba(214,177,87,.08)}
.seal{border:1px solid rgba(214,177,87,.35);border-radius:18px;padding:16px;text-align:center;background:rgba(214,177,87,.05);color:var(--gold);letter-spacing:.18em;font-size:13px;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.preview{font-size:15px;line-height:1.55;color:#f2e1b1;letter-spacing:.04em}
.small{font-size:12px;color:#bbaa7d;line-height:1.5;letter-spacing:.03em}
.hidden{display:none!important}
/* FIX 8: Welcome back styling */
.welcome-back{text-align:center;margin-top:0;margin-bottom:18px;animation:screenFade .6s ease both}
.welcome-back .wb-name{color:var(--gold);font-size:22px;letter-spacing:.12em;margin-bottom:4px}
.welcome-back .wb-sub{color:var(--muted);font-size:11px;letter-spacing:.22em;text-transform:uppercase}
.bottom-nav{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(430px,100%);padding:14px 18px 14px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.88) 20%,#000 100%);border-top:1px solid rgba(214,177,87,.15);z-index:9999;display:grid;grid-template-columns:1fr 1fr;gap:12px;pointer-events:auto;isolation:isolate;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
.bottom-nav button{margin:0;padding:16px 12px;font-size:12px;letter-spacing:.16em;min-height:54px;-webkit-tap-highlight-color:rgba(214,177,87,.12);touch-action:manipulation;pointer-events:auto;position:relative;z-index:9999;cursor:pointer;-webkit-user-select:none;user-select:none}
.history-box{margin-top:18px;border:1px solid rgba(214,177,87,.18);border-radius:18px;padding:18px 16px;background:rgba(0,0,0,.3)}
.history-title{font-family:Georgia,'Times New Roman',serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;text-align:center;opacity:.85}
.history-item{border-top:1px solid rgba(214,177,87,.08);padding:14px 0;color:var(--soft);font-family:Georgia,'Times New Roman',serif;font-size:13px;line-height:1.55;letter-spacing:.02em}
.history-item:first-of-type{border-top:0}
.history-item strong{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;color:var(--gold);letter-spacing:.08em;font-size:11px}
.history-item .history-date{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.06em;color:var(--muted);opacity:.65;margin-left:6px}
.history-item .history-stand{font-family:Georgia,'Times New Roman',serif;font-size:12.5px;color:#e6d8ad;letter-spacing:.03em;margin-top:4px}
.history-fear{color:var(--ember);font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic;letter-spacing:.03em;text-shadow:0 0 8px rgba(196,58,42,.25);word-break:break-word;margin-top:3px;font-size:12.5px}
.history-empty{text-align:center;color:var(--muted);font-family:Georgia,'Times New Roman',serif;font-size:12px;padding:10px 0;letter-spacing:.04em;opacity:.7}
.history-progress{text-align:center;color:var(--gold);font-family:Georgia,'Times New Roman',serif;font-size:12px;font-style:italic;letter-spacing:.04em;line-height:1.6;padding:8px 0 14px;opacity:.85;border-bottom:1px solid rgba(214,177,87,.1);margin-bottom:6px}
.history-enc{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;color:var(--muted);letter-spacing:.02em;margin-top:4px;line-height:1.5;opacity:.7}
/* MY DO HISTORY — typography emphasis only. Makes key numbers (Total Stands, Last Stand, category counts) and DO-SEAL identifiers easier to scan, especially on mobile, while preserving the black-and-gold aesthetic. Dates remain secondary via .history-date. */
.history-item .history-value{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:16px;font-weight:600;letter-spacing:.04em;color:#f0cf7d;opacity:1;margin-left:8px}
.history-item .history-unit{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:500;letter-spacing:.06em;color:var(--muted);opacity:.7;margin-left:4px}
.history-item .history-seal{font-size:12.5px;letter-spacing:.1em;color:#f0deac}
/* MY DO HISTORY — readability pass (scoped to #historyScreen only). Lifts the brightness/contrast of secondary text (timeline dates, category "Stands" units, section labels, footer seal, empty state) so it reads comfortably on mobile against the black background. Primary values, headings and seal identifiers are left untouched to stay dominant. No layout, sizing or colour-hue changes. */
#historyScreen .history-item .history-date{color:#d6c79d;opacity:.9}
#historyScreen .history-item .history-unit{color:#d6c79d;opacity:.92}
#historyScreen .history-title{opacity:.96}
#historyScreen .history-empty{opacity:.9}
#historyScreen .reflection-modal-seal{color:rgba(221,189,116,.78)}
@media(max-height:760px){.vault-stage{height:340px}.vault-wrap{width:270px;height:270px}.card{padding:15px}h1{font-size:25px}.vault-side-door{width:32px;height:220px;left:-32px}.vault-side-bolt{width:10px;height:10px}.vault-side-do{font-size:13px}.welcome-back{margin-top:0;margin-bottom:14px}}
/* MOBILE — anchor the fixed bottom button bar (LEAVE THE VAULT / KEEP DO-ING) to the
   true bottom of the screen on iPhone Safari / Home Screen PWA so it no longer floats high
   over content. The bar sits flush at bottom:0 with the safe-area inset folded into its own
   bottom padding (keeping the buttons clear of the home indicator), and the app reserves
   generous bottom padding so the SEAL THE VAULT button, DO history / Acts of DO entries and
   the final page content all scroll fully clear of the bar. Phone-only; desktop unchanged. */
@media(max-width:600px){.app{padding-bottom:calc(212px + env(safe-area-inset-bottom))}.bottom-nav{bottom:0;padding-bottom:calc(14px + env(safe-area-inset-bottom))}}
/* MOBILE — raise the SEAL THE VAULT button clear of the fixed bottom action bar.
   On the ritual (open-vault) screen the vault stage carries empty slack above/below the
   vault graphic, which pushed the seal button low — partially behind the fixed
   LEAVE THE VAULT / KEEP DO-ING bar. That slack is trimmed on phones so the button rises
   into clear view, and a comfortable gap is set between the vault and the button. The vault
   graphic keeps its own size and animation; the fixed bottom bar and desktop layout are
   left exactly as they are. Phone-only. */
@media(max-width:600px){#ritual .vault-stage{height:330px}#ritual .entry-copy{margin-top:16px}}
@media(max-width:600px) and (max-height:760px){#ritual .vault-stage{height:280px}}
/* Exit flow overlay */
.exit-overlay{
position:fixed;inset:0;z-index:10000;
background:radial-gradient(circle at 50% 40%,#0a0804 0%,#000 100%);
display:flex;align-items:center;justify-content:center;
text-align:center;padding:32px 32px 14vh;
opacity:0;transition:opacity .9s ease;
}
.exit-overlay.visible{opacity:1}
.exit-overlay.fading{opacity:0;transition:opacity .85s ease}
.exit-content{display:flex;flex-direction:column;gap:14px;max-width:300px}
.exit-message{color:var(--soft);font-size:20px;letter-spacing:.06em;line-height:1.4;font-weight:400}
.exit-remember{color:#c9a84c;font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.6}
.exit-standswith{color:var(--gold);font-size:17px;letter-spacing:.16em;line-height:1.4;text-transform:uppercase;text-shadow:0 0 24px rgba(214,177,87,.3)}
.exit-closing{color:var(--gold);font-size:13px;letter-spacing:.20em;text-transform:uppercase;margin-top:4px;opacity:.55;text-shadow:0 0 18px rgba(214,177,87,.15)}
.vault-wrap.force-close .vault-door{
transform:translateX(0) rotateY(0deg) scale(1)!important;
opacity:1!important;
visibility:visible!important;
filter:none!important;
}
.vault-wrap.force-close .vault-side-door{display:none!important}
.vault-wrap.force-close .vault-wheel{opacity:1!important}
/* Ritual vault: door behaviour */
#ritualVault > .vault-door{
display:block!important;
visibility:visible!important;
z-index:60!important;
transform-origin:-10% 50%!important;
}
#ritualVault.open > .vault-door{
opacity:1!important;
visibility:visible!important;
pointer-events:none!important;
transform:translateX(-110px) rotateY(-62deg)!important;
transition:transform 1.75s cubic-bezier(.13,.83,.18,1),opacity .6s ease!important;
}
#ritualVault.open > .vault-side-door{
display:none!important;
}
#ritualVault.open > .vault-chamber{
background:radial-gradient(circle at 50% 22%,#0e0b05 0%,#060402 20%,#020201 48%,#000 100%)!important;
box-shadow:inset 0 0 110px rgba(0,0,0,.99),inset 0 0 40px rgba(214,177,87,.03)!important;
}
#ritualVault.closing-now > .vault-door{
transform:translateX(0) rotateY(0deg) scale(1)!important;
opacity:1!important;
visibility:visible!important;
filter:none!important;
pointer-events:auto!important;
transition:transform 1.18s cubic-bezier(.12,.84,.18,1),opacity .2s linear,filter .2s linear!important;
}
#ritualVault.closing-now > .vault-side-door{
display:none!important;
}
#ritualVault.closing-now > .vault-door::after{opacity:1!important}
#ritualVault.sealed > .vault-side-door{display:none!important}
#ritualVault.sealing .fear-text{
animation:fearRedPulse .6s ease-in-out 1!important;
text-align:center!important;
margin:0 auto!important;
}
#ritualVault.closing-now .fear-text{
animation:fearLockedAway 1.1s cubic-bezier(.4,0,1,1) forwards!important;
}
#ritualVault.sealed .fear-text{
opacity:0!important;
visibility:hidden!important;
}
/* Ceremonial result screen */
.result-card{padding:8px 20px 24px!important}
.result-do-symbol{position:relative;margin:10px auto 16px;width:120px;height:120px;display:flex;align-items:center;justify-content:center}
.result-do-glow{position:absolute;inset:-20px;border-radius:50%;background:radial-gradient(circle,rgba(214,177,87,.18) 0%,rgba(214,177,87,.06) 40%,transparent 70%);animation:resultGlow 4s ease-in-out infinite}
@keyframes resultGlow{0%,100%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
.result-do-text{position:relative;color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:56px;font-weight:800;letter-spacing:.04em;text-shadow:0 0 32px rgba(214,177,87,.5),0 0 64px rgba(214,177,87,.15);z-index:1}
.result-seal{margin:0 auto 16px;max-width:280px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;padding:16px 24px;border:1px solid rgba(214,177,87,.3);border-radius:14px;box-shadow:0 0 24px rgba(214,177,87,.06),inset 0 0 24px rgba(214,177,87,.03);color:var(--gold);opacity:.9}
.result-statement{font-family:Georgia,'Times New Roman',serif;color:var(--soft);font-size:16px;font-weight:400;line-height:1.55;margin:10px 0 8px;letter-spacing:.04em}
.result-remembers{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:var(--gold);font-size:13px;letter-spacing:.18em;margin:0 0 6px;opacity:.85}
.result-delivery{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:var(--muted);font-size:12px;letter-spacing:.12em;margin:0 0 16px}
/* DO-SEAL Image (legacy canvas - hidden when card active) */
.doseal-image-wrap{position:relative;margin:0 auto 20px;max-width:340px;border-radius:4px;overflow:hidden;box-shadow:0 8px 40px rgba(0,0,0,.6),0 0 60px rgba(214,177,87,.06)}
.doseal-image-wrap canvas{display:block;width:100%;height:auto;border-radius:4px}
@keyframes dosealReveal{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
.doseal-image-wrap.revealed{animation:dosealReveal 1.2s cubic-bezier(.22,.9,.36,1) both}
/* ===== DO-SEAL Completion Section ===== */
.doSealCompletion{position:relative;margin:0 auto 10px;width:100%;display:flex;flex-direction:column;align-items:center;padding:28px 0 0}
.doSealRewardHeadline{text-align:center;margin:0 16px 0;flex-shrink:0}
.doSealRewardHeadline__line{display:block;font-family:Georgia,'Times New Roman',serif;font-size:clamp(20px,4.7vw,27px);font-weight:400;color:#fff3d0;line-height:1.45;letter-spacing:.03em;text-shadow:0 0 26px rgba(224,187,99,.28),0 1px 0 rgba(0,0,0,.25)}
.doSealRewardSupportLine{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:clamp(8px,2vw,10px);font-weight:400;color:rgba(214,177,87,.5);letter-spacing:.4em;text-transform:uppercase;text-align:center;margin-top:8%}
.doSealRewardEmblem{display:flex;flex-direction:column;align-items:center;margin-top:10%}
.doSealRewardEmblem__seal{position:relative;width:clamp(56px,14vw,76px);height:clamp(56px,14vw,76px);border-radius:50%;background:radial-gradient(circle at 50% 42%,#241a08 0%,#150f04 52%,#080501 100%);display:flex;align-items:center;justify-content:center;box-shadow:0 0 30px rgba(224,187,99,.30),0 0 60px rgba(224,187,99,.10),inset 0 0 16px rgba(0,0,0,.65)}
.doSealRewardEmblem__seal::before{content:"";position:absolute;inset:-1px;border-radius:50%;border:1.5px solid rgba(240,208,118,.9);box-shadow:0 0 13px rgba(240,208,118,.55),inset 0 0 9px rgba(240,208,118,.28)}
.doSealRewardEmblem__seal::after{display:none}
.doSealRewardEmblem__notches{position:absolute;inset:0;border-radius:50%}
.doSealRewardEmblem__sealText{font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,4.2vw,23px);font-weight:400;color:#ecd28a;letter-spacing:.12em;text-indent:.12em;line-height:1;position:relative;z-index:1;text-shadow:0 0 12px rgba(224,187,99,.5)}
.doSealRewardNumber{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:clamp(11px,2.8vw,14px);font-weight:400;color:rgba(214,177,87,.7);letter-spacing:.25em;text-align:center;margin-top:clamp(10px,2.5vw,16px)}
@keyframes doSealCompletionReveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.doSealCompletion.revealed{animation:doSealCompletionReveal 1.2s cubic-bezier(.22,.9,.36,1) both}
.doseal-encouragement-block{margin:14px 0 12px;padding:18px 16px;border:1px solid rgba(214,177,87,.18);border-radius:12px;background:rgba(0,0,0,.34);box-shadow:0 10px 26px rgba(0,0,0,.5),inset 0 0 24px rgba(214,177,87,.02)}
.doseal-encouragement-text{font-family:Georgia,'Times New Roman',serif;color:#f2e1b1;font-size:14px;font-weight:400;line-height:1.75;letter-spacing:.03em;text-align:left;white-space:pre-line}
.doseal-encouragement-text .enc-line{display:block;margin-bottom:8px}
.doseal-encouragement-text .enc-line:last-child{margin-bottom:0}
.doseal-encouragement-text .enc-emphasis{color:var(--gold);font-style:italic}
.doseal-section-divider{width:32px;height:1px;background:linear-gradient(90deg,transparent,rgba(214,177,87,.3),transparent);margin:14px auto}
.doseal-delivery-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:rgba(214,177,87,.7);font-size:10px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;margin:16px 0 8px}
.btn.doseal-download{background:linear-gradient(175deg,rgba(214,177,87,.18) 0%,rgba(90,65,18,.14) 100%);border-color:rgba(214,177,87,.3);color:var(--gold);font-size:11px;letter-spacing:.14em}
.doseal-sending{display:inline-block;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;color:var(--gold);letter-spacing:.08em;margin-top:8px;animation:waitPulse 2s ease-in-out infinite}
/* Payment Overlay */
.payment-overlay{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:none;align-items:center;justify-content:center;animation:payOverlayIn .5s cubic-bezier(.22,.9,.36,1) both}
.payment-overlay.active{display:flex}
@keyframes payOverlayIn{from{opacity:0}to{opacity:1}}
.payment-overlay-inner{width:100%;max-width:400px;padding:24px 20px;text-align:center}
.payment-overlay-do{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:52px;font-weight:800;color:var(--gold);letter-spacing:.06em;text-shadow:0 0 40px rgba(214,177,87,.4),0 0 80px rgba(214,177,87,.12);margin-bottom:18px}
.payment-overlay-title{font-family:Georgia,'Times New Roman',serif;font-size:20px;color:var(--soft);font-weight:400;letter-spacing:.08em;margin-bottom:8px;line-height:1.4}
.payment-overlay-sub{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;color:var(--muted);letter-spacing:.10em;margin-bottom:36px;line-height:1.6}
.payment-overlay .pay-option{width:100%;border:1px solid rgba(214,177,87,.4);background:linear-gradient(175deg,rgba(214,177,87,.22) 0%,rgba(180,140,50,.14) 40%,rgba(130,95,28,.10) 70%,rgba(90,65,18,.16) 100%);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#f4ead4;border-radius:18px;padding:22px 20px;cursor:pointer;position:relative;overflow:hidden;transition:transform .2s ease,box-shadow .3s ease,border-color .3s ease;touch-action:manipulation;-webkit-user-select:none;user-select:none;margin-bottom:14px;display:block;box-shadow:0 10px 28px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,235,180,.10),inset 0 -1px 0 rgba(0,0,0,.25)}
.payment-overlay .pay-option::before{content:"";position:absolute;inset:0;border-radius:18px;background:linear-gradient(180deg,rgba(255,245,210,.08) 0%,transparent 45%,rgba(0,0,0,.06) 100%);pointer-events:none}
.payment-overlay .pay-option:active{transform:scale(.982);box-shadow:0 4px 14px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,235,180,.06)}
.payment-overlay .pay-option-name{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.5);margin-bottom:6px}
.payment-overlay .pay-option-price{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:400;letter-spacing:.08em;color:var(--muted)}
.payment-overlay .pay-option.secondary-opt{background:rgba(0,0,0,.35);border-color:rgba(214,177,87,.25);box-shadow:0 6px 18px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.04)}
.payment-overlay .pay-option.secondary-opt .pay-option-name{color:var(--gold)}
.payment-overlay-note{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;color:rgba(169,155,120,.6);letter-spacing:.08em;margin-top:18px;line-height:1.6}
.payment-overlay-remaining{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;color:var(--gold);letter-spacing:.06em;margin-bottom:10px;opacity:.85}
.payment-waiting{display:none;text-align:center;padding:40px 20px}
.payment-waiting.active{display:block}
.payment-waiting-text{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;color:var(--soft);letter-spacing:.08em;animation:waitPulse 2s ease-in-out infinite}
@keyframes waitPulse{0%,100%{opacity:.6}50%{opacity:1}}
/* DO-ER Encouragement System */
.doer-choice-card{background:linear-gradient(180deg,rgba(16,12,7,.92),rgba(4,4,4,.96));border:1px solid var(--line);border-radius:24px;padding:32px 22px;box-shadow:0 20px 50px rgba(0,0,0,.55),inset 0 0 44px rgba(214,177,87,.03);text-align:center}
.doer-choice-title{font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.18em;color:var(--gold);text-transform:uppercase;margin-bottom:8px}
.doer-choice-sub{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;color:var(--muted);letter-spacing:.06em;line-height:1.6;margin-bottom:28px}
.doer-choice-divider{width:40px;height:1px;background:rgba(214,177,87,.25);margin:0 auto 28px}
.btn-doer-private,.btn-doer-release{width:100%;border:1px solid rgba(214,177,87,.3);border-radius:999px;padding:16px 20px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:all .3s ease;min-height:54px;position:relative;overflow:hidden;touch-action:manipulation;-webkit-user-select:none;user-select:none;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.btn-doer-private{background:rgba(0,0,0,.4);color:var(--muted);margin-bottom:12px}
.btn-doer-private:hover{border-color:rgba(214,177,87,.45);color:var(--soft)}
.btn-doer-release{background:linear-gradient(175deg,rgba(214,177,87,.28) 0%,rgba(130,95,28,.18) 70%,rgba(90,65,18,.22) 100%);color:#f4ead4;border-color:rgba(214,177,87,.45);box-shadow:0 10px 28px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,235,180,.1)}
.btn-doer-release:active{transform:scale(.982)}
.doer-releasing{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;color:var(--gold);letter-spacing:.10em;margin-top:16px;display:none;animation:waitPulse 2s ease-in-out infinite}
/* Incoming Fear Display */
.doer-incoming{background:linear-gradient(180deg,rgba(16,12,7,.94),rgba(4,4,4,.97));border:1px solid rgba(214,177,87,.2);border-radius:20px;padding:26px 22px;margin-bottom:18px;text-align:center;display:none;animation:screenFade .6s cubic-bezier(.22,.9,.36,1) both}
.doer-incoming-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;line-height:1.7}
.doer-incoming-id{font-family:Georgia,'Times New Roman',serif;font-size:12px;letter-spacing:.14em;color:var(--gold);margin-bottom:10px}
.doer-incoming-fear{font-family:Georgia,'Times New Roman',serif;font-size:16px;color:var(--soft);line-height:1.5;letter-spacing:.02em;margin-bottom:22px;font-style:italic}
.doer-incoming-divider{width:30px;height:1px;background:rgba(214,177,87,.2);margin:0 auto 20px}
.btn-stand-with{width:100%;border:1px solid rgba(214,177,87,.4);border-radius:999px;padding:15px 20px;background:linear-gradient(175deg,rgba(214,177,87,.22) 0%,rgba(130,95,28,.14) 100%);color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:all .3s ease;min-height:50px;touch-action:manipulation}
.btn-stand-with:active{transform:scale(.982)}
/* Encouragement Chamber */
.doer-chamber{display:none;animation:screenFade .5s cubic-bezier(.22,.9,.36,1) both}
.doer-chamber-inner{background:linear-gradient(180deg,rgba(10,8,4,.96),rgba(2,2,2,.98));border:1px solid rgba(214,177,87,.25);border-radius:20px;padding:28px 22px;text-align:center}
.doer-chamber-title{font-family:Georgia,'Times New Roman',serif;font-size:13px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase;margin-bottom:6px}
.doer-chamber-sub{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.10em;color:var(--muted);margin-bottom:20px}
.doer-chamber-textarea{width:100%;min-height:90px;max-height:120px;resize:none;border:1px solid rgba(214,177,87,.27);background:rgba(0,0,0,.5);color:var(--gold);border-radius:14px;padding:14px 15px;font-family:Georgia,'Times New Roman',serif;font-size:14px;line-height:1.5;letter-spacing:.02em;outline:none;box-shadow:inset 0 0 18px rgba(214,177,87,.04);transition:border-color .35s ease}
.doer-chamber-textarea:focus{border-color:rgba(214,177,87,.5);box-shadow:0 0 16px rgba(214,177,87,.12),inset 0 0 18px rgba(214,177,87,.06)}
.doer-chamber-textarea::placeholder{color:rgba(214,177,87,.28);font-style:italic}
.doer-chamber-counter{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;color:var(--muted);text-align:right;margin-top:6px;letter-spacing:.04em}
.doer-chamber-counter.warn{color:var(--red)}
.doer-enc-options{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.doer-enc-option{width:100%;text-align:center;cursor:pointer;border:1px solid rgba(214,177,87,.22);border-radius:14px;padding:15px 16px;background:linear-gradient(180deg,rgba(14,11,6,.92),rgba(3,3,3,.96));color:var(--soft);font-family:Georgia,'Times New Roman',serif;font-size:14px;letter-spacing:.03em;line-height:1.45;box-shadow:inset 0 0 18px rgba(214,177,87,.03);transition:border-color .35s ease,background .35s ease,color .35s ease,box-shadow .35s ease,transform .15s ease;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.doer-enc-option:hover{border-color:rgba(214,177,87,.42);color:var(--gold)}
.doer-enc-option:active{transform:scale(.985)}
.doer-enc-option:focus-visible{outline:none;border-color:rgba(214,177,87,.55)}
.doer-enc-option.selected{border-color:var(--gold);color:var(--gold);background:linear-gradient(175deg,rgba(214,177,87,.24) 0%,rgba(130,95,28,.14) 100%);box-shadow:0 0 16px rgba(214,177,87,.12),inset 0 0 20px rgba(214,177,87,.07);text-shadow:0 1px 3px rgba(0,0,0,.5)}
.btn-send-vault{width:100%;border:1px solid rgba(214,177,87,.4);border-radius:999px;padding:15px 20px;background:linear-gradient(175deg,rgba(214,177,87,.28) 0%,rgba(130,95,28,.16) 100%);color:#f4ead4;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;margin-top:18px;min-height:50px;transition:all .3s ease;touch-action:manipulation;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.btn-send-vault:active{transform:scale(.982)}
.btn-send-vault:disabled{opacity:.4;cursor:default}
.doer-chamber-status{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;color:var(--gold);letter-spacing:.08em;margin-top:12px;display:none}
/* Received Encouragement */
.doer-received{background:linear-gradient(180deg,rgba(16,12,7,.94),rgba(4,4,4,.97));border:1px solid rgba(214,177,87,.2);border-radius:20px;padding:26px 22px;margin-bottom:18px;text-align:center;display:none;animation:screenFade .6s cubic-bezier(.22,.9,.36,1) both}
.doer-received-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;line-height:1.7}
.doer-received-message{font-family:Georgia,'Times New Roman',serif;font-size:15px;color:var(--gold);line-height:1.6;letter-spacing:.02em;margin-bottom:18px;font-style:italic}
.doer-received-divider{width:30px;height:1px;background:rgba(214,177,87,.2);margin:0 auto 16px}
.doer-received-stand,.doer-incoming-stand{margin:0 auto 18px;display:flex;flex-direction:column;gap:12px}
.doer-received-stand:empty,.doer-incoming-stand:empty{display:none;margin:0}
.doer-received-stand .drs-row,.doer-incoming-stand .drs-row{display:flex;flex-direction:column;gap:3px}
.doer-received-stand .drs-label,.doer-incoming-stand .drs-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);opacity:.7;line-height:1.5}
.doer-received-stand .drs-value,.doer-incoming-stand .drs-value{font-family:Georgia,'Times New Roman',serif;font-size:15px;color:var(--soft);letter-spacing:.02em;line-height:1.4}
.doer-received-closing{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:14px;margin-bottom:14px;opacity:.7}
.btn-doer-dismiss{border:1px solid rgba(214,177,87,.2);border-radius:999px;padding:12px 28px;background:rgba(0,0,0,.3);color:var(--muted);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:all .3s ease;touch-action:manipulation}
.btn-doer-dismiss:hover{color:var(--soft);border-color:rgba(214,177,87,.35)}
.vault-quiet .vault-shell{box-shadow:inset 0 0 60px #000,inset 0 0 30px rgba(0,0,0,.8),0 0 0 4px rgba(214,177,87,.06),0 0 0 8px rgba(0,0,0,.5),0 0 0 10px rgba(214,177,87,.04),0 0 28px rgba(214,177,87,.07),0 0 100px rgba(0,0,0,.6);transition:box-shadow 2s ease}
.vault-quiet .vault-chamber::after{opacity:.35;transition:opacity 2s ease}
.vault-quiet .vault-dust{opacity:.3!important;transition:opacity 2s ease}
.vault-quiet .entry-glow{opacity:.24!important;transition:opacity 2s ease}
/* DO-VOLUTION Preview */
.dovolution-section{margin-top:32px;padding:28px 20px;border:1px solid rgba(214,177,87,.12);border-radius:18px;background:linear-gradient(180deg,rgba(16,12,7,.7),rgba(4,4,4,.85));text-align:center}
.dovolution-title{font-family:Georgia,'Times New Roman',serif;font-size:14px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase;margin-bottom:12px;line-height:1.4}
.dovolution-body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;color:var(--muted);letter-spacing:.04em;line-height:1.7;margin-bottom:22px;max-width:320px;margin-left:auto;margin-right:auto}
.dovolution-btn{width:100%;border:1px solid rgba(214,177,87,.3);border-radius:999px;padding:14px 20px;background:linear-gradient(175deg,rgba(214,177,87,.14) 0%,rgba(90,65,18,.10) 100%);color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:all .3s ease;min-height:48px;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.dovolution-btn:active{transform:scale(.982);box-shadow:0 4px 14px rgba(0,0,0,.4)}
.dovolution-coming{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;color:rgba(169,155,120,.5);letter-spacing:.14em;text-transform:uppercase;margin-top:10px}
/* Reflection Modal */
.reflection-modal-overlay{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.94);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);display:none;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .5s cubic-bezier(.22,.9,.36,1)}
.reflection-modal-overlay.active{display:flex;opacity:1}
.reflection-modal-overlay.visible{opacity:1}
.reflection-modal{width:100%;max-width:420px;max-height:85vh;overflow-y:auto;padding:36px 24px;text-align:center;-webkit-overflow-scrolling:touch}
.reflection-modal-heading{font-family:Georgia,'Times New Roman',serif;font-size:13px;letter-spacing:.22em;color:var(--gold);text-transform:uppercase;margin-bottom:28px;line-height:1.4}
.reflection-modal-body{font-family:Georgia,'Times New Roman',serif;font-size:15px;color:var(--soft);line-height:1.9;letter-spacing:.03em;text-align:center;white-space:pre-line;margin-bottom:28px}
.reflection-modal-seal{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.18em;color:rgba(214,177,87,.5);text-transform:uppercase;margin-bottom:28px}
.reflection-modal-close{border:1px solid rgba(214,177,87,.3);border-radius:999px;padding:13px 20px;background:transparent;color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:all .3s ease;touch-action:manipulation;min-width:160px}
.reflection-modal-close:active{transform:scale(.982)}
/* WHY DO-VOLUTION EXISTS — true centered modal overlay (scoped to this popup only so the
   other shared reflection modals are untouched). The backdrop only darkens/blurs the current
   app screen slightly so it stays visible behind, and the Founder letter sits in a distinct
   floating card that stays within the mobile viewport and scrolls if the text is long. */
#whyDovolutionOverlay{background:rgba(4,4,4,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
#whyDovolutionOverlay .reflection-modal{background:linear-gradient(180deg,rgba(20,16,9,.98) 0%,rgba(8,7,4,.98) 100%);border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 60px rgba(0,0,0,.6),0 0 0 1px rgba(214,177,87,.06);max-height:82vh;padding:40px 24px 30px}
#standFounderOverlay{background:rgba(4,4,4,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
#standFounderOverlay .reflection-modal{background:linear-gradient(180deg,rgba(20,16,9,.98) 0%,rgba(8,7,4,.98) 100%);border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 60px rgba(0,0,0,.6),0 0 0 1px rgba(214,177,87,.06);max-height:82vh;padding:36px 24px 30px}
#standFounderOverlay .reflection-modal-body{font-size:14px;line-height:1.85;margin-bottom:24px}
.reflection-play-btn{width:100%;max-width:260px;border:1px solid rgba(214,177,87,.3);border-radius:999px;padding:14px 20px;background:linear-gradient(175deg,rgba(214,177,87,.14) 0%,rgba(90,65,18,.10) 100%);color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:all .3s ease;min-height:48px;touch-action:manipulation;-webkit-user-select:none;user-select:none;margin-bottom:8px}
.reflection-play-btn:active{transform:scale(.982);box-shadow:0 4px 14px rgba(0,0,0,.4)}
.reflection-play-btn[data-playing="1"]{border-color:rgba(214,177,87,.55);background:linear-gradient(175deg,rgba(214,177,87,.22) 0%,rgba(90,65,18,.16) 100%)}
.reflection-play-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.14em;color:rgba(169,155,120,.5);text-transform:uppercase;margin-bottom:24px}
/* DO-VOLUTION Reflection States */
.dovolution-reflection-headline{font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.22em;color:var(--gold);text-transform:uppercase;line-height:1.7;margin-bottom:20px;text-align:center}
.dovolution-reflection-sub{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;color:var(--muted);letter-spacing:.06em;line-height:1.7;margin-bottom:24px;max-width:300px;margin-left:auto;margin-right:auto;text-align:center}
.dovolution-reflection-badge{display:inline-flex;align-items:center;gap:6px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.14em;color:rgba(214,177,87,.6);text-transform:uppercase;margin-bottom:22px;padding:8px 16px;border:1px solid rgba(214,177,87,.15);border-radius:999px;background:rgba(214,177,87,.04)}
.dovolution-option-card{border:1px solid rgba(214,177,87,.15);border-radius:14px;padding:18px 16px;margin-bottom:10px;background:rgba(214,177,87,.03);text-align:center;transition:all .3s ease}
.dovolution-option-card .dovolution-option-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase;margin-bottom:4px}
.dovolution-option-card .dovolution-option-status{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.12em;color:rgba(169,155,120,.4);text-transform:uppercase}
.dovolution-progress-ring{width:56px;height:56px;margin:0 auto 18px;position:relative}
.dovolution-progress-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.dovolution-progress-ring circle{fill:none;stroke-width:2}
.dovolution-progress-ring .ring-bg{stroke:rgba(214,177,87,.1)}
.dovolution-progress-ring .ring-fill{stroke:rgba(214,177,87,.55);stroke-linecap:round;transition:stroke-dashoffset 1.5s cubic-bezier(.22,.9,.36,1)}
/* Reflection viewer modal */
.reflection-viewer-overlay{position:fixed;inset:0;z-index:10001;background:rgba(0,0,0,.96);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);display:none;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .6s cubic-bezier(.22,.9,.36,1)}
.reflection-viewer-overlay.active{display:flex}
.reflection-viewer-overlay.visible{opacity:1}
.reflection-viewer{width:100%;max-width:420px;max-height:88vh;overflow-y:auto;padding:40px 24px;text-align:center;-webkit-overflow-scrolling:touch}
.reflection-viewer-divider{width:48px;height:1px;background:linear-gradient(90deg,transparent,rgba(214,177,87,.4),transparent);margin:0 auto 28px}
.reflection-viewer-text{font-family:Georgia,'Times New Roman',serif;font-size:15px;color:var(--soft);line-height:2;letter-spacing:.03em;text-align:center;white-space:pre-line;margin-bottom:32px}
.reflection-journey{margin:0 auto 30px;max-width:340px;text-align:left}
.reflection-journey-heading{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.22em;color:var(--gold);text-align:center;margin-bottom:18px;opacity:.92}
.reflection-journey-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:7px 0;border-bottom:1px solid rgba(214,177,87,.12)}
.reflection-journey-row:last-child{border-bottom:none}
.reflection-journey-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);opacity:.85;flex:1}
.reflection-journey-value{font-family:Georgia,'Times New Roman',serif;font-size:16px;color:var(--soft);letter-spacing:.02em;white-space:nowrap}
.reflection-viewer-audio-wrap{display:flex;flex-direction:column;align-items:center;margin-bottom:28px}
.reflection-viewer-audio-btn{width:100%;max-width:260px;border:1px solid rgba(214,177,87,.3);border-radius:999px;padding:14px 20px;background:linear-gradient(175deg,rgba(214,177,87,.14) 0%,rgba(90,65,18,.10) 100%);color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:all .3s ease;min-height:48px;touch-action:manipulation;-webkit-user-select:none;user-select:none;margin-bottom:8px}
.reflection-viewer-audio-btn:active{transform:scale(.982);box-shadow:0 4px 14px rgba(0,0,0,.4)}
.reflection-viewer-audio-btn[data-playing="1"]{border-color:rgba(214,177,87,.55);background:linear-gradient(175deg,rgba(214,177,87,.22) 0%,rgba(90,65,18,.16) 100%)}
.reflection-viewer-progress{width:100%;max-width:260px;height:3px;background:rgba(214,177,87,.12);border-radius:2px;overflow:hidden;margin-top:10px;opacity:0;transition:opacity .4s ease}
.reflection-viewer-progress-bar{height:100%;width:0%;background:linear-gradient(90deg,rgba(214,177,87,.4),rgba(214,177,87,.7));border-radius:2px;transition:width .3s linear}
/* THE POWER OF DO™ — additive, story-led inline result-screen panel. Scoped .pod-* only; luxury black / glass / gold; minimal; no badges, points, scores, progress bars or gamification. */
.pod-panel{margin:34px auto 0;max-width:360px;text-align:center;padding:32px 24px 26px;border:1px solid rgba(214,177,87,.18);border-radius:18px;background:linear-gradient(180deg,rgba(20,16,8,.55) 0%,rgba(0,0,0,.42) 100%);box-shadow:0 18px 50px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,235,180,.06)}
.pod-title{font-family:Georgia,'Times New Roman',serif;font-size:21px;letter-spacing:.06em;color:var(--gold);text-shadow:0 0 22px rgba(214,177,87,.28);margin-bottom:4px}
.pod-tagline{font-family:Georgia,'Times New Roman',serif;font-size:13px;font-style:italic;letter-spacing:.05em;color:var(--soft);opacity:.6;margin:10px 0 22px;line-height:1.6}
.pod-view-btn{display:inline-block;border:1px solid rgba(214,177,87,.34);border-radius:999px;padding:13px 30px;background:linear-gradient(175deg,rgba(214,177,87,.12) 0%,rgba(90,65,18,.08) 100%);color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:border-color .35s ease,background .35s ease,transform .2s ease;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-appearance:none;appearance:none;min-height:46px;outline:none}
.pod-view-btn:active{transform:scale(.978)}
.pod-panel.pod-open .pod-view-btn{border-color:rgba(214,177,87,.5);background:linear-gradient(175deg,rgba(214,177,87,.2) 0%,rgba(90,65,18,.14) 100%)}
.pod-expand{max-height:0;overflow:hidden;opacity:0;transition:max-height .7s cubic-bezier(.22,.61,.36,1),opacity .55s ease}
.pod-panel.pod-open .pod-expand{max-height:1800px;opacity:1}
.pod-divider{width:46px;height:1px;background:linear-gradient(90deg,transparent,rgba(214,177,87,.42),transparent);margin:20px auto}
.pod-expand .pod-divider:first-child{margin-top:28px}
.pod-movement{margin:0 auto}
.pod-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);opacity:.92;margin-bottom:8px}
.pod-desc{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.04em;text-transform:none;color:var(--muted);opacity:.72;margin-bottom:10px;line-height:1.6}
.pod-line{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.7;color:#f7f1e3;letter-spacing:.005em;font-weight:300;opacity:1}
.pod-story .pod-line{font-style:italic}
.pod-close{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.8;color:#f7f1e3;letter-spacing:.01em;font-weight:300;opacity:1}
.pod-close strong{color:var(--gold);font-weight:600}
.pod-seal{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(214,177,87,.5);margin-top:22px}
/* ── VOICE VAULT CEREMONY V1 — additive, scoped. Reuses existing gold/black
   palette and typography; introduces no new colours, fonts, or layout changes
   to any existing element. All selectors are vv-/voice- prefixed. ── */
.vv-entry{margin:6px 0 20px;text-align:center}
.vv-divider{display:flex;align-items:center;gap:12px;margin:18px 2px 14px;color:rgba(214,177,87,.45)}
.vv-divider::before,.vv-divider::after{content:"";flex:1;height:1px;background:rgba(214,177,87,.18)}
.vv-divider span{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(214,177,87,.6)}
.vv-speak-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;background:rgba(0,0,0,.28);border:1px solid rgba(214,177,87,.4);color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;letter-spacing:.10em;padding:15px 18px;border-radius:12px;cursor:pointer;transition:border-color .3s ease,background .3s ease}
#voiceVaultBtn > span[aria-hidden="true"]{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green)}
.vv-speak-btn:hover{border-color:rgba(214,177,87,.7);background:rgba(0,0,0,.4)}
.vv-speak-btn.vv-listening{border-color:rgba(214,177,87,.85);background:rgba(214,177,87,.08)}
.vv-helper{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;letter-spacing:.03em;color:#bbaa7d;line-height:1.65;margin:12px 0 0}
.vv-status{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.04em;color:#bbaa7d;line-height:1.6;margin-top:12px;min-height:1em}
.vv-status.vv-live{color:var(--gold)}
.vv-mic-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);margin-right:7px;vertical-align:middle;opacity:.9;animation:vvPulse 1.3s ease-in-out infinite}
@keyframes vvPulse{0%,100%{opacity:.25;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}
/* Ceremony panel — lives inside the existing ritual entry-copy area */
.voice-ceremony{margin:18px auto 8px;max-width:420px}
.voice-ceremony-line{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:17px;font-weight:300;letter-spacing:.04em;line-height:1.7;color:#f7f1e3;min-height:1.7em;opacity:0;transition:opacity .6s ease}
.voice-ceremony-line.vv-show{opacity:1}
.voice-ceremony-controls{display:flex;gap:10px;justify-content:center;margin-top:16px}
.voice-ceremony-controls button{background:rgba(0,0,0,.28);border:1px solid rgba(214,177,87,.32);color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.10em;text-transform:uppercase;padding:9px 16px;border-radius:10px;cursor:pointer;transition:border-color .3s ease}
.voice-ceremony-controls button:hover{border-color:rgba(214,177,87,.6)}
/* DO Platform Gateway — isolated front-door layer. */
body.do-gateway-mode,
body.do-dopadel-mode,
body.do-padel-intent-mode,
body.do-padel-brands-mode,
body.do-padel-clubs-mode,
body.do-padel-play-mode,
body.do-padel-events-mode,
body.do-padel-improve-mode,
body.do-padel-club-admin-mode,
body.do-padel-voice-mode,
body.do-winner-mode,
body.do-padel-infrastructure-mode,
body.do-padel-partners-mode,
body.do-padel-influencers-mode,
body.do-padel-brand-partner-mode,
body.do-padel-partner-enquiry-mode{min-height:100vh;background:#030402;color:#f7f2e6;overflow-x:hidden}
body.do-gateway-mode #introOverlay,
body.do-gateway-mode #sampleOverlay,
body.do-gateway-mode #mainApp,
body.do-dopadel-mode #introOverlay,
body.do-dopadel-mode #sampleOverlay,
body.do-dopadel-mode #mainApp,
body.do-padel-intent-mode #introOverlay,
body.do-padel-intent-mode #sampleOverlay,
body.do-padel-intent-mode #mainApp,
body.do-padel-brands-mode #introOverlay,
body.do-padel-brands-mode #sampleOverlay,
body.do-padel-brands-mode #mainApp,
body.do-padel-clubs-mode #introOverlay,
body.do-padel-clubs-mode #sampleOverlay,
body.do-padel-clubs-mode #mainApp,
body.do-padel-play-mode #introOverlay,
body.do-padel-play-mode #sampleOverlay,
body.do-padel-play-mode #mainApp,
body.do-padel-events-mode #introOverlay,
body.do-padel-events-mode #sampleOverlay,
body.do-padel-events-mode #mainApp,
body.do-padel-improve-mode #introOverlay,
body.do-padel-improve-mode #sampleOverlay,
body.do-padel-improve-mode #mainApp,
body.do-padel-club-admin-mode #introOverlay,
body.do-padel-club-admin-mode #sampleOverlay,
body.do-padel-club-admin-mode #mainApp,
body.do-padel-voice-mode #introOverlay,
body.do-padel-voice-mode #sampleOverlay,
body.do-padel-voice-mode #mainApp,
body.do-winner-mode #introOverlay,
body.do-winner-mode #sampleOverlay,
body.do-winner-mode #mainApp,
body.do-padel-infrastructure-mode #introOverlay,
body.do-padel-infrastructure-mode #sampleOverlay,
body.do-padel-infrastructure-mode #mainApp,
body.do-padel-partners-mode #introOverlay,
body.do-padel-partners-mode #sampleOverlay,
body.do-padel-partners-mode #mainApp,
body.do-padel-influencers-mode #introOverlay,
body.do-padel-influencers-mode #sampleOverlay,
body.do-padel-influencers-mode #mainApp,
body.do-padel-brand-partner-mode #introOverlay,
body.do-padel-brand-partner-mode #sampleOverlay,
body.do-padel-brand-partner-mode #mainApp,
body.do-padel-partner-enquiry-mode #introOverlay,
body.do-padel-partner-enquiry-mode #sampleOverlay,
/* THE DO→PADEL MEMBERSHIP CONTINUATION PAGE STAYS INSIDE DO→PADEL. This route
   was the one screen in this list that never hid the DO-VOLUTION application
   layer beneath it, so DO-VOLUTION's own content (the vault, THE POWER OF DO)
   rendered underneath the DO→PADEL membership content. It is hidden here in
   exactly the way every other DO→PADEL route already hides it. DO-VOLUTION
   itself is untouched: its own routes, membership and account functionality are
   not changed by this, and on every DO-VOLUTION screen #mainApp shows as always. */
body.do-padel-membership-mode #introOverlay,
body.do-padel-membership-mode #sampleOverlay,
body.do-padel-membership-mode #mainApp,
body.do-padel-partner-enquiry-mode #mainApp{display:none !important}
html.do-padel-host-entry body{min-height:100vh;background:#030402;color:#f7f2e6;overflow-x:hidden}
html.do-padel-host-entry body::before,
html.do-padel-host-entry #introOverlay,
html.do-padel-host-entry #sampleOverlay,
html.do-padel-host-entry #mainApp,
html.do-padel-host-entry #doPlatformGateway{display:none !important}
/* ── DO→PADEL ENTRY SPOTLIGHT — the approved Playtomic image, full screen ──────
   Fixed to the viewport, above everything, on a black backdrop. THE WHOLE ADVERT
   IS ALWAYS ON SCREEN: the image is contained rather than covered, so the
   DO→SPOTLIGHT™ heading and the gold glow beneath it survive every viewport,
   including the shorter one a browser leaves behind its own toolbars — covering
   used to scale the artwork up until the top of it was cut away. Nothing is
   cropped now; the only thing the fit can add is a little more black above and
   below, and the backdrop is already black, so the advert simply sits in it with
   no border, no padding and no line anywhere. The source file is displayed
   exactly as supplied; only the framing is done here. */
#doPadelEntrySpotlight{display:none}
html.do-padel-entry-spotlight{background:#000}
html.do-padel-entry-spotlight body{overflow:hidden}
html.do-padel-entry-spotlight #doPadelEntrySpotlight{display:block;position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;height:100dvh;margin:0;padding:0;border:0;background:#000;z-index:2147483647;overflow:hidden}
html.do-padel-entry-spotlight #doPadelEntrySpotlight img{display:block;width:100%;height:100%;margin:0;padding:0;border:0;object-fit:contain;object-position:center center;background:#000}
/* ── BOOK A COURT — THE ONE DO→PADEL™ PORTRAIT HOUSE ADVERT ───────────────────
   This single screen stands where two used to: the timed WILSON "FEATURED
   PARTNER / PRESENTED BY WILSON" presentation and the separate "FEATURED PARTNER
   OPPORTUNITY / YOUR BRAND HERE" page. Both are gone.
   The creative is the approved DO→PADEL™ portrait house advert that already
   exists in this project — assets/do-padel-portrait-advert.jpg, the identical
   file the post-landing advert serves. It is reused, never copied: one image, its
   own 1284 × 1963 proportions, nothing regenerated, cropped, recoloured,
   stretched, distorted or recompressed, and the complete artwork on screen.
   The page is pure black, so the black the artwork ends in runs straight on into
   the controls beneath it with no seam and no panel. NO CLOCK RUNS HERE: there is
   no countdown, no "Continuing in…" and no automatic advancement of any kind —
   the advert stays until CONTINUE YOUR JOURNEY is pressed. */
#doPadelBookCourtAdvert{display:none}
html.do-padel-bc-advert{background:#000}
html.do-padel-bc-advert body{overflow:hidden;background:#000}
html.do-padel-bc-advert #doPadelBookCourtAdvert{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;height:100dvh;margin:0;padding:0;border:0;background:#000;z-index:2147483646;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
/* The whole portrait, at its own ratio, as large as the screen allows. The 232px
   set aside covers the two controls and the room around them in full, which is
   what lets a phone hold the entire artwork and both buttons together. */
#doPadelBookCourtAdvert img{display:block;flex:0 0 auto;width:100%;max-width:min(560px,max(240px,calc((100dvh - 232px) * 0.65410)));height:auto;margin:0 auto;padding:0;border:0;background:#000}
#doPadelBookCourtAdvert .do-advert-actions{flex:0 0 auto;display:grid;gap:clamp(11px,1.9vh,17px);width:100%;max-width:420px;box-sizing:border-box;margin:0;padding:clamp(18px,3vh,28px) 22px calc(clamp(22px,3.6vh,34px) + env(safe-area-inset-bottom));background:#000}
/* ── DO→PADEL™ ADVERT — WHAT THE LANDING PAGE HANDS OVER TO ───────────────────
   The supplied portrait advert, on screen the instant /dopadel is entered, with
   the CONTINUE JOURNEY button beneath it. The artwork is displayed exactly as
   supplied and only framed here.
   THE WHOLE ARTWORK, ALWAYS. The portrait is laid in by WIDTH with height:auto,
   so the browser keeps its own 1284×1963 proportions exactly — never stretched,
   never squeezed. There is no object-fit crop anywhere on this screen, so the
   DO→PADEL logo, PLAY • IMPROVE • BELONG, TOGETHER WE ARE STRONGER, the players,
   the world map, the lower feature row and DO-PADEL.COM are all shown in full.
   AS LARGE AS THE SCREEN SENSIBLY ALLOWS. On a phone that is the full width of
   the viewport, edge to edge. The width is only ever reduced by the one thing
   that could otherwise push the foot of the artwork off screen — the height left
   once the button's strip is set aside — so on shorter or landscape viewports the
   whole composition scales down together rather than the design being trimmed.
   The 560px ceiling stops it being blown up past a premium size on a desktop, and
   the 240px floor keeps it sensible on a viewport too short to fit it, where the
   frame simply scrolls and the artwork is still complete.
   SEAMLESS BLACK. The <html>, the body, the frame, the strip the button sits on
   and the artwork's own top and bottom bands are all the same pure black, and
   nothing here paints a panel, a border, a radius, a shadow or a background of any
   other colour, so where the image ends the page just carries on — no white gap,
   no grey gap, no box around the button, no seam. It sits one below the
   spotlight's layer, so the spotlight lifts onto it rather than the other way
   round and the change of screen cannot flash. */
#doPadelFounderAdvert{display:none}
html.do-padel-founder-advert{background:#000}
html.do-padel-founder-advert body{overflow:hidden;background:#000}
html.do-padel-founder-advert #doPadelFounderAdvert{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;height:100dvh;margin:0;padding:0;border:0;background:#000;z-index:2147483646;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#doPadelFounderAdvert img{display:block;flex:0 0 auto;width:100%;max-width:min(560px,max(240px,calc((100dvh - 232px - var(--do-advert-head)) * 0.65410)));height:auto;margin:0 auto;padding:0;border:0;background:#000}
/* THE HEADER ABOVE BOTH CREATIVES — the identical DO logo lockup the members'
   buttons page carries at its head: the same supplied artwork
   (assets/do-hero-logo-together-stronger.jpg), the same .do-padel-intent-brand-mark
   sizing and the same treatment, never a larger landing-page version and never
   rebuilt as text (TOGETHER WE ARE STRONGER is part of the artwork). Only the
   spacing around it belongs to this screen: balanced room above and below, centred.
   Its height is declared once in --do-advert-head so the creative beneath it is
   sized from the room that is actually left, which is what keeps the whole advert,
   the header and both controls on screen together. */
/* The logo header has been removed from above both creatives, so the creative and
   both controls lift into the reclaimed space. The ENERGY can creative (B) is opened
   by TOGETHER WE ARE STRONGER in the landing page's exact lockup and size; the
   court/players creative (A) carries that line in its own artwork, so it gets none. */
#doPadelFounderAdvert{--do-advert-head:0px}
html.do-advert-b #doPadelFounderAdvert{--do-advert-head:calc(0.0588 * min(100vw,620px) + clamp(24px,4vh,36px))}
#doPadelFounderAdvert .do-advert-tws{display:none}
html.do-advert-b #doPadelFounderAdvert .do-advert-tws{display:block;flex:0 0 auto;width:100%;box-sizing:border-box;margin:0;padding:clamp(14px,2.4vh,22px) 0 clamp(10px,1.6vh,14px);white-space:nowrap;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:calc(0.049 * min(100vw,620px));line-height:1.2;text-transform:uppercase;text-align:center;background:#000}
@media (min-width:700px){html.do-advert-b #doPadelFounderAdvert .do-advert-tws{font-size:calc(0.049 * min(100vw,620px,(100vh - 132px) * 1284 / 2778))}}
/* THE SECOND CREATIVE — the supplied DO→? ENERGY can advert, used exactly as
   supplied: assets/do-energy-can-advert.jpg at its own 1284 × 1925 proportions,
   never regenerated, recompressed, cropped, stretched or distorted. It is framed
   by the identical rules the court/players creative uses — only the ratio in the
   height-fit differs, because the artwork is its own shape — so the can fills the
   same advertising area as strongly as the screen allows, complete, with no empty
   space added around it. One creative is on screen per entrance: the other is not
   rendered at all. */
#doPadelFounderAdvert .do-advert-creative-b{display:none;max-width:min(88vw,540px)}
/* EACH CREATIVE IS SIZED ON ITS OWN. Fitting both into the height left over after
   the header and the two controls made them far smaller than the artwork deserves —
   the DO→PADEL branding, the shirt logos and the lower message row were hard to
   read. Each creative is now laid in by WIDTH, at its own ceiling, so the artwork is
   as large as the screen sensibly allows: the court/players advert takes practically
   the full width of a phone and up to 660px on a desktop, the can advert a little
   less, as its own composition needs. Only max-width is set — height stays auto and
   there is no object-fit, no max-height and no crop anywhere — so both keep their
   exact supplied proportions and are shown complete. Where the whole composition is
   taller than the viewport the frame scrolls, exactly as it already did on short
   screens, and both controls stay where they are. */
#doPadelFounderAdvert .do-advert-creative-a{max-width:min(97vw,660px)}
html.do-advert-b #doPadelFounderAdvert .do-advert-creative-a{display:none}
html.do-advert-b #doPadelFounderAdvert .do-advert-creative-b{display:block}
/* DO CAN™ — COMING SOON — the small centred caption under the can creative. The
   established DO→PADEL gold (#f2d489) at the quiet end of its range, the same
   uppercase letter-spaced treatment the page's other small gold labels carry, so it
   reads as premium and understated rather than as a second control. It is text: no
   pill, no border, no background, no press behaviour. It exists only with the can
   creative, and the room around it is the minimum that keeps the existing spacing
   between the artwork and CONTINUE JOURNEY sensible. */
#doPadelFounderAdvert .do-advert-can-caption{display:none;flex:0 0 auto;width:100%;max-width:420px;box-sizing:border-box;margin:0 auto;padding:clamp(10px,1.7vh,15px) 22px 0;background:#000;color:#f2d489;-webkit-text-fill-color:#f2d489;text-align:center;text-transform:uppercase;font-size:clamp(9.5px,2.4vw,11px);font-weight:600;letter-spacing:.20em;line-height:1.4;opacity:.82}
html.do-advert-b #doPadelFounderAdvert .do-advert-can-caption{display:block}
/* No per-breakpoint overrides are needed any more. The single width rule above
   already fits the whole portrait, at its own proportions, on every screen: the
   old wide-screen and landscape re-fit existed only to undo the phone-only crop,
   and the old phone "lift" existed only to claw back black the crop had left
   above the logo. There is no crop now, so lifting the frame would push the top
   of the artwork off screen — both are gone rather than re-tuned. */
/* THE BUTTON'S FOOTING — the black the artwork ends in, carried straight on down
   the page. Same pure black, no border, no radius, no shadow and no panel of its
   own, so the join between the foot of the image and this strip cannot be seen.
   Only the room around the button changes: enough above and below to give it
   premium breathing space, and black beneath it to close the composition. The
   232px set aside in the image's width above covers this strip in full (the two
   54px controls, the gap between them and the room above and below), which is what
   lets a phone hold the whole artwork and both controls on screen together without
   scrolling. It is the same 232px the BOOK A COURT advert — the identical artwork
   with the identical pair of controls — already sets aside, so the two screens
   compose alike. The bottom padding still adds the safe-area inset on top of its
   own room, so the lower control always stays clear of the phone's home
   indicator and the browser's own bottom bar. */
#doPadelFounderAdvert .do-key-advert-actions{flex:0 0 auto;width:100%;max-width:420px;box-sizing:border-box;margin:0;padding:clamp(20px,3.4vh,32px) 22px calc(clamp(26px,4.4vh,42px) + env(safe-area-inset-bottom));background:#000}
#doPadelFounderAdvert .do-key-advert-actions .btn{width:100%;margin:0}
/* ADVERTISE GLOBALLY WITH DO→PADEL — the secondary control beneath CONTINUE
   JOURNEY, in the established .do-showcase-cta advertising treatment used by every
   other advertising placement in DO→PADEL (declared once, further down): the same
   pill, the same 54px height and the same gold lettering, but the quieter,
   translucent green fill and softer edge that keep it one step below the
   functional control. Nothing is redeclared here — the only rule this placement
   adds is the gap above it, which is the same gap the BOOK A COURT advert puts
   between its own two controls, so the minimum extra height is all that is taken.
   CONTINUE JOURNEY itself is untouched. */
#doPadelFounderAdvert .do-key-advert-actions .do-showcase-cta{margin-top:clamp(11px,1.9vh,17px)}
/* THE CONTINUE JOURNEY BUTTON — the same premium green-and-gold treatment the two
   CONTINUE buttons on the DO→PADEL Member Access page already carry, applied here
   so the two moments in the journey read as one product. The values are the ones
   already declared for #doPadelMemberEmailBtn / #doPadelPartnerCodeBtn further
   down: the deep, sophisticated end of the DO→PADEL green family rather than the
   bright lime end, the same four-stop gradient with the ::before sheen and the
   ::after top hairline that keep it dimensional rather than flat, and the page's
   warm DO→PADEL gold label, which clears 4.5:1 against the fill behind the text.
   Only the fill, the edge, the label colour and the glow change — the width, the
   54px height, the pill radius, the padding, the position on the page and every
   press/hover behaviour are inherited from .btn and are exactly as they were. The
   artwork above it, and the wording inside that artwork, are untouched. */
#doPadelFounderAdvert .do-key-advert-actions #doPadelFounderAdvertBtn{
background:linear-gradient(175deg,#5f8825 0%,#49681d 42%,#385214 72%,#2d4210 100%);
border-color:rgba(197,247,116,.72);
color:#f2d489;
text-shadow:0 1px 3px rgba(18,42,4,.45);
box-shadow:0 10px 28px rgba(0,0,0,.35),0 4px 18px rgba(139,197,46,.28),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.22)
}
#doPadelFounderAdvert .do-key-advert-actions #doPadelFounderAdvertBtn::before{background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 46%,rgba(0,0,0,.1) 100%)}
#doPadelFounderAdvert .do-key-advert-actions #doPadelFounderAdvertBtn::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent)}
#doPadelFounderAdvert .do-key-advert-actions #doPadelFounderAdvertBtn:hover{border-color:rgba(212,252,140,.9);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 28px rgba(139,197,46,.34),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.22)}
/* ── DO→PADEL Member Access — the premium membership gate reached from the three
   restricted DO→PADEL buttons. It reuses the shared registration component but
   must read as one continuous DO→PADEL product: the DO-VOLUTION intro landing,
   the DO-VOLUTION footer, and the vault "KEEP DO-ING" / "Leave The Vault"
   controls are never shown here, and #mainApp is revealed at first paint so no
   DO-VOLUTION landing ever flashes on the way in. ──────────────────────────── */
body.do-padel-register-mode #introOverlay,
body.do-padel-register-mode #sampleOverlay{display:none !important}
body.do-padel-register-mode #mainApp{opacity:1 !important}
body.do-padel-register-mode #bottomNav,
body.do-padel-register-mode .footer{display:none !important}
/* The top-of-app DO-VOLUTION identity (DO→?® mark, "THE POWER OF DO", the
   vault welcome-back / continuity banners) sits above every screen inside
   #mainApp. Hidden here so the member access page carries only DO→PADEL brand. */
body.do-padel-register-mode .brand,
body.do-padel-register-mode .subbrand,
body.do-padel-register-mode #welcomeBack,
body.do-padel-register-mode #continuityIndicator{display:none !important}
/* The DO-VOLUTION vault entry screen is the default .active screen inside
   #mainApp; suppress it in member-access mode so it can never paint before the
   DO→PADEL member access screen is shown. */
body.do-padel-register-mode #entry{display:none !important}
.do-padel-access-brand{display:none;text-align:center;margin:0 0 20px}
body.do-padel-register-mode .do-padel-access-brand{display:block}
.do-padel-access-wm{font-size:26px;letter-spacing:.02em;line-height:1}
.do-padel-access-coin{display:block;width:clamp(112px,26vw,150px);height:auto;margin:-6px auto 0;user-select:none;-webkit-user-drag:none}
.do-padel-access-tag{margin-top:9px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-access-divider{display:flex;align-items:center;gap:14px;margin:24px 0 16px;color:rgba(224,187,99,.6);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase}
.do-padel-access-divider::before,.do-padel-access-divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(139,197,46,.45),transparent)}
.do-padel-access-newbtn{background:transparent;border:1px solid rgba(139,197,46,.6);color:var(--brand-green);box-shadow:none}
/* YOUR FIRST 14 DAYS ARE ON US — the welcome line that sits with the new-member
   button. Centred on the same axis as the divider above it and the button below,
   with the button's own top margin closed up so the three read as one group rather
   than as three separate things. Signature Green at a readable 12.5px: quieter than
   a heading, unmistakably not an advertisement. */
.do-padel-access-launch{text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:12.5px;letter-spacing:.1em;line-height:1.6;color:var(--brand-green);margin:0 0 12px}
/* ── CLUB OFFER MODE ────────────────────────────────────────────────────────
   A member arriving on a valid DO→PADEL™ Club Offer link is not an ordinary
   public arrival: their club has already arranged complimentary access for them.
   The body class below is set by the Club Offer arrival script ONLY after the
   server has confirmed the campaign, and it does exactly two things.

   ONE — IT REMOVES THE ORDINARY 14-DAY PROPOSITION, EVERYWHERE. The launch block
   on the registration screen, the launch line on Member Access, and the launch
   line on the club representative signpost are all hidden, so nothing in a Club
   Offer journey offers the public 14 days.

   TWO — IT REVEALS THE CLUB OFFER NOTE, which names the club and states that
   club's own shared window. Presentation only: no date, no day count and no
   entitlement is decided here, and without the class every screen is byte-for-byte
   what it has always been.  */
body.do-padel-club-offer-mode .do-padel-access-launch,
body.do-padel-club-offer-mode .do-padel-launch,
body.do-padel-club-offer-mode .do-padel-launch-14,
/* AND THE REFERRAL SECTION WITH THEM. "Were you introduced by another DO→PADEL
   member?", its Member ID field and its "another 14 days on us" note are the
   ordinary public proposition too, and they conflict with a club's own shared
   window: a Club Offer member is not being offered 14 days, so they cannot be
   offered another 14. Hidden here, in the one rule that already hides the rest of
   that proposition, and nowhere else — the referral system itself is untouched
   and an ordinary public registration is byte-for-byte what it always was. */
body.do-padel-club-offer-mode .do-padel-introducer{display:none !important}
.do-padel-club-offer-note{display:none;margin:0 0 20px;padding:15px 16px 16px;border:1px solid rgba(139,197,46,.34);border-radius:16px;background:linear-gradient(180deg,rgba(139,197,46,.08) 0%,rgba(0,0,0,0) 66%);text-align:center}
body.do-padel-club-offer-mode .do-padel-club-offer-note[data-club-offer-ready="1"]{display:block}
.do-padel-club-offer-eyebrow{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:10.5px;letter-spacing:.22em;line-height:1.5;color:var(--gold);opacity:.92;margin:0 0 8px}
.do-padel-club-offer-head{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:13.5px;letter-spacing:.06em;line-height:1.6;color:var(--brand-green);margin:0 0 8px}
.do-padel-club-offer-copy{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;letter-spacing:.04em;line-height:1.75;color:var(--cream,#f6e6bc);opacity:.94;margin:0 0 6px}
.do-padel-club-offer-foot{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.05em;line-height:1.7;color:var(--muted);opacity:.9;margin:8px 0 0}
/* ── PROMOTION 1 RETIRED — THE REPLACEMENT NOTICE ────────────────────────────
   DISPLAY ONLY, AND NOTHING ELSE. Shown in place of the old Promotion 1 journey
   to somebody who opened a previously sent Promotion 1 link. It has no control,
   no field and no button: nothing here activates, sends, triggers or stores
   anything.

   IT REUSES WHAT IS ALREADY ON THE SITE. The coin is the existing
   /assets/do-padel-seal.png, reused unaltered, and the strapline is the
   established lockup — Together gold, We Are white, Stronger green — in the same
   .do-padel-launch-foot treatment the registration screen already uses. Only the
   coin's size and the notice heading are new, and the reveal rule is the note
   container's own display rule with the retired class in place of the club offer
   body class, so an ordinary arrival is byte-for-byte what it always was. */
.do-padel-promotion-1-retired[data-club-offer-ready="1"]{display:block}
.do-padel-promotion-1-retired-coin{display:block;width:84px;max-width:36%;height:auto;margin:0 auto 12px}
.do-padel-promotion-1-retired-head{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;line-height:1.55;color:var(--gold);margin:14px 0 10px}
/* ── "YOUR FULL 30 DAYS STARTS TODAY" — MEMBERSHIP CONFIRMED, CLUB OFFER ONLY ──
   Shown on the confirmation screen to a member who has just registered through a
   genuine club campaign, and to nobody else. Revealed by the SAME body class the
   Club Offer note above uses — set only after the server confirmed the campaign —
   so an ordinary public registration's confirmation screen is byte-for-byte what it
   always was. It states the member's own period, which is now measured from this
   moment. Presentation only: the 30 days were granted by the database, in the
   statement that created this membership. */
.do-padel-club-offer-started{display:none;margin:2px 0 14px;padding:12px 14px;border:1px solid rgba(139,197,46,.42);border-radius:14px;background:linear-gradient(180deg,rgba(139,197,46,.1) 0%,rgba(0,0,0,0) 70%);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:400;letter-spacing:.13em;text-transform:uppercase;line-height:1.65;color:var(--brand-green)}
body.do-padel-club-offer-mode .do-padel-club-offer-started{display:block}
/* ── THE ADDRESSED CODE ARRIVALS — TWO MODES, AND NOTHING SHARED ────────────
   A club representative opening ACTIVATE YOUR CLUB, and a club member opening the
   invitation their club sent them, have each already been told what this is about
   by the link they pressed. Neither is an ordinary public arrival, and neither is
   choosing between "member or new" — so each is shown its own recognition, its own
   short form, and nothing that belongs to the other journey or to the public one.

   THE CLASS IS THE WHOLE OF THE PRESENTATION, exactly as CLUB OFFER MODE above is.
   It is set only for an arrival whose ADDRESS carried the code, and it hides
   generic content and shortens the existing shared form — it adds no field, no
   endpoint, no screen and no authority. Without the class every screen is
   byte-for-byte what it has always been, which is every arrival with no code on the
   address.

   THE RECOGNITION BLOCK states three facts and only three: the club, the code, and
   that the code was recognised — all three written from the SERVER'S answer and
   never from the browser. */
.do-padel-code-recognised{margin:0 0 22px;padding:16px 16px 15px;border:1px solid rgba(214,177,87,.36);border-radius:16px;background:linear-gradient(180deg,rgba(214,177,87,.08) 0%,rgba(0,0,0,0) 70%);text-align:center}
.do-padel-code-club{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:16px;letter-spacing:.2em;line-height:1.5;color:var(--gold);margin:0 0 6px;text-transform:uppercase}
.do-padel-code-value{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:400;font-size:12.5px;letter-spacing:.28em;line-height:1.6;color:rgba(214,177,87,.72);margin:0 0 10px}
.do-padel-code-state{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:12px;letter-spacing:.18em;line-height:1.6;color:var(--brand-green);margin:0;text-transform:uppercase}
.do-padel-code-gift{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:400;font-size:12.5px;letter-spacing:.14em;line-height:1.8;color:var(--cream,#f6e6bc);margin:12px 0 0;text-transform:uppercase}
.do-padel-code-gift strong{font-weight:600;color:var(--brand-green)}
/* ONE — THE CLUB ACTIVATION ROUTE. The generic Member Access proposition, the
   Commercial Partner Preview line, the public 14 days, the referral offer, the
   DO→KEY® card, the public profile choice, the country / age pair and the whole
   "are you a member of a padel club?" question are all removed: none of them is
   being asked of the club representative activating their own club, whose club is
   already settled by the code they arrived on. What is left is Name, Position,
   Email and Phone. */
body.do-padel-code-club-mode #sampleRegMessage,
body.do-padel-code-club-mode .do-padel-launch,
body.do-padel-code-club-mode .do-padel-launch-14,
body.do-padel-code-club-mode .do-padel-access-launch,
body.do-padel-code-club-mode .do-padel-introducer,
body.do-padel-code-club-mode .do-padel-founder,
body.do-padel-code-club-mode #publicProfileSection,
body.do-padel-code-club-mode #doPadelPlayerClub,
body.do-padel-code-club-mode #register > .card > .row,
body.do-padel-code-club-mode #doPadelMemberBenefitLine,
/* The club representative QUESTION goes with them. It is not a question on this
   route: the code has already answered it, so the tick is held on and out of sight
   and only the one field this route still needs — Position — remains. */
body.do-padel-code-club-mode .do-padel-clubrep-q,
body.do-padel-code-club-mode .do-padel-clubrep-note,
body.do-padel-code-club-mode #doPadelClubRepCheckWrap,
body.do-padel-code-club-mode #doPadelClubRepFields label[for="clubName"],
body.do-padel-code-club-mode #doPadelClubRepFields #clubName,
body.do-padel-code-club-mode #doPadelClubRepFields #clubNameMsg,
body.do-padel-code-club-mode #doPadelClubRepFields label[for="clubEmail"],
body.do-padel-code-club-mode #doPadelClubRepFields #clubEmail,
body.do-padel-code-club-mode #doPadelClubRepFields #clubEmailMsg,
body.do-padel-code-club-mode #doPadelClubRepFields label[for="clubWebsite"],
body.do-padel-code-club-mode #doPadelClubRepFields #clubWebsite,
/* TWO — THE MEMBER ACTIVATION ROUTE. Name, Email and Phone. The club is settled by
   the code, so the club question is gone with the rest of the public proposition;
   the recognition block above states the gift in its place. */
body.do-padel-code-member-mode #sampleRegMessage,
body.do-padel-code-member-mode .do-padel-launch,
body.do-padel-code-member-mode .do-padel-launch-14,
body.do-padel-code-member-mode .do-padel-access-launch,
body.do-padel-code-member-mode .do-padel-introducer,
body.do-padel-code-member-mode .do-padel-founder,
body.do-padel-code-member-mode #publicProfileSection,
body.do-padel-code-member-mode #doPadelClubRep,
body.do-padel-code-member-mode #doPadelPlayerClub,
body.do-padel-code-member-mode #register > .card > .row,
body.do-padel-code-member-mode #doPadelMemberBenefitLine,
/* The club offer note names the club and prints the club's own joining window. The
   recognition block says the same thing more plainly and in the words the member
   was invited in, so on this route the note is not shown twice. */
body.do-padel-code-member-mode .do-padel-club-offer-note{display:none !important}
/* ── THE MEMBER ROUTE'S LOWER SECTION, READABLE ON A PHONE ──────────────────
   BRIGHTNESS ONLY. Same black, same gold, same green, same layout, same wording,
   same fields and same button: the colours below are the existing colours at a
   higher opacity, because at .52 and .6 on a phone in daylight the legal line,
   the website line and the footer beneath CLAIM MY 30 DAYS could not be read.
   Scoped to the member route so nothing else on the shared registration card,
   and no other screen, is touched. The inline styles they override are why these
   carry !important. */
body.do-padel-code-member-mode #register #regStatus + div{color:rgba(246,230,188,.88) !important;font-size:11px !important}
body.do-padel-code-member-mode #register #regStatus + div a{color:#e4c278 !important}
body.do-padel-code-member-mode #register .do-reg-site{color:rgba(232,203,134,.95) !important}
body.do-padel-code-member-mode #register .do-reg-powered{color:rgba(246,230,188,1)}
body.do-padel-code-member-mode #register .do-reg-powered::after{color:rgba(240,218,164,.95)}
/* AND THE BACKGROUND THEY SIT ON, LIFTED OFF PURE BLACK. A single soft gold wash
   behind the lower half of the card, painted under the content, so the section
   reads as lit rather than as a dark edge. No layout, spacing or size changes. */
body.do-padel-code-member-mode #register > .card{background-image:linear-gradient(to bottom,rgba(214,177,87,0) 52%,rgba(214,177,87,.055) 78%,rgba(214,177,87,.1) 100%),linear-gradient(180deg,rgba(16,12,7,.9),rgba(4,4,4,.94))}
/* The club representative fields themselves are revealed on the club route, because
   the tick that normally reveals them is not on screen to be pressed. */
body.do-padel-code-club-mode #doPadelClubRepFields{display:block}
/* NUMBER OF ACTIVE CLUB MEMBERS is asked on the club activation route and nowhere
   else, so it is hidden by default and revealed only here. Its help text is shown
   with it, and only with it. */
#doPadelClubActiveMembersWrap{display:none}
body.do-padel-code-club-mode #doPadelClubActiveMembersWrap{display:block}
body.do-padel-code-club-mode #doPadelClubActiveMembersHelp{display:block;margin:6px 0 0}
body.do-padel-code-club-mode #doPadelClubRep{border-color:transparent;background:none;padding-top:0;margin-top:0}
/* ── THE CLUB ACTIVATED SCREEN ──────────────────────────────────────────────
   The one thing a club must do next, in three numbered steps, with the invitation
   its members need on the clipboard. */
.do-padel-club-live{text-align:center}
.do-padel-club-live-head{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:16px;letter-spacing:.16em;line-height:1.5;color:var(--gold);margin:0 0 6px;text-transform:uppercase}
.do-padel-club-live-state{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:12.5px;letter-spacing:.18em;line-height:1.6;color:var(--brand-green);margin:0 0 22px;text-transform:uppercase}
.do-padel-club-live-call{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:14px;letter-spacing:.14em;line-height:1.6;color:var(--cream,#f6e6bc);margin:0 0 20px;text-transform:uppercase}
.do-padel-club-step{text-align:left;margin:0 0 18px;padding:0 0 18px;border-bottom:1px solid rgba(214,177,87,.14)}
.do-padel-club-step:last-of-type{border-bottom:none;padding-bottom:0}
.do-padel-club-step-n{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:12px;letter-spacing:.18em;line-height:1.6;color:var(--gold);margin:0 0 8px;text-transform:uppercase}
.do-padel-club-step-copy{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;letter-spacing:.04em;line-height:1.8;color:rgba(246,230,188,.86);margin:0}
.do-padel-club-live-note{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:12px;letter-spacing:.13em;line-height:1.8;color:var(--brand-green);margin:20px 0 0;padding:14px 14px 13px;border:1px solid rgba(139,197,46,.36);border-radius:14px;background:linear-gradient(180deg,rgba(139,197,46,.08) 0%,rgba(0,0,0,0) 70%);text-transform:uppercase}
.do-padel-club-live-entitlement{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.06em;line-height:1.8;color:var(--muted);margin:18px 0 0}
.do-padel-club-copybtn{margin-top:10px}
.do-padel-club-copystate{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:11px;letter-spacing:.16em;line-height:1.6;color:var(--brand-green);margin:8px 0 0;min-height:14px;text-transform:uppercase}
.do-padel-club-invite{width:100%;min-height:150px;margin-top:10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.7}
.do-padel-access-launch + .btn.do-padel-access-newbtn{margin-top:0}
body.do-padel-register-mode .btn.do-padel-access-newbtn{background:rgba(139,197,46,.08);border-color:rgba(139,197,46,.6);color:var(--brand-green)}
body.do-padel-register-mode .btn.do-padel-access-newbtn:hover{border-color:var(--brand-green);box-shadow:0 0 22px rgba(139,197,46,.18)}
/* ── DO→KEY® FOUNDER MEMBER — the choice offered underneath the DO→PADEL New
   Member Registration form. DO→PADEL ONLY: the registration form itself is shared
   with DO-VOLUTION, which never shows this, so the whole block is revealed by the
   same do-padel-register-mode the rest of the DO→PADEL branding on this screen
   uses. The card is the HORIZONTAL DO→KEY® Founder Member card artwork, used
   exactly as supplied at its own 1284×915 ratio — never cropped, stretched or
   altered — and it is a different thing from the full DO→KEY® advert that follows
   Playtomic. The tick reuses the established DO→KEY® control styling unchanged. */
.do-padel-founder{display:none;margin-top:24px;padding-top:20px;border-top:1px solid rgba(214,177,87,.15);text-align:center}
body.do-padel-register-mode .do-padel-founder{display:block}
.do-padel-founder-title{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);line-height:1.6;margin:0 0 14px}
.do-padel-founder-card{display:block;margin:0;padding:0;border:0;background:#000;border-radius:14px;overflow:hidden}
.do-padel-founder-card img{display:block;width:100%;height:auto;aspect-ratio:1284/915;border:0;border-radius:14px}
.do-padel-founder-copy{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.02em;line-height:1.75;color:var(--soft);opacity:.9;margin:16px 0 0}
/* DO-COIN is one word on the page as well as in the brand: it never breaks over
   two lines, whatever the column width happens to be. */
.do-padel-founder-copy .do-coin{white-space:nowrap}
.do-padel-founder-choice{margin-top:16px}
/* ── DO→PADEL LAUNCH MEMBERSHIP — THE PROPOSITION, ABOVE THE REGISTRATION FIELDS.
   DO→PADEL ONLY: the registration form itself is shared with DO-VOLUTION, which
   never shows this, so the block is revealed by the same do-padel-register-mode the
   rest of the DO→PADEL branding on this screen uses. Nothing about the existing
   opening journey changes and no new screen is introduced — this is a panel inside
   the page that is already there.

   DELIBERATELY COMPACT. It sits ABOVE the fields, so every value is set to state
   the offer and then get out of the way: small type, tight leading, one hairline
   between the two halves and no artwork. On a phone it costs a little over a third
   of the first screen, so Full Name is still reachable without hunting for it.

   No price appears anywhere in it, because nothing is charged during the launch
   period. The established brand palette only — black ground, gold, white, green. */
.do-padel-launch{display:none;margin:0 0 20px;padding:15px 16px 16px;border:1px solid rgba(139,197,46,.3);border-radius:16px;background:linear-gradient(180deg,rgba(139,197,46,.07) 0%,rgba(0,0,0,0) 62%);text-align:center}
body.do-padel-register-mode .do-padel-launch{display:block}
.do-padel-launch-head{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:400;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);line-height:1.5;margin:0}
.do-padel-launch-copy{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.015em;line-height:1.6;color:var(--soft);opacity:.9;margin:5px 0 0}
/* The second half of the offer — the introduction that earns another 14 days. The
   hairline is the only separation it needs; a second panel would double the height. */
.do-padel-launch-earn{margin-top:13px;padding-top:12px;border-top:1px solid rgba(214,177,87,.18)}
.do-padel-launch-earn .do-padel-launch-head{color:var(--brand-green)}
/* Together We Are Stronger, in the established treatment: Together gold, We Are
   white, Stronger green, and no full stop. */
.do-padel-launch-foot{margin:13px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;line-height:1.5}
/* Narrow phones: shave the padding and the type a touch further rather than let the
   panel grow, so the form below it keeps the same start position. */
@media (max-width:380px){
.do-padel-launch{padding:13px 13px 14px;margin-bottom:18px}
.do-padel-launch-head{font-size:11.5px;letter-spacing:.11em}
.do-padel-launch-copy{font-size:11px}
.do-padel-launch-foot{font-size:10px;letter-spacing:.12em}
}
/* ── THE OPTIONAL INTRODUCER MEMBER ID — "who introduced you?" ────────────────
   One small optional field on the page that is already there, DO→PADEL only, and
   never required: registration completes with it blank, with it filled, and with it
   wrong. It reuses the existing label / input / validation-msg styling unchanged. */
.do-padel-introducer{display:none;margin-top:22px;padding-top:18px;border-top:1px solid rgba(214,177,87,.15)}
body.do-padel-register-mode .do-padel-introducer{display:block}
.do-padel-introducer-q{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);line-height:1.6;margin:0 0 6px}
.do-padel-introducer-note{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.01em;line-height:1.55;color:#a99b78;margin:0 0 12px}
/* The live answer to what was typed. One line, one colour, no icon: green when the
   Member ID is a real member, gold when it is not yet recognised. */
.do-padel-introducer-msg{display:none;margin-top:8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.01em;line-height:1.5}
.do-padel-introducer-msg.is-visible{display:block}
.do-padel-introducer-msg.is-valid{color:var(--brand-green)}
.do-padel-introducer-msg.is-invalid{color:rgba(224,187,99,.9)}
/* ── ARRIVED BY INVITATION ────────────────────────────────────────────────────
   The same block, in the one case where the answer is already known: the invited
   person opened a member's own /join/DP-000025 link, so there is nothing to ask
   and nothing to type. The question is withdrawn (asking somebody a question you
   have already been given the answer to is what makes an interface feel careless)
   and the field becomes a stated fact — INTRODUCED BY MEMBER, and the Member ID
   beneath it, read-only.

   It is deliberately styled as a value rather than as a disabled input: the gold
   hairline and gold text of a filled field, no caret, no hover, and the brand
   green on the value itself so it reads as something confirmed. It remains a real
   input with the same id and name, so the existing submission path carries it
   exactly as it carries a typed one. */
/* THE LOCKED CLUB NAME on the member benefit registration form, in the same
   settled treatment the locked introducer field already uses: it reads as a fact
   that has been answered, not as a field waiting to be filled in. */
.do-padel-member-club[hidden]{display:none !important}
.do-padel-member-club input#doPadelMemberClubName{background:rgba(139,197,46,.05);border-color:rgba(139,197,46,.42);color:var(--brand-green);letter-spacing:.1em;font-weight:600;cursor:default;caret-color:transparent}
.do-padel-member-club input#doPadelMemberClubName:focus{outline:none;border-color:rgba(139,197,46,.42);box-shadow:none}
.do-padel-introducer.is-invited .do-padel-introducer-q{display:none}
.do-padel-introducer.is-invited input#introducerMemberId{background:rgba(139,197,46,.05);border-color:rgba(139,197,46,.42);color:var(--brand-green);letter-spacing:.14em;font-weight:600;cursor:default;caret-color:transparent}
.do-padel-introducer.is-invited input#introducerMemberId:focus{outline:none;border-color:rgba(139,197,46,.42);box-shadow:none}
/* ── DO YOU REPRESENT A PADEL CLUB? ───────────────────────────────────────────
   One optional tick on the registration page that is already there, DO→PADEL only
   (revealed by the same do-padel-register-mode as the rest of the DO→PADEL
   treatment on this screen, so the shared form is unchanged for DO-VOLUTION).

   OFF BY DEFAULT, AND OFF MEANS INVISIBLE: with the tick unselected the four club
   fields are not in the layout at all and the form is exactly the form it was. The
   tick itself reuses the existing .do-key-check control, and the revealed fields
   reuse the existing label / input / select / validation-msg styling unchanged, so
   nothing new is introduced to the premium black-and-gold treatment. */
.do-padel-clubrep{display:none;margin-top:22px;padding-top:18px;border-top:1px solid rgba(214,177,87,.15)}
body.do-padel-register-mode .do-padel-clubrep{display:block}
.do-padel-clubrep-q{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);line-height:1.6;margin:0 0 10px}
.do-padel-clubrep-note{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.01em;line-height:1.55;color:#a99b78;margin:0 0 12px}
.do-padel-clubrep-fields{display:none;margin-top:16px}
.do-padel-clubrep.is-open .do-padel-clubrep-fields{display:block}
/* The required marker on the three required club fields, in the page's own gold. */
.do-padel-clubrep-fields .do-req{color:var(--gold);opacity:.75;margin-left:1px}
/* ── ARE YOU CURRENTLY A MEMBER OF A PADEL CLUB? ───────────────────────────────
   The player's own club, asked on the registration page that is already there and
   DO→PADEL only (revealed by the same do-padel-register-mode as everything else on
   this screen, so the shared form is unchanged for DO-VOLUTION).

   A DIFFERENT QUESTION FROM THE ONE ABOVE, AND DELIBERATELY LOOKS LIKE ONE. The
   block above asks whether somebody SPEAKS for a club; this asks where they PLAY.
   The two sit under their own hairline rules with their own headings so neither can
   be mistaken for the other, and they share no field.

   TWO TAPS AT MOST, AND EVERY EXTRA FIELD IS REVEALED RATHER THAN PRESENT. The
   answer is one of two large touch targets; only what that answer needs appears
   after it, so the form is never longer than the member's own path through it. The
   pills, the fields and the validation styling are the existing premium
   black-and-gold treatment — nothing new is introduced. */
.do-padel-playerclub{display:none;margin-top:22px;padding-top:18px;border-top:1px solid rgba(214,177,87,.15)}
body.do-padel-register-mode .do-padel-playerclub{display:block}
/* NOT ASKED OF A CLUB REPRESENTATIVE. "Are you currently a member of a padel
   club?", the postcode and the local-club contact permission are the ordinary
   member's club-DISCOVERY questions: they exist to find a player a club to play
   at. Somebody registering as a club's owner, director, manager or authorised
   representative has already told us which club they are here for, so the block
   is hidden for them and nothing beneath it is asked, validated or sent. The rule
   is one class on the existing block and nothing else: unticked — which is how the
   page loads and the only state an ordinary member ever sees — the questions are
   exactly where they were, and DO-VOLUTION never renders this block at all. */
body.do-padel-register-mode .do-padel-playerclub.is-clubrep-hidden{display:none}
.do-padel-playerclub-q{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);line-height:1.6;margin:0 0 10px}
/* The two revealed fields are introduced by their own question above them, so their
   form labels exist for assistive technology only and are taken out of the layout
   rather than repeated on screen. */
.do-a11y-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.do-padel-playerclub-note{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.01em;line-height:1.55;color:#a99b78;margin:0 0 12px}
/* THE YES / NO PAIR. Two equal targets, side by side, comfortably tappable on the
   smallest phone. Neither is selected when the page loads — an unanswered question
   must never look answered. */
.do-padel-yesno{display:flex;gap:10px;margin:0}
.do-padel-yesno-opt{flex:1 1 0;position:relative;display:flex;align-items:center;justify-content:center;min-height:50px;padding:13px 10px;border:1px solid rgba(214,177,87,.24);border-radius:14px;background:rgba(0,0,0,.35);cursor:pointer;transition:border-color .3s,background .3s,color .3s;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);text-align:center;-webkit-tap-highlight-color:transparent}
.do-padel-yesno-opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.do-padel-yesno-opt:hover{border-color:rgba(214,177,87,.4)}
.do-padel-yesno-opt.is-on{border-color:rgba(139,197,46,.55);background:rgba(139,197,46,.07);color:var(--brand-green)}
.do-padel-yesno-opt input:focus-visible+.do-padel-yesno-label{outline:1px solid rgba(214,177,87,.6);outline-offset:6px;border-radius:4px}
/* Everything the answer leads to. Closed is not merely hidden — it is not in the
   layout at all, so an unanswered form is exactly as short as it was. */
.do-padel-playerclub-reveal{display:none;margin-top:18px}
.do-padel-playerclub-reveal.is-open{display:block}
.do-padel-playerclub-sub{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);line-height:1.6;margin:0 0 8px;opacity:.92}
.do-padel-playerclub-help{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.01em;line-height:1.55;color:#a99b78;margin:0 0 10px}
/* THE CLUB SEARCH, AGAINST THE DIRECTORY THAT ALREADY EXISTS. The results panel is
   the same black-and-gold surface as a field, so the search reads as part of the
   form rather than as a component dropped into it. */
.do-padel-clubfind-results{display:none;margin-top:8px;border:1px solid rgba(214,177,87,.22);border-radius:14px;background:rgba(0,0,0,.5);overflow:hidden}
.do-padel-clubfind-results.is-open{display:block;max-height:266px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.do-padel-clubfind-result{display:block;width:100%;text-align:left;padding:12px 14px;background:none;border:none;border-bottom:1px solid rgba(214,177,87,.12);cursor:pointer;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;transition:background .25s}
.do-padel-clubfind-result:last-child{border-bottom:none}
.do-padel-clubfind-result:hover,.do-padel-clubfind-result:focus{background:rgba(214,177,87,.08);outline:none}
.do-padel-clubfind-name{display:block;font-size:13.5px;color:#f5e6bc;letter-spacing:.02em;line-height:1.4}
/* The place, which is what tells two clubs of the same name apart. */
.do-padel-clubfind-place{display:block;margin-top:3px;font-size:11px;color:#a99b78;letter-spacing:.04em;line-height:1.4}
.do-padel-clubfind-msg{display:none;margin-top:8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.01em;line-height:1.5;color:#a99b78}
.do-padel-clubfind-msg.is-visible{display:block}
/* THE CHOSEN CLUB, SHOWN AS A CONFIRMED FACT rather than as a filled-in field: the
   brand green on the club's own name, the same treatment an invitation's Member ID
   gets, because both are something settled rather than something being typed. */
.do-padel-clubfind-chosen{display:none;margin-top:10px;padding:13px 14px;border:1px solid rgba(139,197,46,.42);border-radius:14px;background:rgba(139,197,46,.05)}
.do-padel-clubfind-chosen.is-open{display:block}
.do-padel-clubfind-chosen-name{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;font-weight:600;letter-spacing:.02em;color:var(--brand-green);line-height:1.4}
.do-padel-clubfind-chosen-place{margin-top:3px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.04em;color:#a99b78;line-height:1.4}
.do-padel-textlink{display:inline-block;margin-top:12px;padding:0;background:none;border:none;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10.5px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:rgba(214,177,87,.62);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.do-padel-textlink:hover{color:rgba(214,177,87,.9)}
.do-padel-playerclub-unlisted{display:none;margin-top:14px}
.do-padel-playerclub-unlisted.is-open{display:block}
/* The consent question, set apart from the postcode above it by its own hairline,
   because it is a permission and not another detail. */
.do-padel-playerclub-consent{margin-top:18px;padding-top:16px;border-top:1px solid rgba(214,177,87,.12)}
/* Member Access watermark — the approved premium DO→PADEL racket artwork used as a
   refined branding element that fills the black space the page already leaves below
   the panel, so the screen reads as balanced rather than top-heavy. Anchored to the
   section's own bottom edge (top:100%) and then lifted 20px, so the top of the artwork
   tucks in under the card. It paints strictly behind the card: the section is isolated
   and the watermark carries z-index:-1, so nothing of the racket can ever show over the
   logo, email field or buttons. The isolation is what makes that safe — without it the
   z-index:-1 would resolve against the root stacking context, where body's own opaque
   background paints later and would hide the racket completely.
   Upright (the source artwork needs no rotation) and centred on the 430px column.
   The height is capped against the viewport so the watermark always fits the space
   already reserved beneath the card and never adds scroll on short screens. The
   artwork sits on its own black ground: mix-blend-mode:screen means that ground
   contributes nothing at all, and a soft elliptical vignette dissolves the artwork's
   rectangular edges completely, so the racket emerges out of the page's black rather
   than reading as a pasted image. Attached to a pseudo-element inside this section,
   so .screen{display:none} keeps it off every other DO→PADEL page.
   The three geometry values (height, the gap under the panel, the 20px lift) are
   declared once on the section so the artwork and the footer beneath it are laid
   out from the SAME numbers — the footer simply clears the racket's full measured
   height and can therefore never overlap it at any viewport size.
   The pseudo-element hangs off the PANEL rather than the section, so the racket
   keeps the exact position it has always had (the panel's bottom edge is where
   the section used to end) while the section itself is free to grow downwards to
   carry the footer underneath.
   The artwork is painted 22% larger than its frame (scale about its own centre),
   so it reads bigger while its centre, the frame, and everything laid out from
   the three geometry values — the footer and the black ground — stay put.
   It is also shifted down by 20% of the frame height in the same transform, so
   only the artwork moves; the footer and black ground keep their positions. */
body.do-padel-register-mode #doPadelMemberAccess{position:relative;isolation:isolate;--do-access-wm-h:clamp(140px,calc(115vh - 644px),391px);--do-access-wm-gap:clamp(16px,3vh,32px);--do-access-wm-lift:20px;--do-access-group-raise:150px;--do-access-foot-space:calc(179px + env(safe-area-inset-bottom));--do-access-group-drop:calc((var(--do-access-foot-space) + var(--do-access-wm-lift) + var(--do-access-group-raise) - var(--do-access-wm-gap) - var(--do-access-wm-h) * .3028) / 2)}
/* The racket + footer group is then moved down as one piece by --do-access-group-drop,
   which centres it in the black space between the panel's bottom border and the foot
   of the page: the racket's visible top sits .3028 of its frame height below the frame
   top (after the lift, raise and scale), and --do-access-foot-space is the black space
   left under the footer. Moved with transform/relative offset only, so no layout,
   page height or black ground changes. */
@media(max-width:600px){body.do-padel-register-mode #doPadelMemberAccess{--do-access-foot-space:calc(231px + env(safe-area-inset-bottom))}}
body.do-padel-register-mode #doPadelMemberAccess > .card{position:relative}
body.do-padel-register-mode #doPadelMemberAccess > .card::after{content:"";position:absolute;top:100%;left:50%;margin-top:var(--do-access-wm-gap);height:var(--do-access-wm-h);width:calc(var(--do-access-wm-h) * .4622);transform:translate(-50%,calc(var(--do-access-wm-h) * .2 - var(--do-access-wm-lift) - var(--do-access-group-raise) + var(--do-access-group-drop))) scale(1.22);background:center/contain no-repeat;opacity:.68;filter:brightness(1.38) contrast(1.06) saturate(1.14);mix-blend-mode:screen;pointer-events:none;z-index:-1;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 0 80%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 0 80%,transparent 100%)}
/* PERFORMANCE — the racket artwork is the single heaviest asset this page can ask
   for and it is purely decorative, so the image URL is withheld until the class
   below is set, one frame after the member access form has painted. The frame the
   artwork occupies is reserved by the rule above whether the image has arrived or
   not, so the form never waits on it and nothing shifts when it lands.
   The artwork itself is the same file, requested through the Netlify Image CDN at
   the size it is actually painted at (the artwork is at most ~221px wide, so 680px
   covers a 3x display) and in whatever modern format the visitor's browser accepts.
   That turns a 2.6MB source PNG into a small fraction of the bytes for an identical
   result on screen — the file on disk is untouched and nothing else that uses it is
   affected. */
body.do-padel-art-ready.do-padel-register-mode #doPadelMemberAccess > .card::after{background-image:url('/.netlify/images?url=%2Fassets%2Fdo-padel-racket-hero.png&w=680&q=82')}
/* ── DO→PADEL MEMBER ACCESS — BRIGHTNESS / COLOUR REFRESH ───────────────────
   A pure visual lift of this one screen: nothing here changes a word, a font, a
   size, a position or a behaviour. The background stays black — only the gold,
   green, white and decorative elements sitting on it are made brighter, cleaner
   and more vibrant.
   The brand tokens are re-declared on the section itself, so every gold heading,
   label, wordmark, divider, border and body line inside this screen inherits the
   brighter value from one place, and nothing outside this section can see them. */
body.do-padel-register-mode #doPadelMemberAccess{
--gold:#f2d489;--brand-gold:#f2d489;--brand-green:#a8e83e;
--soft:#fdf7e6;--muted:#dccfab;--line:rgba(242,212,137,.44)
}
/* The panel edge and its inner light — crisper against the black, same geometry. */
body.do-padel-register-mode #doPadelMemberAccess > .card{box-shadow:0 20px 50px rgba(0,0,0,.55),inset 0 0 44px rgba(242,212,137,.06)}
/* Headings, labels and the DO→PADEL lockup read at full strength rather than
   through the veil the shared styles apply. */
body.do-padel-register-mode #doPadelMemberAccess label{opacity:1;color:var(--gold)}
body.do-padel-register-mode #doPadelMemberAccess h2{color:var(--gold);text-shadow:0 0 18px rgba(242,212,137,.16)}
body.do-padel-register-mode #doPadelMemberAccess .small{opacity:1 !important}
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-tag{color:var(--brand-green);text-shadow:0 0 16px rgba(168,232,62,.24)}
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-wm{text-shadow:0 0 22px rgba(242,212,137,.14)}
body.do-padel-register-mode #doPadelMemberAccess .validation-msg{color:rgba(242,212,137,.82)}
body.do-padel-register-mode #doPadelMemberAccess .status{color:var(--muted)}
/* The fine gold divider lines and their labels. */
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-divider{color:rgba(242,212,137,.9)}
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-divider::before,
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-divider::after{background:linear-gradient(90deg,transparent,rgba(168,232,62,.8),transparent)}
/* Fields — same size, same position, same behaviour; brighter edge and a clearly
   legible placeholder so each field is unmistakably there. */
body.do-padel-register-mode #doPadelMemberAccess input{border-color:rgba(242,212,137,.6);color:#fdf3d6;box-shadow:inset 0 0 18px rgba(242,212,137,.09)}
body.do-padel-register-mode #doPadelMemberAccess input::placeholder{color:rgba(242,212,137,.62)}
body.do-padel-register-mode #doPadelMemberAccess input:focus{border-color:rgba(242,212,137,.92);box-shadow:0 0 22px rgba(242,212,137,.26),inset 0 0 18px rgba(242,212,137,.1)}
/* THE TWO CONTINUE BUTTONS — the brown/bronze gradient is replaced with the rich
   DO→PADEL green fill. Size, shape, radius, position, text and behaviour are all
   inherited from .btn and untouched; only the fill and the label colour change.
   The fill is the deep, premium end of the DO→PADEL green family rather than the
   bright lime end: the same hue the PADEL wordmark carries, taken down in
   lightness so it reads as sophisticated rather than fluorescent, while the
   four-stop gradient (plus the ::before sheen and ::after top hairline below)
   keeps the dimensional lift so the buttons never go flat. The edge, the glow and
   every hover/press state are deliberately left exactly as they were.
   The label is the page's established warm DO→PADEL gold — the same --gold token
   the headings, labels and dividers on this screen use — which clears 4.5:1
   against the fill behind the text, helped by the existing dark shadow. */
body.do-padel-register-mode #doPadelMemberAccess #doPadelMemberEmailBtn,
body.do-padel-register-mode #doPadelMemberAccess #doPadelPartnerCodeBtn{
background:linear-gradient(175deg,#5f8825 0%,#49681d 42%,#385214 72%,#2d4210 100%);
border-color:rgba(197,247,116,.72);
color:var(--gold);
text-shadow:0 1px 3px rgba(18,42,4,.45);
box-shadow:0 10px 28px rgba(0,0,0,.35),0 4px 18px rgba(139,197,46,.28),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.22)
}
body.do-padel-register-mode #doPadelMemberAccess #doPadelMemberEmailBtn::before,
body.do-padel-register-mode #doPadelMemberAccess #doPadelPartnerCodeBtn::before{background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 46%,rgba(0,0,0,.1) 100%)}
body.do-padel-register-mode #doPadelMemberAccess #doPadelMemberEmailBtn::after,
body.do-padel-register-mode #doPadelMemberAccess #doPadelPartnerCodeBtn::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent)}
body.do-padel-register-mode #doPadelMemberAccess #doPadelMemberEmailBtn:hover,
body.do-padel-register-mode #doPadelMemberAccess #doPadelPartnerCodeBtn:hover{border-color:rgba(212,252,140,.9);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 28px rgba(139,197,46,.34),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.22)}
/* REGISTER AS A NEW MEMBER stays the SECONDARY OUTLINE button — never filled.
   Its green border and green label are simply brightened into the same family as
   the two filled buttons above. Size, position and behaviour unchanged. */
body.do-padel-register-mode #doPadelMemberAccess .btn.do-padel-access-newbtn{
background:transparent;
border-color:rgba(168,232,62,.9);
color:#b6ef4e;
text-shadow:0 0 14px rgba(168,232,62,.22);
box-shadow:0 6px 18px rgba(0,0,0,.28)
}
body.do-padel-register-mode #doPadelMemberAccess .btn.do-padel-access-newbtn::before{background:none}
body.do-padel-register-mode #doPadelMemberAccess .btn.do-padel-access-newbtn::after{background:linear-gradient(90deg,transparent,rgba(168,232,62,.34),transparent)}
body.do-padel-register-mode #doPadelMemberAccess .btn.do-padel-access-newbtn:hover{background:transparent;border-color:#c2f566;box-shadow:0 0 24px rgba(168,232,62,.24)}
/* ── THE FOOTER, UNDERNEATH THE RACKET ──────────────────────────────────────
   The established POWERED BY DO→?® footer used everywhere else on DO→PADEL,
   unchanged in markup, wording and styling — its legal line comes from the shared
   .do-padel-powered::after rule. It sits last in the section, so the page reads
   FORM → RACKET → FOOTER, and its top margin clears the racket's full measured
   height plus its own breathing space, so the two can never meet. */
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-footer{
margin-top:calc(var(--do-access-wm-gap) + var(--do-access-wm-h) - var(--do-access-wm-lift) + clamp(26px,4.5vh,44px) - var(--do-access-group-raise));
color:rgba(242,212,137,.88)
}
/* ── TRUE-BLACK GROUND UNDER THE PANEL ─────────────────────────────────────
   The racket artwork carries its own black ground, and the page behind it is a
   warm near-black gradient with a soft gold glow, so that ground read as a darker
   patch around the racket. This lays a full-width #000 backdrop from the panel's
   bottom edge down to the foot of the page, so the racket's black and the page's
   black are the same black and the patch disappears. It fades in softly from
   transparent at the panel edge to solid black just as the racket's visible
   ground begins, so the step into the lower section is a clean gradient rather
   than a line. Painted from the footer (made a positioning box only — its own
   layout is untouched) and measured back up to the panel with the same numbers
   that place the footer, at z-index:-2 so it sits beneath the racket (-1) inside
   the section's isolated group; the racket's screen blend therefore lands on
   pure black. It reaches down exactly the .app bottom padding, so it never adds
   scroll, and paints nothing on any other screen. */
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-footer{position:relative;top:var(--do-access-group-drop);--do-access-ground-fade:max(32px,calc(var(--do-access-wm-gap) - var(--do-access-wm-lift) + var(--do-access-wm-h) * .12))}
body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-footer::before{content:"";position:absolute;left:50%;width:100vw;transform:translateX(-50%);top:calc(-1 * (var(--do-access-wm-gap) + var(--do-access-wm-h) - var(--do-access-wm-lift) + clamp(26px,4.5vh,44px) - var(--do-access-group-raise)) - var(--do-access-group-drop));bottom:calc(-1 * (160px + env(safe-area-inset-bottom)) + var(--do-access-group-drop));background:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 var(--do-access-ground-fade));pointer-events:none;z-index:-2}
@media(max-width:600px){body.do-padel-register-mode #doPadelMemberAccess .do-padel-access-footer::before{bottom:calc(-1 * (212px + env(safe-area-inset-bottom)) + var(--do-access-group-drop))}}
/* ── DO→PADEL NEW MEMBER REGISTRATION — THE MEMBER ACCESS DESIGN LANGUAGE ─────
   New Member Registration is reached from the same /dopadel/register route as
   Member Access, one tap apart, so the two must read as one product rather than
   two. Everything below is the treatment declared for Member Access directly
   above, pointed at the registration form: the same brighter DO→PADEL tokens
   from one place, black field interiors, a fine gold field edge, gold labels,
   crisp true-white supporting and entered text, and green kept back for focus
   and action alone. Nothing is invented here that Member Access does not
   already do.

   PRESENTATION ONLY, AND DO→PADEL ONLY. The registration form is SHARED with
   DO-VOLUTION, so every rule is scoped to body.do-padel-register-mode #register
   and the form is pixel-for-pixel unchanged everywhere else. No field, option,
   required status, validation rule or submission behaviour is touched. */
body.do-padel-register-mode #register{
--gold:#f2d489;--brand-gold:#f2d489;--brand-green:#a8e83e;
--soft:#fdf7e6;--muted:#dccfab;--line:rgba(242,212,137,.44)
}
body.do-padel-register-mode #register > .card{box-shadow:0 20px 50px rgba(0,0,0,.55),inset 0 0 44px rgba(242,212,137,.06)}
body.do-padel-register-mode #register h2{color:var(--gold);text-shadow:0 0 18px rgba(242,212,137,.16)}
body.do-padel-register-mode #register label{opacity:1;color:var(--gold)}
body.do-padel-register-mode #register .do-padel-access-tag{color:var(--brand-green);text-shadow:0 0 16px rgba(168,232,62,.24)}
body.do-padel-register-mode #register .do-padel-access-wm{text-shadow:0 0 22px rgba(242,212,137,.14)}
body.do-padel-register-mode #register .validation-msg{color:rgba(242,212,137,.82)}
body.do-padel-register-mode #register .status{color:var(--muted)}
/* THE FIELDS. The same black interior and fine gold outline the EMAIL ADDRESS
   and ACCESS CODE fields carry on Member Access — same size, same radius, same
   position, same behaviour, only the edge, the entered text and the placeholder
   are brought into line. Never filled or outlined in bright green. */
body.do-padel-register-mode #register input,
body.do-padel-register-mode #register select{border-color:rgba(242,212,137,.6);color:#FFFFFF;box-shadow:inset 0 0 18px rgba(242,212,137,.09)}
body.do-padel-register-mode #register input::placeholder{color:rgba(242,212,137,.62)}
body.do-padel-register-mode #register select option{background:#0a0806;color:#FFFFFF}
body.do-padel-register-mode #register input:-webkit-autofill,
body.do-padel-register-mode #register select:-webkit-autofill{-webkit-text-fill-color:#FFFFFF !important}
/* Green is the interaction accent and nothing else: it appears on the field the
   member is actually in, then gets out of the way again. */
body.do-padel-register-mode #register input:focus,
body.do-padel-register-mode #register select:focus{border-color:rgba(168,232,62,.85);box-shadow:0 0 22px rgba(139,197,46,.24),inset 0 0 18px rgba(242,212,137,.1)}
/* The dial-code prefix is the left half of the mobile field, so it carries the
   same edge and inner light as the input joined to it. Styled inline in the
   markup, which is why these three declarations have to win explicitly. */
body.do-padel-register-mode #register #phonePrefix{border-color:rgba(242,212,137,.6) !important;color:var(--gold) !important;box-shadow:inset 0 0 18px rgba(242,212,137,.09) !important}
/* TRUE WHITE. Every line on this page that is meant to be white is #FFFFFF at
   full strength — no cream, no veil, no reduced opacity — so it reads cleanly
   against the black. Gold and green copy is deliberately left exactly as it is. */
body.do-padel-register-mode #register .do-padel-launch-copy,
body.do-padel-register-mode #register .do-padel-founder-copy,
body.do-padel-register-mode #register .do-padel-introducer-note,
body.do-padel-register-mode #register .do-padel-clubrep-note,
body.do-padel-register-mode #register .do-padel-playerclub-note,
body.do-padel-register-mode #register .do-padel-playerclub-help,
body.do-padel-register-mode #register .do-key-check-label{color:#FFFFFF;opacity:1}
/* The DO→PADEL lockup sits inside running sentences here, so it is given a
   little air on either side and can never touch the word before or after it. */
body.do-padel-register-mode #register .do-padel-launch-copy .wm,
body.do-padel-register-mode #register .do-padel-playerclub-help .wm,
body.do-padel-register-mode #register .do-padel-introducer-q .wm{margin:0 .12em}
/* THE CONTINUE BUTTON. The very same button, one tap later in the very same
   journey, so it carries the very same treatment the two CONTINUE buttons on
   Member Access already have — the deep, premium end of the DO→PADEL green
   family with the page's warm gold label. Width, height, radius, padding,
   position and every press/hover behaviour are inherited from .btn and are
   exactly as they were; only the fill, the edge, the label colour and the glow
   are brought into line. Green here is the important action, used once. */
body.do-padel-register-mode #register #toStandBtn{
background:linear-gradient(175deg,#5f8825 0%,#49681d 42%,#385214 72%,#2d4210 100%);
border-color:rgba(197,247,116,.72);
color:var(--gold);
text-shadow:0 1px 3px rgba(18,42,4,.45);
box-shadow:0 10px 28px rgba(0,0,0,.35),0 4px 18px rgba(139,197,46,.28),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.22)
}
body.do-padel-register-mode #register #toStandBtn::before{background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 46%,rgba(0,0,0,.1) 100%)}
body.do-padel-register-mode #register #toStandBtn::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent)}
body.do-padel-register-mode #register #toStandBtn:hover{border-color:rgba(212,252,140,.9);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 28px rgba(139,197,46,.34),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.22)}
/* The website line: the DO→PADEL domain on the DO→PADEL page, the DO-VOLUTION
   one everywhere else. Both are inline-styled in the shared markup. */
body.do-padel-register-mode #register .do-reg-site-do{display:none !important}
body.do-padel-register-mode #register .do-reg-site-padel{display:inline-block !important}
/* THE POWERED BY LINE AND ITS LEGAL LINE. The shared footer component, hidden
   for DO-VOLUTION (the card is the SHARED registration form) and shown here,
   closing the page directly under do-padel.com. It keeps the site-wide
   treatment; only the gap above it is tightened, because here it follows a line
   of text rather than a full section, and the footer must stay understated. */
.do-reg-powered{display:none}
body.do-padel-register-mode #register .do-reg-powered{display:block;margin-top:11px}
/* THE COPYRIGHT LINE STAYS ON ONE LINE. The shared rule already sets
   white-space:nowrap, so it can never wrap; on a narrow phone the risk is the
   opposite one — an unwrappable line running wider than the card. The type
   scales down with the viewport instead, and only downwards: it is capped at the
   8.5px every other footer on the site uses, so on any normal screen this line is
   identical to the one everywhere else, and it shrinks a fraction of a pixel at a
   time below roughly 360px rather than ever breaking in two. */
body.do-padel-register-mode #register .do-reg-powered::after{font-size:clamp(6.8px,2.2vw,8.5px)}
/* FOOTER LEGIBILITY. The three closing lines were sitting a little too far back to
   be read comfortably on a phone, the legal line most of all. Each is lifted by
   roughly 13% — the only thing that changes is how much of the gold comes through.
   THE HUE, THE SIZE, THE WEIGHT, THE SPACING, THE LAYOUT AND THE ORDER ARE ALL
   EXACTLY AS THEY WERE: same rgb(214,177,87), same type, same clamp above, same
   nowrap, so the copyright line still cannot wrap and the footer stays subdued and
   subordinate to everything above it. .60 → .69, .68 → .77, .42 → .48. The domain
   link is styled inline in the SHARED registration markup, which is why that one
   declaration has to win explicitly; nothing outside the DO→PADEL context sees it. */
body.do-padel-register-mode #register .do-reg-site-padel{color:rgba(214,177,87,.69) !important}
body.do-padel-register-mode #register .do-reg-powered{color:rgba(214,177,87,.77)}
body.do-padel-register-mode #register .do-reg-powered::after{color:rgba(214,177,87,.48)}
/* ── THE BOTTOM OF THE REGISTRATION FORM — BRIGHTNESS ONLY ───────────────────
   THE PROBLEM. From BECOME A DO→KEY® FOUNDER MEMBER downwards the page fell away:
   the gold went dusty, the hairlines and the tick's edge all but disappeared, and
   the legal and footer lines sat too far back to read comfortably. The upper half
   of the form is crisp; the lower half looked unfinished beside it.

   WHAT THIS IS, AND ALL IT IS. Brightness and contrast, on the elements that are
   already there. Nothing is restructured, resized, reordered, added or removed:
   no new element, no decoration, no gradient, no card, no effect and no content.
   Every declaration below changes a colour or an alpha and nothing else, and the
   premium black ground is untouched.

   THE GOLD IS THE PAGE'S OWN BRIGHT GOLD, 242/212/137 — the same value the
   registration fields above already use for their lit edges — so the bottom of
   the form is brought INTO LINE with the top rather than given a look of its own.
   The green is the established brand green, strengthened only where it already
   signals a chosen state.

   Scoped to body.do-padel-register-mode #register, so DO-VOLUTION's copy of this
   shared form, and every other screen carrying these classes, are unaffected. */

/* The hairline that opens the section, and the section's own gold title. */
body.do-padel-register-mode #register .do-padel-founder{border-top-color:rgba(242,212,137,.34)}
body.do-padel-register-mode #register .do-padel-founder-title{color:#f2d489}

/* THE FOUNDER MEMBER TICK. Its edge and its box were the least legible details on
   the page; both are the same shapes at the same sizes, simply visible now. The
   chosen state's green is strengthened, because that is the one thing on this part
   of the form that reports a decision. */
body.do-padel-register-mode #register .do-key-check{border-color:rgba(242,212,137,.42)}
body.do-padel-register-mode #register .do-key-check:hover{border-color:rgba(242,212,137,.62)}
body.do-padel-register-mode #register .do-key-box{border-color:rgba(242,212,137,.68)}
body.do-padel-register-mode #register .do-key-check.is-on{border-color:rgba(168,232,62,.8)}

/* The registration status line, which has to be readable the moment it speaks. */
body.do-padel-register-mode #register .status{color:rgba(255,255,255,.74)}

/* THE LEGAL LINE AND THE THREE CLOSING LINES. Still understated and still
   subordinate to everything above them — only how much of the gold comes through
   changes. The Privacy Policy and Terms links are lifted furthest, because they
   are the two things on the line a member may actually need to press. */
body.do-padel-register-mode #register .do-reg-legal{color:rgba(242,212,137,.8) !important}
body.do-padel-register-mode #register .do-reg-legal a{color:rgba(242,212,137,.95) !important}
body.do-padel-register-mode #register .do-reg-site-padel{color:rgba(242,212,137,.92) !important}
body.do-padel-register-mode #register .do-reg-powered{color:rgba(242,212,137,.88)}
body.do-padel-register-mode #register .do-reg-powered::after{color:rgba(242,212,137,.66)}
/* ══ DO→PADEL™ MEMBERSHIP CONFIRMATION ══════════════════════════════════════
   The welcome copy keeps the exact typography this screen has always used — the
   values are lifted straight off the inline styles they replace, so the greeting
   and the body lines are pixel-for-pixel what they were; only the words changed.
   Everything is scoped to #doPadelRegConfirm so no other screen is touched. */
#doPadelRegConfirm .do-padel-confirm-greeting{text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:400;letter-spacing:.14em;font-size:18px;line-height:1.5;margin:0 0 16px}
/* MEMBER ID · DP-0000XX — added beneath the welcome, and nothing else on this screen
   is altered. It is deliberately quieter than the greeting above it (a little under
   60% of its size, and in the brand's muted gold rather than the greeting's full
   strength) but it is not a footnote: this is the number the member will quote to
   somebody they introduce, so it keeps a readable size and generous tracking. The
   size and tracking are set so the line also measures NARROWER than the shortest
   realistic greeting it can sit under ("Welcome, Bob.") — measured in the browser,
   not estimated — so it reads as secondary by width as well as by weight. When it is
   shown the greeting's own bottom margin closes up, so the two read as one pair
   rather than as two separate statements; when it is hidden the greeting keeps the
   exact 16px it has always had. */
#doPadelRegConfirm .do-padel-confirm-memberid{text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:10.5px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;color:rgba(214,177,87,.82);margin:0 0 16px}
#doPadelRegConfirm .do-padel-confirm-memberid-dot{color:var(--brand-gold);opacity:.8;margin:0 .5em;font-weight:400}
#doPadelRegConfirm .do-padel-confirm-greeting:has(+ .do-padel-confirm-memberid:not([hidden])){margin-bottom:9px}
#doPadelRegConfirm .do-padel-confirm-line{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;letter-spacing:.03em;line-height:1.7;color:var(--soft);opacity:.9;margin:0 0 10px}
/* The closing lockup carries the brand's own gold / neutral / green, so it is read
   at full strength rather than through the body copy's .9 veil. */
#doPadelRegConfirm .do-padel-confirm-lockup{margin:16px 0 0;opacity:1}
/* The paddle. The artwork is the asset exactly as supplied — one <img> at its own
   1284×2778 aspect ratio, no crop, no clip, no opacity, no blend, no filter, no
   mask on the image itself. It is scaled to 82.5% of the span the authenticated
   Buttons page uses (min(123vw,792px)), which lands in the requested 80–85% band.
   It sits in normal flow between the closing line and the Continue button, so it
   fills the black space that was there and cannot overlap anything.
   Because the artwork is uncropped its frame carries empty black above and below
   the racket. A pure black ground behind it, bleeding to the card's inner edges
   (the negative margins cancel the card's 20px padding) and dissolving vertically
   into the card, means that frame has no visible edge — the same technique the
   Buttons page already uses behind its own racket. The fade happens on this
   backing ground, never on the artwork. */
#doPadelRegConfirm .do-padel-confirm-racket{--do-confirm-racket-span:min(101.5vw,653px);position:relative;display:flex;justify-content:center;padding:28px 0;margin:12px -20px 20px;pointer-events:none}
#doPadelRegConfirm .do-padel-confirm-racket::before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background:#000;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 28px,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 28px,#000 calc(100% - 28px),transparent 100%)}
#doPadelRegConfirm .do-padel-confirm-racket img{position:relative;display:block;width:auto;height:var(--do-confirm-racket-span);max-width:none;user-select:none;-webkit-user-drag:none}
/* THE CONTINUE BUTTON — THE REGISTRATION CONTINUE BUTTON'S OWN TREATMENT.
   Membership Confirmed is the screen immediately after the registration form, one
   tap later in the very same journey, so its single action carries the very same
   treatment CONTINUE already has there (body.do-padel-register-mode #register
   #toStandBtn, above): the same four-stop deep DO→PADEL green fill, the same green
   edge, the same premium glow, and the same ::before sheen and ::after top hairline
   that keep it from going flat. Width, height, radius, padding, position, wording,
   destination and every press/hover behaviour are inherited from .btn and are
   exactly as they were — only the fill, the edge, the label colour and the glow
   change. The gold is written out rather than read from --gold because this screen
   does not re-declare the brighter DO→PADEL tokens the registration card does, and
   the label must be the same warm gold either way. */
#doPadelRegConfirm #doPadelContinueBtn{
background:linear-gradient(175deg,#5f8825 0%,#49681d 42%,#385214 72%,#2d4210 100%);
border-color:rgba(197,247,116,.72);
color:#f2d489;
text-shadow:0 1px 3px rgba(18,42,4,.45);
box-shadow:0 10px 28px rgba(0,0,0,.35),0 4px 18px rgba(139,197,46,.28),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.22)
}
#doPadelRegConfirm #doPadelContinueBtn::before{background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 46%,rgba(0,0,0,.1) 100%)}
#doPadelRegConfirm #doPadelContinueBtn::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent)}
#doPadelRegConfirm #doPadelContinueBtn:hover{border-color:rgba(212,252,140,.9);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 28px rgba(139,197,46,.34),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.22)}
/* THE FOOTER — THE RESTRAINED FOOTER SYSTEM REGISTRATION ALREADY USES.
   Three centred lines closing the page and nothing more: the domain, the shared
   POWERED BY DO→?® mark, and the one legal line the site-wide
   .do-padel-powered::after rule writes for every footer in the application. No
   Privacy Policy or Terms line here — that belongs to the form, where a choice is
   actually being made. The values are lifted straight off the registration footer
   so the two read as one system.
   THE COPYRIGHT LINE STAYS ON ONE LINE. The shared rule already sets
   white-space:nowrap; the type then scales down with the viewport, and only
   downwards — capped at the 8.5px every other footer uses — so on a narrow phone it
   shrinks a fraction of a pixel at a time rather than ever breaking in two. */
#doPadelRegConfirm .do-padel-confirm-sitewrap{margin-top:22px;text-align:center}
#doPadelRegConfirm .do-padel-confirm-site{display:inline-block;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:400;letter-spacing:.16em;color:rgba(214,177,87,.69);text-decoration:none}
#doPadelRegConfirm .do-padel-powered{margin-top:11px;color:rgba(214,177,87,.77)}
#doPadelRegConfirm .do-padel-powered::after{font-size:clamp(6.8px,2.2vw,8.5px);color:rgba(214,177,87,.48)}
/* ══ DO→KEY® INTRODUCTION ═══════════════════════════════════════════════════
   The one screen shown after a DO-ER has been identified and their existing
   record found or created, on the way into their hub. It carries the DO→PADEL™
   design language — black ground, gold, luxury spacing — and nothing else: the
   DO-VOLUTION intro landing, the DO→?® masthead, the footer and the vault nav are
   all suppressed for this mode exactly as they are for member access, so the
   approved DO→KEY® card is the only thing that arrives with the page.
   The card artwork is used exactly as supplied — one <img>, its own aspect ratio,
   never cropped, never recreated, and centred in its own column. ─────────────── */
body.do-padel-do-key-mode #introOverlay,
body.do-padel-do-key-mode #sampleOverlay{display:none !important}
body.do-padel-do-key-mode #mainApp{opacity:1 !important}
body.do-padel-do-key-mode #bottomNav,
body.do-padel-do-key-mode .footer{display:none !important}
body.do-padel-do-key-mode .brand,
body.do-padel-do-key-mode .subbrand,
body.do-padel-do-key-mode #welcomeBack,
body.do-padel-do-key-mode #continuityIndicator{display:none !important}
body.do-padel-do-key-mode #entry{display:none !important}
/* The card reads as the hero of the page, so this one route is allowed a wider
   column than the 430px app default. Scoped to the mode class, so every other
   screen keeps the column it has always had. */
body.do-padel-do-key-mode .app{max-width:min(560px,100%);padding-bottom:calc(72px + env(safe-area-inset-bottom))}
.do-key-page{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0}
.do-key-title{font-size:clamp(30px,8vw,40px);letter-spacing:.04em;margin:clamp(10px,3vh,26px) 0 0;line-height:1.1}
.do-key-sub{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green);margin:14px 0 0}
/* THE APPROVED CARD — large, fully visible, perfectly centred. The frame holds the
   artwork's own 1284×915 ratio so the image is never cropped or letterboxed, and the
   artwork sits on its own black ground, which is the page's ground too. */
.do-key-card-frame{position:relative;width:100%;margin:clamp(30px,6vh,52px) 0 0;border-radius:18px;isolation:isolate}
.do-key-card-art{display:block;width:100%;height:auto;aspect-ratio:1284/915;border-radius:18px}
/* THE SUCCESS ANIMATION — run once, only after the record has been saved. A soft
   light sweeps across the card, the card lifts slightly, the gold catches the light
   and it returns naturally. Roughly two seconds, one pass: no flashing, no spin,
   no loop. */
.do-key-card-frame::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;mix-blend-mode:screen;background:linear-gradient(102deg,transparent 34%,rgba(255,238,196,.26) 46%,rgba(255,250,232,.44) 50%,rgba(255,238,196,.24) 54%,transparent 66%);background-size:260% 100%;background-repeat:no-repeat;background-position:135% 0}
.do-key-card-frame.is-celebrating{animation:doKeyLift 2s cubic-bezier(.33,.02,.30,1) both}
.do-key-card-frame.is-celebrating::after{animation:doKeySweep 2s cubic-bezier(.42,0,.34,1) both}
@keyframes doKeyLift{
0%{transform:none;filter:none}
34%{transform:translateY(-9px) scale(1.012);filter:brightness(1.1) saturate(1.05)}
64%{transform:translateY(-5px) scale(1.006);filter:brightness(1.04) saturate(1.02)}
100%{transform:none;filter:none}
}
@keyframes doKeySweep{
0%{opacity:0;background-position:135% 0}
16%{opacity:1}
84%{opacity:1}
100%{opacity:0;background-position:-45% 0}
}
@media(prefers-reduced-motion:reduce){
.do-key-card-frame.is-celebrating,
.do-key-card-frame.is-celebrating::after{animation:none}
}
.do-key-powered{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.9;margin:clamp(20px,4vh,30px) 0 0}
.do-key-note{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10.5px;letter-spacing:.05em;line-height:1.8;color:var(--muted);opacity:.6;margin:12px 0 0;max-width:38ch}
.do-key-globe{font-size:26px;line-height:1;margin:clamp(34px,7vh,58px) 0 0}
.do-key-lines{font-size:15.5px;line-height:2;letter-spacing:.05em;color:var(--soft);margin:20px 0 0}
.do-key-lines strong{font-weight:400;color:var(--brand-green)}
.do-key-body{margin:clamp(32px,6vh,52px) 0 0;max-width:44ch}
.do-key-body p{font-size:14px;line-height:1.85;margin:0 0 18px}
.do-key-body p:last-child{margin-bottom:0}
.do-key-vision-title{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:clamp(34px,7vh,54px) 0 0}
.do-key-vision{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;width:100%;max-width:34ch}
.do-key-vision li{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;letter-spacing:.06em;color:#e6d8ad;padding-bottom:12px;border-bottom:1px solid rgba(214,177,87,.13)}
.do-key-vision li:last-child{border-bottom:none;padding-bottom:0}
/* THE ONE CHECKBOX. No other field, and no form. */
.do-key-choice{width:100%;margin:clamp(36px,7vh,58px) 0 0}
.do-key-check{display:flex;align-items:flex-start;gap:14px;text-align:left;padding:18px 20px;border:1px solid rgba(214,177,87,.24);border-radius:18px;background:linear-gradient(180deg,rgba(16,12,7,.7),rgba(4,4,4,.8));cursor:pointer;transition:border-color .35s ease,box-shadow .35s ease}
.do-key-check:hover{border-color:rgba(214,177,87,.45)}
.do-key-check.is-on{border-color:rgba(139,197,46,.5);box-shadow:0 0 26px rgba(139,197,46,.1)}
.do-key-check input{position:absolute;opacity:0;width:0;height:0}
.do-key-box{flex:0 0 auto;width:21px;height:21px;margin-top:1px;border:1px solid rgba(214,177,87,.5);border-radius:6px;background:rgba(0,0,0,.4);position:relative;transition:border-color .35s ease,background .35s ease}
.do-key-box::after{content:"";position:absolute;left:6px;top:2px;width:6px;height:11px;border-right:1.6px solid #0b1004;border-bottom:1.6px solid #0b1004;transform:rotate(42deg) scale(.5);opacity:0;transition:opacity .3s ease,transform .3s cubic-bezier(.2,.9,.3,1.2)}
.do-key-check.is-on .do-key-box{border-color:var(--brand-green);background:var(--brand-green)}
.do-key-check.is-on .do-key-box::after{opacity:1;transform:rotate(42deg) scale(1)}
.do-key-check input:focus-visible ~ .do-key-box{outline:2px solid rgba(214,177,87,.7);outline-offset:3px}
.do-key-check-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.7;letter-spacing:.03em;color:var(--soft)}
.do-key-msg{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.04em;line-height:1.7;color:var(--ember);margin:14px 0 0}
.do-key-welcome{margin:26px 0 0;padding:22px 20px;border:1px solid rgba(139,197,46,.28);border-radius:18px;background:linear-gradient(180deg,rgba(12,18,6,.6),rgba(4,4,4,.85));animation:screenFade .8s cubic-bezier(.22,.9,.36,1) both}
.do-key-welcome-title{font-size:19px;letter-spacing:.08em;color:var(--gold);margin:0 0 12px}
.do-key-welcome p{font-size:13px;line-height:1.85;margin:0 0 12px}
.do-key-welcome p:last-child{margin-bottom:0}
.do-key-continue{max-width:340px;margin-top:clamp(32px,6vh,50px)}
/* ══ YOUR FEEDBACK™ ═════════════════════════════════════════════════════════
   The feedback page, reached at /dopadel/partner-review from the YOUR FEEDBACK™
   tile on the buttons page. It is never opened for the DO-ER: it is somewhere they
   choose to go, and it interrupts nothing.
   It carries the same mode treatment the DO→KEY® page uses — the DO-VOLUTION intro
   landing, the DO→?® masthead, the footer and the vault nav are all suppressed — so
   the feedback is the only thing that arrives with the page.
   Supabase decides which of its two panels shows: the form while
   do_review_completed is false, and a thank-you once it is true. ─────────────── */
body.do-padel-partner-review-mode #introOverlay,
body.do-padel-partner-review-mode #sampleOverlay{display:none !important}
body.do-padel-partner-review-mode #mainApp{opacity:1 !important}
body.do-padel-partner-review-mode #bottomNav,
body.do-padel-partner-review-mode .footer{display:none !important}
body.do-padel-partner-review-mode .brand,
body.do-padel-partner-review-mode .subbrand,
body.do-padel-partner-review-mode #welcomeBack,
body.do-padel-partner-review-mode #continuityIndicator{display:none !important}
body.do-padel-partner-review-mode #entry{display:none !important}
body.do-padel-partner-review-mode .app{max-width:min(560px,100%);padding-bottom:calc(72px + env(safe-area-inset-bottom))}
.dp-review-page{width:100%;font-family:'Plus Jakarta Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#f2ecdc}
.dp-review-page *{box-sizing:border-box}
/* PRESENCE. The page opens in the brand's own light rather than flat black: one
   soft gold wash behind the heading with a quieter green one beside it. Painted as
   the panel's background so nothing sits above the copy and nothing moves. */
.dp-ev-panel{width:min(100%,860px);margin:0 auto;padding:clamp(18px,3vw,30px) 0 clamp(26px,4vw,38px);background:radial-gradient(58% 230px at 50% 0,rgba(233,205,130,.10),transparent 72%),radial-gradient(44% 190px at 82% 4%,rgba(139,197,46,.065),transparent 74%);background-repeat:no-repeat}
/* READABILITY. Section headings are up about a fifth and body copy about a seventh
   on the sizes this form has always used, the dividers and the unlit stars are
   materially brighter, and the stars themselves are a fifth larger with a little
   more air between them. The serif title, the gold and the spacing rhythm are the
   ones this form has always used.
   INTERACTION. Every control now answers the DO-ER: the stars light warmer and
   carry a soft gold halo when lit, the pills take the DO green behind a gold edge
   when selected, the written answers glow faintly green-gold on focus, and each
   control dips very slightly under a finger. Transitions only — nothing loops,
   nothing bounces, and nothing draws attention to itself unprompted. */
.dp-ev-title{margin:0 0 8px;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(23px,3.1vw,30px);line-height:1.2;letter-spacing:.06em;text-transform:uppercase;color:#e9cd82;text-align:center}
.dp-ev-intro{margin:0 auto 14px;max-width:600px}
.dp-ev-lede{margin:0 0 10px;font-size:14.4px;line-height:1.7;color:#b7ab8b;text-align:center}
.dp-ev-lede:last-child{margin-bottom:0}
.dp-ev-wm{white-space:nowrap}
/* TOGETHER WE ARE STRONGER — the platform lockup in the platform's own three
   colours, sitting directly beneath the introduction exactly as it does on the
   DO→PADEL™ buttons page. */
.dp-ev-tws{margin:0 0 24px;font-size:11.5px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;line-height:1.6;text-align:center}
.dp-ev-q{position:relative;padding:16px 0}
/* The divider between questions carries the gold across and hands off to a breath
   of green at the end of the line — the same two colours, one hairline. */
.dp-ev-q::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,rgba(214,177,87,.42),rgba(214,177,87,.24) 58%,rgba(139,197,46,.3))}
.dp-ev-q:first-of-type{padding-top:4px}
.dp-ev-q:first-of-type::before{display:none}
.dp-ev-label{display:block;margin:0 0 11px;font-size:12.6px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#d9c496}
.dp-ev-hint{margin:-6px 0 11px;font-size:12.6px;letter-spacing:.03em;color:#9c9075}
.dp-ev-stars{display:flex;gap:10px}
.dp-ev-star{width:41px;height:41px;padding:0;font:inherit;font-size:23px;line-height:1;cursor:pointer;color:rgba(230,199,133,.6);background:transparent;border:0;border-radius:12px;touch-action:manipulation;transition:color .18s ease,transform .16s ease,text-shadow .22s ease,background .18s ease}
.dp-ev-star:hover{transform:translateY(-1px);color:rgba(240,215,155,.85)}
/* Touch feedback: the star dips under the finger and returns. */
.dp-ev-star:active{transform:scale(.9)}
.dp-ev-star:focus-visible{outline:none;background:rgba(233,205,130,.1);box-shadow:0 0 0 1px rgba(233,205,130,.5)}
/* Lit: brighter, warmer, and carrying a soft gold halo with the faintest green
   under it, so a given rating reads at a glance without any change of shape. */
.dp-ev-star.is-on{color:#f6d98c;text-shadow:0 0 10px rgba(233,205,130,.5),0 0 22px rgba(139,197,46,.16)}
.dp-ev-star.is-on:hover{color:#ffe6a2}
.dp-ev-chips{display:flex;flex-wrap:wrap;gap:8px}
.dp-ev-chip{padding:8px 14px;font:inherit;font-size:13.8px;letter-spacing:.03em;cursor:pointer;color:#cdbd96;background:rgba(255,255,255,.02);border:1px solid rgba(214,177,87,.3);border-radius:999px;touch-action:manipulation;transition:border-color .18s ease,color .18s ease,background .18s ease,box-shadow .22s ease,transform .14s ease}
.dp-ev-chip:hover{border-color:rgba(214,177,87,.6);color:#f0e3bf}
.dp-ev-chip:active{transform:scale(.97)}
.dp-ev-chip:focus-visible{outline:none;box-shadow:0 0 0 1px rgba(233,205,130,.55)}
/* SELECTED — the DO green behind a gold edge. Unmistakable beside an unselected
   pill and still fully legible at the smallest phone width. Multiple selections
   are unaffected: the state is per-pill, exactly as before. */
.dp-ev-chip.is-on{color:#f7eed3;background:linear-gradient(180deg,rgba(139,197,46,.3),rgba(139,197,46,.1));border-color:#e0bb63;box-shadow:inset 0 0 0 1px rgba(233,205,130,.18),0 3px 16px rgba(139,197,46,.16)}
.dp-ev-chip.is-on:hover{color:#fff8e6;border-color:#f0d693}
.dp-ev-panel textarea{width:100%;min-height:82px;padding:12px 14px;font:inherit;font-size:15.5px;line-height:1.6;color:#f2ecdc;background:#0a0c08;border:1px solid rgba(214,177,87,.3);border-radius:11px;outline:none;resize:vertical;transition:border-color .2s ease,box-shadow .24s ease}
/* Focused: a green border with a gold hairline inside it and the faintest glow.
   The field keeps its size, its place and its weight. */
.dp-ev-panel textarea:focus{border-color:rgba(139,197,46,.5);box-shadow:0 0 0 1px rgba(233,205,130,.2),0 0 18px rgba(139,197,46,.1)}
.dp-ev-note{margin:20px 0 0;padding:15px 17px;font-size:13.8px;line-height:1.7;letter-spacing:.015em;color:#c9ba92;background:linear-gradient(180deg,rgba(233,205,130,.06),rgba(139,197,46,.04));border:1px solid rgba(214,177,87,.3);border-radius:12px;text-align:center}
.dp-ev-note p{margin:0}
.dp-ev-note p+p{margin-top:11px}
.dp-ev-actions{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:22px}
.dp-ev-btn{flex:0 0 auto;padding:9px 18px;font:inherit;font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;color:#8bc52e;background:linear-gradient(180deg,rgba(139,197,46,.17),rgba(139,197,46,.05));border:1px solid rgba(139,197,46,.5);border-radius:10px;touch-action:manipulation;transition:border-color .18s ease,background .18s ease,color .18s ease,box-shadow .22s ease,transform .14s ease}
.dp-ev-btn:hover{border-color:#8bc52e;background:linear-gradient(180deg,rgba(139,197,46,.26),rgba(139,197,46,.08))}
.dp-ev-btn:active{transform:scale(.98)}
.dp-ev-btn[disabled]{opacity:.55;cursor:default}
/* SUBMIT REVIEW — the page's primary action, and the one solid button on it: the
   DO green filled, edged in gold, with a low green glow beneath. */
.dp-ev-submit{padding:13px 30px;font-size:12px;font-weight:700;letter-spacing:.16em;color:#0b1204;background:linear-gradient(180deg,#a3d945,#7ab327);border-color:#a3d945;box-shadow:inset 0 0 0 1px rgba(233,205,130,.26),0 8px 26px rgba(139,197,46,.18)}
.dp-ev-submit:hover{color:#08110b;background:linear-gradient(180deg,#b3e558,#86c02c);border-color:#bdea6c}
/* CONTINUE YOUR JOURNEY — always available, and never a submission. It is the
   quieter of the two so SUBMIT REVIEW remains the page's primary action. */
.dp-ev-continue{padding:12px 26px;font-size:11px;font-weight:600;letter-spacing:.16em;color:#cbbb92;background:transparent;border-color:rgba(214,177,87,.34);box-shadow:none}
.dp-ev-continue:hover{color:#f0e3bf;border-color:rgba(214,177,87,.6);background:rgba(214,177,87,.06);box-shadow:none}
.dp-ev-status{min-height:16px;margin:0;font-size:13.8px;line-height:1.6;letter-spacing:.02em;color:#c9b483;text-align:center}
.dp-ev-status.is-error{color:#e6a893}
/* The thank-you shown in place of the form once the feedback has been given. */
.dp-ev-done .dp-ev-note{margin-top:14px}
/* Motion is already limited to short transitions; this removes even those for a
   DO-ER who has asked their device for reduced motion. */
@media (prefers-reduced-motion:reduce){
.dp-ev-star,.dp-ev-chip,.dp-ev-btn,.dp-ev-panel textarea{transition:none}
.dp-ev-star:hover,.dp-ev-star:active,.dp-ev-chip:active,.dp-ev-btn:active{transform:none}
}
body.do-gateway-mode::before,
body.do-dopadel-mode::before,
body.do-padel-intent-mode::before,
body.do-padel-brands-mode::before,
body.do-padel-clubs-mode::before,
body.do-padel-play-mode::before,
body.do-padel-events-mode::before,
body.do-padel-improve-mode::before,
body.do-padel-club-admin-mode::before,
body.do-padel-voice-mode::before,
body.do-padel-membership-mode::before,
body.do-winner-mode::before,
body.do-padel-infrastructure-mode::before,
body.do-padel-partners-mode::before,
body.do-padel-influencers-mode::before,
body.do-padel-brand-partner-mode::before,
body.do-padel-partner-enquiry-mode::before{display:none}
#doPlatformGateway,
#doPadelPlaceholder,
#doPadelIntent,
#doPadelBrands,
#doPadelClubs,
#doPadelPlay,
#doPadelEvents,
#doPadelImprove,
#doPadelVoice,
#doPadelMembershipEnded,
#doWinnerPage,
#doPadelInfrastructure,
#doPadelPartners,
#doPadelInfluencers,
#doPadelBrandPartner,
#doPadelPartnerEnquiry{display:none}
body.do-gateway-mode #doPlatformGateway,
body.do-dopadel-mode #doPadelPlaceholder,
body.do-padel-intent-mode #doPadelIntent,
body.do-padel-brands-mode #doPadelBrands,
body.do-padel-clubs-mode #doPadelClubs,
body.do-padel-play-mode #doPadelPlay,
body.do-padel-events-mode #doPadelEvents,
body.do-padel-improve-mode #doPadelImprove,
body.do-padel-club-admin-mode #doPadelClubAdmin,
body.do-padel-voice-mode #doPadelVoice,
body.do-padel-membership-mode #doPadelMembershipEnded,
body.do-winner-mode #doWinnerPage,
body.do-padel-infrastructure-mode #doPadelInfrastructure,
body.do-padel-partners-mode #doPadelPartners,
body.do-padel-influencers-mode #doPadelInfluencers,
body.do-padel-brand-partner-mode #doPadelBrandPartner,
body.do-padel-partner-enquiry-mode #doPadelPartnerEnquiry{display:block}
.do-gateway-shell{position:relative;min-height:100vh;padding:clamp(68px,15vh,210px) 18px 56px;background:radial-gradient(circle at 50% 36%,rgba(191,142,43,.10),transparent 24%),linear-gradient(180deg,#010101 0%,#050605 55%,#020302 100%);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;overflow:hidden}
.do-gateway-shell::before{content:"";position:absolute;inset:16% -12% 0;background:radial-gradient(circle at 6% 16%,rgba(188,132,21,.34),transparent 16%),radial-gradient(circle at 96% 17%,rgba(188,132,21,.24),transparent 16%),radial-gradient(circle at 50% 67%,rgba(89,132,16,.22),transparent 31%);filter:blur(5px);opacity:.72;pointer-events:none}
.do-gateway-shell::after{content:"";position:absolute;inset:0;opacity:.045;background-image:url('data:image/svg+xml,%3Csvg viewBox=%220 0 256 256%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cfilter id=%22n%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.95%22 numOctaves=%224%22 stitchTiles=%22stitch%22/%3E%3C/filter%3E%3Crect width=%22100%25%22 height=%22100%25%22 filter=%22url(%23n)%22/%3E%3C/svg%3E');background-size:220px 220px;mix-blend-mode:screen;pointer-events:none}
.do-gateway-inner{position:relative;z-index:1;width:min(100%,1060px);margin:0 auto;text-align:center}
.do-gateway-mark{width:clamp(276px,41.5vw,380px);max-width:78vw;margin:0 auto 34px;transform:translateY(calc((34px - clamp(68px,15vh,210px)) / 2));filter:drop-shadow(0 18px 34px rgba(0,0,0,.5))}
.do-gateway-mark img{display:block;width:100%;height:auto;object-fit:contain;user-select:none;-webkit-user-drag:none}
.do-gateway-mark sup{font-size:.22em;line-height:0;vertical-align:super;margin-left:.04em;letter-spacing:0}
.do-gateway-title{margin:0 auto 36px;font-size:clamp(26px,4.4vw,43px);line-height:1.18;font-weight:500;letter-spacing:.26em;text-indent:.26em;color:#d5a34c;text-shadow:0 0 18px rgba(210,151,52,.28);transform:translateY(-12px)}
.do-gateway-sub{display:none}
.do-gateway-sub::before,.do-gateway-sub::after{content:"";width:104px;max-width:18vw;height:1px;background:linear-gradient(90deg,transparent,#b77d23,transparent)}
.do-gateway-grid{display:grid;gap:clamp(28px,4.6vw,44px)}
.do-gateway-card{position:relative;display:block;min-height:clamp(330px,45vw,500px);border-radius:28px;padding:clamp(36px,5.3vw,60px);overflow:hidden;text-align:left;text-decoration:none;color:#f7f4ef;background:linear-gradient(120deg,rgba(15,15,13,.98),rgba(1,1,1,.94));border:1.5px solid rgba(214,177,87,.86);box-shadow:0 18px 48px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,238,174,.10);transition:transform .42s cubic-bezier(.2,.8,.22,1),box-shadow .42s ease,filter .42s ease;isolation:isolate}
.do-gateway-card:hover,.do-gateway-card:focus-visible{transform:translateY(-6px) scale(1.01);box-shadow:0 26px 64px rgba(0,0,0,.72),0 0 38px rgba(209,158,55,.18);outline:none}
.do-gateway-card:active{transform:translateY(-2px) scale(.995)}
.do-gateway-card.do-gateway-entering{transform:scale(1.035);filter:brightness(1.12)}
.do-card-top{display:flex;flex-direction:column;align-items:flex-start;gap:18px;position:relative;z-index:2}
.do-card-do{font-family:Georgia,'Times New Roman',serif;font-size:clamp(48px,8vw,84px);font-weight:700;letter-spacing:-.07em;line-height:1;color:transparent;background:linear-gradient(135deg,#916016,#f3d679 48%,#9b6418);-webkit-background-clip:text;background-clip:text}
.do-card-divider{display:none;width:1px;height:70px;background:linear-gradient(180deg,transparent,#d39b31,transparent)}
.do-card-name{font-size:clamp(34px,6vw,58px);font-weight:700;letter-spacing:.02em;text-shadow:0 0 6px rgba(255,255,255,.1);margin-top:-9px}
.do-card-rule{width:min(56%,430px);height:2px;margin:34px 0 34px;border-radius:2px;color:#d8a33a;background:linear-gradient(90deg,transparent 0%,currentColor 22%,#fff7e6 48%,currentColor 74%,transparent 100%);box-shadow:0 0 11px currentColor;opacity:.9}
.do-card-tagline{position:relative;z-index:2;margin:0;font-size:clamp(25.2px,3.57vw,35.7px);line-height:1.35;color:#fff;font-weight:300}
.do-card-cta{position:absolute;left:clamp(36px,5.3vw,60px);bottom:clamp(34px,5vw,58px);z-index:2;display:flex;align-items:center;gap:26px;color:#d8a33a;font-size:clamp(16px,2.2vw,24px);letter-spacing:.22em;text-transform:uppercase;filter:brightness(1.05)}
.do-card-arrow{font-size:48px;line-height:1}
.do-gateway-card{padding-bottom:clamp(112px,14vw,144px)}
.do-card-features{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,22px);max-width:min(62%,420px);margin:clamp(26px,3.4vw,38px) 0 0}
.do-card-feature{display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(8px,1vw,12px)}
.do-card-feature-icon{width:clamp(30px,3.6vw,40px);height:clamp(30px,3.6vw,40px);color:#d8a33a}
.do-card-feature-icon svg{width:100%;height:100%;display:block;filter:drop-shadow(0 0 6px rgba(217,171,56,.35))}
.do-card-feature-cap{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,1.15vw,12px);font-weight:600;letter-spacing:.12em;line-height:1.45;text-transform:uppercase;color:#cf9f43;text-align:center}
.do-card-features-rule{position:relative;z-index:3;width:min(70%,520px);height:1px;margin:clamp(22px,3vw,34px) 0 0;color:#d8a33a;background:linear-gradient(90deg,currentColor 0%,rgba(217,171,56,0) 94%);opacity:.34}
.do-card-orbit{position:absolute;right:-7%;top:2%;width:38%;height:112%;border-radius:999px 0 0 999px;border-left:2px solid rgba(218,176,69,.72);box-shadow:inset 24px 0 32px rgba(217,171,56,.18),-13px 0 38px rgba(217,171,56,.14);z-index:1}
.do-card-orbit::before,.do-card-orbit::after{content:"";position:absolute;inset:13% 8% 13% 13%;border-left:2px solid rgba(218,176,69,.62);border-radius:999px 0 0 999px}
.do-card-orbit::after{inset:26% 17% 26% 26%;box-shadow:-10px 0 18px rgba(244,211,104,.34)}
/* DO→PADEL™ LANDING CARD — the supplied artwork IS the card, so the anchor is a
   transparent holder: no background, no border, no padding, no radius and no
   shadow, in any state. That is what lets the artwork's own fine gold rounded
   frame be the only frame on the page, and lets the black outside that frame
   meet the black landing-page background with no visible edge. Higher specificity
   than the .do-gateway-card base and its narrow-screen overrides, so it wins at
   every width without reordering anything. The artwork scales to the card column
   at its exact aspect ratio (width:100% + height:auto — never cropped, never
   stretched), and stops growing at the 640px mobile breakpoint so wide screens
   show it at a sensible size rather than blowing it up.

   ITS WIDTH ON A PHONE IS MEASURED FROM THE SCREEN, NOT FROM THE COLUMN. The
   width used to be 94% of the gateway column, and the column is already inset by
   the shell's own side padding, so the card actually landed at about 87% of an
   iPhone's screen. Measuring in vw instead takes the reading from the viewport
   itself: 93.5vw is 93.5% of the screen at every phone width, leaving a deliberate
   3.25% of black down each side — the narrow premium margin the whole gold frame
   sits inside, on all four sides. It is a width only: height stays auto, so the
   ratio is the file's own and nothing is cropped or stretched. The 602px ceiling
   is unchanged, so every screen above ~644px is exactly as it was. THIS CARD IS
   THE REFERENCE: the DO→VOLUTION® card below now takes the same width from it
   (.do-v-card-art), so nothing here may be changed to make the two agree. */
.do-gateway-card.do-padel-card{min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;line-height:0;isolation:auto}
.do-gateway-card.do-padel-card:hover,.do-gateway-card.do-padel-card:focus-visible,.do-gateway-card.do-padel-card:active{box-shadow:none}
.do-padel-card-art{display:block;width:min(93.5vw,602px);max-width:602px;height:auto;margin:0 auto;border:0;border-radius:0;background:none;box-shadow:none;user-select:none;-webkit-user-drag:none}
/* THE HERO STACK — racket, then the wording, and nothing else. The hero master
   (assets/do-padel-landing-hero-final.png, 1284x2778) is used verbatim twice:
   once clipped to the racket, and once through a window that shows only its own
   rows carrying ENTER THE GLOBAL WORLD OF PADEL. and the gold hairline beneath
   it. That window now opens at the position the net used to hold, so the wording
   follows the racket directly at exactly the same pixels, size, font and colours
   as before — only its place on the page changed. The net itself is no longer
   painted inside this stack; it is an in-flow block after it (see below). */
.do-padel-hero-stack{position:relative;display:block;width:max-content;margin:0 auto;line-height:0}
.do-padel-hero-stack .do-padel-card-art{clip-path:inset(0 0 19.72642% 0);transform:scale(.925);transform-origin:50% 78.3657%}
/* THE NET, NOW BELOW THE WORDING AND SUBSTANTIALLY LARGER. The supplied master
   is used verbatim (assets/do-padel-net-gold-hd.jpg, 1284x657) as a normal
   in-flow block after the hero stack, so the reading order is racket, then
   ENTER THE GLOBAL WORLD OF PADEL., then the net, then the round badge, then
   ENTER. It is drawn at 82% of the viewport width on a phone, capped at 520px
   so it stays clearly under the racket's own 620px and secondary to the badge,
   centred by a flex row so it lines up with the racket above it at every
   width, at height:auto so only the file's own 1284:657 ratio
   ever decides its height -- never cropped, never stretched, never redrawn. The
   negative margins only take back the black the file carries above and below
   the net's own pixels, as a share of the drawn width, so the VISIBLE gaps
   wording -> net -> badge stay in the approved premium rhythm at every width. */
.do-padel-hero-net{--do-padel-net-w:min(82vw,520px);position:relative;display:flex;justify-content:center;width:100%;margin:calc(-0.19 * var(--do-padel-net-w)) 0 calc(-0.05 * var(--do-padel-net-w));line-height:0;pointer-events:none}
.do-padel-hero-net > img{display:block;flex:0 0 auto;width:var(--do-padel-net-w);height:auto;border:0;background:none;box-shadow:none;user-select:none;-webkit-user-drag:none}
/* EVERY SHOT™ — THE COUNTER INSIDE THE NET. One live-text layer drawn over the
   net artwork and sized entirely from the net's own drawn width, so it sits in
   the mesh in the approved Net Count proportions at every width: the layer is
   the mesh opening itself (rows 250–440 and columns 85–1200 of the 1284×657
   file), and the title, ball, figure and caption are centred in it. The net's
   pixels are untouched and nothing here is a control. */
.do-every-shot{position:absolute;left:50%;top:38.05%;width:calc(0.868 * var(--do-padel-net-w));height:28.92%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(0.0055 * var(--do-padel-net-w));font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;text-align:center;line-height:1;color:#f3efe6;pointer-events:none;user-select:none;-webkit-user-select:none}
.do-every-shot-title{display:block;font-size:calc(0.0205 * var(--do-padel-net-w));font-weight:400;letter-spacing:.34em;text-transform:uppercase;white-space:nowrap;padding-left:.34em;color:#f3efe6}
.do-every-shot-every{color:#d8b567}
.do-every-shot-tm{font-size:.5em;letter-spacing:0;vertical-align:super;margin-left:.1em}
/* THE WORLD'S PADEL CLOCK — the name's second line, set as small and as still as the caption. */
.do-every-shot-sub{display:block;margin-top:calc(-0.003 * var(--do-padel-net-w));font-size:max(5px,calc(0.0098 * var(--do-padel-net-w)));font-weight:400;letter-spacing:.3em;text-transform:uppercase;white-space:nowrap;padding-left:.3em;color:rgba(216,181,103,.9)}
/* The ball turns once a minute, the one quiet motion besides the figure. CSS only; still under reduced motion. */
@keyframes doEveryShotTurn{to{transform:rotate(360deg)}}
.do-padel-hero-net img.do-every-shot-ball{animation:doEveryShotTurn 60s linear infinite}
@media (prefers-reduced-motion:reduce){.do-padel-hero-net img.do-every-shot-ball{animation:none}}
.do-padel-hero-net img.do-every-shot-ball{display:block;flex:0 0 auto;width:calc(0.035 * var(--do-padel-net-w));height:calc(0.035 * var(--do-padel-net-w));border:0;border-radius:50%;box-shadow:0 0 calc(0.012 * var(--do-padel-net-w)) rgba(190,220,60,.28)}
.do-every-shot-value{display:block;min-height:1em;font-size:calc(0.047 * var(--do-padel-net-w));font-weight:500;letter-spacing:.045em;font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;white-space:nowrap;color:#f6f2e9}
.do-every-shot-caption{display:block;font-size:max(5px,calc(0.0112 * var(--do-padel-net-w)));font-weight:400;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;padding-left:.2em;color:#f6f2e9}
/* ⓘ HOW IS THIS ESTIMATED? — tiny, quiet, and not a button: one line of small
   uppercase text in the page's muted ivory, no box, no border, no gold, no icon
   beyond the typographic ⓘ. It is drawn up into the black beneath the net's
   lower rail from a zero-height holder, so it takes no space in the flow and the
   badge, ENTER and the footer keep their approved spacing to the pixel. The ⓘ is
   a hairline circle with an italic i, so it never depends on a font having the
   ⓘ glyph. */
.do-every-shot-more{--do-padel-net-w:min(82vw,520px);position:relative;z-index:1;height:0;margin:0;padding:0}
.do-every-shot-more a{position:absolute;left:50%;top:calc(6px - 0.092 * var(--do-padel-net-w));transform:translateX(-50%);display:inline-flex;align-items:center;gap:.6em;padding:0 4px;white-space:nowrap;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;line-height:16px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:rgba(233,228,214,.74);text-decoration:none;background:none;border:0;transition:color .2s ease}
/* Mobile: the whole net composition ~11% larger. Every internal measure derives from --do-padel-net-w, so it scales proportionally; the link beneath shares the variable and follows. */
@media (max-width:600px){.do-padel-hero-net,.do-every-shot-more{--do-padel-net-w:min(91vw,520px)}}
.do-every-shot-i{display:inline-block;width:10px;height:10px;border:1px solid currentColor;border-radius:50%;box-sizing:border-box;font-family:Georgia,'Times New Roman',serif;font-size:7px;font-style:italic;line-height:8px;letter-spacing:0;text-align:center;text-transform:none}
.do-every-shot-more a:hover,.do-every-shot-more a:focus-visible{color:rgba(233,228,214,.95);outline:none}
.do-every-shot-more a:focus-visible{text-decoration:underline;text-underline-offset:3px}
.do-every-shot-more[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.do-every-shot-more a{transition:none}}
.do-padel-hero-tail{position:absolute;left:0;right:0;top:82.97336%;height:8.71131%;overflow:hidden;line-height:0;pointer-events:none}
.do-padel-hero-tail img{display:block;width:100%;height:auto;transform:translateY(-80.27358%) scale(.89);transform-origin:50% 82.1454%;border:0;background:none;box-shadow:none;user-select:none;-webkit-user-drag:none}
/* ENTER THE GLOBAL WORLD OF PADEL. drawn 10% larger (.89 -> .979), scaled about the
   centre of its own two lines (rows 2283-2397) so it keeps its place, and clipped
   above row 2420 so only the wording grows. The gold hairline (rows 2447-2453) is
   redrawn from the same file at exactly its previous transform, so it is unchanged. */
.do-padel-hero-tail img{transform:translateY(-80.27358%) scale(.979);transform-origin:50% 73.29684%;clip-path:inset(0 0 12.88697% 0)}
/* The two-line heading a further 15% larger (.979 -> 1.12585), scaled about a point
   chosen so the centre of its two lines stays where it was. ENTER and PADEL are drawn
   from a copy of the artwork recoloured to the hero's deeper gold (#d8b567, as EVERY). */
.do-padel-hero-tail img{transform:translateY(-80.27358%) scale(1.12585);transform-origin:50% 86.066%}
/* The two-line heading a further 6% larger (1.12585 -> 1.193401), with the origin
   moved so the centre of its two lines still stays exactly where it was. */
.do-padel-hero-tail img{transform:translateY(-80.27358%) scale(1.193401);transform-origin:50% 85.42077%}
.do-padel-hero-tail::before{content:"";position:absolute;left:0;top:0;width:100%;aspect-ratio:1284/2778;background:url(/assets/do-padel-landing-hero-final-np.png) 0 0/100% 100% no-repeat;transform:translateY(-80.27358%) scale(.89);transform-origin:50% 82.1454%;clip-path:inset(87.11303% 0 10.72714% 0);pointer-events:none}
.do-padel-hero-shift{display:block;width:auto;height:0;padding-top:17.60125%;pointer-events:none}
/* The card, the wording under it and the CONTINUE YOUR JOURNEY control are one
   grid item, so they stay together as a single composed section and the
   DO→VOLUTION card below keeps its own separation. The wording is live text —
   never baked into the artwork — and is deliberately quieter than the card:
   GLOBAL WORLD OF PADEL is the only emphasis, and 14 DAYS is set smaller than it
   so the membership reads as a benefit rather than an offer. */
.do-padel-landing{display:block;margin-bottom:clamp(26px,4.4vw,40px)}
.do-padel-landing-caption{max-width:640px;margin:clamp(15px,3.8vw,23px) auto 0;text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;line-height:1.22}
.do-padel-enter,.do-padel-trial{margin:0}
.do-padel-enter-lead{display:block;font-size:clamp(14px,3.9vw,20px);font-weight:400;letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;color:#fff}
.do-padel-enter-main{display:block;margin-top:clamp(5px,1.5vw,9px);font-size:clamp(18px,5.9vw,36px);font-weight:800;letter-spacing:.045em;text-transform:uppercase;color:#fff}
.do-padel-enter-green{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green)}
.do-padel-enter-gold{color:var(--brand-gold);-webkit-text-fill-color:var(--brand-gold)}
.do-padel-caption-rule{width:min(72%,420px);height:1px;margin:clamp(15px,3.8vw,23px) auto;background:linear-gradient(90deg,transparent,rgba(224,187,99,.5),transparent)}
.do-padel-trial-lead{display:block;font-size:clamp(11px,2.9vw,14px);font-weight:400;letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;color:#fff}
.do-padel-trial-days{display:block;margin-top:clamp(3px,1vw,6px);font-size:clamp(17px,4.4vw,24px);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand-gold);-webkit-text-fill-color:var(--brand-gold)}
.do-padel-trial-tail{display:block;margin-top:clamp(2px,.9vw,5px);font-size:clamp(13px,3.4vw,17px);font-weight:400;letter-spacing:.2em;text-indent:.2em;text-transform:uppercase;color:#fff}
/* CONTINUE YOUR JOURNEY — the landing page's primary control, in the same
   gold-on-green treatment every other DO→PADEL™ primary control already uses:
   the deep green gradient, the gold lettering and arrow, the fine gold edge with
   its outer hairline, and restrained depth. Sized for a thumb rather than for
   attention — it is narrower than the card above it and never competes with it. */
.do-padel-landing-cta{-webkit-appearance:none;appearance:none;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:281px;min-height:50px;margin:clamp(18px,4vw,26px) auto 0;padding:13px 26px;border:1px solid rgba(226,190,116,.82);border-radius:999px;background:#000;color:#f2d489;-webkit-text-fill-color:#f2d489;text-decoration:none;text-transform:uppercase;text-align:center;font-family:inherit;font-size:clamp(10.5px,2.8vw,12.5px);font-weight:800;letter-spacing:.15em;line-height:1.15;text-shadow:none;box-shadow:0 10px 26px rgba(0,0,0,.5);cursor:pointer;transition:box-shadow .22s ease,border-color .22s ease,transform .14s ease}
.do-padel-landing-cta::after{content:"";position:absolute;inset:-4px;border-radius:inherit;border:1px solid rgba(242,212,137,.14);pointer-events:none}
.do-padel-landing-cta:hover,.do-padel-landing-cta:focus-visible{border-color:rgba(242,212,137,1);box-shadow:0 12px 30px rgba(0,0,0,.54);outline:none}
.do-padel-landing-cta:active{transform:translateY(1px)}
.do-padel-landing-cta-arrow{font-size:1.16em;line-height:1}
/* NEW DO→PADEL LANDING ARTWORK — the supplied master is shown exactly as given
   (1284×2778, uncropped, unedited, its own ratio) and is the top of the page: the
   DO mark inside the artwork is the only mark, so the separate mark above it is
   gone and the space it held belongs to the artwork. On a phone it runs edge to
   edge with no side or top padding; height is capped to the screen so it can never
   be stretched or cropped, and CONTINUE YOUR JOURNEY follows immediately beneath.
   The wording the artwork already carries stays in the HTML for search engines and
   screen readers without being painted twice. */
/* The artwork ends on ONE GLOBAL PLATFORM with its own band of black beneath it,
   so the page adds a little less of its own: an 18px negative bottom margin closes
   that gap and brings CONTINUE YOUR JOURNEY up with it. The image itself is not
   touched — same width, same ratio, same pixels — only the space after it. */
.do-padel-card-art{display:block;width:100vw;max-width:100vw;height:auto;max-height:none;aspect-ratio:1284/2778;object-fit:contain;margin:-7vw auto -20.1vw}
.do-padel-landing-caption .do-padel-enter,.do-padel-landing-caption .do-padel-trial{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.do-padel-landing-caption .do-padel-caption-rule{display:none}
.do-padel-landing-caption{max-width:none;margin-top:0}
.do-padel-landing{margin-bottom:calc(clamp(36px,9vw,52px) - 3px)}
.do-padel-landing-cta{margin-top:clamp(36px,9vw,52px)}
/* The DO→PADEL landing page: no separate mark, no surrounding padding above or
   beside the artwork, and no DO→VOLUTION® section or its connector. do-volution.com
   still renders its own landing from this same page exactly as before — every rule
   here steps aside for it. */
html:not(.do-landing-volution-only) .do-gateway-mark,
html:not(.do-landing-volution-only) .do-eco-link,
html:not(.do-landing-volution-only) .do-v-landing{display:none}
html:not(.do-landing-volution-only) .do-gateway-shell{padding:0 0 clamp(26px,5vw,44px);background:#000}
html:not(.do-landing-volution-only) .do-gateway-shell::before,html:not(.do-landing-volution-only) .do-gateway-shell::after{content:none}
html:not(.do-landing-volution-only) .do-gateway-grid{gap:0}
/* The footer follows the CONTINUE YOUR JOURNEY button rather than sitting in a
   band of black below it: the generous top margin the two-card gateway needs is
   cut back for this single-section landing page. */
html:not(.do-landing-volution-only) .do-legal-footer{margin-top:0}
html:not(.do-landing-volution-only) .do-legal-mark{display:none}
/* THE LOGO AT THE TOP OF THE PAGE, MOVED UP — THE BLACK ABOVE IT, AND NOTHING
   ELSE. The DO mark inside the artwork is this page's only mark and its top, and
   it was sitting about 19.3vw down the screen. That gap is not design: the
   artwork is drawn at scale(.925) anchored low at 50% 78.3657%, so the 7.5% it
   gives up is added ABOVE it as empty space — 12.7vw of nothing — on top of the
   13.6vw of black the file itself carries above the mark.
   WHAT MOVES. The WHOLE hero stack, as one rigid block, 21.5vw closer to the top
   of the screen, leaving a deliberate ~5vw of black above the mark — plus the
   phone's own top safe area where there is one, so the mark can never sit under a
   status bar. Nothing is
   resized, recoloured, cropped or redrawn: the artwork keeps its own width,
   ratio, pixels and .925 scale exactly. The margin is on the STACK, never on the
   artwork, so the stack's own box height is unchanged and ENTER THE GLOBAL WORLD
   OF PADEL. and the wording window positioned as a share of it do not move
   relative to the racket. The net, the badge, ENTER, CONTINUE YOUR JOURNEY and
   the footer simply follow the block up with every gap between them untouched.
   Only the empty black above the mark is spent, and the shell's existing
   overflow trims that same empty black, never a pixel of the artwork.
   SCOPED TO THIS PAGE. html:not(.do-landing-volution-only) is the existing
   DO→PADEL-landing-only scope used by the rules above, so do-volution.com's own
   landing renders exactly as it did. */
html:not(.do-landing-volution-only) .do-padel-hero-stack{margin-top:calc(-21.5vw - var(--dp-lift) + env(safe-area-inset-top,0px) + 0.10 * var(--dp-hero-w))}
/* THE SAME GAP, MEASURED ONCE. The artwork's own negative top margin collapses
   into the stack's — the stack carries no top padding and no top border, so the
   two are one margin and only the more negative of them is used — so the lift
   above is already the only number that decides this gap. It is written to 0
   here so that stays true and the two can never be added together. Nothing
   moves as a result: this is the value the collapsed margin already had. */
html:not(.do-landing-volution-only) .do-padel-card-art{margin-top:0}
@media (min-width:700px){
  /* From tablet width up the artwork's width is capped, so the same shift is
     taken as the same share of the artwork's OWN drawn width — the identical
     expression the artwork itself uses — leaving the mark the same ~5% of black
     above it at every width. */
  html:not(.do-landing-volution-only) .do-padel-hero-stack{--do-padel-hero-w:min(100vw,620px,(100vh - 132px) * 1284 / 2778);margin-top:calc(env(safe-area-inset-top,0px) - 0.2152 * var(--do-padel-hero-w) - var(--dp-lift) + 0.10 * var(--dp-hero-w))}
  html:not(.do-landing-volution-only) .do-padel-card-art{margin-top:0}
}
/* THE LARGE DO MARK REMOVED — TOGETHER WE ARE STRONGER NOW OPENS THE PAGE.
   The artwork's own DO mark and small strapline (rows 189–641 of the master) are
   clipped away at row 690, above the racket's first pixel at row 729; the racket
   itself is not touched. The whole stack is lifted by --dp-lift into the space the
   mark held, and the strapline is set as live text in the gap left above the
   racket, positioned from the racket's own top edge (0.652336 of the drawn width),
   so the two stay locked together at every width. The wording ENTER THE GLOBAL
   WORLD OF PADEL is drawn up 0.03 of the width closer to the racket, and the net
   takes back that and 0.075 more, so the EVERY SHOT™ net enters the first phone
   screen. Everything below the net follows it up with its own spacing unchanged.
   --dp-hero-w is the drawn artwork width: the screen on a phone, the same capped
   width the artwork already uses from 700px up. */
/* FIRST SCREEN ON SHORTER PHONE SCREENS. --dp-e is how far the top of the net
   (1.5584 of the width down the page, plus any top safe area, plus a 0.08-width
   tease) overshoots the visible screen (100svh — the height with the browser's
   bars showing). That overshoot is taken out of the four black gaps in fixed
   shares, each never below its floor: above the strapline (--dp-r0), strapline to
   racket (--dp-r1), racket to wording (--dp-r2) and wording to net (--dp-r3). On a
   very short screen the racket is also drawn 6% smaller (--dp-s), anchored at its
   grip end, and the page closes up by exactly that amount (--dp-shrink). On tall
   screens --dp-e is zero and nothing moves. Phones only. */
html:not(.do-landing-volution-only) .do-padel-card{--dp-hero-w:100vw;--dp-s:1;--dp-r0:0px;--dp-r1:0px;--dp-r2:0px;--dp-r3:0px;--dp-shrink:calc((1 - var(--dp-s)) * 1.043147 * var(--dp-hero-w));--dp-lift:calc(0.21 * var(--dp-hero-w) + var(--dp-r0) + var(--dp-r1) + var(--dp-shrink))}
@media (min-width:700px){html:not(.do-landing-volution-only) .do-padel-card{--dp-hero-w:min(100vw,620px,(100vh - 132px) * 1284 / 2778)}}
@media (max-width:699.98px){
  html:not(.do-landing-volution-only) .do-padel-card{--dp-e:max(0px,calc(var(--dp-hero-w) * (1.7824 - (1 - var(--dp-s)) * 1.043147) + env(safe-area-inset-top,0px) + 0.08 * var(--dp-hero-w) - 100svh));--dp-r0:min(0.035 * var(--dp-hero-w),var(--dp-e) * .25);--dp-r1:min(0.03 * var(--dp-hero-w),var(--dp-e) * .2143);--dp-r2:min(0.03 * var(--dp-hero-w),var(--dp-e) * .2143);--dp-r3:min(0.045 * var(--dp-hero-w),var(--dp-e) * .3214)}
}
@media (max-width:699.98px) and (min-aspect-ratio:2/3){html:not(.do-landing-volution-only) .do-padel-card{--dp-s:.96}}
html:not(.do-landing-volution-only) .do-padel-hero-stack .do-padel-card-art{clip-path:inset(24.83801% 0 19.72642% 0);transform:scale(calc(.925 * var(--dp-s)))}
/* ENTER THE GLOBAL WORLD OF PADEL. now opens the page, in the place TOGETHER WE ARE
   STRONGER held above the racket — the same window onto the same artwork rows, only
   its position changed. The stack is moved down 0.10 of the width (margin-top above)
   so the racket sits a little lower to make room for it. Top is a share of the stack
   height: the racket's own top edge (as before) less 0.247 of the width, a fixed
   clear gap that no screen height can close. */
html:not(.do-landing-volution-only) .do-padel-hero-tail{z-index:1;top:calc(67.7311% - 48.7778% * var(--dp-s));transform:none}
html:not(.do-landing-volution-only) .do-padel-hero-net{margin-top:calc(-0.19 * var(--do-padel-net-w) + 0.019 * var(--dp-hero-w) - var(--dp-r2) - var(--dp-r3) + 0.09 * var(--dp-hero-w))}
.do-padel-tws{display:none}
/* EVERY SHOT™ ABOVE THE NET — the counter moved out of the mesh into the space
   between the racket and the net, where the wording used to sit. The live figure is
   large and clearly dominant; EVERY SHOT™ and the caption are secondary. Drawn over
   the net file's own black top band (z-index), so the net's pixels stay untouched and
   the net now carries only the turning ball. Sizes are shares of the artwork width. */
.do-every-shot-head{display:none}
html:not(.do-landing-volution-only) .do-every-shot-head{position:absolute;left:50%;top:calc(82.97336% + 0.02 * var(--dp-hero-w) - var(--dp-r2));z-index:1;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:calc(0.012 * var(--dp-hero-w));width:max-content;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;text-align:center;line-height:1;color:#f3efe6;pointer-events:none;user-select:none;-webkit-user-select:none}
.do-every-shot-head .do-every-shot-title{font-size:calc(0.042 * var(--dp-hero-w))}
.do-every-shot-head .do-every-shot-sub{margin-top:calc(-0.006 * var(--dp-hero-w));font-size:max(6px,calc(0.019 * var(--dp-hero-w)))}
.do-every-shot-head .do-every-shot-value{margin-top:calc(0.05 * var(--dp-hero-w));font-size:calc(0.1 * var(--dp-hero-w));letter-spacing:.03em}
.do-every-shot-head .do-every-shot-caption{font-size:max(7px,calc(0.0205 * var(--dp-hero-w)));letter-spacing:.16em;padding-left:.16em;color:rgba(246,242,233,.82)}
html:not(.do-landing-volution-only) .do-padel-tws{position:absolute;left:50%;top:calc(1.695483 * var(--dp-hero-w) - 1.043147 * var(--dp-s) * var(--dp-hero-w) - 0.075 * var(--dp-hero-w) + var(--dp-r1));transform:translate(-50%,-100%);display:block;white-space:nowrap;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:calc(0.049 * var(--dp-hero-w));line-height:1.2;text-transform:uppercase;text-align:center;pointer-events:none}
/* TOGETHER and STRONGER — the two anchors, equal in weight and size. */
.do-padel-tws-anchor{font-weight:700;letter-spacing:.1em;-webkit-text-stroke:.025em currentColor}
.do-padel-tws-gold{color:#d8b567;-webkit-text-fill-color:#d8b567}
.do-padel-tws-green{color:#01d71c;-webkit-text-fill-color:#01d71c;margin-right:-.1em}
/* WE ARE — the quiet bridge: smaller, finer, ivory. */
.do-padel-tws-bridge{display:inline-block;margin:0 .45em;font-size:.64em;font-weight:300;letter-spacing:.24em;vertical-align:.18em;color:#f3efe6;-webkit-text-fill-color:#f3efe6;margin-right:calc(.45em - .24em)}
@media (min-width:700px){
  /* The negative bottom margin is a share of the artwork's WIDTH — it closes the
     band of black the artwork carries beneath its last line — so it is only right
     while the artwork is actually drawn at the full width of its box. On a laptop
     the cap was applied to the HEIGHT (max-height:100vh - 132px) while the box
     stayed 620px wide, so object-fit:contain letterboxed the artwork narrower than
     its box while the margin was still taken from 620px. That lifted the badge and
     ENTER too far up and over the artwork's final line, WHOEVER YOU ARE. WHEREVER
     YOU ARE. The identical screen cap is now expressed as a WIDTH ceiling through
     the artwork's own 1284/2778 ratio, so the drawn size is unchanged, height:auto
     still keeps it inside the screen, and the overlap is the same proportion the
     phone uses — the complete sentence is visible and centred where it belongs. */
  .do-padel-card-art{--do-padel-hero-w:min(100vw,620px,(100vh - 132px) * 1284 / 2778);width:var(--do-padel-hero-w);max-width:100vw;margin-top:-20px;margin-bottom:calc(-0.201 * var(--do-padel-hero-w))}
}
/* THE ECOSYSTEM CONNECTOR — one hairline between the DO→PADEL™ section and the
   DO→VOLUTION® card. It is its own grid item, so the grid's existing gap sits
   above and below it and nothing inside either section moves; the matching
   bottom margin only mirrors the DO→PADEL™ section's own bottom margin above it,
   so the line lands optically centred in the black between the two. One pixel
   wide, fading up out of the black in DO green, crossing into DO gold and fading
   back out. The blurred twin behind it is the only luminosity — a soft 3px
   breath at low opacity, never a glow. No arrow, no icon, no wording, no
   animation, and pointer-events:none so it can never intercept a tap. */
.do-eco-link{display:flex;align-items:center;justify-content:center;height:clamp(44px,8.4vw,66px);margin:0 0 clamp(26px,4.4vw,40px);pointer-events:none}
.do-eco-link-line{position:relative;display:block;width:1px;height:100%;background:linear-gradient(180deg,rgba(139,197,46,0) 0%,rgba(139,197,46,.7) 28%,rgba(186,193,84,.78) 50%,rgba(224,187,99,.7) 72%,rgba(224,187,99,0) 100%)}
.do-eco-link-line::after{content:"";position:absolute;left:50%;top:0;width:3px;height:100%;transform:translateX(-50%);background:inherit;filter:blur(2.5px);opacity:.38}
/* DO→VOLUTION® LANDING CARD — the supplied artwork IS the card, treated exactly
   as the DO→PADEL™ card above it: the anchor is a transparent holder with no
   background, border, padding, radius or shadow in any state, so the artwork's
   own gold frame is the only frame and the black outside it meets the landing
   page's black with no visible edge. Higher specificity than the
   .do-gateway-card base and its narrow-screen overrides, so it wins at every
   width without reordering anything. The artwork scales at its exact 3:2 ratio
   (width + height:auto — never cropped, never stretched, never redrawn).

   ITS WIDTH IS NOW TAKEN FROM THE DO→PADEL™ CARD, WHICH IS THE REFERENCE. The
   two cards on this page carry the identical width rule — min(93.5vw,602px) with
   the same 602px ceiling — so they read as one matched pair at every viewport
   instead of two different sizes. On a phone that measures from the screen rather
   than from the gateway column, exactly as the card above it does, which is what
   enlarges this card to the DO→PADEL™ card's presence (the column is already
   inset by the shell's side padding, so the old 94%-of-column landed noticeably
   narrower than the card above). It is a width only: the height stays auto, so
   the whole gold perimeter, the DO→VOLUTION® identity, MAKE YOUR STAND, the three
   pillars and TOGETHER WE ARE STRONGER all scale together and nothing inside the
   artwork is cropped, stretched or re-laid-out. NOTHING IN THE DO→PADEL™ CARD IS
   TOUCHED TO ACHIEVE THIS — the match runs one way only, into this rule. */
.do-gateway-card.do-v-card{min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;line-height:0;isolation:auto}
.do-gateway-card.do-v-card:hover,.do-gateway-card.do-v-card:focus-visible,.do-gateway-card.do-v-card:active{box-shadow:none}
.do-v-card-art{display:block;width:min(93.5vw,602px);max-width:602px;height:auto;margin:0 auto;border:0;border-radius:0;background:none;box-shadow:none;user-select:none;-webkit-user-drag:none}
/* The DO→VOLUTION® card and its CONTINUE YOUR JOURNEY control are one grid item,
   so they stay together as a single composed section. The control is the quiet
   counterpart to the green DO→PADEL™ button above: gold letterforms straight on
   the black, with no fill, box, border, rule or glow behind them. It keeps a
   48px tap height and generous hit padding so it is as easy to press as the
   green button, and brightens rather than moves on press. */
.do-v-landing{display:block}
/* ── DOMAIN-SEPARATED LANDING PAGE ────────────────────────────────────────────
   The landing page itself is untouched — same header mark, same cards, same
   footer, same links, same styling. Each production domain simply shows the one
   section that belongs to it (class set on <html> before first paint, in <head>).
   The ecosystem connector goes with the card it joins to. On every other host
   neither class is set, so the complete two-card gateway renders exactly as
   before. */
html.do-landing-padel-only .do-eco-link,
html.do-landing-padel-only .do-v-landing,
html.do-landing-volution-only .do-eco-link,
html.do-landing-volution-only .do-padel-landing{display:none !important}
/* COMPACT DO→PADEL™ BADGE — placed inside the landing caption, between the
   wording the hero artwork carries and the ENTER button. Centred and held at its
   own 1:1 ratio so it cannot distort: 175px wide on a phone, 180px from tablet
   width upwards, with 32px of black above and below it on a phone and 40px above
   and below from tablet width upwards. No box, background, border or decoration
   is drawn: the artwork's own gold rim is the only edge. The space below is set
   on the ENTER button only where the badge directly precedes it, so the button's
   own rule — its size, its treatment, its route and its behaviour — is untouched.
   position:relative is load-bearing, not decoration. The hero card anchor above is
   itself positioned, so it paints above ordinary in-flow content; combined with the
   card art's negative bottom margin — which lifts this caption up into the band of
   black the artwork carries below its last line — an unpositioned badge is painted
   UNDER the artwork and its top half disappears behind that black. Positioning the
   badge puts it in the same paint layer as the hero card and, being later in the
   document, above it — exactly how the ENTER button below has always stayed visible
   in that same overlap. No offset is set, so nothing moves, resizes or is cropped. */
.do-padel-compact-badge{position:relative;margin:32px auto 0;text-align:center;line-height:0}
.do-padel-compact-badge img{display:block;width:175px;height:auto;margin:0 auto;object-fit:contain}
.do-padel-compact-badge+.do-padel-landing-cta{margin-top:24px}
/* THE BADGE IS CENTRED IN THE BLACK BETWEEN THE HEADLINE AND ENTER. Its two
   gaps were not equal: the space above it is the artwork's own band of black
   below ENTER THE GLOBAL WORLD OF PADEL. (382 of the file's 2778 rows, so
   0.2975 of the rendered width) less the 0.201 the card art already pulls back,
   PLUS this badge's 32px margin — while the space below it is only the 32px
   before ENTER. On a 390px phone that is 69.6px above against 29.9px below, and
   the imbalance GROWS with the screen because the top half is a share of the
   width while the bottom half is fixed pixels. Half the difference is therefore
   0.048255 of the viewport width plus 2px — measured between the VISIBLE edges,
   so it accounts for the 10px of spare black inside the badge file and the
   inset:-4px hairline ring outside the ENTER button. Lifting the badge by
   exactly that lands both gaps equal at every phone width (45px at 320,
   49px at 390, 51px at 430). It is a transform, so it is a paint-time move
   only: the badge is not resized, nothing else is re-laid-out, and the
   headline, the racket, ENTER and the footer all stay exactly where they are.
   Below 700px only — the desktop rules above are untouched. */
@media (max-width:699.98px){
.do-padel-compact-badge{transform:translateY(calc(-4.83vw - 2px))}
}
@media(min-width:768px){
.do-padel-compact-badge{margin-top:40px}
.do-padel-compact-badge img{width:180px}
.do-padel-compact-badge+.do-padel-landing-cta{margin-top:32px}
}
html.do-landing-volution-only .do-padel-compact-badge{display:none !important}
/* BELOW EVERY SHOT™, SPREAD DOWNWARD. The headline, the racket, EVERY SHOT™ and THE
   WORLD'S PADEL CLOCK keep their approved places; the counter's line, the net and
   ball, the methodology link, the coin and ENTER take a little more of the black
   space beneath them, in shares of the artwork width so every screen keeps the same
   proportions. Nothing is enlarged; the footer stays below ENTER. */
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption{margin-top:calc(0.03 * var(--dp-hero-w))}
html:not(.do-landing-volution-only) .do-every-shot-more,html:not(.do-landing-volution-only) .do-padel-compact-badge{--dp-hero-w:100vw}
@media (min-width:700px){html:not(.do-landing-volution-only) .do-every-shot-more,html:not(.do-landing-volution-only) .do-padel-compact-badge{--dp-hero-w:min(100vw,620px,(100vh - 132px) * 1284 / 2778)}}
html:not(.do-landing-volution-only) .do-every-shot-more{margin-top:calc(0.03 * var(--dp-hero-w))}
html:not(.do-landing-volution-only) .do-padel-compact-badge{padding-top:calc(0.06 * var(--dp-hero-w));padding-bottom:calc(0.05 * var(--dp-hero-w))}

/* THE INDEXABLE DO→PADEL™ SEO SECTION, MOVED DOWN — NOT HIDDEN, NOT CHANGED.
   The section is appended to the end of the document at the edge and is real,
   visible, crawlable HTML; its wording, its markup, its links and its visibility
   are untouched here. The only change is black space above where it begins, so it
   no longer competes with the hero or the badge on the landing page. Scoped to the
   landing section's own id, so club, directory, news and section pages keep the
   spacing they already have. */
#do-padel-home-seo{padding-top:clamp(96px,20vw,168px)}
.do-v-landing-cta{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;margin:clamp(18px,4vw,26px) auto 0;padding:12px 20px;border:0;border-radius:999px;background:none;color:var(--brand-gold);-webkit-text-fill-color:var(--brand-gold);text-decoration:none;text-transform:uppercase;text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,2.9vw,13px);font-weight:600;letter-spacing:.26em;text-indent:.26em;line-height:1;cursor:pointer;transition:color .22s ease,-webkit-text-fill-color .22s ease,opacity .18s ease}
.do-v-landing-cta:hover,.do-v-landing-cta:focus-visible{color:#f4d274;-webkit-text-fill-color:#f4d274}
.do-v-landing-cta:focus-visible{outline:1px solid rgba(224,187,99,.55);outline-offset:2px}
.do-v-landing-cta:active{opacity:.72}
.do-v-landing-cta-arrow{font-size:1.16em;line-height:1;letter-spacing:0;text-indent:0}
.do-padel-word{background:linear-gradient(100deg,#f7f7f5 0%,#f7f7f5 38%,#78bd29 39%,#8ccf36 58%,#f7f7f5 59%);-webkit-background-clip:text;background-clip:text;color:transparent}
/* The approved artwork sits in the card's bottom-right corner and is a composited
   layer (drop-shadow, mask, and opacity on small screens). WebKit does not reliably
   apply a rounded overflow clip to a layer like that, so the opaque artwork was
   painting across the card's bottom-right corner and taking the green border line
   with it — the other three corners have nothing over them and were always
   complete. This holder clips the artwork to the very same rounded rectangle the
   card already clips to, so the corner is drawn again. Nothing moves: the holder is
   exactly the card's padding box, so every offset and size inside it resolves to
   the same pixels as before. */
.do-padel-art-clip{position:absolute;inset:0;z-index:1;border-radius:26.5px;overflow:hidden;-webkit-clip-path:inset(0 round 26.5px);clip-path:inset(0 round 26.5px)}
.do-padel-art{position:absolute;right:-1%;bottom:0;width:min(52%,520px);aspect-ratio:600/486;z-index:1;background:url('assets/do-padel-approved-artwork.png') center/contain no-repeat;filter:drop-shadow(0 24px 34px rgba(0,0,0,.62));-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 9%,#000 100%),linear-gradient(0deg,transparent 0%,#000 7%,#000 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 9%,#000 100%),linear-gradient(0deg,transparent 0%,#000 7%,#000 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
.do-padel-art::before,.do-padel-art::after{content:none}
.do-padel-ball{display:block;position:absolute;right:33.4%;bottom:7%;width:clamp(116px,14.2vw,152px);aspect-ratio:198/218;z-index:2;background:url('assets/do-padel-real-ball.png') center/contain no-repeat;filter:drop-shadow(0 12px 14px rgba(0,0,0,.5))}
.do-padel-ball::before,.do-padel-ball::after,.do-padel-ball-seam,.do-padel-ball-seam::before,.do-padel-ball-seam::after{content:none}
.do-gateway-chevron{width:70px;height:70px;margin:-18px auto -18px;border:1px solid rgba(214,177,87,.78);border-radius:50%;display:grid;place-items:center;position:relative;z-index:3;background:#020202;box-shadow:0 0 34px rgba(214,177,87,.32)}
.do-gateway-chevron span{width:20px;height:20px;border-right:4px solid #ddb34d;border-bottom:4px solid #ddb34d;transform:rotate(45deg) translate(-3px,-3px)}
/* The ONE ACCOUNT / ONE COMMUNITY / ONE ECOSYSTEM strip, its three drawn icons,
   its dividers and the POWERED BY DO→?® line that followed it have been removed
   from the landing page, so the styles that existed only for them are gone with
   them. The single legal footer below is now the whole bottom of the page. */
/* LEGAL / BRAND FOOTER — the last thing on the landing page and the only footer
   on it. No card, no panel, no box, no rule: just the DO→?® mark in the house
   wordmark treatment with the company line beneath it, centred in black. Small
   and restrained, but both lines are held at full brightness — brand gold for
   the mark, warm near-white for the company line — so they stay crisp and easy
   to read on a phone rather than fading into the background. */
.do-legal-footer{margin:clamp(56px,9vw,88px) auto 0;text-align:center}
.do-legal-mark{font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,3vw,22px);font-weight:700;letter-spacing:-.04em;line-height:1}
.do-legal-mark sup{font-size:.34em;line-height:0;vertical-align:super;margin-left:.04em;letter-spacing:0}
.do-legal-company{margin-top:12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,2.1vw,13px);font-weight:500;letter-spacing:.13em;line-height:1.5;color:#f2ece0}
/* DO→PADEL LANDING FOOTER — the maker's mark and the company line. Beneath ENTER
   the DO→?® mark is set small and quiet, the way a maker signs a piece rather
   than the way a brand announces one, and the company line below it is smaller
   still in a muted warm grey-gold. Scoped to the DO→PADEL landing only, so the
   DO-VOLUTION® gateway footer is exactly as it was. */
html:not(.do-landing-volution-only) .do-legal-mark{font-size:clamp(17.5px,3.1vw,21.6px);opacity:1}
html:not(.do-landing-volution-only) .do-legal-mark .wm-gold{color:#f2d489;-webkit-text-fill-color:#f2d489}
html:not(.do-landing-volution-only) .do-legal-company{margin-top:0;font-size:clamp(10.4px,2vw,12px);font-weight:400;letter-spacing:.16em;color:rgba(228,212,184,.96)}
/* THE THREE SOCIAL MARKS — beneath the company line, above nothing. Small,
   understated and the same muted warm gold as the line above them, so they read
   as part of the maker's signature rather than as a FOLLOW US block: no panel,
   no border, no labels, no counts and no feed. They warm to full gold on hover
   and focus, which is the only thing about them that moves. */
.do-legal-social{display:flex;justify-content:center;align-items:center;gap:clamp(16px,3.4vw,22px);margin-top:clamp(12px,2.4vw,16px)}
.do-legal-social-link{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;color:rgba(228,212,184,.86);text-decoration:none;transition:color .28s ease,transform .28s ease}
.do-legal-social-link:hover,.do-legal-social-link:focus-visible{color:#f2d489;transform:translateY(-1px)}
.do-legal-social-link svg{display:block;width:clamp(15px,2.7vw,17px);height:clamp(15px,2.7vw,17px);fill:currentColor}
@media (prefers-reduced-motion:reduce){.do-legal-social-link{transition:color .28s ease}.do-legal-social-link:hover,.do-legal-social-link:focus-visible{transform:none}}
/* The footer element is shared with the DO-VOLUTION® gateway, and these are the
   DO→PADEL accounts, so they are not shown on do-volution.com. */
html.do-landing-volution-only .do-legal-social{display:none !important}
/* DO→PADEL welcome — premium gold introduction screen. Deliberately built in the
   DO landing language (black radial ground, gold gradient headline, premium glass
   card, forged-gold .btn) rather than the green gateway-card palette, so the first
   screen a player sees after tapping the card matches the platform's premium feel. */
.do-padel-welcome{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(32px,8vh,80px) 20px calc(48px + env(safe-area-inset-bottom));background:radial-gradient(circle at 50% 18%,#1a1307 0%,#050505 48%,#000 100%);font-family:Georgia,'Times New Roman',serif;text-align:center;position:relative;overflow-x:hidden}
.do-padel-welcome::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 40%,rgba(214,177,87,.10),transparent 36%);mix-blend-mode:screen}
.do-padel-welcome-card{position:relative;z-index:1;width:min(100%,600px);border:1px solid var(--line);border-radius:28px;padding:clamp(40px,6vw,62px) clamp(26px,5vw,54px);background:linear-gradient(180deg,rgba(16,12,7,.72),rgba(4,4,4,.82));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 24px 70px rgba(0,0,0,.6),inset 0 0 50px rgba(214,177,87,.04),inset 0 1px 0 rgba(255,235,180,.10);animation:screenFade .7s cubic-bezier(.22,.9,.36,1) both}
/* DO→PADEL branded racket — a permanent hero element that sits beneath the welcome
   card. It is the racket from the approved reference, on its own premium black surface,
   so masking the rectangular edges lets it emerge from the card's shadow and melt into
   the page's black/gold lighting, reading as part of the interface rather than a pasted
   image. Sits below the card (z-index:0) and never intercepts taps. */
.do-padel-welcome-racket{position:relative;z-index:0;width:min(120%,720px);aspect-ratio:1160/800;margin:clamp(4px,2.2vh,26px) auto -2%;background:url('assets/do-padel-racket.png') center top/contain no-repeat;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 15%,#000 88%,transparent 100%),linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 15%,#000 88%,transparent 100%),linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect;pointer-events:none;animation:screenFade .9s cubic-bezier(.22,.9,.36,1) both}
.do-padel-welcome-title{margin:0 0 22px;font-weight:400;font-size:clamp(29px,6.4vw,50px);line-height:1.16;letter-spacing:.07em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 42%,#a76f1e 72%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 4px rgba(214,177,87,.06))}
.do-padel-welcome-rule{width:78px;height:2px;margin:0 auto 28px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.9}
.do-padel-welcome-values{margin:0 auto 16px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,2.2vw,18px);line-height:1.55;letter-spacing:.22em;text-transform:uppercase;color:var(--brand-green);text-shadow:0 0 22px rgba(139,197,46,.22)}
.do-padel-welcome-sub{margin:0 auto 20px;max-width:440px;font-size:clamp(17px,2.4vw,21px);line-height:1.5;color:var(--soft);letter-spacing:.02em}
.do-padel-welcome-body{margin:0 auto 34px;max-width:462px;font-size:15px;line-height:1.72;color:#d8c79b;letter-spacing:.015em}
/* START MY JOURNEY — stays the premium gold button. A very soft Signature DO Green
   outer edge/glow is layered on top of the base gold shadows so it visually belongs
   to the DO→PADEL ecosystem, without becoming a green button. */
.do-padel-welcome-btn{width:min(100%,340px);margin:0 auto;border-color:rgba(214,177,87,.5);box-shadow:0 10px 28px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,235,180,.14),inset 0 -1px 0 rgba(0,0,0,.25),0 0 0 1px rgba(139,197,46,.20),0 0 26px rgba(139,197,46,.30),0 0 50px rgba(139,197,46,.18);transition:transform .18s cubic-bezier(.2,.8,.22,1),box-shadow .18s ease,border-color .18s ease}
/* Pressed — the green perimeter glow gently intensifies and the button lifts a touch,
   a smooth ~180ms premium response. Stays the gold button; only the green glow deepens. */
.do-padel-welcome-btn:active{transform:translateY(-2px);border-color:rgba(214,177,87,.6);box-shadow:0 16px 40px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,235,180,.16),inset 0 -1px 0 rgba(0,0,0,.25),0 0 0 1px rgba(139,197,46,.34),0 0 40px rgba(139,197,46,.50),0 0 64px rgba(139,197,46,.26)}
.do-padel-sound-toggle{position:fixed;right:clamp(14px,3vw,24px);bottom:calc(4px + env(safe-area-inset-bottom));z-index:10020;width:42px;height:42px;border:1px solid rgba(214,177,87,.34);border-radius:50%;background:rgba(3,4,2,.72);color:rgba(246,226,166,.88);display:none;align-items:center;justify-content:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:16px;line-height:1;cursor:pointer;box-shadow:0 14px 34px rgba(0,0,0,.5),0 0 20px rgba(139,197,46,.12),inset 0 1px 0 rgba(255,235,180,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:border-color .2s ease,color .2s ease,transform .2s ease}
.do-padel-sound-toggle:hover,.do-padel-sound-toggle:focus-visible{border-color:rgba(139,197,46,.58);color:#fff4d2;outline:none}
.do-padel-sound-toggle:active{transform:scale(.96)}
.do-padel-sound-toggle.is-muted{color:rgba(216,199,155,.54);border-color:rgba(216,199,155,.22)}
body.do-dopadel-mode .do-padel-sound-toggle,
body.do-padel-intent-mode .do-padel-sound-toggle,
body.do-padel-brands-mode .do-padel-sound-toggle,
body.do-padel-clubs-mode .do-padel-sound-toggle,
body.do-padel-play-mode .do-padel-sound-toggle,
body.do-padel-events-mode .do-padel-sound-toggle,
body.do-padel-improve-mode .do-padel-sound-toggle,
body.do-padel-club-admin-mode .do-padel-sound-toggle,
body.do-padel-voice-mode .do-padel-sound-toggle,
body.do-padel-partners-mode .do-padel-sound-toggle,
body.do-padel-sponsors-mode .do-padel-sound-toggle,
body.do-padel-infrastructure-mode .do-padel-sound-toggle,
body.do-padel-influencers-mode .do-padel-sound-toggle,
body.do-padel-brand-partner-mode .do-padel-sound-toggle,
body.do-padel-book-court-mode .do-padel-sound-toggle,
body.do-padel-community-mode .do-padel-sound-toggle{display:flex}
/* The Padel DNA™ Journey / completed report is a self-contained premium surface.
   The floating interface-sound control is suppressed only while that report (and
   any milestone/report overlay opened from it) is on screen — every other DO→PADEL
   page keeps its audio control unchanged. */
body:has(.do-padel-voice-panel.pvr-open) .do-padel-sound-toggle{display:none!important}
/* DO→PADEL intent — "What brings you to DO→PADEL?" chooser. Six premium glass
   cards in a clean 2-column layout, built in the exact same DO→PADEL welcome
   language (black radial ground, gold gradient headline, glass cards, screenFade,
   gold accents) as the screen immediately before it. */
.do-padel-intent{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:clamp(10px,1.8vh,22px) 20px calc(44px + env(safe-area-inset-bottom));background:#000;font-family:Georgia,'Times New Roman',serif;position:relative;overflow:hidden}
/* Mobile horizontal drift. The racket's black glow (.do-padel-intent-racket-top::before)
   is wider than the screen and reaches past both edges; overflow:hidden clipped it but
   left this page a scroll container that iOS still let slide sideways. overflow:clip
   clips at the very same edge without making it scrollable, so the page stays locked. */
.do-padel-intent{overflow:clip}
.do-padel-intent::before{content:none}
.do-padel-intent-inner{position:relative;z-index:1;width:min(100%,880px);margin:0 auto;text-align:center;animation:screenFade .7s cubic-bezier(.22,.9,.36,1) both}
/* THE STRAPLINE AT THE HEAD OF THE MEMBERS' BUTTONS PAGE. The DO hero logo
   artwork that used to stand here is gone, and the vertical space it held with
   it: this block now holds the strapline alone, centred, with one clean gap
   beneath it so the member control panel follows directly under it. The negative
   margins that used to absorb the artwork's own internal black are therefore
   gone too, and nothing inside the panel, the racket below it or the buttons is
   touched. */
/* BROUGHT IN EQUALLY ON BOTH SIDES. The strapline band is held 5% narrower
   than the member dashboard beneath it — 95% of the width at every viewport
   and 627px against the dashboard's 660px at full width — and margin:0 auto
   keeps it exactly centred. Height, type size, tracking, colours and the
   words themselves are untouched. */
.do-padel-intent-brand{width:min(95%,627px);margin:0 auto clamp(16px,3.4vw,26px)}
/* TOGETHER WE ARE STRONGER. — the strapline the removed artwork carried, kept
   word for word and set as live text in the platform's own lockup (brand gold,
   white, Signature DO Green) so it reads at full clarity at every width. Sized
   to hold real presence on a phone and on a desktop: a single centred line in
   the interface sans, letter-spaced the way the artwork set it. */
.do-padel-intent-strapline{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(15px,4.8vw,30px);font-weight:700;letter-spacing:.1em;line-height:1.28;text-transform:uppercase;text-align:center}
/* The lockup's weight contrast: TOGETHER and STRONGER carry the weight in gold and
   green, WE ARE is the lighter, slightly smaller white bridge between them. */
.do-padel-intent-strapline .wm-gold,.do-padel-intent-strapline .wm-green{font-weight:800}
.do-padel-intent-strapline .do-padel-community-neutral{font-weight:300;font-size:.8em;letter-spacing:.14em}
/* MOBILE ONLY — 18px of additional clearance above the top content group on the
   members' buttons page, because the DO logo and the lines beneath it were
   sitting hard against the phone status bar and safe-area region. It is padding
   on the group's own wrapper, so the whole group simply starts 18px lower: the
   logo is not resized, its proportions are untouched, and no spacing inside the
   group changes. Same design, slightly lower. Phones only; the desktop
   presentation is unchanged. */
@media(max-width:699.98px){
  .do-padel-intent-inner{padding-top:18px}
}
/* The supplied DO hero logo artwork, placed as an image and nothing else: no crop, no
   filter, no blend, no recolour, and no text rebuilt on top of it. The TOGETHER WE ARE
   STRONGER lockup is part of the artwork, so it is never repeated as markup. Sized for
   a phone first — 80vw keeps it prominent edge to edge, and because the supplied frame
   carries its own generous margin the mark inside it always reads a little smaller than
   the full landing-page presentation. The members' buttons page no longer shows this
   artwork (its head is the strapline alone, above), so this sizing now serves the
   entry advert's header, which uses the identical asset and treatment. */
.do-padel-intent-brand-mark{display:block;width:clamp(318px,90.5vw,437px);max-width:100%;height:auto;margin:0 auto;object-fit:contain;user-select:none;-webkit-user-drag:none}
/* Hero copy group (heading, values link, divider). The markup for this group is not on
   the members' buttons page: the authenticated hero is the supplied logo, the greeting
   and Sign out, and nothing else. The values line and its supporting line from this
   group now live on the dedicated OUR VALUES™ page (#doPadelCommunity), which reuses
   .do-padel-intent-values / .do-padel-intent-values-dot / .do-padel-intent-sub below
   verbatim so the approved copy renders exactly as it was published. The remaining
   rules (title, values link, cue) match nothing today and are kept only so the full
   group can be restored intact if it is ever wanted back in a hero. */
.do-padel-intent-hero{transform:none}
.do-padel-intent-title{position:relative;top:0;margin:0 0 16px;font-weight:400;font-size:clamp(27px,5.6vw,46px);line-height:1.05;letter-spacing:.06em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 42%,#a76f1e 72%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 4px rgba(214,177,87,.06))}
/* Community value line — a restrained green cue that frames the home buttons as a
   community, not a menu. Purely additive; the buttons and layout are unchanged. */
.do-padel-intent-values{margin:0 auto 12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:clamp(16px,2.8vw,22px);line-height:1.4;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-green);text-shadow:0 0 24px rgba(139,197,46,.26)}
.do-padel-intent-values-dot{color:var(--brand-gold);margin:0 .55em;font-weight:400;opacity:.85;text-shadow:none}
.do-padel-intent-sub{margin:0 auto 26px;max-width:540px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.5px,1.9vw,15px);line-height:1.55;letter-spacing:.14em;text-transform:none;color:rgba(240,240,240,.7);text-shadow:none}
.do-padel-values-link{display:block;text-decoration:none;color:inherit;border-radius:18px;padding:10px 14px 14px;margin:0 auto clamp(16px,2.4vw,26px);max-width:600px;transition:transform .28s cubic-bezier(.2,.8,.22,1),filter .22s ease;cursor:pointer;touch-action:manipulation}
.do-padel-values-link .do-padel-intent-sub{margin-bottom:12px}
.do-padel-values-cue{position:relative;top:10px;display:inline-flex;align-items:center;gap:11px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.72px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-gold);opacity:.9;transition:opacity .22s ease,text-shadow .22s ease}
.do-padel-values-cue span{display:inline-block;font-size:1.45em;font-weight:700;line-height:1;transition:transform .28s cubic-bezier(.2,.8,.22,1)}
.do-padel-values-link:hover,.do-padel-values-link:focus-visible{outline:none;transform:translateY(-2px);filter:brightness(1.08)}
.do-padel-values-link:hover .do-padel-values-cue,.do-padel-values-link:focus-visible .do-padel-values-cue{opacity:1;text-shadow:0 0 10px rgba(214,177,87,.35)}
.do-padel-values-link:hover .do-padel-values-cue span,.do-padel-values-link:focus-visible .do-padel-values-cue span{transform:translateX(2px)}
.do-padel-values-link:active{transform:translateY(-1px);filter:brightness(1.04)}
.do-padel-values-link.do-gateway-entering{transform:scale(1.03);filter:brightness(1.1)}
@media(prefers-reduced-motion:reduce){.do-padel-values-link,.do-padel-values-cue span{transition:none}}
/* The personalised welcome on the DO→PADEL™ buttons page. It carries NO surface of
   its own — no panel, border, gradient or shadow — so the greeting sits directly on
   the page background and there is no visible transition between it and the rest of
   the page. Layout spacing only. The hero heading beneath is no longer offset
   upwards, so no bottom reserve is needed and the greeting can sit close under the
   brand lockup above it as one connected group. */
.do-padel-intent-welcome{margin:0 auto clamp(22px,3vw,32px);max-width:660px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;animation:screenFade .7s cubic-bezier(.22,.9,.36,1) both}
/* WELCOME {FIRST NAME} — THE DOMINANT LINE OF THE GROUP.
   Set in the page's own Georgia serif and its own gold gradient, as it always was;
   what changed is only its weight in the composition. It is now the largest thing
   in the group by a wide margin, uppercase, and set on a tight line height so it
   reads as one confident statement rather than a caption.

   THE SIZE IS FIXED, NOT FITTED TO THE NAME. 6.2vw with a floor and a ceiling: the
   same size for WELCOME BO as for WELCOME DOMINIQUE, so a short first name is never
   "corrected" by shrinking the line — which is exactly what would make the Member ID
   beneath it start competing.

   WHY 6.2vw, AND WHY IT IS MEASURED AGAINST THE WIDEST SERIF AND NOT AGAINST GEORGIA.
   The longest ordinary first name that has to hold one line is the ~17 character
   WELCOME DOMINIQUE. Georgia is only actually present on some platforms; where it is
   not (Android, Linux) the line is set in whatever serif the device falls back to,
   and the widest of those measures the phrase at ~13.5em — about 8% wider than
   Georgia itself. The size is set against THAT worst case, measured in the browser
   rather than estimated, so the name holds one line everywhere rather than only on
   iOS: 6.2vw leaves ~7% of clear space inside the 40px-padded viewport at every
   normal phone width (320px through 430px). The 34px ceiling stops it becoming a
   billboard on a tablet, and letter-spacing is deliberately modest (.04em) because
   uppercase serif caps are already wide — more tracking here is what would push a
   long name onto two lines. */
.do-padel-intent-welcome-title{margin:0;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(20px,6.2vw,34px);line-height:1.14;letter-spacing:.04em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 46%,#a76f1e 78%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text}
/* MEMBER ID · DP-000025 — THE SECONDARY LINE, AND ONLY EVER SECONDARY.
   The member's existing member_number in its member-facing form. It sits directly
   under the welcome on the same centre line, and everything about it is set to keep
   it subordinate to the welcome even though it carries roughly twice as many
   characters: the interface sans rather than the serif, a size a little under 40% of
   the welcome's, restrained tracking, and a muted gold that sits back from the
   welcome's lit gradient.

   THE TWO-LETTER-NAME CASE, WHICH IS THE ONE THAT DECIDES THESE NUMBERS. Against the
   shortest realistic welcome, WELCOME BO, this line must still not measure wider —
   even though it carries twice the characters. 2.7vw against the welcome's 6.2vw is
   a size ratio of ~0.44, and because both ends of both clamps are set in the same
   proportion the relationship holds at every width, floor and ceiling included.
   Measured in the browser rather than estimated: WELCOME BO against MEMBER ID ·
   DP-000025 comes out at 195px against 154px on a 390px phone, and 161px against
   139px at the 320px floor — so the welcome is the wider line as well as the larger
   one, and the hierarchy reads correctly for BO, BOB and DOMINIQUE alike. */
.do-padel-intent-memberid{margin:clamp(9px,1.6vw,13px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:clamp(9.5px,2.7vw,12.5px);line-height:1.4;letter-spacing:.1em;text-transform:uppercase;color:rgba(216,199,155,.72);-webkit-text-fill-color:rgba(216,199,155,.72)}
/* The separator carries the brand gold at the same restraint the values line uses,
   so it reads as a divider rather than as punctuation. */
.do-padel-intent-memberid-dot{color:var(--brand-gold);opacity:.8;margin:0 .5em;font-weight:400}
/* SIGN OUT — a small text link, never a button. Centred in its own full-width row so
   it always lands directly beneath the centre of the Member ID above it, on the same
   central axis as the welcome and the Member ID, with ~11px of air between it and the
   line above (5px row margin + 6px padding above the text). Small and muted
   gold with a thin underline, but at full opacity so it stays legible on a phone —
   quiet next to the welcome line, never invisible. The padding is tap area only; the
   underline is drawn on the text itself so it hugs the wording rather than the box. */
.do-padel-intent-signout-row{display:flex;justify-content:center;margin:5px 0 0}
.do-padel-intent-signout{display:inline-block;margin:0;padding:6px 10px;border:0;background:none;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;font-weight:500;letter-spacing:.06em;line-height:1.4;color:#d8c79b;-webkit-text-fill-color:#d8c79b;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;-webkit-text-decoration-color:rgba(216,199,155,.7);text-decoration-color:rgba(216,199,155,.7);cursor:pointer;transition:color .25s ease;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none}
.do-padel-intent-signout:hover,.do-padel-intent-signout:focus-visible{color:#f4e8c6;-webkit-text-fill-color:#f4e8c6;-webkit-text-decoration-color:rgba(244,232,198,.9);text-decoration-color:rgba(244,232,198,.9)}
.do-padel-intent-signout[aria-busy="true"]{opacity:.5;cursor:default}
/* INVITE A NEW MEMBER — the last line of the member header group.
   Centred on the same axis as the welcome, the Member ID and Sign out above it, and
   deliberately carrying NO arrow. Everything about the link itself — size, weight,
   underline weight and offset, hover, tap behaviour — is the existing Sign out
   treatment; only the colour differs, in the brand's Signature Green, because this
   line grows the community while the one above it ends a session. */
.do-padel-intent-invite-row{display:flex;justify-content:center;margin:2px 0 0}
.do-padel-intent-invite{display:inline-block;margin:0;padding:6px 10px;border:0;background:none;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;font-weight:500;letter-spacing:.06em;line-height:1.4;color:var(--brand-green);-webkit-text-fill-color:var(--brand-green);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;-webkit-text-decoration-color:rgba(139,197,46,.7);text-decoration-color:rgba(139,197,46,.7);cursor:pointer;transition:color .25s ease;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none}
.do-padel-intent-invite:hover,.do-padel-intent-invite:focus-visible{color:#a8e83e;-webkit-text-fill-color:#a8e83e;-webkit-text-decoration-color:rgba(168,232,62,.9);text-decoration-color:rgba(168,232,62,.9)}
.do-padel-dash .do-padel-intent-welcome-body{margin:clamp(10px,2vw,14px) 0 0;font-size:clamp(12.5px,1.7vw,14.5px);line-height:1.55;text-align:center}
.do-padel-intent-welcome-body{margin:14px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.9vw,16px);line-height:1.65;letter-spacing:.01em;color:#d8c79b}
/* PARTNER PREVIEW — THE SIGN OUT LINK ON ITS OWN. A Partner Preview visitor has no
   member record and therefore no personalised greeting, so the welcome group carries
   nothing but the existing Sign out link for them: same element, same class, same
   row, same size, colour, underline, hover, spacing and behaviour as the member
   Buttons page. Only the greeting line and the just-registered body line are taken
   out of the group, and only while this one class is present — the member Buttons
   page never carries it, so nothing there changes. */
/* ── THE MEMBER DASHBOARD PANEL ────────────────────────────────────────────────
   One compact oblong: black interior, a single hairline gold surround, hairline
   gold dividers, and nothing else. No fill, no gradient surface, no glow, no
   icon. Sized to sit naturally between the brand lockup above and the racket and
   green buttons below — wider than the old loose text stack, and still centred on
   the same axis as everything else on the page. */
.do-padel-dash{margin:0 auto;max-width:660px;padding:clamp(13px,2.8vw,20px) clamp(12px,2.6vw,22px) clamp(12px,2.2vw,17px);border:1px solid rgba(214,177,87,.5);border-radius:clamp(14px,2.6vw,20px);background:#000}
.do-padel-dash .do-padel-intent-welcome-title{font-size:clamp(19px,5.2vw,27px)}
/* THE MEMBERSHIP SEAL — the existing DO→PADEL™ coin, centred beneath the welcome as
   the credential's one branded object. No glow, no frame: the coin's own gold rim
   is its edge. */
.do-padel-dash-seal{display:flex;justify-content:center;margin:clamp(16px,3vw,22px) 0 0}
.do-padel-dash-seal img{display:block;width:clamp(74px,19vw,96px);height:auto;border-radius:50%;user-select:none;-webkit-user-drag:none}
/* THE ROWS. Equal cells, so whatever is present is symmetrical: two cells each
   take half, three take a third, one takes the row. The divider between cells is
   drawn by the cell that follows another one, which is what makes an absent cell
   leave no trace — no empty column and no dangling rule. */
.do-padel-dash-row{display:flex;align-items:stretch;margin:clamp(10px,2vw,15px) 0 0;padding:clamp(9px,1.8vw,13px) 0 0;border-top:1px solid rgba(214,177,87,.32)}
/* The facts row sits straight under the brand line with no rule of its own — the
   horizontal hairlines inside the panel are the ones above the offer and the
   actions, and there are never any others. */
.do-padel-dash-row.is-facts{padding-top:0;border-top:0}
.do-padel-dash-row[hidden]{display:none}
.do-padel-dash-cell{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(3px,.9vw,5px);padding:0 clamp(6px,1.4vw,12px)}
.do-padel-dash-cell+.do-padel-dash-cell{border-left:1px solid rgba(214,177,87,.32)}
.do-padel-dash-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:clamp(8.5px,2.2vw,10.5px);line-height:1.4;letter-spacing:.18em;text-transform:uppercase;color:rgba(214,177,87,.82);-webkit-text-fill-color:rgba(214,177,87,.82)}
.do-padel-dash-value{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:400;font-size:clamp(12.5px,3.2vw,16px);line-height:1.3;letter-spacing:.04em;color:rgba(255,255,255,.92);-webkit-text-fill-color:rgba(255,255,255,.92)}
.do-padel-dash-value.is-green{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green)}
/* The actions keep the existing Sign out / Invite link treatment exactly — size,
   weight, colour, underline and hover. Each one is a single centred line and reads
   as its own label, so the actions row is one line tall however many of them the
   member has. */
.do-padel-dash-cell .do-padel-intent-invite,.do-padel-dash-cell .do-padel-intent-signout{padding:0;font-size:clamp(11px,2.9vw,13.5px);letter-spacing:.1em;text-transform:uppercase;text-align:center;text-wrap:balance}
/* EQUAL COLUMN TREATMENT FOR THE THREE ACTIONS. Every action cell reserves the
   same two lines of the action type and centres its label inside them, and each
   label wraps into even halves with its arrow tied to the last word. So a label
   that needs two lines and one that needs one read as the same centred block, the
   arrows all sit at the end of the final line, and no action is left hanging or
   drawing the eye. Nothing about the type, colour or behaviour changes. */
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row.is-actions .do-padel-dash-cell{min-height:calc(2.8 * clamp(11px,2.9vw,13.5px))}
/* Inside the dashboard the three action lines read as one set, so Sign out carries
   the same Signature Green as the other two — the approved panel treats every
   actionable line the same way. The Partner Preview sign-out link is deliberately
   excluded, so that surface keeps the muted gold link it has today. */
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-signout{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green);-webkit-text-decoration-color:rgba(139,197,46,.7);text-decoration-color:rgba(139,197,46,.7)}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-signout:hover,.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-signout:focus-visible{color:#a8e83e;-webkit-text-fill-color:#a8e83e;-webkit-text-decoration-color:rgba(168,232,62,.9);text-decoration-color:rgba(168,232,62,.9)}
.do-padel-dash-arrow{text-decoration:none;-webkit-text-decoration:none;margin-left:.14em}
.do-padel-dash-cell[hidden]{display:none}
/* MOBILE. THE ROWS STAY HORIZONTAL. The panel is an oblong on a phone as much as on
   a desktop — two facts side by side, the offer on its own line, the actions side by
   side — so it never becomes a tall vertical card. Nothing stacks: the cells simply
   tighten, so the composition stays symmetrical and the panel never scrolls
   sideways. */
@media(max-width:520px){
  .do-padel-dash{max-width:none;border-radius:clamp(12px,3vw,16px)}
  .do-padel-dash-cell{padding:0 clamp(5px,1.6vw,9px)}
  .do-padel-dash-label{font-size:clamp(8px,2.1vw,9.5px);letter-spacing:.12em;text-align:center}
  .do-padel-dash-cell .do-padel-intent-invite,.do-padel-dash-cell .do-padel-intent-signout{letter-spacing:.06em}
}
/* ── THE MEMBER CREDENTIAL ─────────────────────────────────────────────────────
   Presentation only. The same rows, cells, ids and controls, set as a DO→PADEL™
   digital membership credential rather than a table: one centred column, no
   column dividers and no row rules, hierarchy carried by spacing and type. Scoped
   away from the Partner Preview sign-out-only form, which is unchanged. */
.do-padel-intent-welcome:not(.is-signout-only){max-width:none;margin-bottom:clamp(16px,2.4vw,24px)}
/* One box on the same grid as the DO AI flagship beneath it: full inner width,
   same fine gold edge and corner language. Every row is spaced by its own top
   margin, so a hidden row (Club Offer, countdown, courtesy) takes its gap with
   it and the credential simply collapses. */
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash{max-width:none;padding:clamp(16px,3.2vw,23px) clamp(16px,3.6vw,28px) clamp(14px,2.8vw,19px);border:1px solid rgba(214,177,87,.36);border-radius:clamp(22px,3vw,28px);background:#000}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-seal{margin:0 0 clamp(8px,1.8vw,12px)}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-seal img{width:clamp(74.75px,19.55vw,87.4px)}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash .do-padel-intent-welcome-title{text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:clamp(13px,3.4vw,15px);line-height:1.25;letter-spacing:.14em}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row{flex-direction:column;align-items:center;margin:0;padding:0;border-top:0}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row[hidden]{display:none}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell{flex:0 0 auto;padding:0}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell+.do-padel-dash-cell{border-left:0}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-label{font-size:clamp(9px,2.3vw,10px);letter-spacing:.12em;color:rgba(214,177,87,.75);-webkit-text-fill-color:rgba(214,177,87,.75)}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-value{font-size:clamp(11px,2.9vw,12.5px);font-weight:500;letter-spacing:.1em;text-transform:uppercase}
/* Membership · CLUB OFFER and Member ID · DP-0000XX — one quiet line each. */
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row.is-facts{gap:3px;margin-top:clamp(7px,1.6vw,9px)}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row.is-facts .do-padel-dash-cell{flex-direction:row;align-items:baseline;gap:.5em}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row.is-facts .do-padel-dash-label::after{content:"\00a0\00b7"}
.do-padel-intent-welcome:not(.is-signout-only) #doPadelDashOfferCell .do-padel-dash-value{color:#fff;-webkit-text-fill-color:#fff}
/* The countdown — the strongest informational line, then its two quiet notes. */
.do-padel-intent-welcome:not(.is-signout-only) #doPadelDashCountdownRow{gap:1px;margin-top:clamp(10px,2.3vw,14px)}
.do-padel-intent-welcome:not(.is-signout-only) #doPadelDashCountdownValue{font-weight:600;font-size:clamp(13px,3.5vw,15px);letter-spacing:.14em}
.do-padel-intent-welcome:not(.is-signout-only) #doPadelDashCourtesyRow{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:baseline;column-gap:.5em;row-gap:2px;margin-top:1px}
.do-padel-intent-welcome:not(.is-signout-only) #doPadelDashCourtesyValue{color:#fff;-webkit-text-fill-color:#fff}
/* THE CONTROLS — one system. Invite, Find a club and Sign out stacked in one
   column, each across the full width at exactly the same height, with the same
   vertical gap between them. All three share the same thin gold edge, radius and
   type; green survives only on the arrows. A hidden control takes its row with it. */
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row.is-actions{display:grid;grid-template-columns:1fr;grid-auto-rows:1fr;align-items:stretch;justify-items:stretch;gap:8px;width:100%;max-width:560px;margin:clamp(12px,2.7vw,16px) auto 0}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-row.is-actions .do-padel-dash-cell{display:flex;flex-direction:row;align-items:stretch;grid-column:1/-1;width:100%;min-height:0}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-invite,.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-signout{display:flex;align-items:center;justify-content:center;box-sizing:border-box;flex:1 1 auto;width:100%;min-height:44px;margin:0;padding:6px 10px;border:1px solid rgba(214,177,87,.4);border-radius:10px;background:none;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,2.6vw,11px);font-weight:600;line-height:1.2;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;-webkit-text-decoration:none;text-align:center;color:#e6dcc0;-webkit-text-fill-color:#e6dcc0;transition:border-color .25s ease,color .25s ease}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-invite:hover,.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-invite:focus-visible,.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-signout:hover,.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-signout:focus-visible{border-color:rgba(214,177,87,.8);color:#f4e8c6;-webkit-text-fill-color:#f4e8c6}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-dash-arrow{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green)}
.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash .do-padel-intent-welcome-body{margin-top:clamp(12px,2.6vw,16px);font-size:clamp(11.5px,3vw,13px)}
@media(max-width:360px){
  .do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-invite,.do-padel-intent-welcome:not(.is-signout-only) .do-padel-dash-cell .do-padel-intent-signout{letter-spacing:.06em;padding:0 6px}
}
/* THE OPENING HERO — the racket is now the first thing on the page. */
.do-padel-intent-inner>.do-padel-intent-racket-top{margin:clamp(18px,3vw,32px) auto clamp(18px,3vw,28px)}
/* PARTNER PREVIEW — THE SIGN OUT LINK ON ITS OWN. A Partner Preview visitor has no
   member record and therefore no dashboard: the panel's own surround, padding,
   welcome, brand line, dividers and every other cell are taken out, leaving exactly
   the centred Sign out link the page showed them before. Same element, same class,
   same handler. Only while this one class is present — the member Buttons page never
   carries it, so nothing there changes. */
.do-padel-intent-welcome.is-signout-only .do-padel-dash{max-width:560px;padding:0;border:0;border-radius:0}
.do-padel-intent-welcome.is-signout-only .do-padel-intent-welcome-title,
.do-padel-intent-welcome.is-signout-only .do-padel-dash-seal,
.do-padel-intent-welcome.is-signout-only .do-padel-dash-row:not(.is-actions),
.do-padel-intent-welcome.is-signout-only .do-padel-dash-cell:not(#doPadelSignOutCell),
.do-padel-intent-welcome.is-signout-only .do-padel-dash-label,
.do-padel-intent-welcome.is-signout-only .do-padel-intent-welcome-body{display:none}
.do-padel-intent-welcome.is-signout-only .do-padel-dash-row.is-actions{margin:0;padding:0;border-top:0}
/* Premium DO→PADEL™ racket features on the home buttons page — one beneath the
   values cue, one between the two groups of buttons. Both use the same supplied
   brand asset as the Book a Court hero, exactly as provided: original file, original
   proportions, original upright orientation (head top, handle bottom), no crop, no
   filter, and no change to its colours, lighting or premium black-and-gold finish.

   --do-racket-span is the racket's long (vertical) axis. The image is centred by the
   flex wrapper and its width follows the asset's own aspect ratio, so each racket
   stays perfectly centred at any viewport and the surrounding buttons, their spacing
   and the page layout are left untouched. */
.do-padel-intent-racket{display:flex;justify-content:center;pointer-events:none}
/* The supplied file carries roughly 17% of its own height as empty black above the
   racket head and the same again below the grip, and that dead band — not the layout —
   is what left both rackets looking suspended in a field of black. 15% is taken off
   the top and bottom of the FRAME, which lands comfortably inside the empty band, so
   the racket itself is shown whole: no part of it is cropped, its proportions and
   upright orientation are exactly as supplied, and its colours, lighting and premium
   black-and-gold finish are untouched. The matching negative margins pull the layout
   box in to the trimmed frame, so the surrounding content sits close to the visible
   racket instead of to a band of nothing. */
.do-padel-intent-racket img{display:block;width:auto;height:var(--do-racket-span);margin-top:calc(var(--do-racket-span) * -.15);margin-bottom:calc(var(--do-racket-span) * -.15);-webkit-clip-path:inset(15% 0);clip-path:inset(15% 0);user-select:none;-webkit-user-drag:none}
/* Top racket — sits directly under TAP TO EXPLORE OUR VALUES →, integrated into the
   flow of the page rather than suspended in empty space.

   Sized at ~115% of the original span — a ~12% lift on the displayed racket. The
   value is the racket's long axis, both rackets carry the SAME value, and the
   ::before backdrop below is derived from the same variable, so both rackets grow
   by exactly the same amount, stay centred, stay upright and keep every margin,
   button and layout rule around them untouched.

   VERTICAL SPACE. With the artwork's own empty band trimmed above (shared img rule),
   the margins here are small positive gaps, so the racket sits close to the values cue
   above it and the buttons below it rather than floating in black. A little less is
   left above than below, which lifts it slightly higher in its slot. */
.do-padel-intent-racket-top{--do-racket-span:min(123vw,792px);margin:clamp(6px,1.2vw,14px) auto clamp(14px,2.2vw,26px);position:relative}
/* Background treatment — brings the top racket section in line with the lower one.
   The lower racket already reads correctly because by that point down the page the
   section's warm radial glow has faded to near-black (about rgb(6,5,4)), so the
   artwork's own black background is indistinguishable from the page. Up here the glow
   is still warm (about rgb(38,30,14)), which is the only reason the artwork's black
   frame showed as a rectangle.

   This lays a soft-edged pool of that same pure black behind the top racket, so both
   sections sit on an identical black backdrop. It is a feathered rectangle: solid
   #000 across the whole image frame, then faded well out beyond it on all four sides
   using the crossed-mask technique already used for the welcome-screen racket.

   Absolutely positioned and centred on the wrapper, so it is not a flex item and
   contributes nothing to layout — the racket is not moved, resized or respaced. It
   sits on the negative layer so it stays behind every piece of content, including the
   values cue above it, leaving all text rendered exactly as before. The artwork
   itself is untouched. Its height tracks the trimmed frame (1.15× the long axis
   against a visible frame of 0.7×), so the solid core of the mask still covers the
   whole frame and the feathered edges still fade out well beyond it. */
.do-padel-intent-racket-top::before{content:"";position:absolute;left:50%;top:50%;z-index:-1;width:calc(var(--do-racket-span) * 1284 / 2778 * 2.5);height:calc(var(--do-racket-span) * 1.15);transform:translate(-50%,-50%);background:#000;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26%,#000 74%,transparent 100%),linear-gradient(180deg,transparent 0,#000 14.5%,#000 85.5%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 26%,#000 74%,transparent 100%),linear-gradient(180deg,transparent 0,#000 14.5%,#000 85.5%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect;pointer-events:none}
/* Middle racket — a full-width break between the two button groups. It carries the
   same span and the same trimmed frame as the top racket, so both grow by exactly the
   same amount and both sit tight to the buttons around them; the grid's own row gap
   supplies the air above and below, so only a small closing gap is added here. */
.do-padel-intent-racket-mid{--do-racket-span:min(123vw,792px);grid-column:1/-1;margin:0 auto clamp(4px,1vw,10px)}
/* POWERED BY DO→?® and the legal line beneath it, on this page only — a readability
   lift, nothing more. The mark is a shared component used on around twenty routes, so
   this is scoped to #doPadelIntent rather than edited on the base class; every other
   page keeps the footer exactly as it is today.

   POSITION IS UNCHANGED. The footer keeps its own margin-top, its auto margins and its
   centring, so it sits in exactly the same place on the page as before. Nothing here
   moves it, and no glow, shadow, weight change or other decoration is introduced.

   POWERED BY DO→?®. Both sizes stay as they are (11.3px / 13.6px) and only the gold
   gains alpha, .82 → 1.0 — about a 22% lift in contrast against the near-black ground.
   Same typeface, same letter-spacing, same gold hue, same weight, and the DO→?®
   trademark lockup itself is untouched.

   © 2026 THE DO COIN LIMITED. The legal line is the faintest thing on the page, so it
   takes the larger lift: alpha .42 → .58, about 38% more contrast, plus the single
   permitted 1px of size (8.5px → 9.5px). Same typeface, same weight, same letter-
   spacing, still one centred line. */
#doPadelIntent .do-padel-powered{font-size:11.3px;color:rgba(214,177,87,1)}
#doPadelIntent .do-padel-powered strong{font-size:13.6px}
#doPadelIntent .do-padel-powered::after{font-size:9.5px;color:rgba(214,177,87,.58)}
.do-padel-intent-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.4vw,24px);text-align:left}
/* THE STANDARD BUTTON FILL AND ITS GOLD EDGE — a rich, deep premium sporting
   green. Deliberately not the bright lime end of the DO green family: the
   signature lime belongs to the wordmark, the index numbers and the glow, and
   reading it across a whole button made the page shout rather than feel premium.
   This is the same four-stop geometry and the same angle as the deeper fill the
   large buttons carry, held several steps lighter all the way down — its darkest
   stop (#274317) is still clearly lighter than the large buttons' lightest stop
   (#1c3a16), so the two tiers never meet and the hierarchy reads at a glance.
   Deep enough, too, that the gold lettering reads as refined rather than vivid.

   THE EDGE IS PERMANENT, NOT A HOVER STATE. The perimeter used to be var(--line)
   — the page's faint 25%-alpha hairline — which all but disappeared once the
   button behind it turned green, so the gold only really arrived on hover. It is
   now the established DO→PADEL gold (#f2d489) at an alpha that is plainly
   visible from the moment the page paints. Still one crisp pixel: the width, the
   radius and the glow are untouched, and only the colour of that pixel changed.
   Hover keeps doing exactly what it did — the edge brightens — which is why the
   hover alpha below rises with it rather than staying where it was, since the
   old hover value is now duller than the resting edge it is meant to lift.

   Fill and edge colour only: size, radius, padding, glow, press and every word,
   icon and link on the button are exactly as they were, and the large buttons —
   which set their own border colour and their own hover under an ID — are not
   reached by either rule. */
.do-padel-intent-card{position:relative;display:flex;flex-direction:column;min-height:clamp(172px,22vw,210px);border:1px solid rgba(242,212,137,.62);border-radius:24px;padding:clamp(24px,3.4vw,34px) clamp(24px,3.4vw,34px) clamp(52px,6vw,60px);text-decoration:none;color:#f7f2e6;background:linear-gradient(175deg,#385f24 0%,#32551f 42%,#2c4b1b 72%,#274317 100%);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 20px 56px rgba(0,0,0,.55),0 0 0 1px rgba(139,197,46,.156),0 0 24px rgba(139,197,46,.19),0 0 44px rgba(139,197,46,.12),inset 0 0 44px rgba(214,177,87,.04),inset 0 1px 0 rgba(255,235,180,.10);transition:transform .42s cubic-bezier(.2,.8,.22,1),box-shadow .18s ease,border-color .18s ease,filter .42s ease;isolation:isolate;overflow:hidden}
.do-padel-intent-card:hover,.do-padel-intent-card:focus-visible{transform:translateY(-6px) scale(1.01);border-color:rgba(242,212,137,.9);box-shadow:0 28px 66px rgba(0,0,0,.7),0 0 0 1px rgba(139,197,46,.18),0 0 24px rgba(139,197,46,.22),0 0 44px rgba(139,197,46,.14),0 0 38px rgba(214,177,87,.18),inset 0 0 52px rgba(214,177,87,.07),inset 0 1px 0 rgba(255,235,180,.14);outline:none}
.do-padel-intent-card:active{transform:translateY(-2px) scale(.995)}
.do-padel-intent-card.do-gateway-entering{transform:scale(1.035);filter:brightness(1.12)}
/* Card numbers 01–06 — Signature DO Green premium accent. */
.do-padel-intent-index{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.28em;color:var(--brand-green);opacity:.85}
/* The number carried Signature DO Green while the button behind it was black. On
   the green fill above, green on green cannot be read, so it takes the same solid
   premium gold the established green premium buttons already give it (the
   ADVERTISE GLOBALLY tile has carried exactly this since it was published). The
   size, tracking, typeface and position are untouched, and the ID-scoped rule
   that tile already has still wins over this one, so nothing about it changes. */
.do-padel-intent-index{color:#f2d489;-webkit-text-fill-color:#f2d489;opacity:.9;text-shadow:0 1px 2px rgba(10,26,2,.45)}
.do-padel-intent-name{margin:14px 0 10px;font-weight:400;font-size:clamp(22px,3.2vw,30px);letter-spacing:.10em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 46%,#a76f1e 78%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text}
.do-padel-intent-desc{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.7vw,15px);line-height:1.6;letter-spacing:.015em;color:#d8c79b}
.do-padel-intent-arrow{position:absolute;right:clamp(24px,3.4vw,34px);bottom:clamp(20px,3vw,26px);font-size:34px;line-height:1;color:var(--gold);opacity:.55;transition:transform .42s cubic-bezier(.2,.8,.22,1),opacity .42s ease}
.do-padel-intent-card:hover .do-padel-intent-arrow,.do-padel-intent-card:focus-visible .do-padel-intent-arrow{opacity:1;transform:translateX(5px)}
/* Closing brand line at the foot of every navigation card — the approved DO
   lockup, gold TOGETHER, white WE ARE, green STRONGER., in the same tracked
   uppercase Plus Jakarta Sans Medium as the hero. It is the last item in the
   card's flex column with an auto top margin, so it always settles at the foot
   of the card, can never ride over the description, and clears the corner arrow,
   which keeps its existing position and size. Centred at every width; on the
   narrow two-column mobile cards it breaks once after WE ARE, which keeps
   STRONGER. whole on its own line. Type size is the published lockup size
   raised by 15% at every clamp stop (10/2.7/13 → 11.5/3.105/14.95); nothing
   else about the line moves. */
.do-padel-intent-foot{margin:auto 0 0;padding-top:clamp(8px,1.2vw,12px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11.5px,3.105vw,14.95px);font-weight:500;line-height:1.3;letter-spacing:.18em;text-transform:uppercase;text-align:center}
/* Selected card — the single highlighted state. Only one card may carry this at a
   time (enforced in JS). Signature DO Green border, glow and arrow quietly mark the
   chosen card while gold typography stays dominant. */
.do-padel-intent-card.do-padel-intent-selected{border-color:rgba(139,197,46,.72);box-shadow:0 24px 60px rgba(0,0,0,.62),0 0 0 1px rgba(139,197,46,.34),0 0 30px rgba(139,197,46,.30),inset 0 0 46px rgba(139,197,46,.06),inset 0 1px 0 rgba(255,235,180,.12)}
.do-padel-intent-card.do-padel-intent-selected .do-padel-intent-arrow{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green);opacity:1;transform:translateX(4px)}

/* CARD FOOT LOCKUP — every navigation card now closes on the same two centred
   lines: TOGETHER WE ARE STRONGER. on the very bottom line of the card, always
   whole on one line, with the existing gold arrow centred immediately above it.
   Position only. The arrow keeps its glyph, size, colour, opacity and hover; the
   strapline keeps its typeface, weight, tracking and the gold/white/green lockup.
   The pair is pushed to the foot by the arrow's auto top margin, so it settles at
   the same place on every card whatever its title and description run to, and the
   card's bottom padding no longer has to reserve space for a corner arrow. The
   strapline is sized against the card's own width (container query), so it fills
   the line without ever wrapping — capped at the published size on the wide
   full-width tiles, and falling back to that size where cqw is unsupported. */
.do-padel-intent-card{container-type:inline-size;padding-bottom:clamp(24px,3.4vw,34px)}
.do-padel-intent-arrow{position:static;right:auto;bottom:auto;order:1;display:block;width:100%;margin:auto 0 0;text-align:center}
.do-padel-intent-foot{order:2;margin:0;padding-top:clamp(4px,.7vw,8px);white-space:nowrap;font-size:min(clamp(11.5px,3.105vw,14.95px),4.7cqw)}

/* Cards 12, 13 and 15 — titles only. These three carry the longest names on the
   grid, so they are given a fractionally smaller type size and a tighter, stated
   line-height: the two-line health and warm-up/cool-down titles breathe instead of
   crowding, PADEL COURT PARTNERS™ sits cleanly, and none of the three can grow past
   the shared card height, which keeps their arrows and straplines on the same line
   as every other card. Type size and line-height only — colour, gradient, tracking,
   case, spacing, card size and everything else are untouched, and card 16 keeps its
   own ID-scoped title rule. */
[data-do-route="dopadel-health"] .do-padel-intent-name,
[data-do-route="dopadel-updown"] .do-padel-intent-name{font-size:clamp(19px,2.75vw,26px);line-height:1.24}
[data-do-route="dopadel-infrastructure"] .do-padel-intent-name{font-size:clamp(20.5px,3vw,28px);line-height:1.24}

/* Home button grid — tidy pass. Purely about how the existing cards sit and how
   their existing words break; no card is renamed, restyled or re-coloured.

   1. EQUAL HEIGHTS. The grid stretches every card to its row height, so cards
      already match their row partner — but rows differed from each other, which
      read as a ragged ladder down the page. The min-height below is set just above
      the tallest card's natural content height at each width, so every standard
      card resolves to the same height and the two columns line up all the way
      down. It stays a min-height, never a fixed height: if a font ever falls back
      and the words take an extra line, the card still grows instead of clipping.
   2. LINE BREAKS. pretty keeps the last line of a title or description from
      stranding a single word, so no button is left with a lone orphan word. It was
      measured against balance: balance evened the line lengths but pushed "The
      Health Benefits of DO→PADEL™" onto a lone "Benefits" line, so pretty wins on
      both elements. Degrades to normal wrapping where unsupported. */
.do-padel-intent-card:not(#doPadelVoiceCard){min-height:272px}
/* Cards 01–04 (User Feedback, Book a Court, Improve, Clubs Worldwide) — about 11%
   shorter than the shared height (272 → 242, and 290 → 258 at ≤560px). The top
   and bottom padding and the title's margins are trimmed a touch so the
   description, arrow and strapline still sit comfortably in the shorter card,
   including card 01's two-line description. Widths, type, colours, borders and
   radius are untouched, and no other card is reached. */
#doPadelIntent .do-padel-intent-card:is([data-do-route="dopadel-your-feedback"],[data-do-route="dopadel-book-court"],[data-do-route="dopadel-improve"],[data-do-route="dopadel-clubs"]){min-height:242px;padding-top:clamp(22px,3vw,30px);padding-bottom:clamp(22px,3vw,30px)}
#doPadelIntent .do-padel-intent-card:is([data-do-route="dopadel-your-feedback"],[data-do-route="dopadel-book-court"],[data-do-route="dopadel-improve"],[data-do-route="dopadel-clubs"]) .do-padel-intent-name{margin:12px 0 8px}
@media(max-width:560px){
#doPadelIntent .do-padel-intent-card:is([data-do-route="dopadel-your-feedback"],[data-do-route="dopadel-book-court"],[data-do-route="dopadel-improve"],[data-do-route="dopadel-clubs"]){min-height:258px;padding-top:18px;padding-bottom:18px}
}
.do-padel-intent-name{text-wrap:pretty}
.do-padel-intent-desc{text-wrap:pretty}

/* YOUR PADEL METRICS™ — approved featured tile. Spans the full grid width as the
   prominent double-width hub feature, with gold-forward border, glow and enlarged
   wordmark, on the established darker DO→PADEL green the page's large buttons
   carry. Scoped to this tile only so no other card is affected. */
#doPadelVoiceCard{grid-column:1/-1;border-color:rgba(214,177,87,.42);background:linear-gradient(152deg,#1c3a16 0%,#173112 42%,#12280e 72%,#0e1f0a 100%);box-shadow:0 28px 74px rgba(0,0,0,.62),0 0 0 1px rgba(139,197,46,.16),0 0 44px rgba(214,177,87,.14),inset 0 1px 0 rgba(255,235,180,.12)}
#doPadelVoiceCard:hover,#doPadelVoiceCard:focus-visible{border-color:rgba(214,177,87,.66)}
#doPadelVoiceCard .do-padel-intent-name{font-size:clamp(26px,4vw,38px);text-align:center}
/* The heading is centred across the tile's full double width. Its left and right
   padding are identical, so centring the text inside the content box centres it
   edge to edge across the tile at every width. Alignment only: the "09" index,
   font, size, colour, spacing and vertical position are untouched, and the rule is
   scoped to this one tile's heading so every other card keeps left alignment. */
/* "Profile up to date" — the completed-profile status line is centre-aligned across
   the tile's full double width. The tile's left and right padding are identical, so
   centring the text inside the content box centres it edge to edge across the tile.
   Alignment only: font, size, colour and vertical position are untouched, and the
   rule is scoped to this one status line so every other tile state, and every other
   card, keeps its existing left alignment. */
#doPadelVoiceCard .do-padel-intent-desc.do-padel-intent-desc-centred{text-align:center}

/* ── ADVERTISE GLOBALLY — the buttons page's own way into the advertising page ─
   The existing DO→PADEL™ Advertising & Commercial Partnerships page, reached
   straight from the buttons page. Nothing about that page, its enquiry form or
   its notifications changes; this is only one more door into it.
   A premium double-width tile spanning the full intent grid, in the deep
   forest/bottle green shared by every full-width feature on this page (see THE
   LARGE BUTTON FILL below), with the gold border and gold wordmark that mark
   the premium double-width features. Content is centred across the tile's full
   double width — the card's left and right padding are identical, so centring
   inside the content box centres it edge to edge. Every rule is scoped to this
   one tile, so no other button on the page is touched. */
#doPadelAdvertiseCard.do-padel-intent-card{grid-column:1/-1;align-items:center;text-align:center;border-color:rgba(242,212,137,.5);background:linear-gradient(175deg,#1c3a16 0%,#173112 42%,#12280e 72%,#0e1f0a 100%);box-shadow:0 28px 74px rgba(0,0,0,.6),0 0 0 1px rgba(242,212,137,.2),0 0 42px rgba(214,177,87,.12),inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.28)}
/* Its own height, as the double-width features have: the shared two-column card
   height exists to line the standard buttons up with their row partner, and a
   full-width tile has none. Specificity clears both the base and the ≤560px
   shared-height rules without either of them being changed. */
#doPadelIntent #doPadelAdvertiseCard.do-padel-intent-card{min-height:clamp(178px,20vw,214px)}
#doPadelAdvertiseCard:hover,#doPadelAdvertiseCard:focus-visible{border-color:rgba(242,212,137,.85)}
#doPadelAdvertiseCard .do-padel-intent-index{color:#f2d489;opacity:.7}
/* Solid premium gold, as on the premium buttons, rather than the gold gradient
   the standard cards carry: the gradient's bronze stops read as muddy over green. */
#doPadelAdvertiseCard .do-padel-intent-name{font-size:clamp(26px,4vw,38px);color:#f2d489;-webkit-text-fill-color:#f2d489;background:none;text-shadow:0 1px 3px rgba(10,26,2,.55)}
#doPadelAdvertiseCard .do-padel-intent-desc{color:rgba(247,242,230,.92);text-shadow:0 1px 2px rgba(10,26,2,.4)}
#doPadelAdvertiseCard .do-padel-intent-arrow{color:#f2d489;-webkit-text-fill-color:#f2d489;opacity:.75}

/* ── DO AI™ product mark ────────────────────────────────────────────────────
   DO AI™ is the intelligence that powers the DO→PADEL platform. Gold "DO" keeps
   it inside the ecosystem family; signature green "AI" marks it as the active
   intelligence layer, echoing the green PADEL wordmark. Rendered as one unit. */
.do-ai{white-space:nowrap;font-weight:700;letter-spacing:.01em}
.do-ai-do{color:var(--brand-gold);-webkit-text-fill-color:var(--brand-gold);background:none}
.do-ai-ai{color:var(--brand-green);-webkit-text-fill-color:var(--brand-green);background:none;margin-left:.14em}
.do-ai-tm{color:var(--brand-gold);-webkit-text-fill-color:var(--brand-gold);font-size:.6em;vertical-align:.55em;font-weight:600}

/* ── FLAGSHIP · PLAN YOUR PADEL CLUB ────────────────────────────────────────
   The DO→PADEL Development Intelligence Platform, powered by DO AI™. A premium
   double-width hero feature spanning the full intent grid — deliberately the
   first thing a serious developer, investor or operator notices. The visual
   language is blueprint / masterplan / consultancy report; never a novelty tile. */
.do-padel-flagship{grid-column:1/-1;position:relative;display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(22px,3vw,42px);align-items:stretch;border:1px solid rgba(214,177,87,.36);border-radius:28px;padding:clamp(26px,3.6vw,44px);text-decoration:none;color:#f7f2e6;overflow:hidden;isolation:isolate;background:linear-gradient(158deg,rgba(21,16,9,.94),rgba(6,7,4,.94));box-shadow:0 30px 82px rgba(0,0,0,.62),0 0 0 1px rgba(139,197,46,.14),0 0 42px rgba(214,177,87,.10),inset 0 1px 0 rgba(255,235,180,.12);transition:transform .5s cubic-bezier(.2,.8,.22,1),box-shadow .22s ease,border-color .22s ease}
/* Faint blueprint / masterplan grid drawn behind the content, fading right. */
.do-padel-flagship::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.55;background-image:linear-gradient(rgba(214,177,87,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(214,177,87,.055) 1px,transparent 1px),radial-gradient(circle at 84% 8%,rgba(139,197,46,.12),transparent 46%);background-size:34px 34px,34px 34px,auto,auto;mask-image:linear-gradient(112deg,#000 52%,transparent 100%);-webkit-mask-image:linear-gradient(112deg,#000 52%,transparent 100%)}
.do-padel-flagship:hover,.do-padel-flagship:focus-visible{transform:translateY(-5px);border-color:rgba(214,177,87,.62);box-shadow:0 42px 98px rgba(0,0,0,.72),0 0 0 1px rgba(139,197,46,.2),0 0 56px rgba(214,177,87,.18),inset 0 1px 0 rgba(255,235,180,.16);outline:none}
.do-padel-flagship:active{transform:translateY(-2px)}
.do-flag-main{position:relative;display:flex;flex-direction:column;min-width:0}
.do-flag-eyebrow{display:inline-flex;align-items:center;gap:9px;align-self:flex-start;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green);border:1px solid rgba(139,197,46,.34);border-radius:999px;padding:6px 13px;background:rgba(139,197,46,.06)}
.do-flag-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brand-green);box-shadow:0 0 10px rgba(139,197,46,.85)}
.do-flag-title{margin:18px 0 0;font-weight:400;font-size:clamp(30px,4.7vw,52px);line-height:1.02;letter-spacing:.045em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 44%,#a76f1e 74%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 8px rgba(214,177,87,.10))}
.do-flag-position{margin:15px 0 0;max-width:40ch;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.55vw,16.5px);line-height:1.6;letter-spacing:.008em;color:#e7d8ac}
.do-flag-powered{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 9px;margin:16px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;letter-spacing:.02em;color:#b6a985}
.do-flag-powered .role{color:#9a8f70;font-style:italic}
.do-flag-caps{display:grid;grid-template-columns:1fr 1fr;gap:7px 22px;margin:22px 0 0;padding:0;list-style:none}
.do-flag-caps li{position:relative;padding-left:20px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.2px;line-height:1.5;letter-spacing:.006em;color:#d8c79b}
.do-flag-caps li::before{content:"";position:absolute;left:1px;top:.5em;width:7px;height:7px;border:1px solid var(--brand-green);background:rgba(139,197,46,.14);transform:rotate(45deg)}
.do-flag-evidence{margin:20px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-green)}
.do-flag-evidence span{color:#8a8674;margin:0 8px;opacity:.7}
.do-flag-arc{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:16px 0 0}
.do-flag-arc .q{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.4;letter-spacing:.01em;color:#c9b794;border:1px solid var(--line);border-radius:10px;padding:8px 13px;background:rgba(16,12,7,.6)}
.do-flag-arc .q.done{color:#eadfc0;border-color:rgba(139,197,46,.42);background:rgba(139,197,46,.06)}
.do-flag-arc .to{color:var(--brand-gold);font-size:16px;line-height:1}
.do-flag-cta{display:inline-flex;align-items:center;gap:11px;align-self:flex-start;margin:26px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:700;font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:#0b0a06;background:radial-gradient(132% 92% at 50% -22%,rgba(255,249,228,.42) 0%,rgba(255,249,228,0) 56%),linear-gradient(180deg,#f2dca2 0%,#e7ce8c 40%,#d4b170 62%,#c39c56 100%);border-radius:13px;padding:15px 24px;box-shadow:0 10px 26px rgba(0,0,0,.32),0 18px 46px rgba(198,152,68,.20),0 0 0 1px rgba(120,88,34,.34),inset 0 1px 0 rgba(255,250,232,.60),inset 0 -1px 1px rgba(120,86,30,.34)}
.do-flag-cta .a{transition:transform .42s cubic-bezier(.2,.8,.22,1)}
.do-padel-flagship:hover .do-flag-cta .a,.do-padel-flagship:focus-visible .do-flag-cta .a{transform:translateX(5px)}
/* Right console — a live-feeling DO AI™ intelligence report preview. Mirrors the
   real platform output (investment ranges, ownership cost, confidence tracks) so
   the promise on the left is immediately made credible on the right. */
.do-flag-vis{position:relative;display:flex;flex-direction:column;justify-content:center;gap:13px;border:1px solid rgba(214,177,87,.22);border-radius:20px;padding:clamp(17px,1.9vw,24px);background:linear-gradient(180deg,rgba(10,11,7,.86),rgba(4,5,3,.92));box-shadow:inset 0 0 46px rgba(0,0,0,.55)}
.do-flag-vis-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:11px;border-bottom:1px solid rgba(214,177,87,.16)}
.do-flag-vis-head .t{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#bdad84}
.do-flag-vis-badge{display:inline-flex;align-items:center;gap:6px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--brand-green);border:1px solid rgba(139,197,46,.42);border-radius:999px;padding:3px 9px;background:rgba(139,197,46,.08)}
.do-flag-vis-badge::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brand-green);box-shadow:0 0 8px rgba(139,197,46,.9)}
.do-flag-kpi{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.do-flag-kpi .l{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#9b9585}
.do-flag-kpi .v{font-family:Georgia,'Times New Roman',serif;font-size:15px;color:#f1d488;white-space:nowrap}
.do-flag-score{margin-top:1px}
.do-flag-score .lab{display:flex;justify-content:space-between;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:#8f8a77;margin-bottom:5px}
.do-flag-score .lab b{color:var(--brand-green);font-weight:700}
.do-flag-track{height:6px;border-radius:99px;background:#1c1c18;overflow:hidden}
.do-flag-track i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand-green),var(--brand-gold))}
.do-flag-vis-foot{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;letter-spacing:.05em;color:#7c7663;margin-top:2px}
/* Premium single-button entrance into the DO AI™ Consultation Suite.
   The whole card IS the button. Its visual language matches the second-page
   Consultation Suite doorway: a near-black premium surface, a thin gold border,
   the faint blueprint grid, restrained glow, a green "powered" mark, a serif
   headline and an understated gold BEGIN cue — no flat yellow rectangle. */
/* THE LARGE BUTTON FILL — a deep forest/bottle green, and the darker of the two
   tiers on this page. Shared by all three full-width buttons (this one, YOUR
   PADEL METRICS™ and ADVERTISE GLOBALLY) so the large features read as one set,
   each keeping its own gradient angle. It sits far enough below the standard
   button fill that the tiers are never in doubt, and stays green rather than
   black so the gold border and lettering have something warm to sit on. Fill
   only: the gold border, the gold lettering and arrow, the blueprint grid, the
   top sheen, the glow, the hover and press states and every size and position
   are untouched. */
.do-flag-entrance{grid-template-columns:1fr;justify-items:center;text-align:center;cursor:pointer;padding:clamp(20px,2.2vw,24px) clamp(24px,4vw,52px);border-color:rgba(224,187,99,.4);background:linear-gradient(158deg,#1c3a16 0%,#173112 42%,#12280e 72%,#0e1f0a 100%);box-shadow:0 30px 82px rgba(0,0,0,.6),0 0 0 1px rgba(139,197,46,.12),0 0 42px rgba(224,187,99,.08),inset 0 1px 0 rgba(255,235,180,.14),inset 0 0 0 1px rgba(224,187,99,.06),inset 0 -1px 0 rgba(224,187,99,.05)}
.do-flag-entrance::before{opacity:.5}
/* Very subtle glass sheen + gold rim light — depth without gloss. Sits above
   the grid backdrop but below the content, and never intercepts the tap. */
.do-flag-entrance::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;background:linear-gradient(180deg,rgba(255,248,232,.06),transparent 20%),radial-gradient(122% 60% at 50% -10%,rgba(255,240,205,.05),transparent 62%);mix-blend-mode:screen}
.do-flag-entrance:hover,.do-flag-entrance:focus-visible{border-color:rgba(224,187,99,.66);box-shadow:0 42px 98px rgba(0,0,0,.72),0 0 0 1px rgba(139,197,46,.2),0 0 56px rgba(224,187,99,.16),inset 0 1px 0 rgba(255,235,180,.18),inset 0 0 0 1px rgba(224,187,99,.09),inset 0 -1px 0 rgba(224,187,99,.07)}
/* One calm press: the whole card settles a touch before the transition. */
.do-flag-entrance:active{transform:translateY(-1px) scale(.994);box-shadow:0 22px 58px rgba(0,0,0,.66),0 0 0 1px rgba(139,197,46,.2),0 0 40px rgba(224,187,99,.14),inset 0 1px 0 rgba(255,235,180,.12),inset 0 0 0 1px rgba(224,187,99,.11);transition:transform .13s cubic-bezier(.2,.8,.22,1),box-shadow .13s ease,border-color .13s ease}
.do-flag-enter{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:0}
.do-flag-enter-mark{display:inline-flex;align-items:center;gap:9px;margin:0 0 12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green)}
.do-flag-enter-pulse{width:6px;height:6px;border-radius:50%;background:var(--brand-green);box-shadow:0 0 10px rgba(139,197,46,.9);animation:doFlagBreathe 2.6s ease-in-out infinite}
.do-flag-enter-headline{display:block;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(28px,5vw,49px);line-height:1.06;letter-spacing:-.015em;color:#fbf7ee;text-shadow:0 1px 24px rgba(224,187,99,.09)}
.do-flag-enter-role{display:block;margin:10px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14.5px,2vw,18px);letter-spacing:.03em;color:#c3b791}
.do-flag-enter-go{display:inline-flex;align-items:center;gap:12px;margin:16px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--brand-gold);transition:color .22s ease,text-shadow .22s ease,letter-spacing .22s ease}
.do-flag-enter-go .a{transition:transform .22s ease}
.do-padel-flagship:hover .do-flag-enter-go,.do-padel-flagship:focus-visible .do-flag-enter-go{color:#f2d894;text-shadow:0 0 18px rgba(224,187,99,.34);letter-spacing:.19em}
.do-padel-flagship:active .do-flag-enter-go{color:#e9cd82;text-shadow:0 0 12px rgba(224,187,99,.26)}
.do-padel-flagship:hover .do-flag-enter-go .a,.do-padel-flagship:focus-visible .do-flag-enter-go .a{transform:translateX(5px)}
/* Closing brand line for the entrance panel. It sits on its own row directly
   beneath BEGIN, carries no arrow of its own, and is centred on the panel's
   axis — the column above it is itself centred in the panel, so a block-level,
   centre-aligned line resolves to the true horizontal centre of the hero at
   every width. The lockup itself is the approved one: gold TOGETHER, white
   WE ARE, green STRONGER., in tracked uppercase Plus Jakarta Sans Medium. Type
   size is the published lockup size raised by 15% at every clamp stop
   (11/3.5/17 → 12.65/4.025/19.55) and still held inside the panel's inner
   width so it stays on one line; margin, tracking, weight and colour are
   untouched. */
.do-flag-enter-foot{display:block;align-self:stretch;margin:clamp(12px,1.4vw,14px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.65px,4.025vw,19.55px);font-weight:500;letter-spacing:.18em;text-transform:uppercase;text-align:center;white-space:nowrap}
@keyframes doFlagBreathe{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.82)}}
.do-padel-intent-aside{margin:clamp(22px,3vw,30px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;letter-spacing:.02em;color:#9c8f6e}
.do-padel-intent-aside a{color:#c6b487;text-decoration:none;border-bottom:1px solid rgba(214,177,87,.3);padding-bottom:1px;transition:color .18s ease,border-color .18s ease}
.do-padel-intent-aside a:hover{color:var(--brand-gold);border-color:rgba(214,177,87,.7)}
@media(max-width:720px){
  .do-padel-flagship{grid-template-columns:1fr;gap:22px;border-radius:22px}
  .do-flag-caps{grid-template-columns:1fr 1fr}
  .do-flag-title{font-size:clamp(28px,8vw,40px)}
}
@media(max-width:430px){.do-flag-caps{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.do-padel-flagship,.do-flag-cta .a,.do-flag-enter-go,.do-flag-enter-go .a{transition:none}.do-flag-enter-pulse{animation:none}.do-padel-flagship:hover .do-flag-enter-go,.do-padel-flagship:focus-visible .do-flag-enter-go{letter-spacing:.17em}.do-flag-entrance:active{transform:none}}

.do-padel-editorial{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:clamp(46px,8vh,92px) 20px calc(58px + env(safe-area-inset-bottom));background:#030303;font-family:Georgia,'Times New Roman',serif;position:relative;overflow:hidden}
.do-padel-editorial::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 16%,rgba(214,177,87,.055),transparent 34%),radial-gradient(circle at 78% 70%,rgba(139,197,46,.045),transparent 30%);mix-blend-mode:screen}
.do-padel-editorial::after{content:"";position:absolute;inset:-12%;pointer-events:none;opacity:.04;background-image:linear-gradient(90deg,rgba(214,177,87,.9) 1px,transparent 1px),linear-gradient(0deg,rgba(214,177,87,.65) 1px,transparent 1px),linear-gradient(32deg,transparent 49.7%,rgba(139,197,46,.78) 50%,transparent 50.3%);background-size:168px 168px,168px 168px,320px 320px;background-position:center;mask-image:radial-gradient(circle at 50% 46%,#000 0%,transparent 72%);-webkit-mask-image:radial-gradient(circle at 50% 46%,#000 0%,transparent 72%)}
.do-padel-editorial-inner{position:relative;z-index:1;width:min(100%,960px);margin:0 auto;text-align:center;animation:screenFade .7s cubic-bezier(.22,.9,.36,1) both}
.do-padel-editorial-kicker{margin:0 0 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.36em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-editorial-title{margin:0 auto 18px;max-width:820px;font-weight:400;font-size:clamp(30px,5.6vw,52px);line-height:1.12;letter-spacing:.07em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 42%,#a76f1e 72%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 7px rgba(214,177,87,.08))}
.do-padel-editorial-sub{margin:0 auto 32px;max-width:640px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.8vw,16px);line-height:1.75;letter-spacing:.035em;color:#d8c79b}
/* SEARCH-INTENT LEAD — one short line at the top of a section, written in the words a
   visitor would actually use themselves ("Looking for a padel club near you?"), placed
   inside the introduction the section already has. It is ordinary visible copy, not SEO
   furniture: the sentence a search engine reads here is the same sentence a person
   reads. Styled as a quieter sibling of .do-padel-editorial-sub above it, and it
   inherits whatever alignment its own section already sets. */
.do-padel-search-lead{margin:0 auto clamp(22px,3vw,30px);max-width:640px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.7vw,15.5px);line-height:1.75;letter-spacing:.035em;color:rgba(216,199,155,.92)}
.do-padel-clubs-page .do-padel-search-lead{margin-left:0;margin-right:0}
#doPadelHealth .do-health-intro .do-padel-search-lead{margin:clamp(14px,2vw,18px) auto 0}
.do-advertise-intro + .do-advertise-intro{margin-top:clamp(10px,1.6vw,14px)}
.do-padel-editorial-rule{width:82px;height:1px;margin:0 auto clamp(32px,4.7vw,48px);background:linear-gradient(90deg,transparent,rgba(139,197,46,.88),transparent);opacity:.9}
.do-padel-brand-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,20px);text-align:left}
.do-padel-brand-card{position:relative;display:flex;flex-direction:column;min-height:220px;border:1px solid var(--line);border-radius:24px;padding:24px 22px 22px;text-decoration:none;color:#f7f2e6;background:linear-gradient(180deg,rgba(16,12,7,.72),rgba(4,4,4,.82));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 20px 56px rgba(0,0,0,.55),0 0 0 1px rgba(139,197,46,.156),0 0 24px rgba(139,197,46,.19),0 0 44px rgba(139,197,46,.12),inset 0 0 44px rgba(214,177,87,.04),inset 0 1px 0 rgba(255,235,180,.10);transition:transform .42s cubic-bezier(.2,.8,.22,1),box-shadow .18s ease,border-color .18s ease;overflow:hidden}
.do-padel-brand-card:hover,.do-padel-brand-card:focus-visible{transform:translateY(-6px) scale(1.01);border-color:rgba(214,177,87,.55);box-shadow:0 28px 66px rgba(0,0,0,.7),0 0 0 1px rgba(139,197,46,.18),0 0 24px rgba(139,197,46,.22),0 0 44px rgba(139,197,46,.14),0 0 38px rgba(214,177,87,.18),inset 0 0 52px rgba(214,177,87,.07),inset 0 1px 0 rgba(255,235,180,.14);outline:none}
.do-padel-brand-card:active{transform:translateY(-2px) scale(.995);border-color:rgba(214,177,87,.64);box-shadow:0 24px 58px rgba(0,0,0,.66),0 0 0 1px rgba(139,197,46,.30),0 0 34px rgba(139,197,46,.34),inset 0 0 48px rgba(214,177,87,.06)}
.do-padel-brand-name{margin:0 0 12px;font-weight:400;font-size:clamp(21px,2.4vw,27px);letter-spacing:.09em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 46%,#a76f1e 78%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text}
.do-padel-brand-desc{margin:0 0 28px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.62;color:#d8c79b;letter-spacing:.015em}
.do-padel-brand-action{margin-top:auto;display:flex;align-items:center;gap:12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-brand-action span:first-child{font-family:Georgia,'Times New Roman',serif;font-size:24px;line-height:1;color:var(--gold)}
/* Brand card — future-ready meta tags (featured / partner) and the Visit Brand
   action. The action resolves to a real link only when a URL exists in the brand
   data; until then it renders as a clearly disabled control, so a tracked referral
   link can later be dropped into the data without touching this page. */
.do-padel-brand-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;min-height:0}
.do-padel-brand-tag{align-self:flex-start;padding:4px 10px;border:1px solid rgba(139,197,46,.34);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-brand-tag.is-featured{border-color:rgba(214,177,87,.5);color:var(--gold)}
.do-padel-brand-visit{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(139,197,46,.5);border-radius:999px;padding:12px 22px;background:rgba(139,197,46,.08);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#f4ead4;text-decoration:none;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.do-padel-brand-visit:hover,.do-padel-brand-visit:focus-visible{border-color:rgba(139,197,46,.8);box-shadow:0 0 24px rgba(139,197,46,.2);outline:none}
.do-padel-brand-visit:active{transform:scale(.98)}
.do-padel-brand-visit .do-padel-brand-visit-arrow{font-family:Georgia,'Times New Roman',serif;font-size:16px;line-height:1;color:var(--gold)}
.do-padel-brand-visit.is-disabled{cursor:default;opacity:.55;border-color:rgba(214,177,87,.28);background:rgba(214,177,87,.04);color:rgba(214,177,87,.72);pointer-events:none}
.do-padel-brand-visit.is-disabled .do-padel-brand-visit-arrow{color:rgba(214,177,87,.5)}
.do-padel-brand-soon{margin:12px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(214,177,87,.5)}
.do-padel-commercial-partner{margin:clamp(54px,7vw,84px) auto 0;padding:clamp(38px,5.5vw,58px) 0 clamp(8px,2vw,18px);max-width:760px;text-align:center;border-top:1px solid rgba(214,177,87,.22);position:relative}
.do-padel-commercial-partner::before{content:"";position:absolute;left:50%;top:-1px;width:min(72%,420px);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(214,177,87,.78),transparent);box-shadow:0 0 18px rgba(214,177,87,.16)}
.do-padel-commercial-partner h2{margin:0 0 18px;font-weight:400;font-size:clamp(23px,3.4vw,34px);line-height:1.2;letter-spacing:.12em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 46%,#a76f1e 78%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 5px rgba(214,177,87,.07))}
.do-padel-commercial-partner p{margin:0 auto 12px;max-width:620px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.8vw,16px);line-height:1.72;letter-spacing:.035em;color:#d8c79b}
.do-padel-commercial-partner .btn{display:inline-flex;align-items:center;justify-content:center;width:auto;max-width:100%;min-width:min(100%,340px);margin-top:26px;padding-left:28px;padding-right:28px;text-decoration:none}
.do-padel-partners-page .do-padel-editorial-inner{width:min(100%,1040px)}
.do-padel-partners-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(16px,2.6vw,26px);margin:0 auto clamp(42px,6vw,62px);text-align:left}
.do-padel-partners-section{position:relative;border:1px solid rgba(214,177,87,.18);border-radius:24px;padding:clamp(22px,3vw,32px);background:linear-gradient(180deg,rgba(16,12,7,.68),rgba(4,4,4,.84));box-shadow:0 22px 58px rgba(0,0,0,.48),0 0 0 1px rgba(139,197,46,.10),inset 0 1px 0 rgba(255,235,180,.08);overflow:hidden}
.do-padel-partners-section::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,rgba(139,197,46,.82),rgba(214,177,87,.72),transparent);opacity:.8}
.do-padel-partners-section.is-wide{grid-column:1/-1}
.do-padel-partners-section h2{margin:0 0 18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.8vw,16px);letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green);font-weight:600}
.do-padel-partners-section p{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.7vw,16px);line-height:1.75;letter-spacing:.025em;color:#d8c79b}
.do-padel-partners-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px}
.do-padel-partners-list li{position:relative;padding-left:17px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.45;letter-spacing:.04em;color:#efe3c3}
.do-padel-partners-list li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--brand-green);box-shadow:0 0 12px rgba(139,197,46,.48)}
.do-padel-partners-cta{max-width:820px;margin:0 auto;padding:clamp(34px,5vw,54px) clamp(22px,4vw,42px);border:1px solid rgba(139,197,46,.34);border-radius:28px;background:radial-gradient(circle at 50% 0,rgba(139,197,46,.12),transparent 46%),linear-gradient(180deg,rgba(16,12,7,.72),rgba(4,4,4,.88));box-shadow:0 26px 70px rgba(0,0,0,.55),0 0 34px rgba(139,197,46,.12),inset 0 1px 0 rgba(255,235,180,.1)}
.do-padel-partners-cta h2{margin:0 auto 16px;max-width:680px;font-size:clamp(24px,4vw,38px);font-weight:400;line-height:1.18;letter-spacing:.11em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 46%,#a76f1e 78%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text}
.do-padel-partners-cta p{margin:0 auto 26px;max-width:560px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.7;letter-spacing:.035em;color:#d8c79b}
.do-padel-partners-cta .btn{display:inline-flex;align-items:center;justify-content:center;width:auto;max-width:100%;min-width:min(100%,290px);padding-left:28px;padding-right:28px;text-decoration:none}
.do-padel-clubs-page{--gold:#f1d488;--brand-green:#a8dc4c}
.do-padel-clubs-page .do-padel-editorial-inner{width:min(100%,1080px);text-align:left}
.do-padel-clubs-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,320px);gap:clamp(20px,4vw,44px);align-items:end;margin:0 0 clamp(24px,4vw,38px)}
.do-padel-clubs-page .do-padel-editorial-kicker,.do-padel-clubs-page .do-padel-editorial-title,.do-padel-clubs-page .do-padel-editorial-sub{text-align:left;margin-left:0}
.do-padel-clubs-page .do-padel-editorial-title{max-width:760px;margin-bottom:16px}
.do-padel-clubs-page .do-padel-editorial-sub{max-width:640px;margin-bottom:0}
.do-padel-clubs-stat{border:1px solid rgba(214,177,87,.22);border-radius:24px;padding:22px;background:linear-gradient(180deg,rgba(18,14,8,.74),rgba(4,4,4,.84));box-shadow:0 24px 62px rgba(0,0,0,.58),0 0 0 1px rgba(139,197,46,.12),inset 0 1px 0 rgba(255,235,180,.08)}
.do-padel-clubs-stat strong{display:block;font-family:Georgia,'Times New Roman',serif;font-size:42px;line-height:1;color:var(--brand-green);font-weight:400;text-shadow:0 0 22px rgba(139,197,46,.22)}
.do-padel-clubs-stat span{display:block;margin-top:10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(238,206,138,.95);line-height:1.5}
.do-padel-clubs-stat-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,2.2vw,18px);align-items:start}
.do-padel-clubs-stat-pair>div{min-width:0;display:flex;flex-direction:column}
/* THE THIRD FIGURE. The statistics card keeps its existing two-up grid, its
   existing typography and its existing spacing exactly as they are; the third
   statistic simply runs the full width of the second row rather than sitting in
   a half-width column on its own. One rule, scoped to the trio modifier, so
   every other statistics card on the platform is untouched. */
.do-padel-clubs-stat-trio>div:nth-child(3){grid-column:1/-1}
.do-padel-clubs-stat-pair span{margin-top:0;margin-bottom:10px}
/* CLUB TOTAL / COUNTRY TOTAL DIGIT CONSISTENCY.
   The statistics card inherits Georgia, which draws OLD-STYLE (text) figures:
   1, 2 and 0 sit at x-height while 6 and 8 rise to the ascender. That is why the
   leading "1" in a total such as 1,866 reads as visually smaller and lighter
   than the digits after it. tabular-nums alone only equalises WIDTH, not height,
   so the mismatch survived it. Rendering these two figures in the DO→PADEL brand
   face — already loaded for this page, so no extra font request — gives lining
   figures: every digit shares one cap height, one weight and one width. Scoped
   to .do-padel-clubs-stat-pair, which exists only in this top Clubs statistics
   panel, so every other statistic card on the platform is untouched. The value
   itself is still whatever the live club-count logic writes in. */
.do-padel-clubs-stat-pair strong{font-size:clamp(27px,3.6vw,38px);line-height:1;font-weight:500;white-space:nowrap;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1;letter-spacing:.005em}
.do-padel-clubs-stat span.do-padel-clubs-stat-note{margin-top:16px;padding-top:14px;border-top:1px solid rgba(214,177,87,.18)}
.do-padel-clubs-panel{border:1px solid rgba(222,186,110,.30);border-radius:28px;padding:clamp(18px,3vw,28px);background:linear-gradient(180deg,rgba(13,12,8,.78),rgba(3,3,3,.88));box-shadow:0 34px 90px rgba(0,0,0,.65),0 0 0 1px rgba(139,197,46,.10),inset 0 1px 0 rgba(255,235,180,.08)}
.do-padel-clubs-crumbs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif}
.do-padel-clubs-crumb{border:1px solid rgba(228,194,120,.42);border-radius:999px;background:rgba(214,177,87,.04);color:rgba(248,225,152,.94);padding:9px 13px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.do-padel-clubs-crumb.is-active{border-color:rgba(139,197,46,.54);color:var(--brand-green);background:rgba(139,197,46,.07)}
.do-padel-clubs-stage{display:grid;gap:18px}
.do-padel-clubs-stage-head{display:flex;justify-content:space-between;gap:16px;align-items:end}
.do-padel-clubs-stage-title{margin:0;font-size:clamp(24px,3.4vw,34px);letter-spacing:.08em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#c68f2c 0%,#ffe59a 46%,#d09638 78%,#ffe89f 100%);-webkit-background-clip:text;background-clip:text}
.do-padel-clubs-stage-meta{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(168,220,76,.96)}
.do-padel-clubs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.do-padel-clubs-choice,.do-padel-club-card{position:relative;border:1px solid rgba(222,186,110,.30);border-radius:22px;padding:22px 20px;background:linear-gradient(180deg,rgba(19,15,9,.72),rgba(4,4,4,.84));box-shadow:0 18px 46px rgba(0,0,0,.52),0 0 0 1px rgba(139,197,46,.10),inset 0 1px 0 rgba(255,235,180,.08);color:#f7f2e6;text-decoration:none;cursor:pointer;overflow:hidden;transition:transform .28s cubic-bezier(.2,.8,.22,1),border-color .28s ease,box-shadow .28s ease}
.do-padel-clubs-choice:hover,.do-padel-clubs-choice:focus-visible,.do-padel-club-card:hover,.do-padel-club-card:focus-visible{transform:translateY(-4px);border-color:rgba(214,177,87,.50);box-shadow:0 24px 58px rgba(0,0,0,.65),0 0 28px rgba(139,197,46,.14),inset 0 1px 0 rgba(255,235,180,.11);outline:none}
.do-padel-clubs-choice::after{content:"\2192";position:absolute;right:20px;bottom:18px;color:var(--gold);font-family:Georgia,'Times New Roman',serif;font-size:22px;opacity:.65}
.do-padel-clubs-choice-name,.do-padel-club-name{margin:0 0 10px;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(20px,2.6vw,27px);line-height:1.2;letter-spacing:.04em;color:#f6e6bc}
/* COUNTRY NAME COLOUR — country-selection screens only. The country name is
   the one thing on those screens that names a place you can enter, so it carries
   the DO→PADEL lime the page already declares (--brand-green, #a8dc4c on
   .do-padel-clubs-page — the same lime the active crumb and the stage meta line
   use). No new shade is introduced. One rule, shared by the Open Clubs country
   list and the Clubs in Development country list so the two read identically,
   and scoped to the country grids' own modifier so region, city, club and
   development cards keep the cream they have today. Colour is the only
   declaration here: the face, size, weight, letter-spacing, spacing, card
   geometry, gold borders, gold arrows and the secondary line beneath each name
   (READY · REGIONS / CLUBS, or the development count) are all untouched. */
.do-padel-clubs-grid--countries .do-padel-clubs-choice-name{color:var(--brand-green)}
/* THE COUNTRY CARD'S ARROW BELONGS TO ITS COUNTRY NAME. At the country level the
   arrow takes the same --brand-green the name above it carries, so the two read
   as one object rather than a green name with a gold tail. It is the token, not
   a copy of it, and the arrow is held at full opacity here (the shared rule
   dims it to .65) so the green rendered on screen is exactly the green of the
   name and not a dimmed blend of it against the card.
   COUNTRY LEVEL ONLY. Region, city, club and development arrows keep the gold
   at its existing opacity, which is what preserves the hierarchy: green marks
   the top of the directory, gold marks every level inside it. Only colour and
   opacity are set — the glyph, its position, size and face are untouched. */
#doPadelClubs .do-padel-clubs-grid--countries .do-padel-clubs-choice::after{color:var(--brand-green);opacity:1}
.do-padel-clubs-choice-meta,.do-padel-club-location{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;line-height:1.55;letter-spacing:.12em;text-transform:uppercase;color:rgba(230,218,186,.9)}
/* CLUB DIRECTORY CARD — one shared presentation for every club in the
   directory, today's records and every club added later. The club stays the
   hero: name, location and genuine facts lead, the actions sit on their own
   line, and the DO→PADEL signature is a quiet platform mark in the corner the
   words "View Club" used to occupy. The card is a container (not a link) so the
   real CALL / WEBSITE / BOOK / DIRECTIONS links can live inside it; a stretched
   overlay link carries the whole-card tap to the same club profile as before. */
.do-padel-club-card{min-height:230px;display:flex;flex-direction:column;gap:14px;padding:24px 22px}
.do-padel-club-card-link{position:absolute;inset:0;z-index:1;border-radius:inherit;font-size:0;line-height:0;color:transparent}
.do-padel-club-card-link:focus-visible{outline:2px solid rgba(228,194,120,.62);outline-offset:-5px;border-radius:inherit}
.do-padel-club-card:has(.do-padel-club-card-link:focus-visible),.do-padel-club-card:has(.do-padel-club-card-link:hover){transform:translateY(-4px);border-color:rgba(214,177,87,.50);box-shadow:0 24px 58px rgba(0,0,0,.65),0 0 28px rgba(139,197,46,.14),inset 0 1px 0 rgba(255,235,180,.11)}
.do-padel-club-identity{display:grid;gap:9px}
.do-padel-club-name{margin:0;overflow-wrap:anywhere}
.do-padel-club-specs{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.do-padel-club-pill{border:1px solid rgba(139,197,46,.30);border-radius:999px;padding:7px 11px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(139,197,46,.92);background:rgba(139,197,46,.05);white-space:nowrap}
.do-padel-club-foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px;padding-top:15px;border-top:1px solid rgba(214,177,87,.13)}
.do-padel-club-mini-actions{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:7px;margin:0;flex:1 1 auto;min-width:0}
.do-padel-club-mini-actions a{border:1px solid rgba(228,194,120,.28);border-radius:999px;padding:7px 11px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(246,226,171,.86);background:rgba(214,177,87,.04);text-decoration:none;white-space:nowrap;transition:border-color .25s ease,color .25s ease,background-color .25s ease}
.do-padel-club-mini-actions a:hover,.do-padel-club-mini-actions a:focus-visible{border-color:rgba(228,194,120,.5);color:#f8ebc6;background:rgba(214,177,87,.09);outline:none}
/* DO→PADEL SIGNATURE — the exact master mark already served to the live landing
   page (assets/do-master-logo-stronger-landing.png), reused as-is at a small
   responsive size. The file is untouched: the frame simply shows the mark, and
   the artwork's own strapline sits below that frame so the strapline can be set
   as brand text and dropped cleanly on narrow screens where it would not be
   legible. It is a platform signature only — it claims no club relationship. */
.do-padel-club-signature{flex:0 0 auto;margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:6px;pointer-events:none}
.do-padel-club-signature-mark{display:block;width:76px;aspect-ratio:934/462;overflow:hidden;opacity:.94}
.do-padel-club-signature-mark img{display:block;width:100%;height:auto;mix-blend-mode:lighten;user-select:none;-webkit-user-drag:none}
.do-padel-club-signature-line{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:7.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;line-height:1;white-space:nowrap}
.do-padel-club-signature-line .do-padel-club-signature-neutral{color:#fff}
.do-padel-clubs-empty{display:grid;place-items:center;min-height:260px;border:1px solid rgba(214,177,87,.18);border-radius:24px;background:radial-gradient(circle at 50% 10%,rgba(139,197,46,.08),transparent 36%),rgba(214,177,87,.035);text-align:center;padding:34px}
.do-padel-clubs-empty h2{margin:0 0 12px;font-size:clamp(24px,3.4vw,34px);letter-spacing:.12em;text-transform:uppercase}
.do-padel-clubs-empty p{margin:0 auto;max-width:470px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:#ebdfbe}
.do-padel-clubs-empty .do-padel-club-action{margin-top:18px}
/* Clubs in Development (Coming Soon) — a visually distinct, clearly separated
   panel beneath the live operational directory. It reuses the club-directory
   surface and crumb/grid styling but carries a green "future" accent, a status
   pill and a development detail card so it can never be mistaken for a live club. */
.do-padel-dev-panel{margin-top:clamp(26px,4vw,44px);border-color:rgba(139,197,46,.30);box-shadow:0 34px 90px rgba(0,0,0,.65),0 0 0 1px rgba(139,197,46,.16),inset 0 1px 0 rgba(255,235,180,.08)}
.do-padel-dev-panel::before{content:"";display:block;height:1px;margin:-4px 0 22px;background:linear-gradient(90deg,transparent,rgba(139,197,46,.5),transparent)}
.do-padel-dev-head{margin:0 0 20px}
.do-padel-dev-title{margin:6px 0 12px;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(24px,3.4vw,34px);letter-spacing:.08em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#7fae2c 0%,#c7ee7a 48%,#8bc52e 82%,#d8f0a0 100%);-webkit-background-clip:text;background-clip:text}
.do-padel-dev-title span{color:rgba(168,220,76,.9);font-size:.7em;letter-spacing:.16em;background:none;-webkit-text-fill-color:currentColor}
.do-padel-dev-sub{margin:0;max-width:640px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.6;color:rgba(230,218,186,.82)}
.do-padel-dev-panel .do-padel-clubs-crumb.is-active{border-color:rgba(139,197,46,.6);color:#a8dc4c;background:rgba(139,197,46,.09)}
/* Development status badge — exactly one per development. A neutral base pill
   plus a per-status colour modifier (green / amber / blue / white) and a glowing
   dot, so the lifecycle stage reads at a glance and matches the Status Legend. */
.do-padel-dev-status{display:inline-flex;align-items:center;gap:7px;margin:0 0 10px;padding:5px 12px;border:1px solid rgba(230,224,208,.32);border-radius:999px;background:rgba(255,255,255,.05);color:rgba(236,230,212,.92);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.2em;text-transform:uppercase}
.do-padel-dev-status::before{content:"";width:7px;height:7px;border-radius:50%;flex:none;background:currentColor;box-shadow:0 0 8px currentColor}
.do-padel-dev-status.is-opening-soon{border-color:rgba(139,197,46,.5);background:rgba(139,197,46,.10);color:#bfe487}
.do-padel-dev-status.is-under-construction{border-color:rgba(242,193,78,.5);background:rgba(242,193,78,.10);color:#f4cf72}
.do-padel-dev-status.is-planning-approved{border-color:rgba(96,165,224,.52);background:rgba(96,165,224,.12);color:#8fc4ef}
.do-padel-dev-status.is-planning-submitted{border-color:rgba(230,224,208,.34);background:rgba(255,255,255,.06);color:rgba(236,230,212,.92)}
/* Status Legend — compact, premium key shown directly beneath the introduction
   and above the country selector. Colours mirror the badges exactly. */
.do-padel-dev-legend{margin:0 0 22px;padding:18px 20px;border:1px solid rgba(139,197,46,.20);border-radius:18px;background:linear-gradient(180deg,rgba(15,18,9,.60),rgba(4,4,4,.72));box-shadow:0 14px 40px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,235,180,.05)}
.do-padel-dev-legend-title{margin:0 0 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(168,220,76,.9)}
.do-padel-dev-legend-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px 22px}
.do-padel-dev-legend-item{display:flex;align-items:flex-start;gap:10px}
.do-padel-dev-legend-dot{width:10px;height:10px;border-radius:50%;margin-top:3px;flex:none;background:currentColor;box-shadow:0 0 8px currentColor}
.do-padel-dev-legend-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.do-padel-dev-legend-name{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:currentColor}
.do-padel-dev-legend-desc{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;line-height:1.45;color:rgba(230,222,198,.78)}
.do-padel-dev-legend-item.is-opening-soon{color:#bfe487}
.do-padel-dev-legend-item.is-under-construction{color:#f4cf72}
.do-padel-dev-legend-item.is-planning-approved{color:#8fc4ef}
.do-padel-dev-legend-item.is-planning-submitted{color:rgba(236,230,212,.92)}
@media (max-width:640px){.do-padel-dev-legend{padding:16px 16px}.do-padel-dev-legend-list{grid-template-columns:1fr;gap:12px}}
/* Development Information — gentle guidance note sitting between the Status
   Legend and the developments navigation. Intentionally lighter than the
   legend so it reads as helpful context, not a legal disclaimer. */
.do-padel-dev-info{margin:0 0 22px;padding:16px 20px;border:1px solid rgba(139,197,46,.14);border-left:3px solid rgba(168,220,76,.45);border-radius:16px;background:linear-gradient(180deg,rgba(15,18,9,.42),rgba(4,4,4,.55));box-shadow:inset 0 1px 0 rgba(255,235,180,.04)}
.do-padel-dev-info-title{margin:0 0 8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(168,220,76,.82)}
.do-padel-dev-info-text{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.6;color:rgba(230,222,198,.72)}
@media (max-width:640px){.do-padel-dev-info{padding:14px 16px}.do-padel-dev-info-text{font-size:12px}}
.do-padel-dev-card{position:relative;border:1px solid rgba(139,197,46,.26);border-radius:22px;padding:22px 20px;background:linear-gradient(180deg,rgba(15,18,9,.72),rgba(4,4,4,.84));box-shadow:0 18px 46px rgba(0,0,0,.52),0 0 0 1px rgba(139,197,46,.12),inset 0 1px 0 rgba(255,235,180,.06);color:#f7f2e6}
.do-padel-dev-card h3{margin:0 0 8px;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(19px,2.4vw,24px);line-height:1.2;letter-spacing:.03em;color:#eaf3d6}
.do-padel-dev-card .do-padel-dev-loc{margin:0 0 12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;line-height:1.55;letter-spacing:.14em;text-transform:uppercase;color:rgba(230,218,186,.82)}
.do-padel-dev-card p.do-padel-dev-desc{margin:0 0 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.6;color:rgba(238,230,208,.88)}
.do-padel-dev-meta{list-style:none;margin:0 0 4px;padding:0;display:grid;gap:8px}
.do-padel-dev-meta div{display:grid;grid-template-columns:130px 1fr;gap:10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;line-height:1.5}
.do-padel-dev-meta dt{margin:0;color:rgba(168,220,76,.9);letter-spacing:.12em;text-transform:uppercase;font-size:9.5px;align-self:center}
.do-padel-dev-meta dd{margin:0;color:#efe7cf}
.do-padel-dev-meta a{color:#bfe487;text-decoration:none;border-bottom:1px solid rgba(139,197,46,.4)}
.do-padel-dev-meta a:hover{color:#d8f0a0}
@media (max-width:640px){.do-padel-dev-meta div{grid-template-columns:1fr}.do-padel-dev-meta dt{align-self:start}}
/* ── THE CLUBS DIRECTORY LUMINOSITY LIFT ─────────────────────────────────────
   The directory read murky on a phone: the cream secondary text sat under 90%
   alpha, the gold hairlines under a third, and the cards were dark enough that
   their edge against the black page all but disappeared on a small screen held
   at arm's length. This block lifts that — same design, same palette, more
   light.

   IT IS AN OVERRIDE BLOCK, NOT AN EDIT OF THE COMPONENTS. Every rule below is
   scoped to #doPadelClubs, the Clubs route's own wrapper, and the shared
   component rules above are left exactly as they were. That matters because the
   Play, Events, News and Improve pages all carry .do-padel-clubs-page and reuse
   these very classes: brightening them in place would have brightened four other
   DO→PADEL pages nobody asked about. Scoping this way follows the pattern
   #doPadelNews already uses further down. Nothing here changes a font, a size, a
   weight, a letter-spacing, a margin, a padding, a radius, a border width or a
   layout value — every declaration is a colour, an alpha or an opacity.

   AND IT INTRODUCES NO NEW COLOUR. Almost every value below is the EXISTING
   value at a higher alpha — same RGB triplet, less transparency, which is what
   "more luminosity, same colours" actually means in code. Where a colour is an
   opaque hex the replacement is a cream this same component already uses
   (#f7f2e6 is the card's own text colour, #ebdfbe the empty state's), so no
   fifth or sixth cream enters the palette. The two gradient headings are the one
   exception and are handled at the end. */

/* SECONDARY CREAM TEXT — the readability change that matters most on a phone.
   The card meta line (READY · N REGIONS / N CLUBS, club locations) moves from a
   90%-alpha warm cream to the card's own #f7f2e6 near-full, which is the single
   biggest legibility gain in the directory. The development panel's prose was
   the dimmest text on the page at 72–88% alpha and is simply brought up to the
   same footing. Alpha and colour only; every one of these keeps its typeface,
   size, weight, letter-spacing and case. */
#doPadelClubs .do-padel-editorial-sub{color:#ebdfbe}
#doPadelClubs .do-padel-clubs-choice-meta,#doPadelClubs .do-padel-club-location{color:rgba(247,242,230,.94)}
#doPadelClubs .do-padel-clubs-empty p{color:#f7f2e6}
#doPadelClubs .do-padel-clubs-stat span{color:rgba(238,206,138,1)}
#doPadelClubs .do-padel-club-mini-actions a{color:rgba(246,226,171,1)}
#doPadelClubs .do-padel-dev-sub{color:rgba(230,218,186,.96)}
#doPadelClubs .do-padel-dev-legend-desc{color:rgba(230,222,198,.94)}
#doPadelClubs .do-padel-dev-info-text{color:rgba(230,222,198,.92)}
#doPadelClubs .do-padel-dev-card p.do-padel-dev-desc{color:rgba(238,230,208,1)}
#doPadelClubs .do-padel-dev-card .do-padel-dev-loc{color:rgba(230,218,186,.96)}

/* GOLD BORDERS AND GOLD DETAIL — pure alpha lifts on the exact golds already
   there. A 30%-alpha hairline is close to invisible on a bright phone screen
   outdoors; these land nearer half, which is enough to draw the card and the
   panel clearly without the border ever reading as a drawn line. The breadcrumb
   and the club card's mini action links are the directory's gold navigation and
   were the most subdued of all, so their edges and labels come up together.
   Border WIDTHS and RADII are not touched — only the colour of the pixel. */
#doPadelClubs .do-padel-clubs-choice,#doPadelClubs .do-padel-club-card{border-color:rgba(222,186,110,.44)}
#doPadelClubs .do-padel-clubs-panel{border-color:rgba(222,186,110,.44)}
/* THE DEVELOPMENTS PANEL KEEPS ITS GREEN EDGE. It is a .do-padel-clubs-panel too,
   so the gold lift above would otherwise have repainted its deliberate green
   perimeter gold and cost that panel its identity. It gets the same alpha lift in
   its OWN hue instead. Same specificity as the rule above and placed after it, so
   source order decides — do not reorder these two. */
#doPadelClubs .do-padel-dev-panel{border-color:rgba(139,197,46,.44)}
/* The development card's own green edge, lifted in its own hue for the same
   reason. It is NOT a .do-padel-club-card, so the gold card lift above never
   reaches it and this is the only rule that touches its perimeter. */
#doPadelClubs .do-padel-dev-card{border-color:rgba(139,197,46,.40)}
#doPadelClubs .do-padel-clubs-stat{border-color:rgba(214,177,87,.34)}
#doPadelClubs .do-padel-clubs-empty{border-color:rgba(214,177,87,.30)}
#doPadelClubs .do-padel-club-foot{border-top-color:rgba(214,177,87,.22)}
#doPadelClubs .do-padel-clubs-stat span.do-padel-clubs-stat-note{border-top-color:rgba(214,177,87,.28)}
#doPadelClubs .do-padel-clubs-crumb{border-color:rgba(228,194,120,.56);color:rgba(248,225,152,1)}
#doPadelClubs .do-padel-club-mini-actions a{border-color:rgba(228,194,120,.42)}
/* THE STATE RULES HAVE TO BE RE-STATED AT THIS SCOPE, AND THIS IS THE SUBTLE PART.
   An ID outranks any number of classes, so every #doPadelClubs rule above silently
   outranks the component's own :hover, :focus-visible, :has() and .is-active rules
   — which are class-only. Left as they were, the resting border set above would
   have won over the hover border, and the gold crumb colour would have won over
   the ACTIVE crumb's green: the card would stop responding to hover and the
   breadcrumb would stop showing you where you are. So each affected state is
   re-declared here at this scope, carrying its own existing colour lifted by the
   same small step as its resting counterpart, which keeps every state's delta
   intact. Only border-color and color appear here; transform, box-shadow and
   background on those states are still the component's own. */
#doPadelClubs .do-padel-clubs-choice:hover,#doPadelClubs .do-padel-clubs-choice:focus-visible,#doPadelClubs .do-padel-club-card:hover,#doPadelClubs .do-padel-club-card:focus-visible{border-color:rgba(214,177,87,.62)}
#doPadelClubs .do-padel-club-card:has(.do-padel-club-card-link:focus-visible),#doPadelClubs .do-padel-club-card:has(.do-padel-club-card-link:hover){border-color:rgba(214,177,87,.62)}
#doPadelClubs .do-padel-club-mini-actions a:hover,#doPadelClubs .do-padel-club-mini-actions a:focus-visible{border-color:rgba(228,194,120,.62);color:#f8ebc6}
#doPadelClubs .do-padel-clubs-crumb.is-active{border-color:rgba(139,197,46,.66);color:var(--brand-green)}
#doPadelClubs .do-padel-dev-panel .do-padel-clubs-crumb.is-active{border-color:rgba(139,197,46,.72);color:#a8dc4c}
/* The gold arrow on every level INSIDE a country. Brighter gold, still gold —
   this is what keeps the hierarchy the green country arrow sits at the top of.
   The country-level arrow is unaffected: its own rule higher up carries an ID
   plus two classes and outranks this one. */
#doPadelClubs .do-padel-clubs-choice::after{opacity:.82}

/* PAGE VERSUS CARD — the separation the brief asks for. These surfaces are warm
   near-blacks layered over the black page, and at their existing alphas the top
   of a card resolved to about rgb(14,11,6): a card you could only find by its
   hairline. Each stop comes up a few points in its OWN hue, so the top of a card
   now lands near rgb(22,18,11) and its foot near rgb(8,8,7). Both are still
   unmistakably black — no surface turns grey, and the page background itself is
   not touched at all — but the card now has an edge you can see before you find
   its border. Gradient geometry, angle and stop positions are unchanged.
   These set background-IMAGE, not the background shorthand: the shorthand would
   silently reset background-clip and background-color along with the image. */
#doPadelClubs .do-padel-clubs-choice,#doPadelClubs .do-padel-club-card{background-image:linear-gradient(180deg,rgba(27,22,13,.82),rgba(9,8,6,.90))}
#doPadelClubs .do-padel-clubs-panel{background-image:linear-gradient(180deg,rgba(20,18,12,.86),rgba(8,8,6,.92))}
#doPadelClubs .do-padel-clubs-stat{background-image:linear-gradient(180deg,rgba(26,21,12,.84),rgba(9,8,6,.90))}
#doPadelClubs .do-padel-dev-card{background-image:linear-gradient(180deg,rgba(22,26,13,.82),rgba(9,9,7,.90))}

/* ── THE COMPACT DIRECTORY CARD, REDESIGNED ──────────────────────────────────
   PRESENTATION ONLY, AND ONLY THIS CARD. Every rule below is scoped to
   .do-padel-club-card, which the club directory card is the only user of. The
   shared directory pieces it borrows (.do-padel-club-name, -location, -foot,
   -signature) are re-set only INSIDE the card, so the games, events, resources
   and profile surfaces that also use those classes are untouched.

   WHY IT LOOKS LIKE THIS. The card is now the same design language as the
   approved full club profile it opens: a near-black ground, one fine gold
   hairline, the club name set large in the profile's own serif, and the facts
   separated by the profile's small gold dashes rather than by pills. It carries
   what a visitor scans by — name, place, courts / setting / access — and nothing
   else, so the name can take the space the removed link row used to hold.
   Placed after the #doPadelClubs legibility block above because these rules
   deliberately replace that block's card surface and gold values; the card's
   hover, focus and lift states are still the ones declared there and above. */
#doPadelClubs .do-padel-club-card,.do-padel-club-card{border-color:rgba(241,212,136,.24);background-image:linear-gradient(180deg,rgba(11,10,7,.96),rgba(3,3,3,.98))}
.do-padel-club-card.do-padel-club-card{--dpc-gold:#f1d488;--dpc-rule:rgba(241,212,136,.24);min-height:0;display:flex;flex-direction:column;gap:0;border-radius:18px;padding:clamp(24px,3vw,34px) clamp(22px,2.6vw,30px) clamp(18px,2.2vw,24px)}
.do-padel-club-card .do-padel-club-identity{display:block}
/* The card's primary element. The full profile's name treatment at the card's
   own scale: same serif, same uppercase, same near-white ink. */
.do-padel-club-card .do-padel-club-name{margin:0;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(28px,3.4vw,42px);line-height:.98;letter-spacing:.01em;text-transform:uppercase;color:#f5f1e8;text-wrap:balance;overflow-wrap:anywhere}
/* WHERE THE CLUB IS — the profile's own quiet gold place line. */
#doPadelClubs .do-padel-club-card .dp-card-place,.do-padel-club-card .dp-card-place{margin:clamp(12px,1.8vw,16px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;font-weight:400;letter-spacing:.26em;text-transform:uppercase;line-height:1.8;color:rgba(241,212,136,.72)}
/* THE THREE HEADLINE FACTS, with the approved profile's gold dash between them
   (.dp-prem-facts). Only populated facts are rendered, so the separators are
   drawn between whatever is genuinely there. */
.do-padel-club-card .dp-card-facts{margin:clamp(14px,2.2vw,20px) 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;row-gap:7px}
.do-padel-club-card .dp-card-facts li{position:relative;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:#f5f1e8;padding-right:clamp(13px,2.6vw,18px);margin-right:clamp(13px,2.6vw,18px)}
.do-padel-club-card .dp-card-facts li:not(:last-child)::after{content:'';position:absolute;right:-5px;top:.5em;margin-top:-1px;width:10px;height:2px;background:var(--dpc-gold)}
.do-padel-club-card .dp-card-facts li:last-child{padding-right:0;margin-right:0}
/* THE FOOT — branding left, the one restrained way-in on the right. */
#doPadelClubs .do-padel-club-card .dp-card-foot,.do-padel-club-card .dp-card-foot{margin-top:auto;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:14px;padding-top:clamp(18px,2.6vw,26px);border-top:1px solid var(--dpc-rule)}
/* ── THE REUSABLE BOTTOM BRANDING SLOT ───────────────────────────────────────
   A reserved area whose size comes from THIS rule and never from its contents,
   exactly as the full profile's status slot works. The DO→PADEL mark sits in it
   today, materially larger than the old corner signature. When the DO COIN
   artwork replaces it, the coin rule below already reserves the square footprint
   and nothing else about this card moves. The coin is not implemented yet. */
.do-padel-club-card .dp-card-slot{flex:0 0 auto;width:clamp(140px,40%,196px);aspect-ratio:934/531;margin:0;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;overflow:hidden;pointer-events:none}
.do-padel-club-card .dp-card-slot>*{display:block;min-height:0;max-width:100%;max-height:100%;width:auto;height:auto}
/* The artwork's own black ground is screened away so the mark sits on the card
   rather than in a box, and its own strapline is shown at a legible size. */
.do-padel-club-card .dp-card-sig{width:100%;height:auto;aspect-ratio:934/531;object-fit:contain;mix-blend-mode:screen;opacity:.96}
.do-padel-club-card .dp-card-slot .dp-card-coin{height:100%;width:auto;aspect-ratio:1/1;border-radius:50%}
.do-padel-club-card .dp-card-view{flex:0 0 auto;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;font-weight:400;letter-spacing:.26em;text-transform:uppercase;white-space:nowrap;color:rgba(241,212,136,.7);transition:color .25s ease}
.do-padel-club-card .dp-card-view-arrow{display:inline-block;margin-left:5px;transition:transform .25s ease}
.do-padel-club-card:hover .dp-card-view,.do-padel-club-card:has(.do-padel-club-card-link:focus-visible) .dp-card-view{color:var(--dpc-gold)}
.do-padel-club-card:hover .dp-card-view-arrow,.do-padel-club-card:has(.do-padel-club-card-link:focus-visible) .dp-card-view-arrow{transform:translateX(3px)}
/* The club-card grid gives the enlarged names their room: wide screens hold two
   generous cards per row, narrow screens one. Scoped with :has() to grids that
   actually contain club cards, so the country, region and city selectors keep
   their own three-up layout exactly as before. */
.do-padel-clubs-grid:has(.do-padel-club-card){grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(14px,1.8vw,20px)}
@media (max-width:560px){
.do-padel-club-card.do-padel-club-card{border-radius:20px;padding:22px 18px 18px}
.do-padel-club-card .do-padel-club-name{font-size:clamp(26px,7.6vw,34px)}
.do-padel-club-card .dp-card-slot{width:clamp(132px,44%,170px)}
.do-padel-club-card .dp-card-view{font-size:9px;letter-spacing:.2em}
}

/* THE TWO GOLD GRADIENT HEADINGS — the page title and each stage title. Both are
   four-stop gold gradients whose BRIGHT stops are already luminous and whose
   DARK stops (#8d5d16, #a76f1e / #c68f2c, #d09638) are where the murk was: on a
   phone the dark stops occupy most of a short word, so a heading like "Select
   Country" read bronze rather than gold. Only those dark stops move, and only
   up in lightness along their own hue — the bright stops, the 120deg angle, the
   stop positions and the background-clip are all exactly as they were, so the
   sheen still travels across the word the same way. This is the one place a
   value is not simply an existing colour at a higher alpha: a gradient stop has
   no alpha to raise, so the lift has to be in the stop itself.
   CRITICALLY these set background-IMAGE and not the background shorthand. The
   shorthand carries background-clip with it, so writing `background:` here would
   reset the clip from `text` back to `border-box` — and because the text itself
   is `color:transparent`, that renders the heading as a gold bar with invisible
   lettering. The longhand replaces the gradient and leaves the clip alone. */
#doPadelClubs .do-padel-editorial-title{background-image:linear-gradient(120deg,#a97219 0%,#f6d77b 42%,#c08526 72%,#f7dc84 100%)}
#doPadelClubs .do-padel-clubs-stage-title{background-image:linear-gradient(120deg,#d69b31 0%,#ffe59a 46%,#dda340 78%,#ffe89f 100%)}
/* ── END CLUBS DIRECTORY LUMINOSITY LIFT ─────────────────────────────────── */
/* Play & Events listing cards — informational cards (game / event) that reuse
   the club-card surface and pill styling but carry a date line and an external
   action instead of the club "View" affordance. */
.do-padel-listing-card{position:relative;display:flex;flex-direction:column;border:1px solid rgba(222,186,110,.32);border-radius:22px;padding:22px 20px;background:linear-gradient(180deg,rgba(19,15,9,.72),rgba(4,4,4,.84));box-shadow:0 18px 46px rgba(0,0,0,.52),0 0 0 1px rgba(139,197,46,.10),inset 0 1px 0 rgba(255,235,180,.08);color:#f7f2e6}
.do-padel-listing-when{margin:0 0 10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-listing-card .do-padel-club-name{margin-bottom:8px}
.do-padel-listing-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:16px}
.do-padel-listing-price{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.06em;color:rgba(216,199,155,.9)}
/* DO→PADEL Play & Improve — tabs, forms, join/detail panels, development pillars */
.do-padel-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.do-padel-tab{border:1px solid rgba(228,194,120,.44);border-radius:999px;background:rgba(214,177,87,.04);color:rgba(248,225,152,.96);padding:11px 18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:border-color .2s ease,color .2s ease,background .2s ease}
.do-padel-tab:hover{border-color:rgba(214,177,87,.5);color:#f6d77b}
.do-padel-tab.is-active{border-color:rgba(139,197,46,.56);color:var(--brand-green);background:rgba(139,197,46,.08)}
.do-padel-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px;margin-top:4px}
.do-padel-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.do-padel-field.is-wide{grid-column:1 / -1}
.do-padel-field label,.do-padel-field .do-padel-field-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(240,210,138,.98)}
.do-padel-field label .req{color:var(--brand-green)}
.do-padel-field input,.do-padel-field select,.do-padel-field textarea{width:100%;box-sizing:border-box;border:1px solid rgba(228,194,120,.55);border-radius:14px;background:rgba(0,0,0,.32);color:#fbf7ee;padding:13px 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;letter-spacing:.01em;transition:border-color .2s ease,box-shadow .2s ease}
.do-padel-field textarea{min-height:96px;resize:vertical}
.do-padel-field input:focus,.do-padel-field select:focus,.do-padel-field textarea:focus{outline:none;border-color:rgba(139,197,46,.6);box-shadow:0 0 0 3px rgba(139,197,46,.12)}
.do-padel-field select option{background:#0a0a08;color:#f7f2e6}
.do-padel-field input::placeholder,.do-padel-field textarea::placeholder{color:rgba(228,216,186,.76)}
.do-padel-form-foot{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:6px}
.do-padel-submit{border:1px solid rgba(139,197,46,.5);border-radius:999px;background:linear-gradient(120deg,rgba(139,197,46,.16),rgba(139,197,46,.05));color:var(--brand-green);padding:14px 26px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.do-padel-submit:hover:not(:disabled){border-color:rgba(139,197,46,.8);background:rgba(139,197,46,.2);transform:translateY(-1px)}
.do-padel-submit:disabled{opacity:.5;cursor:default}
.do-padel-form-note{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;line-height:1.5;color:rgba(230,218,188,.9);margin:0}
.do-padel-form-msg{grid-column:1 / -1;margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.02em;min-height:0}
.do-padel-form-msg.is-error{color:#f2b467}
.do-padel-form-msg.is-ok{color:var(--brand-green)}
.do-padel-success{display:grid;place-items:center;text-align:center;min-height:260px;border:1px solid rgba(139,197,46,.2);border-radius:24px;background:radial-gradient(circle at 50% 12%,rgba(139,197,46,.1),transparent 40%),rgba(139,197,46,.03);padding:36px}
.do-padel-success h2{margin:0 0 12px;font-size:clamp(24px,3.4vw,32px);letter-spacing:.1em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-success p{margin:0 auto 6px;max-width:460px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:#ebdfbe}
.do-padel-listing-card .do-padel-card-cta{align-self:flex-start;margin-top:4px}
.do-padel-listing-status{display:inline-flex;align-items:center;gap:6px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(230,218,186,.88)}
.do-padel-listing-status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brand-green);box-shadow:0 0 8px rgba(139,197,46,.6)}
.do-padel-listing-status.is-full::before{background:#e8a24c;box-shadow:0 0 8px rgba(232,162,76,.6)}
/* DO→PADEL™ Events page type refinements. Scoped to .do-padel-events-page so the
   Clubs, Play and Improve pages that share these classes are left exactly as they
   are. Font families, colours and the green status dot are unchanged — only scale,
   weight and brightness move. */
.do-padel-events-page .do-padel-clubs-stage-title{font-size:clamp(28px,4vw,40px)}
.do-padel-events-page .do-padel-club-name{font-size:clamp(23px,2.95vw,30px);font-weight:500;-webkit-text-stroke:.25px currentColor}
.do-padel-events-page .do-padel-listing-status:not(.is-full){font-size:10px;font-weight:600;color:rgba(247,240,218,.99)}
/* The featured card sits a little closer to the first country section beneath it.
   Every other gap keeps the stage's own 18px rhythm. */
.do-padel-events-page .do-padel-clubs-grid.is-featured-grid + .do-padel-clubs-stage-head{margin-top:-6px}
/* MORE THAN PADEL — player-facing panel between the Events intro and the
   upcoming events list. One ultra-thin gold frame (the shared clubs panel
   frame, softened), no inner cards. Type scale and spacing are mobile-first
   and grow with the viewport. Nothing here touches the events data, the
   counter or the listing markup. */
.do-padel-events-page .do-padel-events-more{position:relative;overflow:hidden;margin:clamp(18px,3vw,26px) 0;padding:clamp(26px,4.6vw,44px) clamp(20px,4vw,42px);border-color:rgba(230,196,124,.46);background:radial-gradient(120% 82% at 50% -18%,rgba(214,177,87,.14),transparent 58%),radial-gradient(96% 70% at 50% 122%,rgba(139,197,46,.09),transparent 60%),linear-gradient(180deg,rgba(6,6,4,.96),rgba(0,0,0,.98));box-shadow:0 30px 78px rgba(0,0,0,.72),0 0 0 1px rgba(139,197,46,.10),inset 0 1px 0 rgba(255,235,180,.14)}
.do-padel-events-page .do-padel-events-more .do-padel-editorial-kicker{margin:0 0 clamp(14px,2.2vw,18px);font-size:10px;letter-spacing:.44em}
.do-padel-events-page .do-padel-events-more .do-padel-clubs-stage-title{font-size:clamp(23px,3.9vw,40px);line-height:1.08;letter-spacing:.045em}
.do-padel-events-page .do-padel-events-more .do-padel-events-more-copy{margin:clamp(14px,2.2vw,18px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.55vw,15px);line-height:1.62;letter-spacing:.015em;color:rgba(247,242,230,.78)}
.do-padel-events-page .do-padel-events-more-list{max-width:56ch;color:rgba(247,242,230,.58)}
/* The centrepiece. Two hairlines and a wide letterspaced green line — the only
   centred element in the panel, so it reads as the campaign line rather than
   another paragraph. */
.do-padel-events-page .do-padel-events-more .do-padel-events-more-chant{margin:clamp(22px,3.4vw,30px) 0 0;padding:clamp(16px,2.6vw,22px) 0;border-top:1px solid rgba(222,186,110,.22);border-bottom:1px solid rgba(222,186,110,.22);text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,1.9vw,16px);font-weight:600;line-height:1.4;letter-spacing:.34em;text-transform:uppercase;color:var(--brand-green);text-shadow:0 0 22px rgba(139,197,46,.24)}
.do-padel-events-page .do-padel-events-more .do-padel-events-more-close{margin-top:clamp(16px,2.4vw,20px);font-size:clamp(14.5px,1.75vw,17px);font-weight:500;line-height:1.5;color:#fff}
.do-padel-events-page .do-padel-events-more .do-padel-club-action{margin-top:clamp(20px,2.8vw,26px);padding:9px 15px;font-size:10.5px;letter-spacing:.18em}
/* Events page top. The shared editorial shell centres its content in a full
   viewport, which left a deep band of empty black above EVENTS before the page
   had scrolled. The Events page starts at the top instead, exactly as the Clubs
   page already does, and the intro pair is tightened so the kicker, title,
   introduction and the search lead read as one compact block. Every existing
   word — including the search terms — is kept; only spacing and scale move. */
#doPadelEvents .do-padel-editorial{min-height:auto;align-items:flex-start;padding-top:calc(clamp(8px,1.4vh,16px) + env(safe-area-inset-top,0px))}
.do-padel-events-page .do-padel-clubs-hero{align-items:center;margin-bottom:clamp(16px,2.6vw,24px)}
.do-padel-events-page .do-padel-editorial-title{margin-bottom:clamp(10px,1.6vw,14px)}
.do-padel-events-page .do-padel-editorial-sub{font-size:clamp(13.5px,1.6vw,15px);line-height:1.6}
.do-padel-events-page .do-padel-search-lead{margin:clamp(6px,1vw,9px) 0 0;font-size:clamp(12.5px,1.5vw,13.5px);line-height:1.6;color:rgba(216,199,155,.74)}
/* REAL-WORLD INSPIRATION — the closing part of the same frame, separated by a
   hairline rather than a card of its own. Rows are label/value pairs so the
   hierarchy holds at 320px without any box drawing. */
.do-padel-events-page .do-padel-events-more-rule{margin:clamp(26px,4vw,36px) 0 0;border:0;border-top:1px solid rgba(222,186,110,.16)}
.do-padel-events-page .do-padel-events-more-eg{margin-top:clamp(24px,3.6vw,32px)}
.do-padel-events-page .do-padel-events-more-eg .do-padel-editorial-kicker{margin-bottom:clamp(12px,2vw,16px)}
.do-padel-events-page .do-padel-events-eg-name{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(17px,2.4vw,23px);font-weight:600;letter-spacing:.06em;text-transform:uppercase;line-height:1.25;color:#fff}
.do-padel-events-page .do-padel-events-more p.do-padel-events-eg-meta{margin:clamp(6px,1vw,9px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11.5px,1.5vw,13px);letter-spacing:.16em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-events-page .do-padel-events-eg-rows{display:grid;gap:clamp(10px,1.6vw,13px);margin:clamp(18px,2.8vw,24px) 0 0;padding:0;list-style:none}
.do-padel-events-page .do-padel-events-eg-rows li{display:grid;grid-template-columns:minmax(76px,auto) minmax(0,1fr);gap:clamp(10px,2vw,18px);align-items:baseline;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.7vw,15px);line-height:1.55;color:rgba(255,255,255,.82)}
.do-padel-events-page .do-padel-events-eg-rows b{font-size:clamp(10.5px,1.3vw,11.5px);font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(240,214,150,.92)}
.do-padel-events-page .do-padel-events-more p.do-padel-events-eg-close{margin-top:clamp(18px,2.8vw,24px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.7vw,15px);letter-spacing:.04em;color:#fff}
@media (max-width:420px){.do-padel-events-page .do-padel-events-eg-rows li{grid-template-columns:1fr;gap:3px}}
/* EVENTS FILTERS. Search, country type-ahead and event-type chips sit directly
   above the country sections. Built from the existing field / pill / panel
   classes, so the only new rules are the filter grid, the chip's selected state
   and the reset control. Mobile-first: one column until there is room for two. */
.do-padel-events-filters{margin:clamp(18px,3vw,26px) 0 clamp(14px,2.4vw,20px)}
.do-padel-events-filters-grid{display:grid;gap:clamp(12px,2vw,16px);margin-top:14px}
@media (min-width:640px){.do-padel-events-filters-grid{grid-template-columns:1fr 1fr}}
.do-padel-events-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(14px,2.2vw,18px)}
.do-padel-events-chip{cursor:pointer;font-weight:600;transition:color .2s ease,border-color .2s ease,background .2s ease}
.do-padel-events-chip.is-on{border-color:rgba(230,196,124,.75);color:#0b0b07;background:linear-gradient(180deg,rgba(240,214,150,.98),rgba(214,177,87,.92))}
/* Premium category selectors. Custom listbox rather than a native <select> so the
   closed control and its panel both carry the DO->PADEL black / gold / green
   treatment on every platform. Mobile-first: full-width, thumb-sized rows. */
.do-padel-select{position:relative}
.do-padel-select-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;cursor:pointer;border:1px solid rgba(228,194,120,.55);border-radius:14px;padding:13px 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;text-align:left;color:#fbf7ee;background:linear-gradient(180deg,rgba(24,20,10,.92),rgba(0,0,0,.5));transition:border-color .2s ease,box-shadow .2s ease,color .2s ease}
.do-padel-select-btn:hover{border-color:rgba(240,214,150,.8)}
.do-padel-select-btn:focus-visible{outline:none;border-color:rgba(139,197,46,.6);box-shadow:0 0 0 3px rgba(139,197,46,.12)}
.do-padel-select.is-open>.do-padel-select-btn{border-color:rgba(240,214,150,.85);box-shadow:0 0 0 3px rgba(214,177,87,.12)}
.do-padel-select.is-set>.do-padel-select-btn{color:#f4dda4;border-color:rgba(139,197,46,.55)}
.do-padel-select-caret{flex:none;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid rgba(240,214,150,.9);transition:transform .2s ease}
.do-padel-select.is-open .do-padel-select-caret{transform:rotate(180deg)}
.do-padel-select-list{position:absolute;z-index:40;top:calc(100% + 6px);left:0;right:0;margin:0;padding:6px;list-style:none;max-height:min(56vh,300px);overflow-y:auto;-webkit-overflow-scrolling:touch;border:1px solid rgba(228,194,120,.55);border-radius:16px;background:linear-gradient(180deg,#100d07,#050504);box-shadow:0 22px 46px rgba(0,0,0,.6)}
.do-padel-select-list[hidden]{display:none}
.do-padel-select-opt{display:block;width:100%;box-sizing:border-box;cursor:pointer;border:1px solid transparent;border-radius:11px;padding:11px 12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;text-align:left;color:rgba(240,232,210,.92);background:none;transition:color .18s ease,background .18s ease,border-color .18s ease}
.do-padel-select-opt:hover,.do-padel-select-opt:focus-visible{outline:none;color:#0b0b07;border-color:rgba(230,196,124,.75);background:linear-gradient(180deg,rgba(240,214,150,.98),rgba(214,177,87,.92))}
.do-padel-select-opt[aria-selected="true"]{color:var(--brand-green);border-color:rgba(139,197,46,.5);background:rgba(139,197,46,.1);font-weight:600}
.do-padel-events-filters-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:clamp(14px,2.2vw,18px)}
.do-padel-events-filters-foot .do-padel-clubs-stage-meta{margin:0}
.do-padel-events-reset{cursor:pointer;border:1px solid rgba(228,194,120,.45);border-radius:999px;padding:8px 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(240,214,150,.95);background:rgba(0,0,0,.32)}
.do-padel-events-reset:hover{border-color:rgba(139,197,46,.6);color:var(--brand-green)}
.do-padel-join-panel{border:1px solid rgba(214,177,87,.22);border-radius:18px;margin-top:14px;padding:16px;background:rgba(0,0,0,.28);display:grid;gap:12px}
.do-padel-join-panel[hidden]{display:none}
.do-padel-join-panel .do-padel-form{margin-top:0;gap:12px}
.do-padel-join-copy{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.55;color:rgba(230,218,186,.9)}
.do-padel-improve-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:4px}
.do-padel-improve-pillar{position:relative;border:1px solid rgba(214,177,87,.2);border-radius:20px;padding:22px 20px;background:linear-gradient(180deg,rgba(19,15,9,.72),rgba(4,4,4,.84));box-shadow:0 18px 46px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,235,180,.07);color:#f7f2e6;overflow:hidden;transition:transform .28s cubic-bezier(.2,.8,.22,1),border-color .28s ease}
.do-padel-improve-pillar:hover{transform:translateY(-3px);border-color:rgba(214,177,87,.44)}
.do-padel-improve-pillar h3{margin:0 0 10px;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(19px,2.4vw,24px);letter-spacing:.03em;color:#f6e6bc}
.do-padel-improve-pillar p{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.6;color:rgba(240,240,240,.68)}
.do-padel-improve-pillar .do-padel-pillar-tag{display:inline-block;margin-bottom:12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-improve-pillar.is-link{cursor:pointer;text-decoration:none;display:block}
.do-padel-improve-pillar.is-link::after{content:"\2192";position:absolute;right:18px;bottom:16px;color:var(--gold);font-family:Georgia,'Times New Roman',serif;font-size:20px;opacity:.6}
.do-padel-improve-section-label{margin:30px 0 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(139,197,46,.8)}
.do-padel-club-detail{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:22px}
.do-padel-club-detail-main,.do-padel-club-detail-side{border:1px solid rgba(214,177,87,.20);border-radius:24px;padding:clamp(22px,3vw,32px);background:linear-gradient(180deg,rgba(18,14,8,.76),rgba(4,4,4,.86));box-shadow:0 24px 62px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,235,180,.08)}
.do-padel-club-detail-side{display:flex;flex-direction:column}
.do-padel-club-detail-title{margin:0 0 12px;font-size:clamp(32px,5vw,52px);line-height:1.08;letter-spacing:.05em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 44%,#a76f1e 76%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text}
.do-padel-club-detail-copy{margin:0 0 24px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:#d8c79b}
.do-padel-club-sections{display:grid;grid-template-columns:repeat(auto-fit,minmax(184px,1fr));grid-auto-flow:dense;gap:10px}
.do-padel-club-section:has(.do-padel-club-specs),.do-padel-club-section:has(.do-padel-club-gallery){grid-column:1/-1}
.do-padel-club-section{border:1px solid rgba(214,177,87,.12);border-radius:16px;padding:13px 15px;background:rgba(0,0,0,.26)}
.do-padel-club-section h3{margin:0 0 6px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.20em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-club-section p{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.6;color:rgba(240,240,240,.72)}
.do-padel-club-state{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:15px;letter-spacing:.04em;color:rgba(240,240,240,.62)}
.do-padel-club-state.is-yes{color:var(--brand-green)}
/* THE CLUB'S FACTS, READ AS A SPECIFICATION — NOT AS A RECORD ───────────
   Same facts, same order, same renderer. Presentation only: paired tiles
   instead of one long ruled list, gold labels kept, each populated value
   picked out in DO->PADEL lime, and the address given the full width it
   needs. Two columns from the smallest screen up, so the block stays short. */
.do-padel-club-side-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:0}
.do-padel-club-side-list div{border:1px solid rgba(214,177,87,.12);border-radius:12px;padding:9px 11px;background:rgba(0,0,0,.28)}
.do-padel-club-side-list div:first-child{grid-column:1/-1}
.do-padel-club-side-list dt{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(214,177,87,.58)}
.do-padel-club-side-list dd{margin:3px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.35;letter-spacing:.01em;color:var(--brand-green)}
.do-padel-club-side-list div:first-child dd{font-size:14px}
.do-padel-club-map{box-sizing:border-box;width:100%;min-height:132px;flex:1;border:1px dashed rgba(139,197,46,.32);border-radius:18px;display:grid;place-items:center;margin-top:14px;padding:20px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.20em;text-transform:uppercase;color:rgba(139,197,46,.82);background:radial-gradient(circle at 50% 20%,rgba(139,197,46,.075),transparent 48%),rgba(139,197,46,.04);text-align:center}
a.do-padel-club-map{text-decoration:none;transition:border-color .2s ease,color .2s ease,background .2s ease}
a.do-padel-club-map:hover,a.do-padel-club-map:focus-visible{border-color:rgba(139,197,46,.62);color:var(--brand-green);background:rgba(139,197,46,.09);outline:none}
.do-padel-club-actions{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 24px}
.do-padel-club-action{display:inline-flex;align-items:center;gap:2px;border:1px solid rgba(139,197,46,.34);border-radius:999px;background:rgba(139,197,46,.06);color:var(--brand-green);padding:10px 16px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.do-padel-club-action:hover,.do-padel-club-action:focus-visible{border-color:rgba(139,197,46,.68);background:rgba(139,197,46,.13);transform:translateY(-1px);outline:none}
/* The public profile's lead actions, ranked: booking is the single primary,
   website / directions / call support it, socials trail quietly behind. */
.do-padel-club-actions.is-lead{gap:9px;margin:0 0 22px;align-items:center}
.do-padel-club-action.is-primary{border-color:var(--brand-green);background:var(--brand-green);color:#0a0d04;font-weight:700;padding:13px 22px;letter-spacing:.16em;box-shadow:0 10px 26px rgba(139,197,46,.22)}
.do-padel-club-action.is-primary:hover,.do-padel-club-action.is-primary:focus-visible{background:#9ad634;border-color:#9ad634;box-shadow:0 14px 32px rgba(139,197,46,.34)}
.do-padel-club-action.is-key{border-color:rgba(214,177,87,.34);background:rgba(224,187,99,.05);color:var(--gold);padding:12px 18px}
.do-padel-club-action.is-key:hover,.do-padel-club-action.is-key:focus-visible{border-color:rgba(224,187,99,.72);background:rgba(224,187,99,.11)}
.do-padel-club-action.is-social{border-color:rgba(214,177,87,.16);background:transparent;color:rgba(214,177,87,.66);padding:9px 13px;font-size:10px;letter-spacing:.16em}
.do-padel-club-action.is-social:hover,.do-padel-club-action.is-social:focus-visible{border-color:rgba(224,187,99,.5);color:var(--gold);background:rgba(224,187,99,.06)}
.do-padel-club-section p a{color:var(--brand-green);text-decoration:none;border-bottom:1px solid rgba(139,197,46,.4);word-break:break-word}
.do-padel-club-section p a:hover,.do-padel-club-section p a:focus-visible{border-bottom-color:var(--brand-green);outline:none}
/* ── DO→PADEL™ PREMIUM CLUB PROFILE — PROTOTYPE APPEARANCE ─────────────────
   A PRESENTATION LAYER ONLY. Every rule below is scoped inside .dp-prem, which
   is drawn for the ONE prototype club and for no other: with the class absent
   the whole block is inert, so the rest of the directory renders byte-for-byte
   as it did. Nothing here is a component library — the premium reading comes
   from type, proportion, spacing, alignment and hairline rules rather than from
   boxes, pills, widgets, gradients or icons.
   Foundation: near-black ground, DO→PADEL gold for labels and rules, soft ivory
   for information, DO→PADEL green reserved for the single strongest action. */
.do-padel-club-detail.dp-prem{display:block;grid-template-columns:none;gap:0;border:0;background:none;box-shadow:none;padding:0}
.dp-prem{--dp-gold:#f1d488;--dp-rule:rgba(241,212,136,.22);--dp-hair:rgba(255,255,255,.075);--dp-ink:#f5f1e8;--dp-body:rgba(245,241,232,.76);--dp-quiet:rgba(245,241,232,.44);--dp-label:rgba(242,236,225,.88);
  box-sizing:border-box;max-width:1120px;margin:0 auto;padding:0;color:var(--dp-body);overflow-wrap:anywhere}
.dp-prem *{box-sizing:border-box;min-width:0}

/* ── THE OPENING COMPOSITION ─────────────────────────────────────────────── */
.dp-prem-open{padding:clamp(2px,1vw,8px) 0 clamp(16px,2.6vw,24px)}
.dp-prem-place{margin:0 0 clamp(11px,2.2vw,16px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:rgba(241,212,136,.66);line-height:1.8}
.dp-prem-id{display:flex;flex-direction:column;align-items:stretch;gap:clamp(20px,4.6vw,30px)}
/* THE UNIVERSAL DO→PADEL IDENTITY POSITION. One graphic only ever stands
   here: the awarded Coin for a club genuinely in the 30 Day Programme, and
   otherwise the approved DO→PADEL logo, which carries TOGETHER WE ARE
   STRONGER in the artwork itself. The logo is a landscape lockup, so on a
   phone it takes its own line beneath the club name rather than being
   squeezed beside it, and at no width is it allowed the club name's scale. */
.dp-prem-id.is-mark{flex-wrap:wrap;row-gap:clamp(14px,3vw,20px)}
.dp-prem-id.is-mark .dp-prem-name{flex:1 1 100%}
.dp-prem-mark{flex:0 0 auto;display:block;width:clamp(164px,52vw,222px);height:auto;aspect-ratio:934/531;object-fit:contain;mix-blend-mode:screen}
.dp-prem-name.dp-prem-name{flex:1 1 auto;margin:0;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(34px,10.4vw,74px);line-height:.94;letter-spacing:.005em;text-transform:uppercase;color:var(--dp-ink);background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor;text-wrap:balance}
/* THE GENUINE COIN. Only ever the awarded asset the server sends, given room of
   its own beside the club identity rather than pasted on as a badge. */
.dp-prem-coin{flex:0 0 auto;display:block;width:clamp(66px,18vw,112px);height:auto;aspect-ratio:1/1;border-radius:50%}
.dp-prem-coin-note{margin:clamp(12px,2.4vw,16px) 0 0;padding-top:clamp(10px,2vw,14px);border-top:1px solid var(--dp-rule);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--dp-gold);line-height:1.8}
.dp-prem-coin-note span{display:block;margin-top:6px;font-size:12.5px;letter-spacing:.02em;text-transform:none;color:var(--dp-body);line-height:1.7;font-weight:300}
.dp-prem-standfirst.is-quiet{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,3.3vw,14.5px);line-height:1.75;letter-spacing:.015em;color:var(--dp-body);max-width:44em}
.dp-prem-standfirst{margin:clamp(15px,3vw,22px) 0 0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(16.5px,4.3vw,21px);line-height:1.55;letter-spacing:.005em;color:rgba(245,241,232,.86);max-width:34em}
/* The club's headline facts, read as a line of type divided by fine rules. */
.dp-prem-facts{margin:clamp(15px,3vw,22px) 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;row-gap:7px}
.dp-prem-facts li{position:relative;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--dp-ink);padding-right:clamp(14px,3vw,20px);margin-right:clamp(14px,3vw,20px)}
.dp-prem-facts li:not(:last-child)::after{content:'';position:absolute;right:-5px;top:.5em;margin-top:-1px;width:10px;height:2px;background:var(--dp-gold)}
.dp-prem-facts li:last-child{padding-right:0;margin-right:0}

/* ── THE ACTIONS ─────────────────────────────────────────────────────────────
   The SAME links, the same destinations, the same existing classes — retyped as
   editorial actions. Green is spent once, on the strongest action available. */
.dp-prem .do-padel-club-actions.is-lead{gap:9px;margin:clamp(18px,3.4vw,26px) 0 0}
.dp-prem .do-padel-club-action{border-radius:0;font-size:10.5px;letter-spacing:.22em;font-weight:400;padding:12px 18px;background:transparent;border-color:var(--dp-rule);color:var(--dp-gold);transition:border-color .25s ease,color .25s ease,background .25s ease}
.dp-prem .do-padel-club-action:hover,.dp-prem .do-padel-club-action:focus-visible{transform:none;border-color:rgba(241,212,136,.6);background:rgba(241,212,136,.05)}
.dp-prem .do-padel-club-action.is-primary{border-color:rgba(139,197,46,.58);background:rgba(139,197,46,.09);color:#bfe083;font-weight:500;box-shadow:none;letter-spacing:.22em;padding:13px 22px}
.dp-prem .do-padel-club-action.is-primary:hover,.dp-prem .do-padel-club-action.is-primary:focus-visible{background:rgba(139,197,46,.17);border-color:rgba(139,197,46,.8);color:#d3ef9f;box-shadow:none}
.dp-prem .do-padel-club-actions .do-padel-club-action.is-primary,.dp-prem .do-padel-club-actions .do-padel-club-action.is-key,.dp-prem .do-padel-club-actions .do-padel-club-action.is-social{flex:0 0 auto}
.dp-prem .do-padel-club-action.is-key{padding:12px 18px;background:transparent}
.dp-prem .do-padel-club-action.is-social{padding:12px 15px;font-size:10px;letter-spacing:.2em;color:rgba(241,212,136,.62);border-color:rgba(241,212,136,.14)}
/* THE BOOKING ACTION, FULL WIDTH AND STILL SLIM. The same link and the same
   destination, given the whole measure of the card so the route it opens can be
   named in full — at the same height as every other action, not a heavier one.
   The remaining actions reflow beneath it in their existing order, unchanged.
   Gold type on DO→PADEL green, deep enough for the type to be read properly. */
.dp-prem .do-padel-club-actions .do-padel-club-action.is-primary{flex:1 1 100%;width:100%;justify-content:center;text-align:center;padding:12px 18px;background:#43700d;border-color:rgba(139,197,46,.9);color:#f6e2ab;font-weight:500;letter-spacing:.22em}
.dp-prem .do-padel-club-actions .do-padel-club-action.is-primary:hover,.dp-prem .do-padel-club-actions .do-padel-club-action.is-primary:focus-visible{background:#4d8110;border-color:#8bc52e;color:#fdf0c6}

/* ── THE PERMANENT STATUS SLOT ───────────────────────────────────────────────
   One reserved square beside the club name, sized by this rule and never by its
   contents, so the awarded DO COIN and the restrained DO→PADEL signature occupy
   exactly the same footprint and a club qualifying moves nothing. The club name
   keeps its own scale in both states. */
.dp-prem-slot{flex:0 0 auto;width:clamp(238px,62vw,300px);aspect-ratio:934/531;margin:clamp(2px,1vw,8px) auto 0;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;overflow:hidden}
.dp-prem-slot img{display:block;min-height:0;max-width:100%;max-height:100%;width:auto;height:auto}
/* The artwork's own black ground is screened away, so the mark sits on the page
   rather than in a box, and its strapline is set large enough to be read. */
.dp-prem-sig{width:100%;aspect-ratio:934/531;object-fit:contain;mix-blend-mode:screen}
.dp-prem-slot .dp-prem-coin{height:100%;width:auto;aspect-ratio:1/1;border-radius:50%}
.dp-prem-slot .dp-prem-brand-coin{height:clamp(96px,26vw,124px);max-height:100%;width:auto;aspect-ratio:1/1;border-radius:50%}
/* ── THE DO→PADEL™ PARTICIPATION MARK ────────────────────────────────────────
   The existing participation coin with its two caption lines DIRECTLY beneath
   it, stacked as ONE mark on a single shared vertical centre axis, INSIDE the
   same reserved slot the coin and the signature already occupy. The slot's own
   width and aspect ratio are untouched and the stack is sized as a proportion
   of it, so the club name beneath does not move and the page's composition is
   dimensionally identical. The coin artwork itself is unaltered: only its square
   ground is clipped to its own gold perimeter, exactly as the slot already
   clips it. */
/* THE COIN IS ONE FIXED SIZE, STATED ONCE, so every club carrying the mark
   shows an identical coin: the size it was, plus exactly 20% (it tracked the
   slot at 0.3638 x the slot's width; 0.4366 x is that same figure + 20%, and
   the slot's own clamp(238px,62vw,300px) resolves to these three values). */
.dp-prem-slot-mark{--dp-mark-coin:clamp(104px,27.1vw,131px)}
/* The mark's own height comes from the mark, so a coin 20% larger is shown
   whole and never cropped. Only the two clubs carrying the mark use this class;
   the slot's width, its centring and every other club's slot are untouched. */
.dp-prem-slot.dp-prem-slot-mark{aspect-ratio:auto;height:auto;overflow:visible}
.dp-prem-mark-stack{width:100%;height:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.dp-prem-slot .dp-prem-mark-stack .dp-prem-coin{flex:0 0 auto;height:var(--dp-mark-coin);width:auto;max-width:100%;max-height:none;aspect-ratio:1/1;border-radius:50%;margin:0 auto}
.dp-prem-mark-word{display:block;margin:9px auto 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,3.4vw,15px);font-weight:600;letter-spacing:.05em;line-height:1;white-space:nowrap;color:var(--dp-ink)}
.dp-prem-mark-role{display:block;margin:5px auto 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(8.5px,2.4vw,10px);font-weight:500;letter-spacing:.22em;line-height:1;white-space:nowrap;color:var(--brand-green)}

/* ── GENUINE PHOTOGRAPHY, WHEN THERE IS ANY ──────────────────────────────── */
.dp-prem-lead{margin:clamp(18px,3.6vw,28px) 0 0}
.dp-prem-lead img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;background:rgba(255,255,255,.03)}
.dp-prem-lead.is-mark{max-width:340px}
.dp-prem-lead.is-mark img{aspect-ratio:16/9;object-fit:contain;padding:clamp(10px,2.4vw,18px);border:1px solid rgba(242,236,225,.10);border-radius:14px}
.dp-prem-gallery{display:grid;grid-template-columns:1fr;gap:clamp(8px,2vw,14px)}
.dp-prem-gallery img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:rgba(255,255,255,.03)}
/* A photograph fills its frame; the mark standing in for one is shown whole and
   at a thumbnail's size, so it reads as an identity, never as a club photo. */
.dp-prem-gallery.is-mark{max-width:340px}
.dp-prem-gallery.is-mark img{aspect-ratio:16/9;object-fit:contain;padding:clamp(10px,2.4vw,18px);border:1px solid rgba(242,236,225,.10);border-radius:14px}

/* ── THE INFORMATION BELOW ───────────────────────────────────────────────── */
.dp-prem-body{margin:clamp(15px,2.4vw,22px) 0 0;border-top:1px solid var(--dp-rule)}
.dp-prem-section{padding:clamp(17px,3.2vw,28px) 0;border-bottom:1px solid var(--dp-hair)}
.dp-prem-section:last-child{border-bottom:0;padding-bottom:0}
.dp-prem-h{margin:0 0 clamp(10px,2vw,14px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:var(--dp-gold)}
.dp-prem-rows{margin:0}
.dp-prem-row{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;padding:8px 0;border-top:1px solid var(--dp-hair)}
.dp-prem-row:first-child{border-top:0;padding-top:0}
.dp-prem-row:last-child{padding-bottom:0}
.dp-prem-k{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--dp-label);line-height:1.85}
.dp-prem-v{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15.5px,4vw,17.5px);line-height:1.45;color:var(--dp-ink);font-variant-numeric:tabular-nums}
.dp-prem-v a{color:var(--dp-ink);text-decoration:none;border-bottom:1px solid var(--dp-rule)}
.dp-prem-v a:hover,.dp-prem-v a:focus-visible{border-bottom-color:var(--dp-gold);color:#fff;outline:none}
.dp-prem-prose{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15.5px,4vw,17.5px);line-height:1.62;color:rgba(245,241,232,.84);max-width:36em}
.dp-prem-prose+.dp-prem-rows,.dp-prem-set+.dp-prem-rows,.dp-prem-rows+.dp-prem-set,.dp-prem-hours+.dp-prem-rows,.dp-prem-gallery+.dp-prem-rows{margin-top:clamp(11px,2.2vw,16px)}
/* Facilities and features: typeset text divided by fine rules. No capsules. */
.dp-prem-set{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;row-gap:8px}
.dp-prem-set li{position:relative;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15.5px,4vw,17.5px);line-height:1.4;color:var(--dp-ink);padding-right:clamp(14px,3vw,20px);margin-right:clamp(14px,3vw,20px)}
.dp-prem-set li:not(:last-child)::after{content:'';position:absolute;right:0;top:.12em;bottom:.12em;width:1px;background:var(--dp-rule)}
.dp-prem-set li:last-child{padding-right:0;margin-right:0}
/* Opening hours, read as hours rather than as a stored string. */
.dp-prem-hours{margin:0}
.dp-prem-hours-row{display:flex;justify-content:space-between;align-items:baseline;gap:clamp(14px,4vw,28px);padding:8px 0;border-top:1px solid var(--dp-hair)}
.dp-prem-hours-row:first-child{border-top:0;padding-top:0}
.dp-prem-hours-row dt{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--dp-label);line-height:1.7}
.dp-prem-hours-row dd{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15.5px,4vw,17.5px);color:var(--dp-ink);font-variant-numeric:tabular-nums;text-align:right}
.dp-prem-hours-single{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,4.6vw,21px);line-height:1.4;letter-spacing:.01em;color:var(--dp-ink);font-variant-numeric:tabular-nums}
.dp-prem-hours-single+.dp-prem-hours-single{margin-top:5px}
.dp-prem-address{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15.5px,4vw,17.5px);line-height:1.58;color:var(--dp-ink);font-style:normal}

/* ── THE OPENING, ON A PHONE ────────────────────────────────
   At this width the opening stacks into one narrow column — name, mark,
   standfirst, facts, action — and the rhythm that reads as composed across a
   wide measure reads as crowded down a phone. The same parts, in the same
   order, given one step more air between them. Nothing else changes. */
@media(max-width:759px){
  .dp-prem-open{padding-bottom:26px}
  .dp-prem-standfirst,.dp-prem-facts{margin-top:20px}
  /* THE FACTS LINE, ON A PHONE. The same populated items, in the same order,
     with the same fine rule set only between them and never after the last:
     the line is simply set tighter here so the facts take the phone's full
     measure as one line, rather than turning over with a rule left hanging at
     the end of it. Each item is held whole, and wrapping stays available as
     the fallback for a width that genuinely cannot take them. */
  .dp-prem-facts li{font-size:clamp(9.5px,2.7vw,11px);letter-spacing:.1em;white-space:nowrap;padding-right:clamp(8px,2.2vw,14px);margin-right:clamp(8px,2.2vw,14px)}
  .dp-prem .do-padel-club-actions.is-lead{margin-top:24px}
}
/* ── THE SAME TEMPLATE, WIDER ────────────────────────────────────────────── */
@media(min-width:760px){
  .dp-prem-standfirst{margin-top:24px}
  .dp-prem-coin-note{display:inline-block;border-top:0;border-left:1px solid var(--dp-rule);padding:2px 0 2px 20px;margin-top:20px}
  /* Wide enough for the lockup to stand beside the club name. */
  .dp-prem-id.is-mark{flex-wrap:nowrap}
  .dp-prem-id.is-mark .dp-prem-name{flex:1 1 auto}
  .dp-prem-mark{width:clamp(186px,18vw,232px)}
  .dp-prem-section{display:grid;grid-template-columns:minmax(140px,1fr) minmax(0,3.2fr);gap:clamp(22px,3.4vw,48px);align-items:start}
  .dp-prem-h{margin:0;padding-top:4px}
  .dp-prem-row{grid-template-columns:minmax(112px,1fr) minmax(0,2.6fr);gap:clamp(14px,2.6vw,28px);align-items:baseline;padding:7px 0}
  .dp-prem-k{padding-top:2px}
  .dp-prem-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dp-prem-gallery.is-one{grid-template-columns:1fr}
}
@media(min-width:1080px){
  .dp-prem-name.dp-prem-name{font-size:clamp(58px,5.6vw,78px)}
  .dp-prem-gallery:not(.is-one):not(.is-two){grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* ── THE PATH TO THIS CLUB, QUIETENED ────────────────────────────────────────
   THE SAME NAVIGATION: the same buttons, in the same order, carrying the same
   data-club-path values and the same handler, so every step of CLUBS / COUNTRY /
   REGION / CITY / CLUB still leads where it always did and the page's structured
   data is untouched. Only the treatment changes — the interface pills become a
   fine tracked line divided by slashes, so the path states where you are without
   competing with the club name beneath it. The class is added for the prototype
   club and removed for every other level, so the pills return unchanged. */
/* THE PREMIUM PROFILE OPENS ON THE CLUB ITSELF. The same nav is still built
   with the same buttons, the same order and the same destinations — it is
   simply not drawn above this one profile, so the club's own name leads the
   page. Every other level of the directory keeps its path line, because the
   class this rule matches is only ever added for this profile. */
#doPadelClubs .dp-prem-crumbs{display:none}
#doPadelClubs .dp-prem-crumbs .do-padel-clubs-crumb{border:0;border-radius:0;background:none;padding:0;font-size:9px;letter-spacing:.26em;color:rgba(241,212,136,.52);transition:color .25s ease}
#doPadelClubs .dp-prem-crumbs .do-padel-clubs-crumb:not(:last-child)::after{content:'/';margin:0 .55em 0 .7em;color:rgba(241,212,136,.24);letter-spacing:0}
#doPadelClubs .dp-prem-crumbs .do-padel-clubs-crumb:hover,#doPadelClubs .dp-prem-crumbs .do-padel-clubs-crumb:focus-visible{color:#f1d488;outline:none}
#doPadelClubs .dp-prem-crumbs .do-padel-clubs-crumb.is-active{border:0;background:none;color:rgba(245,241,232,.7)}
#doPadelClubs .dp-prem-crumbs .do-padel-clubs-crumb.is-active:hover{color:rgba(245,241,232,.9)}
.do-padel-club-section .do-padel-club-action{display:inline-flex;margin:2px 6px 2px 0;border-bottom:none}
/* FIND US ON DO→PADEL — the optional backlink tool inside the confirmed club
   representative's own Club Profile panel. It borrows the panel's existing
   vocabulary entirely: the gold uppercase label, the soft body colour and the
   existing .do-padel-club-action pill. Nothing here is a new component. */
.do-padel-club-backlink{padding-top:16px;border-top:1px solid rgba(214,177,87,.14)}
.do-padel-club-backlink-title{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.do-padel-club-backlink-copy{margin:8px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.65;letter-spacing:.02em;color:rgba(214,177,87,.66)}
.do-padel-club-backlink-url{margin:10px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.6;letter-spacing:.02em;color:rgba(246,230,188,.84);word-break:break-word}
.do-padel-club-backlink .do-padel-form-msg{margin-top:8px}
.do-padel-club-progress{margin:0 0 16px}
.do-padel-club-progress-label{margin:0 0 8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.do-padel-club-progress-track{height:6px;border-radius:999px;background:rgba(214,177,87,.14);overflow:hidden}
.do-padel-club-progress-track span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,rgba(214,177,87,.5),rgba(224,187,99,.95));transition:width .35s ease}
.do-padel-club-progress-meta{margin:7px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.04em;color:rgba(214,177,87,.66)}
.do-padel-club-action.is-edit-club{padding:8px 15px;font-size:10px;letter-spacing:.18em;border-color:rgba(224,187,99,.55);background:rgba(224,187,99,.07);color:var(--gold);box-shadow:0 0 14px rgba(214,177,87,.16)}
.do-padel-club-action.is-edit-club:hover,.do-padel-club-action.is-edit-club:focus-visible{border-color:rgba(224,187,99,.9);background:rgba(224,187,99,.15);box-shadow:0 0 20px rgba(214,177,87,.3)}
.do-padel-club-review-group{margin:0 0 18px}
.do-padel-club-review-group h4{margin:0 0 8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.do-padel-club-review-group dl{display:grid;gap:8px;margin:0}
.do-padel-club-review-group dt{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(214,177,87,.62)}
.do-padel-club-review-group dd{margin:3px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.5;color:#ebdfbe;word-break:break-word}
.do-padel-club-review-note{margin:8px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;line-height:1.5;color:rgba(214,177,87,.7)}
/* DO→KEY® global rewards interest — an OPTIONAL expression of interest sitting at
   the foot of the master club form, in both the new-club and existing-club
   journeys. The approved DO→KEY® card is shown as the visual only; the heading,
   copy, checkbox and every other control are real page elements. Principal copy is
   bright white for legibility on black; gold and DO→PADEL green carry hierarchy. */
.do-padel-club-dokey{grid-column:1 / -1;margin:26px 0 2px;padding:clamp(20px,3.2vw,30px);border:1px solid rgba(222,186,110,.34);border-radius:24px;background:linear-gradient(180deg,rgba(17,15,9,.88),rgba(4,4,3,.94));box-shadow:0 22px 60px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,235,180,.08)}
.do-padel-club-dokey-kicker{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-club-dokey-title{margin:12px 0 0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(20px,3.5vw,29px);font-weight:400;line-height:1.22;letter-spacing:.05em;text-transform:uppercase;color:#f8e9c4}
.do-padel-club-dokey-strap{margin:12px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.do-padel-club-dokey-art{display:block;width:min(480px,100%);height:auto;margin:26px auto 0;border-radius:14px}
.do-padel-club-dokey-copy{margin:22px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;line-height:1.7;letter-spacing:.005em;color:#ffffff}
.do-padel-club-dokey-copy + .do-padel-club-dokey-copy{margin-top:16px}
.do-padel-club-dokey-opt{margin:28px 0 0;padding:18px 18px 16px;border:1px solid rgba(139,197,46,.42);border-radius:18px;background:rgba(139,197,46,.06)}
.do-padel-club-dokey-opt > label{display:flex;align-items:flex-start;gap:13px;cursor:pointer;margin:0}
.do-padel-club-dokey-opt input[type=checkbox]{width:21px;height:21px;flex:none;margin:1px 0 0;accent-color:#8bc52e;cursor:pointer}
.do-padel-club-dokey-optlabel{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;line-height:1.5;color:var(--brand-green)}
.do-padel-club-dokey-support{margin:14px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.65;color:#ffffff}
.do-padel-club-dokey-note{margin:12px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.6;letter-spacing:.02em;color:rgba(240,210,138,.98)}
.do-padel-club-hours{display:block;margin-top:6px;color:rgba(240,240,240,.72)}
.do-padel-club-side-list dd a{color:var(--brand-green);text-decoration:none;border-bottom:1px solid rgba(139,197,46,.4);font-size:13px}
#doPadelClubAdmin{display:none}
.do-padel-admin-page{min-height:100vh;padding:clamp(36px,6vw,72px) 18px calc(44px + env(safe-area-inset-bottom));font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;background:radial-gradient(circle at 20% 0,rgba(139,197,46,.08),transparent 32%),linear-gradient(180deg,#050604,#030402)}
.do-padel-admin-shell{width:min(1180px,100%);margin:0 auto}
.do-padel-admin-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:end;margin-bottom:24px}
.do-padel-admin-kicker{margin:0 0 10px;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-admin-title{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(30px,5vw,54px);font-weight:400;line-height:1.05;letter-spacing:.05em;text-transform:uppercase;color:#f6e6bc}
.do-padel-admin-sub{margin:12px 0 0;max-width:720px;font-size:13px;line-height:1.65;color:#d8c79b}
.do-padel-admin-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}
.do-padel-admin-btn{border:1px solid rgba(214,177,87,.36);border-radius:999px;padding:12px 16px;background:rgba(214,177,87,.06);font:600 10px/1 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#f6e6bc;cursor:pointer}
.do-padel-admin-btn:hover,.do-padel-admin-btn:focus-visible{border-color:rgba(214,177,87,.68);outline:none}
.do-padel-admin-btn:disabled{opacity:.45;cursor:wait}
.do-padel-admin-btn.is-approve{border-color:rgba(139,197,46,.56);background:rgba(139,197,46,.10)}
.do-padel-admin-btn.is-reject{border-color:rgba(178,32,32,.54);background:rgba(178,32,32,.11)}
.do-padel-admin-status{min-height:20px;margin:0 0 16px;font-size:12px;line-height:1.6;color:rgba(214,177,87,.78)}
.do-padel-admin-list{display:grid;gap:16px}
.do-padel-admin-card{border:1px solid rgba(214,177,87,.22);border-radius:18px;padding:20px;background:linear-gradient(180deg,rgba(17,15,10,.84),rgba(5,5,5,.88));box-shadow:0 20px 52px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,235,180,.08)}
.do-padel-admin-card-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:start;margin-bottom:16px}
.do-padel-admin-name{margin:0;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(22px,3vw,30px);line-height:1.2;color:#f6e6bc}
.do-padel-admin-meta{margin:6px 0 0;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(216,199,155,.74)}
.do-padel-admin-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.do-padel-admin-badge{border:1px solid rgba(214,177,87,.24);border-radius:999px;padding:7px 9px;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(246,230,188,.84);background:rgba(0,0,0,.18)}
.do-padel-admin-badge.is-score{border-color:rgba(139,197,46,.38);color:rgba(139,197,46,.96)}
.do-padel-admin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.do-padel-admin-field{min-width:0;border:1px solid rgba(214,177,87,.13);border-radius:12px;padding:12px;background:rgba(0,0,0,.22)}
.do-padel-admin-label{display:block;margin-bottom:7px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(214,177,87,.58)}
.do-padel-admin-value{margin:0;font-size:12px;line-height:1.55;color:rgba(245,238,218,.86);overflow-wrap:anywhere}
.do-padel-admin-value a{color:#f6d77b;text-decoration:none}
.do-padel-admin-wide{grid-column:1/-1}
.do-padel-admin-listline{display:flex;flex-wrap:wrap;gap:7px;margin:0}
.do-padel-admin-chip{border:1px solid rgba(139,197,46,.24);border-radius:999px;padding:6px 8px;font-size:10px;color:rgba(216,199,155,.9)}
.do-padel-admin-conflict{display:grid;gap:8px}
.do-padel-admin-conflict strong{font-size:11px;color:#f6e6bc}
@media(max-width:760px){
.do-padel-admin-head,.do-padel-admin-card-head{grid-template-columns:1fr}
.do-padel-admin-actions,.do-padel-admin-badges{justify-content:flex-start}
.do-padel-admin-grid{grid-template-columns:1fr}
}
.do-padel-metrics-page{padding-top:clamp(38px,6.8vh,76px)}
.do-padel-metrics-page .do-padel-editorial-title{max-width:760px;margin-bottom:18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(27px,4.2vw,42px);font-weight:600;letter-spacing:.18em;color:var(--brand-green);-webkit-text-fill-color:var(--brand-green);background:none;text-shadow:0 0 20px rgba(139,197,46,.18);filter:none}
.do-padel-metrics-page .do-padel-editorial-sub{margin-bottom:26px}
.do-padel-metrics-page .do-padel-editorial-rule{margin-bottom:clamp(27px,3.8vw,39px)}
.do-padel-voice-panel{width:min(100%,640px);margin:0 auto;border:1px solid rgba(214,177,87,.25);border-radius:28px;padding:clamp(31px,4.7vw,47px);background:linear-gradient(180deg,rgba(18,14,8,.72),rgba(5,5,5,.80));backdrop-filter:blur(18px) saturate(116%);-webkit-backdrop-filter:blur(18px) saturate(116%);box-shadow:0 36px 86px rgba(0,0,0,.70),0 14px 34px rgba(0,0,0,.44),0 0 0 1px rgba(139,197,46,.10),0 0 34px rgba(139,197,46,.105),0 0 58px rgba(214,177,87,.06),inset 0 0 54px rgba(214,177,87,.045),inset 0 1px 0 rgba(255,235,180,.13);transform:translateY(-3px)}
.do-padel-voice-question{margin:0 0 20px;font-size:clamp(22px,3.4vw,31px);font-weight:400;line-height:1.34;letter-spacing:.06em;color:var(--soft);text-wrap:balance}
.do-padel-voice-options{display:grid;gap:13px;margin-top:30px}
.do-padel-voice-option{position:relative;display:flex;align-items:center;min-height:58px;border:1px solid rgba(214,177,87,.36);border-radius:18px;padding:17px 52px 17px 22px;background:linear-gradient(180deg,rgba(255,235,180,.078),rgba(255,235,180,.026)),rgba(5,5,5,.48);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.35;letter-spacing:.15em;text-transform:uppercase;color:rgba(246,215,123,.93);box-shadow:0 15px 31px rgba(0,0,0,.30),0 1px 0 rgba(255,255,255,.035),inset 0 1px 0 rgba(255,255,255,.078),inset 0 -18px 38px rgba(0,0,0,.15);cursor:pointer;transition:transform .2s cubic-bezier(.22,.9,.36,1),border-color .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease}
.do-padel-voice-option::after{content:"";position:absolute;right:19px;top:50%;width:10px;height:10px;border-radius:50%;border:1px solid rgba(214,177,87,.44);transform:translateY(-50%);box-shadow:inset 0 0 0 2px rgba(0,0,0,.18);transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s cubic-bezier(.22,.9,.36,1)}
.do-padel-voice-option:hover,.do-padel-voice-option:focus-visible{transform:translateY(-2px);border-color:rgba(214,177,87,.64);color:#f6d77b;box-shadow:0 19px 36px rgba(0,0,0,.36),0 0 0 1px rgba(214,177,87,.085),0 0 22px rgba(214,177,87,.085),inset 0 1px 0 rgba(255,255,255,.11);outline:none}
.do-padel-voice-option:hover::after,.do-padel-voice-option:focus-visible::after{border-color:rgba(139,197,46,.74);box-shadow:0 0 13px rgba(139,197,46,.18),inset 0 0 0 2px rgba(0,0,0,.18)}
.do-padel-voice-option:active{transform:translateY(0) scale(.991)}
.do-padel-voice-option.selected{transform:translateY(-1px) scale(.996);border-color:rgba(214,177,87,.80);background:linear-gradient(180deg,rgba(139,197,46,.11),rgba(214,177,87,.046)),rgba(5,5,5,.56);color:#f6d77b;box-shadow:0 21px 43px rgba(0,0,0,.41),0 0 0 1px rgba(139,197,46,.31),0 0 28px rgba(139,197,46,.25),0 0 25px rgba(214,177,87,.11),inset 0 1px 0 rgba(255,255,255,.12)}
.do-padel-voice-option.selected::after{background:var(--brand-green);border-color:rgba(139,197,46,.96);box-shadow:0 0 17px rgba(139,197,46,.46),0 0 0 5px rgba(139,197,46,.08);transform:translateY(-50%) scale(1.24)}
.do-padel-voice-note{margin:18px auto 0;min-height:18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(214,177,87,.68)}
/* Player Voice journey — continuous 20-question conversation. */
.do-padel-voice-progress{display:flex;flex-direction:column;gap:11px;margin:0 0 28px}
.do-padel-voice-count{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.30em;text-transform:uppercase;color:rgba(214,177,87,.64)}
.do-padel-voice-bar{position:relative;height:3px;border-radius:3px;background:rgba(214,177,87,.12);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,235,180,.025)}
.do-padel-voice-bar-fill{position:absolute;left:0;top:0;bottom:0;width:5%;border-radius:3px;background:linear-gradient(90deg,rgba(214,177,87,.62),var(--brand-green));box-shadow:0 0 18px rgba(139,197,46,.28);transition:width .68s cubic-bezier(.22,.9,.25,1)}
.do-padel-voice-stage{animation:screenFade .45s cubic-bezier(.22,.9,.36,1) both}
.do-padel-voice-answered{display:grid;gap:15px;text-align:left;animation:screenFade .45s cubic-bezier(.22,.9,.36,1) both}
.do-padel-voice-reflection{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,2.6vw,21px);line-height:1.5;letter-spacing:.02em;color:var(--soft)}
.do-padel-voice-compare{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.65;letter-spacing:.01em;color:#d8c79b;padding:14px 16px;border:1px solid rgba(139,197,46,.22);border-radius:16px;background:rgba(139,197,46,.05)}
.do-padel-voice-compare.is-thin{border-color:rgba(214,177,87,.2);background:rgba(214,177,87,.04);color:rgba(214,177,87,.82)}
.do-padel-voice-curiosity{margin:2px 0 0;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:15px;line-height:1.6;color:rgba(214,177,87,.82)}
.do-padel-voice-continue{margin:22px auto 0;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:200px;border:1px solid rgba(139,197,46,.5);border-radius:999px;padding:15px 26px;background:rgba(139,197,46,.08);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#f4ead4;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.do-padel-voice-continue:hover,.do-padel-voice-continue:focus-visible{border-color:rgba(139,197,46,.78);box-shadow:0 0 26px rgba(139,197,46,.2);outline:none}
.do-padel-voice-continue:active{transform:scale(.985)}
.do-padel-voice-lead{margin:0 0 18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-voice-discovery-lines{display:grid;gap:14px;text-align:left;margin:0}
.do-padel-voice-discovery-line{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.4vw,19px);line-height:1.55;letter-spacing:.02em;color:var(--soft);padding-left:18px;position:relative}
.do-padel-voice-discovery-line::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--brand-green);box-shadow:0 0 12px rgba(139,197,46,.5)}
/* Subtle community reflection line that closes each discovery moment — a quiet
   value cue (confidence / connection / belonging) between Player Voice sections. */
.do-padel-voice-value{margin:22px 0 0;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(15px,2.3vw,18px);line-height:1.5;letter-spacing:.06em;color:rgba(139,197,46,.92);text-shadow:0 0 20px rgba(139,197,46,.18)}
.do-padel-voice-reg{text-align:left;display:grid;gap:12px}
.do-padel-voice-reg-title{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(21px,3.2vw,27px);font-weight:400;line-height:1.3;letter-spacing:.03em;color:var(--soft)}
.do-padel-voice-reg-body{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;line-height:1.7;color:#d8c79b}
.do-padel-voice-reg-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:8px}
.do-padel-voice-reg-cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(214,177,87,.55);border-radius:999px;padding:15px 26px;background:linear-gradient(175deg,rgba(214,177,87,.2),rgba(130,95,28,.14));font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#f6e6bc;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.do-padel-voice-reg-cta:hover,.do-padel-voice-reg-cta:focus-visible{box-shadow:0 0 26px rgba(214,177,87,.24);outline:none}
.do-padel-voice-reg-cta:active{transform:scale(.985)}
.do-padel-voice-skip{background:none;border:none;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(214,177,87,.62);cursor:pointer;text-decoration:none}
.do-padel-voice-skip:hover,.do-padel-voice-skip:focus-visible{color:var(--gold);outline:none}
.do-padel-voice-final{display:grid;gap:18px;animation:screenFade .6s cubic-bezier(.22,.9,.36,1) both}
.do-padel-voice-final-title{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(23px,3.6vw,32px);font-weight:400;line-height:1.28;letter-spacing:.04em;color:var(--soft)}
.do-padel-voice-final-body{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14.5px;line-height:1.75;color:#d8c79b}
.do-padel-voice-final-note{margin:4px 0 0;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:15px;line-height:1.6;color:rgba(214,177,87,.82)}
.do-padel-back{display:flex;width:max-content;align-items:center;justify-content:center;gap:10px;margin:34px auto 0;color:#f2dca6;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;text-align:center}
.do-padel-powered{width:max-content;max-width:100%;margin:22px auto 0;text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(242,220,166,.98)}
.do-padel-powered strong{font-family:Georgia,'Times New Roman',serif;font-size:12px;font-weight:400;letter-spacing:.12em}
/* ── MEMBERSHIP DAYS ENDED ──────────────────────────────────────────────────
   The same panel language as the launch proposition on the registration page —
   one bordered block, green hairline wash, gold heading — so the offer reads as
   the same offer wherever the member meets it. Presentation only. */
.do-padel-membership-panel{margin:0 auto;max-width:560px;padding:20px 20px 22px;border:1px solid rgba(139,197,46,.3);border-radius:16px;background:linear-gradient(180deg,rgba(139,197,46,.07) 0%,rgba(0,0,0,0) 62%);text-align:center}
.do-padel-membership-head{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;font-weight:400;letter-spacing:.13em;text-transform:uppercase;line-height:1.5;color:var(--brand-green)}
.do-padel-membership-copy{margin:9px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;letter-spacing:.015em;line-height:1.7;color:var(--soft);opacity:.9}
.do-padel-membership-foot{margin:16px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;line-height:1.5}
@media (max-width:380px){
.do-padel-membership-panel{padding:16px 14px 18px}
.do-padel-membership-head{font-size:12px;letter-spacing:.11em}
.do-padel-membership-copy{font-size:11.5px}
.do-padel-membership-foot{font-size:10.5px;letter-spacing:.12em}
}

/* ── FOOTER LEGAL LINE ──────────────────────────────────────────────────────
   One centred legal line directly beneath every POWERED BY DO→?® footer in the
   application, and nothing else. Attached with ::after to the three existing
   POWERED BY DO→?® elements rather than added to their markup, which is what
   keeps every one of those footers — including the ones the app builds at
   runtime for the guided-session and sponsor-interstitial screens — completely
   unchanged in branding, wording, spacing and layout. The mark above it is not
   touched in any way; this only adds a line below it.

   Each POWERED BY element is a centred box only as wide as its own text, so the
   line is centred on that box's centre (left:50% + translateX) and held to a
   single line with white-space:nowrap. Subtle and smaller than the mark above. */
.do-padel-powered::after,
.do-sponsor-screen-brand::after{
  content:"© 2026 The Do Coin Limited. All rights reserved.";
  position:relative;left:50%;transform:translateX(-50%);
  display:block;width:max-content;max-width:100vw;margin-top:9px;
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
  font-size:8.5px;font-weight:400;font-style:normal;letter-spacing:.07em;line-height:1.4;
  text-transform:none;text-align:center;white-space:nowrap;
  color:rgba(240,218,164,.86)
}

/* ── DO→?® SIGN-OFF FOOTER ─────────────────────────────────────────────────
   The closing footer on the Buttons page and on INVITE A NEW MEMBER, and on no
   other route: the DO→?® master mark on one line, the company line beneath it,
   both centred under the content they close. It replaces the POWERED BY DO→?®
   footer — and the legal line the ::after rule above attaches to that footer —
   on those two pages only. Every other footer in the application, and the rule
   above, is left exactly as it is.

   LEGIBILITY FIRST. Both lines are set at full strength: the mark in a clear
   gold, the company line in a warm near-white. Nothing here is translucent,
   faded or glowing, so the footer stays crisp on a phone against the black
   ground while remaining quiet enough to read as secondary to the page above. */
.do-padel-signoff{width:max-content;max-width:100%;margin:32px auto 0;text-align:center}
.do-padel-signoff-mark{display:block;font-family:Georgia,'Times New Roman',serif;font-size:16px;font-weight:400;letter-spacing:.14em;line-height:1.3}
.do-padel-signoff-mark .wm-gold{color:#edcd86;-webkit-text-fill-color:#edcd86}
.do-padel-signoff-legal{display:block;margin-top:9px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:400;letter-spacing:.1em;line-height:1.5;color:#f6efe0}
@media (max-width:380px){
.do-padel-signoff-mark{font-size:15px;letter-spacing:.12em}
.do-padel-signoff-legal{font-size:11px}
}

/* ── PREMIUM PADEL DNA REPORT (pvr-* / pvj-*) ───────────────────────────────────
   Faithful reproduction of the approved DO→PADEL DNA™ Journey: progression ring +
   Foundation completed badge, the development roadmap, the journey continuation
   banner, the report action buttons and the footer.
   Rendered into #pvStage; the surrounding #pvPanel chrome is neutralised while the
   report is open (.pvr-open) so the journey reads as one premium surface. */
.do-padel-voice-panel.pvr-open{border:none;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0;width:min(100%,680px);max-width:680px;transform:none}
.pvr{display:flex;flex-direction:column;gap:16px;text-align:left;animation:screenFade .5s cubic-bezier(.22,.9,.36,1) both}
.pvr-card{position:relative;border:1px solid rgba(214,177,87,.20);border-radius:22px;background:linear-gradient(180deg,rgba(17,14,9,.66),rgba(6,7,4,.74));box-shadow:0 26px 64px rgba(0,0,0,.52),0 0 0 1px rgba(139,197,46,.05),0 0 40px rgba(139,197,46,.05),inset 0 1px 0 rgba(255,235,180,.06);overflow:hidden}
.pvr-card::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 0%,rgba(139,197,46,.07),transparent 60%);opacity:.9}
/* ── Padel DNA™ Journey — approved production layout (pvj-*) ─────────────────── */
.pvr-journey{gap:0}
.pvj-shell{position:relative;border:1px solid rgba(214,177,87,.22);border-radius:26px;background:linear-gradient(180deg,rgba(15,13,8,.72),rgba(5,6,3,.82));box-shadow:0 30px 72px rgba(0,0,0,.56),0 0 0 1px rgba(139,197,46,.05),0 0 46px rgba(139,197,46,.05),inset 0 1px 0 rgba(255,235,180,.06);padding:clamp(16px,3.4vw,28px);display:flex;flex-direction:column;gap:clamp(16px,3.2vw,24px);overflow:visible}
.pvj-shell::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at 50% 0%,rgba(139,197,46,.07),transparent 58%);opacity:.9}
.pvj-shell > *{position:relative;z-index:1}
/* Top: progression (left) + roadmap (right) */
.pvj-top{display:grid;grid-template-columns:minmax(0,.86fr) 1px minmax(0,1.14fr);gap:clamp(12px,2.6vw,24px);align-items:stretch}
.pvj-kicker{margin:0 0 clamp(12px,2vw,18px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,2vw,12px);font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-green);text-align:center}
.pvj-prog{display:flex;flex-direction:column;align-items:center;text-align:center}
/* Progression ring */
.pvj-ring{position:relative;width:clamp(120px,34vw,186px);height:clamp(120px,34vw,186px);margin:0 auto}
.pvj-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.pvj-ring-arc{filter:drop-shadow(0 0 5px rgba(139,197,46,.55))}
.pvj-ring-dot{filter:drop-shadow(0 0 6px rgba(190,240,110,.9))}
.pvj-ring-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.pvj-ring-num{font-family:Georgia,'Times New Roman',serif;font-size:clamp(40px,10vw,58px);line-height:.9;color:#e6c471;text-shadow:0 0 20px rgba(214,177,87,.16)}
.pvj-ring-of{margin-top:6px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,2.3vw,13px);font-weight:600;letter-spacing:.07em;color:#f2ead6}
.pvj-ring-cap{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,2.1vw,12px);font-weight:600;letter-spacing:.08em;line-height:1.35;color:#f2ead6}
.pvj-ring-cap:first-of-type{margin-top:3px}
/* Foundation completed badge */
.pvj-found{margin-top:clamp(22px,4.4vw,34px);width:100%;display:flex;flex-direction:column;align-items:center;text-align:center}
.pvj-found-head{display:flex;align-items:center;justify-content:center}
.pvj-found-titles{display:flex;flex-direction:column;align-items:center;gap:clamp(7px,1.6vw,11px);text-align:center}
.pvj-found-t1{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,2.5vw,15px);font-weight:600;letter-spacing:.12em;text-indent:.12em;text-transform:uppercase;color:#f4ecd8;text-align:center}
.pvj-found-t2{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(16.8px,3.75vw,22.4px);font-weight:600;letter-spacing:.04em;text-indent:.04em;text-transform:uppercase;color:#e6c471;text-align:center}
.pvj-found-rule{width:clamp(66px,15vw,104px);height:1px;margin:clamp(11px,2.4vw,16px) 0;background:linear-gradient(90deg,rgba(214,177,87,.85),transparent)}
.pvj-found-note{margin:-7px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.5px,2.7vw,15px);line-height:1.5;color:#e9e2d0}
/* Vertical divider between the two columns */
.pvj-vdiv{width:1px;background:linear-gradient(180deg,transparent,rgba(214,177,87,.26),transparent)}
/* Roadmap */
.pvj-road-h{margin:0 0 6px;display:flex;align-items:center;justify-content:center;gap:clamp(7px,2vw,11px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,2.05vw,13px);font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--brand-green);text-align:center}
.pvj-dash{width:clamp(12px,3vw,22px);height:1px;background:rgba(139,197,46,.6);flex:none}
.pvj-road-sub{margin:0 0 clamp(13px,2.6vw,18px);text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(9.5px,1.95vw,12px);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#c9a961}
.pvj-road{position:relative}
.pvj-road::before{content:"";position:absolute;left:calc(clamp(11px,2.4vw,15px) + clamp(19px,4.4vw,24px));top:calc(clamp(11px,2.2vw,15px) + clamp(19px,4.4vw,24px));bottom:clamp(19px,4.4vw,24px);border-left:1.5px dashed rgba(214,177,87,.26);z-index:0}
.pvj-mile{position:relative;z-index:1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;column-gap:clamp(9px,2.2vw,14px);border:1px solid rgba(214,177,87,.16);border-radius:16px;padding:clamp(11px,2.2vw,15px);margin-bottom:clamp(9px,1.8vw,13px);background:rgba(9,9,6,.5)}
.pvj-mile-ico{width:clamp(38px,8.8vw,48px);height:clamp(38px,8.8vw,48px);flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid rgba(184,184,172,.34);color:#b7b3a6;background:#0b0b08}
.pvj-mile-ico svg{width:46%;height:46%;display:block}
.pvj-mile-body{min-width:0;display:flex;flex-direction:column}
.pvj-mile-t{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,2.6vw,15px);font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:#f1ead7;line-height:1.15}
.pvj-mile-s{margin-top:2px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(9.5px,2vw,12px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#8f8a7d;line-height:1.2}
.pvj-mile-n{margin-top:clamp(4px,1vw,6px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,2.1vw,12.5px);letter-spacing:.01em;color:#c9a961;line-height:1.25}
.pvj-mile-end{flex:none;display:flex;align-items:center;justify-content:center;color:#7d786c}
.pvj-mile-end svg{width:clamp(16px,3.4vw,20px);height:clamp(16px,3.4vw,20px);display:block}
.pvj-mile.is-done{border-color:rgba(139,197,46,.55);background:linear-gradient(180deg,rgba(139,197,46,.10),rgba(139,197,46,.02));box-shadow:0 0 22px rgba(139,197,46,.14),inset 0 0 0 1px rgba(139,197,46,.05)}
.pvj-mile.is-done .pvj-mile-ico{border-color:rgba(139,197,46,.7);color:var(--brand-green);box-shadow:0 0 16px rgba(139,197,46,.3),inset 0 0 10px rgba(139,197,46,.08)}
.pvj-mile.is-done .pvj-mile-s{color:var(--brand-green)}
.pvj-mile.is-done .pvj-mile-n{color:rgba(139,197,46,.92)}
.pvj-mile.is-done .pvj-mile-end{color:var(--brand-green)}
.pvj-more{position:relative;z-index:1;display:flex;align-items:center;gap:clamp(10px,2.2vw,14px);padding-left:clamp(11px,2.2vw,15px);margin-top:clamp(2px,1vw,5px)}
.pvj-more-dot{width:clamp(38px,8.8vw,48px);height:clamp(38px,8.8vw,48px);flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px dashed rgba(184,184,172,.4);color:#8f8a7d;background:#0b0b08}
.pvj-more-dot svg{width:44%;height:44%}
.pvj-more-txt{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,2.4vw,13.5px);letter-spacing:.02em;color:#8f8a7d}
/* Journey continuation banner */
.pvj-banner{position:relative;text-align:center;border:1px solid rgba(214,177,87,.2);border-radius:20px;background:linear-gradient(180deg,rgba(17,14,9,.6),rgba(6,7,4,.7));padding:clamp(34px,6vw,46px) clamp(20px,5vw,44px) clamp(24px,4.4vw,34px);margin-top:clamp(10px,2vw,16px)}
.pvj-banner-badge{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);width:clamp(48px,10vw,60px);height:clamp(48px,10vw,60px);border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid rgba(139,197,46,.6);background:radial-gradient(circle at 50% 40%,rgba(22,29,10,.99),rgba(6,8,4,.99));color:var(--brand-green);box-shadow:0 0 26px rgba(139,197,46,.3),inset 0 0 12px rgba(139,197,46,.12)}
.pvj-banner-badge svg{width:46%;height:46%}
.pvj-banner-title{margin:0 0 clamp(10px,2vw,14px);font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(24px,5.6vw,38px);line-height:1.12;letter-spacing:.01em;color:#e6c471;text-shadow:0 0 22px rgba(214,177,87,.14)}
.pvj-banner-lead{margin:0 0 clamp(12px,2.2vw,16px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,2.9vw,17px);line-height:1.5;color:#ece5d3}
.pvj-banner-cta{margin:0;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(13px,2.9vw,17px);line-height:1.55;color:rgba(139,197,46,.92)}
/* Report action buttons */
.pvr-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(9px,2vw,14px)}
.pvr-act{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:clamp(11px,2.4vw,16px);border:1px solid rgba(214,177,87,.22);border-radius:18px;padding:clamp(18px,3vw,24px) clamp(8px,2vw,14px);background:linear-gradient(180deg,rgba(16,14,9,.62),rgba(6,7,4,.72));color:#e9dcb6;cursor:pointer;text-align:center;font:inherit;transition:box-shadow .2s ease,transform .15s ease,border-color .2s ease,background .2s ease}
.pvr-act-feature{border-color:rgba(139,197,46,.5);box-shadow:0 0 20px rgba(139,197,46,.1)}
.pvr-act-ico{width:clamp(44px,10vw,56px);height:clamp(44px,10vw,56px);border-radius:50%;border:1.5px solid rgba(139,197,46,.55);display:flex;align-items:center;justify-content:center;color:var(--brand-green);flex:none;box-shadow:inset 0 0 12px rgba(139,197,46,.08),0 0 14px rgba(139,197,46,.1)}
.pvr-act-ico svg{width:44%;height:44%;display:block}
.pvr-act-txt{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,2.2vw,12px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1.35;color:#e9dcb6}
.pvr-act:hover,.pvr-act:focus-visible{border-color:rgba(139,197,46,.5);box-shadow:0 0 22px rgba(139,197,46,.12);outline:none}
.pvr-act:active{transform:scale(.985)}
.pvr-act[data-playing="1"]{border-color:rgba(139,197,46,.72);box-shadow:0 0 28px rgba(139,197,46,.22);background:linear-gradient(180deg,rgba(139,197,46,.17),rgba(80,110,26,.1))}
.pvr-act[data-playing="1"] .pvr-act-ico{border-color:rgba(139,197,46,.85);color:#b6e85a;box-shadow:0 0 16px rgba(139,197,46,.4),inset 0 0 10px rgba(139,197,46,.1)}
.pvr-act .pvr-ic-stop{display:none}
.pvr-act[data-playing="1"] .pvr-ic-play{display:none}
.pvr-act[data-playing="1"] .pvr-ic-stop{display:block}
.pvr-act[data-loading="1"]{opacity:.78}
.pvr-act[data-loading="1"] .pvr-act-ico{animation:pvrPulse 1.1s ease-in-out infinite}
@keyframes pvrPulse{0%,100%{opacity:.55}50%{opacity:1}}
/* Footer */
.pvj-foot{position:relative;text-align:center;margin-top:clamp(4px,1.2vw,10px);padding:clamp(4px,1.2vw,8px) 0}
.pvj-foot-tag{display:flex;align-items:center;justify-content:center;gap:clamp(7px,1.8vw,10px);margin:0 0 clamp(8px,1.6vw,12px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,2.6vw,15px);letter-spacing:.03em;color:#c9a961}
.pvj-foot-tag svg{width:clamp(13px,2.8vw,16px);height:clamp(13px,2.8vw,16px);color:#c9a961;flex:none}
.pvj-foot-powered{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,2.1vw,12px);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#c9a961}
.pvj-do{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:.02em;color:#e0bb63}
.pvj-arrow{padding:0 .04em}
/* ── Padel DNA™ Showcase onboarding (read-only demonstration) ───────────────────
   The first-run showcase reuses the approved completed Padel DNA™ dashboard
   (pvj-*) verbatim and layers a demonstration notice, the approved brand
   philosophy and a single "Begin Your Padel DNA™ Journey" call to action on top.
   Nothing here reads or writes member data — the dashboard behind it is rendered
   from one fixed demonstration dataset. */
.pvj-showcase-intro{position:relative;text-align:center;border:1px solid rgba(214,177,87,.28);border-radius:20px;background:linear-gradient(180deg,rgba(20,16,9,.72),rgba(6,7,4,.82));padding:clamp(20px,4vw,30px) clamp(18px,4vw,34px)}
.pvj-showcase-badge{display:inline-block;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(9.5px,2vw,11px);font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green);border:1px solid rgba(139,197,46,.5);border-radius:999px;padding:6px 16px;margin:0 0 clamp(12px,2.4vw,16px);background:rgba(139,197,46,.06)}
.pvj-showcase-intro-title{margin:0 0 clamp(8px,1.8vw,12px);font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(20px,4.6vw,30px);line-height:1.15;color:#e6c471;text-shadow:0 0 22px rgba(214,177,87,.14)}
.pvj-showcase-intro-lead{margin:0 auto;max-width:52ch;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,2.9vw,16px);line-height:1.6;color:#ece5d3}
.pvj-showcase-intro-note{margin:clamp(10px,2vw,14px) auto 0;max-width:52ch;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,2.4vw,13px);line-height:1.55;letter-spacing:.02em;color:#c9a961}
.pvj-showcase-cta{position:relative;text-align:center;border:1px solid rgba(214,177,87,.2);border-radius:20px;background:linear-gradient(180deg,rgba(17,14,9,.6),rgba(6,7,4,.7));padding:clamp(28px,5vw,40px) clamp(20px,5vw,40px)}
.pvj-showcase-philo{margin:0 auto clamp(20px,4vw,28px);max-width:46ch;display:flex;flex-direction:column;gap:clamp(6px,1.4vw,9px)}
.pvj-showcase-philo-line{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(14px,3.1vw,18px);line-height:1.5;color:#ece5d3}
.pvj-showcase-philo-emph{margin:0;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(17px,4vw,23px);line-height:1.35;letter-spacing:.02em;color:#e6c471;text-shadow:0 0 20px rgba(214,177,87,.16)}
.pvj-showcase-begin{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:240px;border:1px solid rgba(214,177,87,.6);border-radius:999px;padding:16px 30px;background:linear-gradient(175deg,rgba(214,177,87,.24),rgba(130,95,28,.16));font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#f6e6bc;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.pvj-showcase-begin:hover{transform:translateY(-1px);box-shadow:0 12px 30px rgba(214,177,87,.18);border-color:rgba(214,177,87,.8)}
.pvj-showcase-begin:active{transform:translateY(0)}
.pvj-showcase-begin:focus-visible{outline:2px solid rgba(214,177,87,.7);outline-offset:3px}
/* Milestone rows and the "more milestones ahead" cue are tappable controls that
   open each milestone's own overview. Cursor affordance only — the approved
   card visuals are unchanged. */
.pvj-mile[role=button],.pvj-more[role=button]{cursor:pointer}
.pvj-mile[role=button]:focus-visible,.pvj-more[role=button]:focus-visible{outline:2px solid rgba(214,177,87,.6);outline-offset:3px}
/* Milestone overview status pill */
.pvj-mv-status{display:inline-block;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:6px 16px;border-radius:999px;border:1px solid rgba(184,184,172,.34);color:#8f8a7d;margin-bottom:18px}
.pvj-mv-status.is-done{color:var(--brand-green);border-color:rgba(139,197,46,.55)}
.pvj-mv-status.is-next{color:#e0bb63;border-color:rgba(214,177,87,.5)}
.pvj-mv-ico{margin:0 auto 18px;width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid rgba(184,184,172,.34);color:#b7b3a6;background:#0b0b08}
.pvj-mv-ico svg{width:46%;height:46%;display:block}
.pvj-mv-ico.is-done{border-color:rgba(139,197,46,.7);color:var(--brand-green);box-shadow:0 0 16px rgba(139,197,46,.3),inset 0 0 10px rgba(139,197,46,.08)}
.pvj-mv-title{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:18px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#f1ead7;margin:0 0 12px;line-height:1.2}

/* ── Premium milestone overview (approved reference layout) ─────────────────────
   One approved layout, reused by every milestone. Only the milestone-specific
   title, icon, status, wording, statistics and hero atmosphere change; the
   composition, spacing, hierarchy, typography and premium aesthetic are fixed. */
.pvmile-frame{position:relative;width:100%;max-width:440px;max-height:92vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#0a0a07 0%,#050503 100%);border:1px solid rgba(214,177,87,.34);border-radius:24px;box-shadow:0 26px 90px rgba(0,0,0,.72),inset 0 0 0 1px rgba(214,177,87,.05);overflow:hidden}
.pvmile-bar{position:relative;flex:0 0 auto;display:flex;align-items:center;justify-content:center;padding:20px 24px 15px;border-bottom:1px solid rgba(214,177,87,.10)}
.pvmile-eyebrow{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:13px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);text-indent:.34em;font-weight:400}
.pvmile-x{position:absolute;top:50%;right:18px;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:1px solid rgba(214,177,87,.4);background:transparent;color:var(--gold);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s ease;touch-action:manipulation;padding:0}
.pvmile-x:hover{background:rgba(214,177,87,.1)}
.pvmile-x:active{transform:translateY(-50%) scale(.94)}
.pvmile-x svg{width:18px;height:18px}
.pvmile-scroll{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:28px 26px 26px}

/* State accents — completed (green), next assessment (gold), locked (muted). */
.pvmile{--maccent:#8bc52e;--maccent-soft:rgba(139,197,46,.5);--maccent-glow:rgba(139,197,46,.32);text-align:center}
.pvmile.mstate-next{--maccent:#e0bb63;--maccent-soft:rgba(214,177,87,.5);--maccent-glow:rgba(214,177,87,.28)}
.pvmile.mstate-locked{--maccent:#b7b3a6;--maccent-soft:rgba(184,184,172,.34);--maccent-glow:rgba(184,184,172,.14)}

.pvmile-badge{margin:2px auto 20px;width:88px;height:88px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid var(--maccent-soft);color:var(--maccent);background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.04),transparent 70%),#0a0a07;box-shadow:0 0 26px var(--maccent-glow),inset 0 0 14px var(--maccent-glow)}
.pvmile-badge svg{width:44%;height:44%}
.pvmile-title{margin:0 0 16px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:34px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;color:#f4eedd;line-height:1.05}
.pvmile-status{display:inline-flex;align-items:center;gap:8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;padding:9px 20px;border-radius:999px;border:1px solid var(--maccent-soft);color:var(--maccent);background:rgba(255,255,255,.02)}
.pvmile-status svg{width:15px;height:15px}
.pvmile-caption{margin:16px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:17px;color:var(--gold);letter-spacing:.01em;line-height:1.4}

.pvmile-hero{position:relative;margin:22px 0 4px;border-radius:16px;overflow:hidden;box-shadow:0 16px 44px rgba(0,0,0,.62)}
.pvmile-hero img{display:block;width:100%;height:auto}
.pvmile-hero::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 66px rgba(0,0,0,.55);background:var(--pvmile-tint,transparent)}

.pvmile-stats{display:flex;align-items:stretch;margin:26px 0 6px}
.pvmile-stat{flex:1 1 0;display:flex;flex-direction:column;align-items:center;gap:9px;padding:2px 8px;text-align:center;min-width:0}
.pvmile-stat+.pvmile-stat{border-left:1px solid rgba(214,177,87,.14)}
.pvmile-stat-ico{height:64px;display:flex;align-items:center;justify-content:center;color:var(--maccent)}
.pvmile-stat-ico>svg{width:28px;height:28px}
.pvmile-stat-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);opacity:.92}
.pvmile-stat-val{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;color:#efe7d3;line-height:1.35}
.pvmile-ring{position:relative;width:62px;height:62px}
.pvmile-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.pvmile-ring-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;font-weight:700;color:#efe7d3}

.pvmile-section{text-align:left;margin-top:28px}
.pvmile-h{margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.pvmile-p{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.62;color:#d7cbaf}
.pvmile-rule{height:1px;background:linear-gradient(90deg,transparent,rgba(214,177,87,.28),transparent);margin:26px 0}

.pvmile-feature{display:flex;align-items:flex-start;gap:16px;text-align:left;margin-top:24px}
.pvmile-feature:first-child{margin-top:0}
.pvmile-feature-ico{flex:0 0 auto;width:42px;height:42px;border-radius:50%;border:1px solid var(--maccent-soft);color:var(--maccent);display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.02)}
.pvmile-feature-ico svg{width:20px;height:20px}
.pvmile-feature-body{flex:1 1 auto;min-width:0}
.pvmile-feature-h{margin:2px 0 8px;font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.pvmile-feature-p{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14.5px;line-height:1.6;color:#d7cbaf}

.pvmile-actions{display:flex;gap:12px;margin-top:30px}
.pvmile-btn{flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid rgba(214,177,87,.4);border-radius:999px;background:transparent;color:var(--gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:15px 14px;cursor:pointer;transition:all .25s ease;touch-action:manipulation;min-height:50px}
.pvmile-btn svg{width:17px;height:17px;flex:0 0 auto}
.pvmile-btn:hover{background:rgba(214,177,87,.08)}
.pvmile-btn:active{transform:scale(.98)}
.pvmile-btn--report{flex:1.7 1 0}
@media(max-width:400px){
.pvmile-scroll{padding:22px 18px 20px}
.pvmile-title{font-size:30px}
.pvmile-caption{font-size:16px}
.pvmile-stat{padding:2px 4px}
.pvmile-stat-val{font-size:13px}
.pvmile-actions{gap:9px}
.pvmile-btn{padding:14px 8px;letter-spacing:.1em}
}
@media(max-width:600px){
#pvMilestoneOverlay{padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))}
#pvMilestoneOverlay .pvmile-frame{max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
#pvMilestoneOverlay .pvmile-actions{position:sticky;bottom:0;z-index:2;padding:10px 0;background:#050503}
.pvr-actions{gap:8px}
.pvr-act{padding:16px 6px}
}
@media(max-width:400px){
.pvj-top{gap:9px}
.pvj-mile{padding:9px;column-gap:8px}
.pvj-road::before{left:calc(9px + clamp(19px,4.4vw,24px))}
.pvj-more{padding-left:9px}
}

@media(max-width:720px){
.do-gateway-shell{padding:78px 14px 46px}
.do-gateway-mark{transform:translateY(calc((34px - 78px) / 2))}
.do-gateway-title{letter-spacing:.22em;text-indent:.22em}
.do-gateway-sub{gap:18px;margin-bottom:34px}
.do-gateway-card{min-height:330px;border-radius:22px;padding:30px 24px;padding-bottom:96px}
.do-card-top{gap:18px;align-items:flex-start;flex-direction:column}
.do-card-divider{width:76px;height:1px}
.do-card-name{font-size:34px}
.do-card-rule{margin:26px 0 24px;width:64%}
.do-card-features{max-width:88%;gap:8px;margin-top:24px}
.do-card-feature-icon{width:32px;height:32px}
.do-card-feature-cap{font-size:10px;letter-spacing:.05em}
.do-card-features-rule{width:88%;margin-top:22px}
.do-card-cta{left:24px;right:20px;bottom:28px;gap:16px;font-size:13px;letter-spacing:.15em}
.do-card-arrow{font-size:38px}
.do-card-orbit{right:-20%;width:55%;opacity:.86}
.do-padel-art-clip{border-radius:20.5px;-webkit-clip-path:inset(0 round 20.5px);clip-path:inset(0 round 20.5px)}
.do-padel-art{right:-38%;bottom:-3%;width:66%;opacity:.9}
.do-padel-ball{right:5%;bottom:8%;width:72px;max-width:19vw}
.do-padel-card .do-card-features{max-width:70%;gap:8px}
.do-padel-card .do-card-features-rule{width:76%}
.do-padel-brand-grid{grid-template-columns:repeat(2,1fr)}
.do-padel-clubs-hero,.do-padel-club-detail{grid-template-columns:1fr}
.do-padel-clubs-grid{grid-template-columns:repeat(2,1fr)}
.do-padel-improve-pillars{grid-template-columns:repeat(2,1fr)}
.do-padel-clubs-stage-head{display:grid}
}
@media(max-width:560px){
.do-padel-intent{padding:clamp(6px,1.1vh,12px) 14px calc(40px + env(safe-area-inset-bottom))}
.do-padel-intent-grid{gap:12px}
.do-padel-intent-card{min-height:150px;border-radius:20px;padding:20px 18px 20px}
/* Narrower cards wrap onto more lines, so the shared height is a little taller
   here than on wide screens. Same purpose as the base rule: one height for every
   button in the two-column grid. */
.do-padel-intent-card:not(#doPadelVoiceCard){min-height:290px}
.do-padel-intent-name{letter-spacing:.06em}
.do-padel-intent-arrow{font-size:29px}
.do-padel-editorial{padding:clamp(38px,7vh,68px) 14px calc(44px + env(safe-area-inset-bottom))}
.do-padel-metrics-page .do-padel-editorial-title{font-size:clamp(22px,6.2vw,28px);letter-spacing:.10em}
.do-padel-brand-grid{gap:12px}
.do-padel-brand-card{min-height:194px;border-radius:20px;padding:20px 18px}
.do-padel-brand-name{letter-spacing:.055em;font-size:20px}
.do-padel-brand-desc{font-size:13px}
.do-padel-partners-grid{grid-template-columns:1fr}
.do-padel-partners-section,.do-padel-partners-cta{border-radius:22px}
.do-padel-partners-list{grid-template-columns:1fr}
.do-padel-clubs-panel{border-radius:22px;padding:16px}
.do-padel-clubs-grid,.do-padel-club-sections{grid-template-columns:1fr}
/* Mobile-first ranking: booking spans the row, the supporting actions share
   the line beneath it, socials stay compact. */
.do-padel-club-actions.is-lead{gap:8px;margin-bottom:18px}
.do-padel-club-action.is-primary{flex:1 0 100%;justify-content:center;padding:14px 20px}
.do-padel-club-action.is-key{flex:1 1 auto;justify-content:center}
.do-padel-club-section{padding:12px 14px}
.do-padel-form,.do-padel-improve-pillars{grid-template-columns:1fr}
.do-padel-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}
.do-padel-tab{white-space:nowrap}
.do-padel-clubs-choice,.do-padel-club-card{border-radius:20px;padding:20px 18px}
/* Narrow phones: the DO→PADEL mark stays, the strapline is dropped rather than
   squeezed to an illegible size or pushed into the actions. */
.do-padel-club-signature-mark{width:64px}
.do-padel-club-signature-line{display:none}
/* Location breadcrumbs wrap onto as many lines as the width needs (2 + 2,
   3 + 1, …) instead of scrolling sideways. */
.do-padel-clubs-crumbs{overflow-x:visible;flex-wrap:wrap;padding-bottom:0}
.do-padel-clubs-crumb{white-space:nowrap}
.do-padel-club-dokey{border-radius:20px;padding:20px 17px}
.do-padel-club-dokey-art{margin-top:20px}
.do-padel-club-dokey-copy{font-size:14.5px;line-height:1.72}
.do-padel-club-dokey-support{font-size:14px}
}

/* DO→PADEL™ Sponsorship Presentation — premium full-screen deck of the 18
   supplied pages. Each page is shown exactly as supplied (object-fit:contain,
   no crop/stretch/recolour), on a black cinematic ground with discreet gold
   controls. Horizontal scroll-snap track = swipe on touch, scroll + arrows on
   desktop. Native and custom pinch/double-tap zoom per page. */
#doPadelSponsors{display:none}
body.do-padel-sponsors-mode{min-height:100vh;background:#000;color:#f7f2e6;overflow:hidden}
body.do-padel-sponsors-mode #introOverlay,
body.do-padel-sponsors-mode #sampleOverlay,
body.do-padel-sponsors-mode #mainApp,
body.do-padel-sponsors-mode #doPlatformGateway,
body.do-padel-sponsors-mode #doPadelPlaceholder,
body.do-padel-sponsors-mode #doPadelIntent{display:none !important}
body.do-padel-sponsors-mode::before{display:none}
body.do-padel-sponsors-mode #doPadelSponsors{display:block}

/* DO→PADEL™ Community Values — an editorial page reached from the home-screen
   values line. Presentational only: it does not touch registration, identity,
   Player Voice, payments, analytics, brands or any stored data. */
#doPadelCommunity{display:none}
body.do-padel-community-mode #introOverlay,
body.do-padel-community-mode #sampleOverlay,
body.do-padel-community-mode #mainApp,
body.do-padel-community-mode #doPlatformGateway,
body.do-padel-community-mode #doPadelPlaceholder,
body.do-padel-community-mode #doPadelIntent{display:none !important}
body.do-padel-community-mode::before{display:none}
body.do-padel-community-mode #doPadelCommunity{display:block}

/* ── DO→PADEL™ INVITE A NEW MEMBER ────────────────────────────────────────────
   The member's own invitation page, reached from INVITE A NEW MEMBER on the
   Buttons page. Everything it shows is built from what the member already has:
   their existing Member ID and their existing first name. It allocates nothing,
   stores nothing and changes no membership record — the only thing it does is
   hand the member's own link to somebody, by the four routes below.

   Scoped exactly like the Our Values page above it, so nothing outside this mode
   is affected. */
#doPadelInvitePage{display:none}
body.do-padel-invite-mode #introOverlay,
body.do-padel-invite-mode #sampleOverlay,
body.do-padel-invite-mode #mainApp,
body.do-padel-invite-mode #doPlatformGateway,
body.do-padel-invite-mode #doPadelPlaceholder,
body.do-padel-invite-mode #doPadelIntent{display:none !important}
body.do-padel-invite-mode::before{display:none}
body.do-padel-invite-mode #doPadelInvitePage{display:block}

/* THE APPROVED DO MASTER MARK, CENTRED AT THE TOP OF THE INVITATION.
   The existing approved site artwork (assets/do-master-logo-stronger.png), the
   same file the Media & Press header above already uses — not a recreation and
   not a redesign. It sits centred above the page's opening line at a width that
   reads clearly on a 320px phone without pushing the invitation buttons below the
   fold.

   THE ARTWORK ALREADY CARRIES "TOGETHER WE ARE STRONGER", which is why the
   strapline is no longer also set in type directly beneath it — it would have
   been the same words twice, once in the logo and once under it. Nothing else on
   the page moves: the kicker, the opening copy, the rule, the launch line, the
   link box, the four green-and-gold buttons and the email panel keep the spacing
   they already had. */
.do-padel-invite-mark{width:clamp(180px,29vw,296px);max-width:78vw;margin:0 auto clamp(20px,3.2vw,30px);filter:drop-shadow(0 20px 38px rgba(0,0,0,.6))}
.do-padel-invite-mark img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}

/* THE MEMBER'S OWN LINK, SHOWN AS THE FACT IT IS. Centred, in the brand's
   Signature Green on a gold hairline, at a size that stays on one line at 320px:
   this is the thing being shared, so it is the one element on the page allowed to
   look like a value rather than like a control. */
.do-padel-invite-link{margin:0 auto clamp(22px,3vw,30px);max-width:min(100%,520px);padding:13px 16px;border:1px solid rgba(214,177,87,.28);border-radius:10px;background:rgba(139,197,46,.05);text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,3.1vw,13.5px);font-weight:500;letter-spacing:.03em;line-height:1.5;color:var(--brand-green);word-break:break-all}
.do-padel-invite-link-label{display:block;margin-bottom:6px;font-size:9.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:rgba(214,177,87,.7)}

/* THE FOUR INVITATION BUTTONS — TWO COLUMNS, GREEN AND GOLD.
   Two columns at every width, because four routes in one column becomes a list to
   read rather than a choice to make, and because the pairs belong together:
   WhatsApp beside Email (both send the invitation to one person), Share beside
   Copy Link (both hand the link to the member to place themselves).

   The treatment is the brand's green-and-gold: a green face, a gold label and gold
   icons, with the Signature Green hairline kept. Equal heights regardless of label
   length so the block reads as one set of four.

   THE GREEN IS THE BRAND GREEN, DEEPENED — AND IT HAS TO BE. Gold (#e0bb63) on the
   Signature Green at full strength (#8bc52e) measures 1.2:1, which is not a colour
   choice so much as an invisible label; the two are close in brightness even though
   they read as different colours. The face is therefore the same yellow-green hue
   carried down in value until the gold label clears 4.5:1 against it, so the button
   is unmistakably green and its wording can still be read at 11.5px. Colour only:
   the grid, the 2 x 2 order, the sizes, the spacing, the radius, the hairline, the
   press lift and every handler are exactly as they were. */
.do-padel-invite-actions{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,2vw,14px);margin:0 auto clamp(26px,3.4vw,34px);max-width:min(100%,520px)}
.do-padel-invite-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:88px;padding:16px 12px;border:1px solid rgba(139,197,46,.55);border-radius:12px;background:linear-gradient(160deg,#245609,#122c05);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);-webkit-text-fill-color:var(--gold);cursor:pointer;transition:border-color .25s ease,box-shadow .25s ease,transform .18s ease;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none}
.do-padel-invite-btn:hover,.do-padel-invite-btn:focus-visible{border-color:var(--brand-green);box-shadow:0 0 24px rgba(139,197,46,.2);outline:none}
.do-padel-invite-btn:active{transform:translateY(1px)}
.do-padel-invite-btn[aria-busy="true"]{opacity:.55;cursor:default}
.do-padel-invite-btn svg{width:24px;height:24px;fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* COPIED / DONE — the confirmation keeps the gold label, because the green it used
   to turn is now the colour of the button underneath it and the word would vanish.
   It is marked instead by the hairline coming up to full Signature Green and the
   same green glow the hover already uses. */
.do-padel-invite-btn.is-done{border-color:var(--brand-green);box-shadow:0 0 24px rgba(139,197,46,.28)}

/* THE EMAIL PANEL — ONE FIELD, AND NOTHING ELSE.
   Revealed under the buttons when EMAIL is pressed. It asks for the recipient's
   email address and nothing more: the member never writes, sees or edits the
   invitation itself, because the branded invitation is composed and sent by the
   platform. Closed again when the invitation has been sent. */
.do-padel-invite-email{display:none;margin:0 auto clamp(22px,3vw,30px);max-width:min(100%,520px);padding:18px 16px;border:1px solid rgba(214,177,87,.22);border-radius:12px;background:rgba(4,4,4,.6);text-align:left}
.do-padel-invite-email.is-open{display:block}
.do-padel-invite-email label{display:block;margin:0 0 7px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:rgba(214,177,87,.75)}
.do-padel-invite-email input{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid rgba(214,177,87,.3);border-radius:9px;background:rgba(0,0,0,.5);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:15px;letter-spacing:.02em;color:#f4e8c6;-webkit-appearance:none;appearance:none}
.do-padel-invite-email input:focus{outline:none;border-color:rgba(139,197,46,.6)}
.do-padel-invite-send{width:100%;margin-top:12px;padding:14px;border:1px solid rgba(139,197,46,.6);border-radius:10px;background:rgba(139,197,46,.1);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);cursor:pointer;transition:border-color .25s ease,box-shadow .25s ease;-webkit-appearance:none;appearance:none}
.do-padel-invite-send:hover{border-color:var(--brand-green);box-shadow:0 0 22px rgba(139,197,46,.18)}
.do-padel-invite-send[aria-busy="true"]{opacity:.55;cursor:default}
/* The one line of feedback the page ever shows. It reports what actually happened
   and never claims a delivery that did not take place. */
.do-padel-invite-status{display:none;margin:14px auto 0;max-width:min(100%,520px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.02em;line-height:1.6;text-align:center;color:#d8c79b}
.do-padel-invite-status.is-visible{display:block}
.do-padel-invite-status.is-sent{color:var(--brand-green)}
.do-padel-invite-status.is-failed{color:rgba(224,187,99,.95)}
/* YOUR FIRST 14 DAYS ARE ON US — the same welcome the invitation itself carries,
   stated once here so the member knows what they are offering. */
.do-padel-invite-launch{margin:0 auto clamp(20px,2.8vw,26px);max-width:min(100%,520px);text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:12.5px;letter-spacing:.1em;line-height:1.6;color:var(--brand-green)}

/* BOOK A COURT — the DO→PADEL™ community page that sits between the approved
   Featured Partner interstitial and Playtomic. Fully self-scoped: every rule below
   is contained under #doPadelBookCourt or the page's own body mode class, and the
   page is built from the existing editorial shell, the existing DO→PADEL™ wordmark,
   the existing Together We Are Stronger lockup and the existing POWERED BY DO→?®
   footer. Nothing here touches any other route. */
#doPadelBookCourt{display:none}
body.do-padel-book-court-mode #introOverlay,
body.do-padel-book-court-mode #sampleOverlay,
body.do-padel-book-court-mode #mainApp,
body.do-padel-book-court-mode #doPlatformGateway,
body.do-padel-book-court-mode #doPadelPlaceholder,
body.do-padel-book-court-mode #doPadelIntent{display:none !important}
body.do-padel-book-court-mode::before{display:none}
body.do-padel-book-court-mode #doPadelBookCourt{display:block}
/* The page runs top-aligned rather than vertically centred, because it is taller
   than one viewport once the full-height racket, the message and the CTA are in. */
#doPadelBookCourt .do-padel-editorial{align-items:flex-start}
/* Header — the existing DO→PADEL™ coin, centred, at a restrained size. */
.do-padel-bc-coin{display:block;width:clamp(112px,26vw,164px);height:auto;margin:0 auto clamp(26px,4vw,38px);user-select:none;-webkit-user-drag:none}
.do-padel-bc-title{margin:0 auto 12px;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(20px,4.4vw,30px);line-height:1.2;letter-spacing:.2em;text-transform:uppercase;color:#e6c477}
.do-padel-bc-sub{margin:0 auto 10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.8vw,15.5px);letter-spacing:.06em;color:#ebdfbe}
.do-padel-bc-note{margin:0 auto;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11.5px,1.5vw,13px);letter-spacing:.05em;color:rgba(216,199,155,.7)}
/* Hero — the approved DO→PADEL™ racket asset, placed exactly as supplied. The image
   is never cropped or recoloured: it is height-constrained and object-fit:contain.
   The short labels either side live in their own grid columns. */
.do-padel-bc-stage{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(10px,3vw,40px);margin:clamp(14px,2.6vw,26px) auto 0;max-width:720px}
.do-padel-bc-racket{display:flex;justify-content:center}
.do-padel-bc-racket img{display:block;width:auto;height:min(56vh,520px);max-width:min(44vw,260px);object-fit:contain;user-select:none;-webkit-user-drag:none}
.do-padel-bc-side{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,1.6vw,13px);font-weight:600;line-height:1.7;letter-spacing:.2em;text-transform:uppercase;color:#e6c477}
.do-padel-bc-side--l{text-align:right}
.do-padel-bc-side--r{text-align:left;color:var(--brand-green)}
.do-padel-bc-explain{margin:clamp(8px,1.6vw,14px) auto clamp(28px,4vw,38px);max-width:min(100%,440px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.7vw,14.5px);line-height:1.7;letter-spacing:.035em;color:#d8c79b}
/* Primary action into Playtomic, in the established DO→PADEL pill-action language. */
.do-padel-bc-cta{-webkit-appearance:none;appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(139,197,46,.62);border-radius:999px;background:rgba(139,197,46,.12);color:var(--brand-green);padding:15px 34px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.do-padel-bc-cta:hover,.do-padel-bc-cta:focus-visible{border-color:rgba(139,197,46,.9);background:rgba(139,197,46,.2);transform:translateY(-1px);outline:none}
/* Secondary — the quiet text link back to the buttons page. */
/* Secondary route — a restrained gold text action into the clubs directory. */
.do-padel-bc-find{margin:24px auto 0;font-size:11px;font-weight:600;color:#e6c477}
.do-padel-bc-find:hover,.do-padel-bc-find:focus-visible{color:#f2dca6;outline:none}
.do-padel-bc-back{margin:22px auto 0;font-size:10.5px;color:rgba(242,220,166,.72)}
.do-padel-bc-back:hover,.do-padel-bc-back:focus-visible{color:#f2dca6;outline:none}
@media(max-width:600px){
  .do-padel-bc-racket img{height:min(46vh,380px);max-width:40vw}
}

/* DO→PADEL™ News — the live worldwide padel news feed. Additive and fully
   self-scoped: all presentation is contained under #doPadelNews / the
   do-padel-news-mode body class, so no other section, button or route is
   affected. Reuses the shared editorial / clubs card styling for visual
   consistency with the rest of the DO→PADEL hub. */
#doPadelNews{display:none}
body.do-padel-news-mode{min-height:100vh;background:#030402;color:#f7f2e6;overflow-x:hidden}
body.do-padel-news-mode #introOverlay,
body.do-padel-news-mode #sampleOverlay,
body.do-padel-news-mode #mainApp,
body.do-padel-news-mode #doPlatformGateway,
body.do-padel-news-mode #doPadelPlaceholder,
body.do-padel-news-mode #doPadelIntent{display:none !important}
body.do-padel-news-mode::before{display:none}
body.do-padel-news-mode #doPadelNews{display:block}
/* A STORY ADDRESS SHOWS THE STORY, NOT THE FEED ABOVE IT. /dopadel/news/{slug}
   is served as this document with that story's own section
   (#do-padel-news-story-seo) in it, and the router puts the same
   do-padel-news-mode class on <body> for it as for /dopadel/news — so the News
   feed was drawn above the story and the router's scroll-to-top left the visitor
   at the top of the feed, which is why READ FULL STORY → looked like it did
   nothing. Scoped by :has() to the served story document alone: /dopadel/news
   carries a different section id, so the feed page is untouched. */
body.do-padel-news-mode:has(#do-padel-news-story-seo) #doPadelNews{display:none}
#doPadelNews .do-padel-news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:6px}
#doPadelNews .do-padel-news-card{display:flex;flex-direction:column;gap:10px;padding:22px;border-radius:18px;border:1px solid rgba(214,177,87,.3);background:linear-gradient(158deg,rgba(20,17,9,.92),rgba(6,7,4,.9));box-shadow:0 20px 54px rgba(0,0,0,.5)}
#doPadelNews .do-padel-news-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
#doPadelNews .do-padel-news-pill{font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border-radius:999px;border:1px solid rgba(139,197,46,.55);color:#b8ea67}
#doPadelNews .do-padel-news-pill.is-region{border-color:rgba(214,177,87,.55);color:#ecc887}
#doPadelNews .do-padel-news-headline{font-size:19px;line-height:1.28;margin:2px 0 0;color:#fffdf6}
#doPadelNews .do-padel-news-summary{font-size:14.5px;line-height:1.5;color:rgba(247,242,230,.88);margin:0}
#doPadelNews .do-padel-news-foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px}
#doPadelNews .do-padel-news-source{font-size:12.5px;color:rgba(236,200,135,.95)}
#doPadelNews .do-padel-news-when{font-size:12px;color:rgba(247,242,230,.7)}
#doPadelNews .do-padel-news-link{font-size:13px;font-weight:600;color:#b8ea67;text-decoration:none}
#doPadelNews .do-padel-news-link:hover{text-decoration:underline}
/* A DO→PADEL ORIGINAL STORY CARD. The card itself is unchanged — same class,
   same border, same background, same layout, same type. This adds only the
   approved seal in the top-right and the room for it. The image is square and
   is given equal width and height with object-fit:contain, so it can be neither
   cropped nor stretched by any rule here or any viewport. */
#doPadelNews .do-padel-news-card.is-original{position:relative}
#doPadelNews .do-padel-news-card.is-original .do-padel-news-meta{padding-right:94px}
#doPadelNews .do-padel-news-card.is-original .do-padel-news-headline{padding-right:94px}
#doPadelNews .do-padel-news-seal{position:absolute;top:16px;right:16px;width:76px;height:76px;object-fit:contain}
@media (max-width:430px){
#doPadelNews .do-padel-news-card.is-original .do-padel-news-meta,
#doPadelNews .do-padel-news-card.is-original .do-padel-news-headline{padding-right:74px}
#doPadelNews .do-padel-news-seal{top:14px;right:14px;width:60px;height:60px}
}
#doPadelNews .do-padel-news-hero{align-items:end;position:relative;padding-bottom:clamp(20px,3vw,30px)}
#doPadelNews .do-padel-news-hero::after{content:"";position:absolute;left:0;bottom:0;width:clamp(84px,14vw,168px);height:2px;background:linear-gradient(90deg,#f6d77b 0%,#a76f1e 55%,rgba(139,197,46,.9) 100%);border-radius:2px}
#doPadelNews .do-padel-news-hero-copy{max-width:820px}
#doPadelNews .do-padel-news-hero .do-padel-editorial-kicker{display:inline-flex;align-items:center;gap:12px;margin-bottom:18px;font-size:12px;font-weight:500;letter-spacing:.42em;color:#a8dc4c}
#doPadelNews .do-padel-news-hero .do-padel-editorial-kicker::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,rgba(214,177,87,0),#e6c477)}
/* Main masthead headline. Deliberately NOT the shared gold serif gradient: on the
   news page the headline carries the modern black + white half of the brand
   system (gold stays for rules, labels and detailing), so it is set in the brand
   sans at the heaviest loaded weight (500 — the font link only ships 300/400/500,
   and faux-bolding a display line looks smeared). max-width is expressed in em so
   the two-line "WORLDWIDE / PADEL NEWS" break holds at every clamp size instead
   of collapsing to one line once the serif metrics are gone. */
#doPadelNews .do-padel-news-hero .do-padel-editorial-title{max-width:8.2em;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(38px,7vw,74px);font-weight:500;line-height:1.03;letter-spacing:.026em;margin-bottom:20px;color:#fff;-webkit-text-fill-color:#fff;background:none;-webkit-background-clip:border-box;background-clip:border-box;filter:none;text-shadow:0 0 34px rgba(255,255,255,.1)}
#doPadelNews .do-padel-news-hero .do-padel-editorial-sub{max-width:600px;font-size:clamp(15px,1.9vw,17px);color:#f0e6cd}
#doPadelNews .do-padel-news-archive-stat{min-width:250px}
#doPadelNews .do-padel-news-archive-stat strong{font-size:clamp(30px,5vw,52px)}
/* Opening viewport balance on a phone, news page only. The single value that put
   the masthead low was the shared editorial page's own top padding
   (clamp(38px,7vh,68px) below 560px — about 59-68px of black on an iPhone), since
   nothing between body and the kicker adds any further top space. It is reduced
   here, scoped to #doPadelNews so no other editorial route is touched, and only
   padding-top is restated: the left, right and bottom padding, the hero's own
   grid gaps, the kicker/headline/sub margins and the archive panel all keep the
   exact values they had, so the whole opening block — DO→PADEL™ NEWS, WORLDWIDE
   PADEL NEWS, the intro paragraph and the stories archive panel — rises as one
   unit and everything below it, the Worldwide News Partner section included,
   follows unchanged. Deliberately not zero and not flush: the band is kept as a
   real, intentional margin (about 32px on a 844px screen, 36px on the tallest
   phones) so the masthead still reads as premium positioning rather than being
   pushed against the top of the page. Above 560px, desktop and tablet keep the
   shared responsive padding untouched. */
@media(max-width:560px){
#doPadelNews .do-padel-news-page{padding-top:clamp(22px,3.8vh,36px)}
}
#doPadelNews .do-padel-news-toolbar{display:grid;gap:18px;padding:22px;margin-bottom:22px;border:1px solid rgba(214,177,87,.24);border-radius:20px;background:linear-gradient(145deg,rgba(18,16,9,.96),rgba(5,7,4,.92));box-shadow:0 24px 60px rgba(0,0,0,.38)}
#doPadelNews .do-padel-news-views{display:flex;flex-wrap:wrap;gap:9px}
#doPadelNews .do-padel-news-view{appearance:none;border:1px solid rgba(214,177,87,.4);border-radius:999px;background:rgba(0,0,0,.2);color:rgba(247,242,230,.88);padding:10px 18px;font:700 12px/1 inherit;letter-spacing:.13em;text-transform:uppercase;cursor:pointer;transition:.2s ease}
#doPadelNews .do-padel-news-view:hover,#doPadelNews .do-padel-news-view:focus-visible{border-color:#d6b157;color:#fff;outline:none}
#doPadelNews .do-padel-news-view.is-active{border-color:rgba(139,197,46,.8);background:rgba(139,197,46,.12);color:#b8ea67;box-shadow:inset 0 0 0 1px rgba(139,197,46,.14)}
#doPadelNews .do-padel-news-filters{display:grid;grid-template-columns:minmax(240px,1.35fr) repeat(2,minmax(190px,.65fr));gap:12px}
#doPadelNews .do-padel-news-field{display:grid;gap:7px}
#doPadelNews .do-padel-news-field label{color:#ecc887;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
#doPadelNews .do-padel-news-input,#doPadelNews .do-padel-news-select{width:100%;min-height:48px;border:1px solid rgba(214,177,87,.34);border-radius:12px;background:#080a06;color:#fffdf6;padding:0 14px;font:inherit;box-sizing:border-box}
#doPadelNews .do-padel-news-input::placeholder{color:rgba(236,200,135,.62)}
#doPadelNews .do-padel-news-input:focus,#doPadelNews .do-padel-news-select:focus{outline:2px solid rgba(139,197,46,.45);outline-offset:1px;border-color:#8bc52e}
#doPadelNews .do-padel-news-search-note{margin:-7px 0 0;color:rgba(247,242,230,.74);font-size:12px;line-height:1.45}
#doPadelNews .do-padel-news-results-head{display:flex;gap:16px;align-items:end;justify-content:space-between;margin-bottom:18px}
#doPadelNews .do-padel-news-results-head h2{margin:0;color:#fff;font-size:clamp(22px,3vw,32px)}
#doPadelNews .do-padel-news-results-head p{margin:4px 0 0;color:rgba(247,242,230,.82);font-size:13px;letter-spacing:.08em;text-transform:uppercase}
#doPadelNews .do-padel-news-clear{display:none;border:0;background:none;color:#b8ea67;font:700 12px/1 inherit;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
#doPadelNews .do-padel-news-clear.is-visible{display:block}
#doPadelNews .do-padel-news-pill.is-breaking{border-color:rgba(255,92,92,.6);color:#ff9a9a}
#doPadelNews .do-padel-news-pill.is-featured{border-color:rgba(214,177,87,.7);background:rgba(214,177,87,.09);color:#f5d68c}
#doPadelNews .do-padel-news-load-wrap{display:flex;justify-content:center;padding:28px 0 4px}
#doPadelNews .do-padel-news-load{min-width:230px;border:1px solid rgba(139,197,46,.65);border-radius:999px;background:rgba(139,197,46,.1);color:#b8ea67;padding:14px 24px;font:800 12px/1 inherit;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
#doPadelNews .do-padel-news-load:hover,#doPadelNews .do-padel-news-load:focus-visible{background:rgba(139,197,46,.18);outline:none}
#doPadelNews .do-padel-news-load[disabled]{cursor:wait;opacity:.55}
@media(max-width:820px){#doPadelNews .do-padel-news-filters{grid-template-columns:1fr}#doPadelNews .do-padel-news-archive-stat{min-width:0}#doPadelNews .do-padel-news-results-head{align-items:start;flex-direction:column}}
/* Legibility pass, scoped to the news page only. The page sits on near-black and
   several inherited greys/creams/golds were falling under comfortable reading
   contrast, especially on mobile. Colours only — no sizes, spacing or structure —
   and the hierarchy is kept intact: secondary copy still reads softer than
   primary, the floor is simply lifted so nothing sinks into the background. */
#doPadelNews .do-padel-clubs-empty{border-color:rgba(214,177,87,.26)}
#doPadelNews .do-padel-clubs-empty h2{color:#fffdf6}
#doPadelNews .do-padel-clubs-empty p{color:#f4ecd6}
#doPadelNews .do-padel-back{color:#f6dfa6}
#doPadelNews .do-padel-powered{color:rgba(232,199,119,.86)}

/* DO→PADEL™ News — the campaign slot at the top of the page. The advertising
   availability message that used to fill this slot is gone; the approved
   DO→PADEL™ landscape master is shown here instead, complete and at its own
   1284 × 982 ratio. Width-driven with height:auto, so the artwork is never
   cropped, stretched or distorted at any width. Deliberately no card, border,
   radius, shadow or padding on the wrapper: any light container would show as a
   white edge against the black news page.
   The Clubs page carries this exact same advert, at the very top of its page,
   so #doPadelClubs shares these rules rather than restating them — one
   implementation, two placements, guaranteed identical. */
#doPadelNews .do-padel-news-partner,
#doPadelInfrastructure .do-padel-news-partner,
#doPadelClubs .do-padel-news-partner{margin:0 0 clamp(24px,4vw,38px)}
#doPadelNews .do-padel-news-partner-visual,
#doPadelInfrastructure .do-padel-news-partner-visual,
#doPadelClubs .do-padel-news-partner-visual{display:block;width:100%;margin:0;padding:0;border:0;border-radius:0;background:#000;box-shadow:none;outline:0;line-height:0;font-size:0}
#doPadelNews .do-padel-news-partner-visual img,
#doPadelInfrastructure .do-padel-news-partner-visual img,
#doPadelClubs .do-padel-news-partner-visual img{display:block;width:100%;height:auto;margin:0;padding:0;border:0;border-radius:0;background:#000;box-shadow:none;outline:0;user-select:none;-webkit-user-drag:none}
/* TOP OF THE CLUBS PAGE. The advert is now the first visual content there, so
   the shared editorial top padding (clamp(46px,8vh,92px), and clamp(38px,7vh,68px)
   below 560px — sized for a page that opens on a heading) left a large empty
   black band above it. It reads as far more than its measurement because the
   artwork's own black masthead band begins immediately beneath it against an
   already-black page, which is why it is most obvious on mobile.

   Only the TOP padding is corrected, and only here: #doPadelClubs is the Clubs
   page alone, whereas the shared .do-padel-clubs-page class is also worn by
   Play, Events, Improve and News, which still open on a heading and keep the
   original spacing untouched. The horizontal and bottom padding — including the
   bottom safe-area inset — are still inherited from the shared rule, and the
   TOP safe-area inset is honoured here so notched devices keep their clearance
   under the status bar. No negative margin is used and the advert itself is not
   touched: it keeps its own size, ratio and spacing exactly as they are. */
#doPadelClubs .do-padel-editorial{padding-top:calc(clamp(14px,2.2vh,22px) + env(safe-area-inset-top,0px))}

/* ── DO→PADEL™ ADVERTISING — THE ESTABLISHED PREMIUM CONTROLS ─────────────────
   ONE block for the buttons that sit beneath a DO→PADEL™ advert, so the BOOK A
   COURT house advert and the DO→PADEL™ News campaign carry exactly the same
   design language rather than two similar ones. Both are the published DO→PADEL
   action: the deep green family, premium gold lettering, the pill shape, the
   54px height and the sheen already declared for the post-landing advert's
   CONTINUE JOURNEY control. Colours are stated in full rather than inherited,
   because the two placements sit in scopes that define the brand variables
   slightly differently and they must match exactly. */
.do-advert-primary-cta,
.do-showcase-cta{-webkit-appearance:none;appearance:none;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;width:100%;min-height:54px;margin:0;padding:14px 20px;border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10.5px,2.9vw,13px);font-weight:700;letter-spacing:.13em;line-height:1.15;text-transform:uppercase;text-align:center;text-decoration:none;color:#f2d489;-webkit-text-fill-color:#f2d489;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease,background .2s ease}
/* PRIMARY — the functional control. */
.do-advert-primary-cta{border:1px solid rgba(197,247,116,.72);background:linear-gradient(175deg,#5f8825 0%,#49681d 42%,#385214 72%,#2d4210 100%);text-shadow:0 1px 3px rgba(18,42,4,.45);box-shadow:0 10px 28px rgba(0,0,0,.35),0 4px 18px rgba(139,197,46,.28),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.22)}
.do-advert-primary-cta:hover,.do-advert-primary-cta:focus-visible{border-color:rgba(212,252,140,.9);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 28px rgba(139,197,46,.34),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.22);outline:none}
.do-advert-primary-cta:active{transform:translateY(1px)}
/* SECONDARY — the same green and gold, one step down in the hierarchy so the
   functional control still leads. */
.do-showcase-cta{border:1px solid rgba(197,247,116,.46);background:linear-gradient(175deg,rgba(95,136,37,.5) 0%,rgba(73,104,29,.56) 42%,rgba(45,66,16,.66) 100%);text-shadow:0 1px 3px rgba(18,42,4,.4);box-shadow:0 8px 22px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(0,0,0,.2)}
.do-showcase-cta:hover,.do-showcase-cta:focus-visible{border-color:rgba(212,252,140,.72);background:linear-gradient(175deg,rgba(95,136,37,.66) 0%,rgba(73,104,29,.72) 42%,rgba(45,66,16,.8) 100%);box-shadow:0 8px 24px rgba(0,0,0,.32),0 0 22px rgba(139,197,46,.22),inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.2);outline:none}
.do-showcase-cta:active{transform:translateY(1px)}
/* On DO→PADEL™ News and on Clubs the control sits in the page rather than on a
   full-screen advert, so it is centred beneath the campaign at the same width the
   advert's own controls use. */
#doPadelNews .do-showcase-cta,
#doPadelClubs .do-showcase-cta{max-width:420px;margin:clamp(18px,3vw,26px) auto 0}

/* DO→PADEL™ Advertising & Commercial Partnerships — one universal, self-scoped
   destination for every advertising placement in the existing ecosystem. */
#doPadelAdvertise{display:none}
body.do-padel-advertise-mode{min-height:100vh;background:#000;color:#fff;overflow-x:hidden}
body.do-padel-advertise-mode #introOverlay,
body.do-padel-advertise-mode #sampleOverlay,
body.do-padel-advertise-mode #mainApp,
body.do-padel-advertise-mode #doPlatformGateway,
body.do-padel-advertise-mode #doPadelPlaceholder,
body.do-padel-advertise-mode #doPadelIntent{display:none !important}
body.do-padel-advertise-mode::before{display:none}
body.do-padel-advertise-mode #doPadelAdvertise{display:block}
/* DO→PADEL™ ADVERTISING & COMMERCIAL PARTNERSHIPS — the premium commercial
   presentation. Every rule below is scoped to #doPadelAdvertise / .do-advertise-*
   so no other DO→PADEL™ destination, and no member, authentication or
   registration surface, is touched by it. The commercial palette is fixed:
   true black, premium warm gold (#f2d489), controlled deep DO→PADEL green (the
   #8bc52e / #5f8825 → #26380d family) and bright white. No platinum, no neon,
   no cheap gradient. */
#doPadelAdvertise{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;background:#000;color:#fff}
#doPadelAdvertise *{box-sizing:border-box}
.do-advertise-shell{width:min(100%,1180px);margin:0 auto;padding:clamp(12px,2.6vw,28px) clamp(18px,5vw,64px) calc(38px + env(safe-area-inset-bottom))}

/* ── THE BRAND OPENING. DO→PADEL™ first, TOGETHER WE ARE STRONGER beneath it.
      Deliberately tight on mobile: premium spacing, no wasted screen. ─────── */
.do-advertise-masthead{text-align:center;padding:clamp(4px,1.2vw,12px) 0 clamp(24px,4.2vw,44px)}
.do-advertise-brand{display:inline-flex;align-items:baseline;justify-content:center;line-height:1;font-size:clamp(31px,7.6vw,54px);font-weight:800;letter-spacing:.01em;text-decoration:none;text-shadow:0 2px 20px rgba(0,0,0,.65)}
.do-advertise-brand-do,.do-advertise-brand-padel{color:#f2d489}
.do-advertise-brand-arrow{color:#8bc52e;padding:0 .03em}
.do-advertise-brand-tm{color:#fff;font-size:.3em;font-weight:700;vertical-align:super;margin-left:.08em}
.do-advertise-motto{margin:clamp(10px,1.9vw,16px) 0 0;font-size:clamp(14px,3.9vw,25px);font-weight:780;letter-spacing:.11em;text-transform:uppercase;line-height:1.2}
.do-advertise-together{color:#f2d489}
.do-advertise-weare{color:#fff}
.do-advertise-stronger{color:#8bc52e}
.do-advertise-hairline{display:block;width:min(320px,60%);height:1px;margin:clamp(16px,2.8vw,26px) auto 0;background:linear-gradient(90deg,rgba(242,212,137,0),#f2d489 30%,#8bc52e 70%,rgba(139,197,46,0))}

/* ── THE COMMERCIAL HERO ────────────────────────────────────────────────── */
.do-advertise-hero{display:grid;grid-template-columns:minmax(0,1.24fr) minmax(250px,.76fr);gap:clamp(24px,5vw,64px);align-items:end;padding:0 0 clamp(34px,5.6vw,68px)}
.do-advertise-kicker{margin:0 0 clamp(12px,2vw,16px);color:#f2d489;font-size:clamp(9.5px,2.5vw,11.5px);font-weight:800;letter-spacing:.26em;text-transform:uppercase}
.do-advertise-title{max-width:860px;margin:0;font-size:clamp(28px,6.4vw,60px);font-weight:760;letter-spacing:-.03em;line-height:1.06;text-wrap:balance}
#doPadelAdvertise .adv-gold{color:#f2d489}
#doPadelAdvertise .adv-white{color:#fff}
#doPadelAdvertise .adv-green{color:#8bc52e}
.do-advertise-intro{max-width:470px;margin:0;color:rgba(255,255,255,.88);font-size:clamp(14.5px,3.4vw,17px);line-height:1.62}
.do-advertise-hero-cta{margin-top:clamp(18px,3vw,28px)}

/* ── THE PRIMARY COMMERCIAL CONTROL. Deep controlled green, gold lettering, a
      refined gold/green edge and real dimensional depth — substantial, not lit
      up. Behaviour is unchanged; this is presentation only. ───────────────── */
.do-advertise-primary{-webkit-appearance:none;appearance:none;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:430px;min-height:58px;padding:16px 28px;border:1px solid rgba(242,212,137,.5);border-radius:999px;background:linear-gradient(178deg,#5f8825 0%,#49681d 38%,#375113 72%,#26380d 100%);color:#f2d489;-webkit-text-fill-color:#f2d489;text-decoration:none;text-transform:uppercase;text-align:center;font-family:inherit;font-size:clamp(10.5px,2.8vw,12.5px);font-weight:800;letter-spacing:.15em;line-height:1.15;text-shadow:0 1px 3px rgba(10,26,2,.55);box-shadow:0 14px 32px rgba(0,0,0,.52),0 2px 0 rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.32),inset 0 0 0 1px rgba(139,197,46,.2);cursor:pointer;transition:box-shadow .22s ease,border-color .22s ease,transform .14s ease}
.do-advertise-primary::after{content:"";position:absolute;inset:-4px;border-radius:inherit;border:1px solid rgba(242,212,137,.14);pointer-events:none}
.do-advertise-primary:hover,.do-advertise-primary:focus-visible{border-color:rgba(242,212,137,.8);box-shadow:0 16px 36px rgba(0,0,0,.56),0 0 20px rgba(139,197,46,.18),inset 0 1px 0 rgba(255,255,255,.26),inset 0 -1px 0 rgba(0,0,0,.32),inset 0 0 0 1px rgba(139,197,46,.3);outline:none}
.do-advertise-primary:active{transform:translateY(1px)}

/* ── SECTIONS ───────────────────────────────────────────────────────────── */
.do-advertise-section{padding:clamp(32px,5.2vw,62px) 0;border-top:1px solid rgba(242,212,137,.16)}
.do-advertise-section-head{margin-bottom:clamp(18px,3.2vw,32px)}
.do-advertise-section h2{margin:0;font-size:clamp(21px,5.1vw,38px);font-weight:800;line-height:1.12;letter-spacing:.005em;text-transform:uppercase}
.do-advertise-section-note{max-width:640px;margin:clamp(10px,1.8vw,14px) 0 0;color:rgba(255,255,255,.8);font-size:clamp(13.5px,3.2vw,16px);line-height:1.6}

/* ── THE ADVERTISING SHOWCASE. The approved DO→PADEL™ landscape master is shown
      exactly as supplied — one file, complete, at its own 1284 × 982 ratio,
      never cropped, stretched, recoloured or redrawn. The frame is black with a
      restrained gold-to-green edge; the creative itself is untouched. ─────── */
.do-advertise-showcase-frame{position:relative;margin:0;padding:clamp(7px,1.4vw,14px);border-radius:clamp(13px,2vw,22px);background:linear-gradient(152deg,rgba(242,212,137,.52) 0%,rgba(242,212,137,.1) 32%,rgba(139,197,46,.12) 66%,rgba(139,197,46,.46) 100%);box-shadow:0 26px 68px rgba(0,0,0,.68)}
.do-advertise-showcase-inner{position:relative;padding:clamp(5px,1.1vw,11px);border-radius:clamp(9px,1.6vw,16px);background:#000}
.do-advertise-showcase-frame img{display:block;width:100%;height:auto;aspect-ratio:1284/982;border-radius:clamp(5px,1vw,10px)}

/* ── THE COMMERCIAL OPPORTUNITY TILES. Compact, dark, individually accented —
      valuable inventory, not navigation placeholders. Gold leads, green marks
      the DO→PADEL™ owned surfaces. ───────────────────────────────────────── */
.do-advertise-opportunities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(9px,1.3vw,14px)}
.do-advertise-opportunity{-webkit-appearance:none;appearance:none;position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:12px;width:100%;margin:0;padding:15px 15px 16px;border:1px solid rgba(242,212,137,.2);border-radius:14px;background:linear-gradient(158deg,#0c0e0b 0%,#050604 62%,#020302 100%);color:#fff;font:inherit;text-align:left;cursor:pointer;overflow:hidden;box-shadow:0 12px 26px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.05);transition:border-color .2s ease,box-shadow .2s ease,transform .14s ease,background .2s ease}
.do-advertise-opportunity::before{content:"";position:absolute;left:0;top:0;width:100%;height:2px;background:linear-gradient(90deg,rgba(242,212,137,.85),rgba(242,212,137,0) 78%)}
.do-advertise-opportunity.is-green{border-color:rgba(139,197,46,.26)}
.do-advertise-opportunity.is-green::before{background:linear-gradient(90deg,rgba(139,197,46,.85),rgba(139,197,46,0) 78%)}
.do-advertise-opp-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid rgba(242,212,137,.3);border-radius:9px;background:rgba(242,212,137,.06);color:#f2d489}
.do-advertise-opportunity.is-green .do-advertise-opp-icon{border-color:rgba(139,197,46,.34);background:rgba(139,197,46,.08);color:#8bc52e}
.do-advertise-opp-icon svg{display:block;width:16px;height:16px}
.do-advertise-opp-title{display:block;color:#fff;font-size:clamp(13.5px,3.3vw,15px);font-weight:780;line-height:1.25}
.do-advertise-opp-note{display:block;margin-top:5px;color:rgba(255,255,255,.64);font-size:clamp(11.5px,2.9vw,12.5px);font-weight:500;line-height:1.42}
.do-advertise-opportunity:hover,.do-advertise-opportunity:focus-visible{border-color:rgba(242,212,137,.5);box-shadow:0 16px 32px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,255,255,.07);outline:none;transform:translateY(-1px)}
.do-advertise-opportunity:active{transform:translateY(1px)}
.do-advertise-opportunity[aria-pressed="true"]{border-color:rgba(139,197,46,.66);background:linear-gradient(158deg,#10160a 0%,#090c05 60%,#030402 100%);box-shadow:0 16px 32px rgba(0,0,0,.56),0 0 0 1px rgba(242,212,137,.2),inset 0 1px 0 rgba(255,255,255,.08)}
.do-advertise-opportunity[aria-pressed="true"] .do-advertise-opp-title{color:#f2d489}
.do-advertise-opportunity[aria-pressed="true"]::before{background:linear-gradient(90deg,#f2d489,rgba(139,197,46,.55) 60%,rgba(139,197,46,0))}

/* ── THE ENQUIRY. A premium commercial conversation, not a registration form.
      Every existing field, name and control is retained exactly. ──────────── */
.do-advertise-form-wrap{display:grid;grid-template-columns:minmax(240px,.6fr) minmax(0,1.4fr);gap:clamp(22px,4.4vw,62px);align-items:start}
.do-advertise-form-copy p{margin:clamp(12px,2vw,16px) 0 0;color:rgba(255,255,255,.8);font-size:15px;line-height:1.62}
.do-advertise-form{position:relative;scroll-margin-top:18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,16px);padding:clamp(18px,3.2vw,36px);border:1px solid rgba(242,212,137,.26);border-radius:20px;background:linear-gradient(168deg,#0a0b09 0%,#050604 100%);box-shadow:0 30px 78px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.05)}
/* ONE restrained accent on the container's top edge — gold running into green,
   the same two-colour signature the section hairline and the opportunity tiles
   already use, so the enquiry reads as part of the commercial page rather than
   a form pasted beneath it. A single hairline: no gradient panel, no second
   green area. */
.do-advertise-form::before{content:"";position:absolute;left:10%;right:10%;top:-1px;height:1px;pointer-events:none;background:linear-gradient(90deg,rgba(242,212,137,0),#f2d489 24%,rgba(139,197,46,.85) 76%,rgba(139,197,46,0))}
.do-advertise-form[hidden],.do-advertise-success[hidden]{display:none !important}
.do-advertise-field{display:block}
.do-advertise-field-full{grid-column:1/-1}
.do-advertise-field label{display:block;margin-bottom:6px;color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
/* REQUIRED and OPTIONAL are carried in gold at two weights rather than by a red
   marker or an asterisk: premium gold states what is needed, restrained gold
   states what is not. */
.do-advertise-required,.do-advertise-optional{margin-left:7px;font-size:8.5px;font-weight:800;letter-spacing:.2em}
.do-advertise-required{color:#f2d489}
.do-advertise-optional{color:rgba(242,212,137,.58)}
/* FIELD SURFACES — deep black interiors, a very fine warm gold resting edge.
   Never filled gold, never filled green. */
.do-advertise-field input,.do-advertise-field select,.do-advertise-field textarea{-webkit-appearance:none;appearance:none;width:100%;min-height:44px;padding:11px 15px 11px 42px;border:1px solid rgba(242,212,137,.32);border-radius:11px;background:#000;color:#fff;font:inherit;font-size:15px;outline:none;transition:border-color .18s ease,box-shadow .18s ease}
.do-advertise-field select{padding-right:42px;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.6 6 6.5 11 1.6' fill='none' stroke='%23f2d489' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:12px 8px}
/* The message area stays substantially larger — it is a place to write. */
.do-advertise-field textarea{min-height:130px;padding-top:13px;resize:vertical;line-height:1.55}
.do-advertise-field input::placeholder,.do-advertise-field textarea::placeholder{color:rgba(255,255,255,.42)}
/* ACTIVE — the edge moves from gold to controlled DO→PADEL green with only a
   very subtle illumination. The interior stays black. */
.do-advertise-field input:focus,.do-advertise-field select:focus,.do-advertise-field textarea:focus{border-color:rgba(139,197,46,.8);box-shadow:0 0 0 3px rgba(139,197,46,.1),0 0 14px rgba(139,197,46,.1)}
/* SMALL PREMIUM FIELD ICONS — the same 24-viewBox, 1.7-weight gold line
   language as the commercial opportunity icons above, at 16px, inside the
   field's own padding so they never sit under typed text. */
.do-advertise-input{position:relative;display:block}
.do-advertise-field-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:16px;height:16px;color:rgba(242,212,137,.72);pointer-events:none;transition:color .18s ease}
.do-advertise-field-icon svg{display:block;width:16px;height:16px}
.do-advertise-input-area .do-advertise-field-icon{top:14px;transform:none}
.do-advertise-input:focus-within .do-advertise-field-icon{color:#8bc52e}
.do-advertise-submit{grid-column:1/-1;max-width:none;margin-top:4px}
.do-advertise-submit[disabled]{cursor:wait;opacity:.7}
.do-advertise-error{grid-column:1/-1;min-height:18px;margin:0;color:#f2d489;font-size:13px;line-height:1.45}
.do-advertise-success{padding:clamp(24px,4.4vw,48px);border:1px solid rgba(139,197,46,.45);border-radius:20px;background:linear-gradient(168deg,#0a0d06 0%,#040603 100%);box-shadow:0 28px 72px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.05)}
.do-advertise-success-mark{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin-bottom:20px;border:1px solid #8bc52e;border-radius:50%;background:rgba(139,197,46,.08);color:#f2d489;font-size:22px}
.do-advertise-success h2{margin:0;color:#fff;font-size:clamp(22px,4.6vw,34px);font-weight:780;line-height:1.18;letter-spacing:-.015em;text-transform:none}
.do-advertise-success p{max-width:560px;margin:16px 0 0;color:rgba(255,255,255,.86);font-size:16px;line-height:1.62}
/* CONTINUE YOUR JOURNEY — the single way onward once an enquiry is in. Centred
   beneath the confirmation, above the sign-off, in the established gold-on-green
   treatment used by every other DO→PADEL™ primary control. */
.do-advertise-continue-wrap{display:flex;justify-content:center;margin-top:clamp(22px,3.8vw,34px);padding-top:clamp(20px,3.2vw,28px);border-top:1px solid rgba(242,212,137,.18)}
.do-advertise-continue{max-width:min(100%,330px)}

/* ── THE SIGN-OFF ───────────────────────────────────────────────────────── */
.do-advertise-signoff{padding:clamp(36px,5.6vw,72px) 0 8px;text-align:center;border-top:1px solid rgba(242,212,137,.16)}
.do-advertise-signoff .do-advertise-brand{font-size:clamp(24px,5.6vw,38px)}
.do-advertise-signoff-line{margin:clamp(14px,2.4vw,20px) 0 0;font-size:clamp(16px,4.2vw,29px);font-weight:780;letter-spacing:.1em;text-transform:uppercase;line-height:1.18}

@media(max-width:980px){
  .do-advertise-hero{grid-template-columns:1fr;align-items:start;gap:clamp(20px,4vw,30px)}
  .do-advertise-intro{max-width:640px}
  .do-advertise-opportunities{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .do-advertise-form-wrap{grid-template-columns:1fr}
}
@media(max-width:600px){
  .do-advertise-shell{padding-left:16px;padding-right:16px}
  /* Single column on a phone: two would cramp the descriptor. The tile becomes a
     shallow row — icon, title, one line — so the set scans quickly. */
  .do-advertise-opportunities{grid-template-columns:1fr;gap:9px}
  .do-advertise-opportunity{align-items:center;padding:12px 13px}
  .do-advertise-opp-note{margin-top:3px}
  .do-advertise-form{grid-template-columns:1fr;padding:18px 15px}
  .do-advertise-field-full,.do-advertise-submit,.do-advertise-error{grid-column:1}
  .do-advertise-primary{max-width:none}
  .do-advertise-showcase-frame{padding:6px;border-radius:14px}
  .do-advertise-showcase-inner{padding:5px;border-radius:10px}
}

/* ── DO→PADEL™ PADEL CLUB ACQUISITIONS ───────────────────────────────────────
   A self-contained addition at the BOTTOM of the existing Clubs section, plus
   its two destinations. Every rule below is scoped to the new section wrapper
   (.do-acq-*) or to the two new page IDs, so no existing Clubs rule, club card,
   directory panel, development panel or form is touched by any of it.

   THE ARTWORK IS SHOWN COMPLETE. The approved 1536 × 1024 master is displayed
   width-driven with height:auto and NO frame, padding, border, radius, shadow or
   overlay of any kind — a radius would clip the artwork's own thin gold
   perimeter and a frame would sit on top of it. This is deliberately the same
   treatment the Clubs campaign placement above already uses. */
.do-acq-panel{margin-top:clamp(26px,4vw,44px)}
.do-acq-head{margin-bottom:clamp(14px,2.4vw,20px)}
.do-acq-title{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(19px,4.4vw,29px);font-weight:800;letter-spacing:.02em;line-height:1.12;text-transform:uppercase;color:#f2d489}
.do-acq-strap{margin:clamp(8px,1.6vw,12px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,3.4vw,20px);font-weight:780;letter-spacing:.06em}
.do-acq-strap .do-acq-buy{color:#f2d489}
.do-acq-strap .do-acq-grow{color:#8bc52e}
.do-acq-strap .do-acq-sell{color:#fff}
.do-acq-note{margin:clamp(10px,1.8vw,14px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.55;color:rgba(230,218,186,.9)}
.do-acq-artwork{display:block;width:100%;margin:clamp(16px,2.8vw,24px) 0 0;padding:0;border:0;border-radius:0;background:#000;box-shadow:none;outline:0;line-height:0;font-size:0}
.do-acq-artwork img{display:block;width:100%;height:auto;margin:0;padding:0;border:0;border-radius:0;background:#000;box-shadow:none;outline:0;user-select:none;-webkit-user-drag:none}
/* THE TWO REAL CONTROLS, directly beneath the artwork. They are the existing
   published DO→PADEL™ .do-showcase-cta control — the same pill, height, gold
   lettering and green family used beneath every other DO→PADEL™ advert — laid
   out side by side with a clear gap, and stacked on a phone. The centring and
   420px cap the Clubs page applies to a single advert control is released here
   because there are two of them in a grid. */
#doPadelClubs .do-acq-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,2vw,16px);margin:clamp(16px,2.8vw,24px) 0 0}
#doPadelClubs .do-acq-actions .do-showcase-cta{max-width:none;margin:0}
/* LIST YOUR CLUB carries the established gold-on-black treatment already used by
   the gold DO→PADEL™ controls, so the pair reads as two clearly separated
   actions rather than one repeated twice. Same component, existing palette. */
#doPadelClubs .do-acq-actions .do-showcase-cta.is-gold{border-color:rgba(224,187,99,.62);background:linear-gradient(175deg,rgba(18,17,12,.96) 0%,rgba(8,8,6,.98) 100%);box-shadow:0 8px 22px rgba(0,0,0,.36),0 0 16px rgba(214,177,87,.14),inset 0 1px 0 rgba(255,235,180,.12)}
#doPadelClubs .do-acq-actions .do-showcase-cta.is-gold:hover,
#doPadelClubs .do-acq-actions .do-showcase-cta.is-gold:focus-visible{border-color:rgba(238,205,128,.95);background:linear-gradient(175deg,rgba(26,23,15,.96) 0%,rgba(12,11,8,.98) 100%);box-shadow:0 10px 26px rgba(0,0,0,.4),0 0 24px rgba(214,177,87,.28),inset 0 1px 0 rgba(255,235,180,.16)}
@media(max-width:560px){
  #doPadelClubs .do-acq-actions{grid-template-columns:1fr}
}

/* ── CURRENT SHOWCASE — PUBLICLY ADVERTISED OPPORTUNITIES ────────────────────
   Premium acquisition cards inside the existing Acquisitions section. Every rule
   is scoped to a NEW .do-acq-showcase / .do-acq-card class, so no existing Clubs
   rule, club card, directory panel, development panel, form or acquisitions rule
   is altered. Palette is the established DO→PADEL language only: black premium
   ground, gold headings, green accents and a subtle gold border.
   Two columns on wider desktop layouts, one column on mobile. */
.do-acq-showcase{margin:clamp(24px,4vw,38px) 0 0;padding:clamp(18px,3vw,26px) 0 0;border-top:1px solid rgba(242,212,137,.2)}
.do-acq-showcase[hidden]{display:none}
.do-acq-showcase-head{margin-bottom:clamp(16px,2.6vw,22px)}
.do-acq-showcase-kicker{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(168,220,76,.96)}
.do-acq-showcase-title{margin:8px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(17px,3.6vw,24px);font-weight:800;letter-spacing:.02em;line-height:1.15;text-transform:uppercase;color:#f2d489}
.do-acq-showcase-sub{margin:clamp(8px,1.6vw,12px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.55;color:rgba(230,218,186,.9)}
.do-acq-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2.4vw,20px);align-items:stretch}
.do-acq-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid rgba(242,212,137,.26);border-radius:20px;background:linear-gradient(168deg,#0a0b09 0%,#050604 100%);box-shadow:0 22px 58px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,235,180,.06)}
/* Neutral, original DO→PADEL court motif — never third-party photography. */
.do-acq-card-visual{position:relative;display:block;width:100%;aspect-ratio:16/6;background:linear-gradient(150deg,rgba(139,197,46,.16) 0%,rgba(10,11,9,.9) 55%,rgba(242,212,137,.12) 100%);border-bottom:1px solid rgba(242,212,137,.18);line-height:0}
.do-acq-card-visual svg{display:block;width:100%;height:100%}
.do-acq-card-flag{position:absolute;left:14px;bottom:11px;margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,245,220,.94);text-shadow:0 1px 6px rgba(0,0,0,.7);line-height:1.2}
.do-acq-card-body{display:flex;flex-direction:column;flex:1 1 auto;padding:clamp(15px,2.4vw,20px)}
.do-acq-card-status{display:inline-flex;align-self:flex-start;align-items:center;margin:0 0 11px;padding:5px 11px;border:1px solid rgba(168,220,76,.4);border-radius:999px;background:rgba(139,197,46,.08);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(168,220,76,.96);line-height:1.3}
.do-acq-card-title{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(15px,2.6vw,18px);font-weight:800;letter-spacing:.01em;line-height:1.25;color:#f2d489}
.do-acq-card-place{margin:5px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.66);line-height:1.4}
.do-acq-card-facts{margin:14px 0 0;padding:13px 0 0;border-top:1px solid rgba(242,212,137,.14);display:grid;gap:8px}
.do-acq-fact{display:flex;justify-content:space-between;align-items:baseline;gap:12px;min-width:0}
.do-acq-fact-key{flex:0 0 auto;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(230,218,186,.62);line-height:1.4}
.do-acq-fact-val{min-width:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:600;line-height:1.45;color:rgba(255,255,255,.94);text-align:right;font-variant-numeric:lining-nums tabular-nums}
.do-acq-fact.is-price .do-acq-fact-val{color:#8bc52e;font-weight:700;font-size:13.5px}
.do-acq-fact-val.is-muted{color:rgba(255,255,255,.55);font-weight:500}
.do-acq-card-desc{margin:14px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.62;color:rgba(255,255,255,.8)}
.do-acq-card-foot{margin-top:auto;padding-top:15px}
.do-acq-card-source{margin:0 0 11px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(230,218,186,.55);line-height:1.45;word-break:break-word}
.do-acq-card-link{-webkit-appearance:none;appearance:none;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;padding:12px 16px;border:1px solid rgba(197,247,116,.46);border-radius:999px;background:linear-gradient(175deg,rgba(95,136,37,.5) 0%,rgba(73,104,29,.56) 42%,rgba(45,66,16,.66) 100%);box-shadow:0 8px 22px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.16);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(9.5px,2.2vw,11px);font-weight:700;letter-spacing:.13em;line-height:1.15;text-transform:uppercase;text-align:center;text-decoration:none;color:#f2d489;-webkit-text-fill-color:#f2d489;text-shadow:0 1px 3px rgba(18,42,4,.4);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.do-acq-card-link:hover,.do-acq-card-link:focus-visible{border-color:rgba(212,252,140,.72);background:linear-gradient(175deg,rgba(95,136,37,.66) 0%,rgba(73,104,29,.72) 42%,rgba(45,66,16,.8) 100%);box-shadow:0 8px 24px rgba(0,0,0,.32),0 0 22px rgba(139,197,46,.22),inset 0 1px 0 rgba(255,255,255,.2);outline:none}
.do-acq-showcase-legal{margin:clamp(18px,2.8vw,24px) 0 0;padding-top:clamp(14px,2.2vw,18px);border-top:1px solid rgba(242,212,137,.14);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;line-height:1.62;color:rgba(230,218,186,.6)}
@media(max-width:760px){
  .do-acq-cards{grid-template-columns:1fr}
}
@media(max-width:420px){
  .do-acq-fact{flex-direction:column;gap:2px}
  .do-acq-fact-val{text-align:left}
}
@media(prefers-reduced-motion:reduce){.do-acq-card-link{transition:none}}

/* ── THE TWO ACQUISITION DESTINATIONS, AND CLAIM YOUR CLUB ───────────────────
   All three reuse the existing DO→PADEL™ commercial page presentation
   (.do-advertise-* shell, masthead, sections, primary control and form styling)
   exactly as the Advertising destination declares it, and CLAIM YOUR CLUB also
   reuses the .do-acq-* club finder declared below, so it introduces no
   presentation of its own. Only the display switching is added here. */
#doPadelAcquisitions,#doPadelAcquisitionsSell,#doPadelClaimClub{display:none}
body.do-padel-acquisitions-mode,
body.do-padel-acquisitions-sell-mode,
body.do-padel-claim-club-mode{min-height:100vh;background:#000;color:#fff;overflow-x:hidden}
body.do-padel-acquisitions-mode #introOverlay,
body.do-padel-acquisitions-mode #sampleOverlay,
body.do-padel-acquisitions-mode #mainApp,
body.do-padel-acquisitions-mode #doPlatformGateway,
body.do-padel-acquisitions-mode #doPadelPlaceholder,
body.do-padel-acquisitions-mode #doPadelIntent,
body.do-padel-acquisitions-sell-mode #introOverlay,
body.do-padel-acquisitions-sell-mode #sampleOverlay,
body.do-padel-acquisitions-sell-mode #mainApp,
body.do-padel-acquisitions-sell-mode #doPlatformGateway,
body.do-padel-acquisitions-sell-mode #doPadelPlaceholder,
body.do-padel-acquisitions-sell-mode #doPadelIntent,
body.do-padel-claim-club-mode #introOverlay,
body.do-padel-claim-club-mode #sampleOverlay,
body.do-padel-claim-club-mode #mainApp,
body.do-padel-claim-club-mode #doPlatformGateway,
body.do-padel-claim-club-mode #doPadelPlaceholder,
body.do-padel-claim-club-mode #doPadelIntent{display:none !important}
body.do-padel-acquisitions-mode::before,
body.do-padel-acquisitions-sell-mode::before,
body.do-padel-claim-club-mode::before{display:none}
body.do-padel-acquisitions-mode #doPadelAcquisitions,
body.do-padel-acquisitions-sell-mode #doPadelAcquisitionsSell,
body.do-padel-claim-club-mode #doPadelClaimClub{display:block}
#doPadelAcquisitions,#doPadelAcquisitionsSell,#doPadelClaimClub{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;background:#000;color:#fff}
#doPadelAcquisitions *,#doPadelAcquisitionsSell *,#doPadelClaimClub *{box-sizing:border-box}
#doPadelAcquisitions .adv-gold,#doPadelAcquisitionsSell .adv-gold,#doPadelClaimClub .adv-gold{color:#f2d489}
#doPadelAcquisitions .adv-white,#doPadelAcquisitionsSell .adv-white,#doPadelClaimClub .adv-white{color:#fff}
#doPadelAcquisitions .adv-green,#doPadelAcquisitionsSell .adv-green,#doPadelClaimClub .adv-green{color:#8bc52e}
/* THE LAUNCH STATE. No clubs are shown, invented or implied — this states plainly
   that the marketplace is being built and hands the visitor to the register form. */
.do-acq-launch{padding:clamp(24px,4.4vw,44px);border:1px solid rgba(242,212,137,.26);border-radius:20px;background:linear-gradient(168deg,#0a0b09 0%,#050604 100%);box-shadow:0 30px 78px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.05)}
.do-acq-launch-mark{display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin-bottom:18px;border:1px solid rgba(242,212,137,.5);border-radius:50%;background:rgba(242,212,137,.06);color:#f2d489}
.do-acq-launch-mark svg{display:block;width:22px;height:22px}
.do-acq-launch h3{margin:0;color:#fff;font-size:clamp(19px,4.2vw,28px);font-weight:780;line-height:1.2;letter-spacing:-.01em}
.do-acq-launch p{max-width:620px;margin:14px 0 0;color:rgba(255,255,255,.84);font-size:15px;line-height:1.62}
/* FIND YOUR CLUB — a search across the EXISTING club directory records only. It
   reads /api/padel-clubs, the same read-only source the Clubs directory already
   uses, and selecting a result only references that club. */
.do-acq-finder{display:grid;gap:clamp(12px,2vw,16px)}
.do-acq-results{max-height:320px;margin:0;padding:0;overflow-y:auto;list-style:none;border:1px solid rgba(242,212,137,.2);border-radius:14px;background:#000}
.do-acq-results:empty{display:none}
.do-acq-result{-webkit-appearance:none;appearance:none;display:block;width:100%;padding:12px 15px;border:0;border-bottom:1px solid rgba(242,212,137,.12);background:transparent;color:#fff;font:inherit;text-align:left;cursor:pointer;transition:background .18s ease}
.do-acq-result:last-child{border-bottom:0}
.do-acq-result:hover,.do-acq-result:focus-visible{background:rgba(139,197,46,.1);outline:none}
.do-acq-result-name{display:block;font-size:15px;font-weight:700;line-height:1.3}
.do-acq-result-meta{display:block;margin-top:3px;color:rgba(255,255,255,.62);font-size:12.5px;line-height:1.4}
.do-acq-status{margin:0;color:rgba(255,255,255,.62);font-size:13px;line-height:1.5}
/* THE SELECTED CLUB. A reference to the existing record — shown so the seller can
   see exactly which club their enquiry names, and clearable. */
.do-acq-selected{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px 16px;border:1px solid rgba(139,197,46,.5);border-radius:14px;background:rgba(139,197,46,.07)}
.do-acq-selected[hidden]{display:none !important}
.do-acq-selected-body{flex:1 1 220px;min-width:0}
.do-acq-selected-label{display:block;color:#8bc52e;font-size:9.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.do-acq-selected-name{display:block;margin-top:4px;color:#fff;font-size:16px;font-weight:760;line-height:1.3}
.do-acq-selected-meta{display:block;margin-top:3px;color:rgba(255,255,255,.66);font-size:12.5px}
.do-acq-clear{-webkit-appearance:none;appearance:none;padding:9px 15px;border:1px solid rgba(242,212,137,.45);border-radius:999px;background:transparent;color:#f2d489;font:inherit;font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.do-acq-clear:hover,.do-acq-clear:focus-visible{border-color:rgba(242,212,137,.85);outline:none}
/* MY CLUB IS NOT LISTED — always available, and it never creates or alters a club
   record. It simply lets the enquiry continue against a typed club name. */
.do-acq-unlisted{-webkit-appearance:none;appearance:none;justify-self:start;padding:11px 18px;border:1px solid rgba(242,212,137,.4);border-radius:999px;background:transparent;color:#f2d489;font:inherit;font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:border-color .2s ease,background .2s ease}
.do-acq-unlisted:hover,.do-acq-unlisted:focus-visible{border-color:rgba(242,212,137,.85);background:rgba(242,212,137,.07);outline:none}
.do-acq-safeguard,.do-advertise-form-copy .do-acq-safeguard{margin:clamp(14px,2.4vw,20px) 0 0;color:rgba(255,255,255,.62);font-size:12.5px;line-height:1.55;text-transform:none;letter-spacing:0;font-weight:500}
.do-acq-choice{display:flex;flex-wrap:wrap;gap:10px}
.do-acq-choice label{display:inline-flex;align-items:center;gap:9px;padding:11px 16px;border:1px solid rgba(242,212,137,.32);border-radius:999px;background:#000;color:#fff;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:border-color .18s ease,background .18s ease}
.do-acq-choice input{-webkit-appearance:none;appearance:none;width:14px;height:14px;min-height:0;margin:0;padding:0;border:1px solid rgba(242,212,137,.6);border-radius:50%;background:#000}
.do-acq-choice input:checked{border-color:#8bc52e;box-shadow:inset 0 0 0 3px #8bc52e}
.do-acq-choice label:has(input:checked){border-color:rgba(139,197,46,.7);background:rgba(139,197,46,.09)}
.do-acq-inline,.do-advertise-field .do-acq-inline{display:inline-flex;align-items:center;gap:9px;margin:9px 0 0;color:rgba(255,255,255,.82);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;cursor:pointer}
.do-acq-inline input{-webkit-appearance:none;appearance:none;width:16px;height:16px;min-height:0;margin:0;padding:0;border:1px solid rgba(242,212,137,.6);border-radius:5px;background:#000}
.do-acq-inline input:checked{border-color:#8bc52e;background:rgba(139,197,46,.9)}

/* DO→PADEL™ feature destinations. All presentation remains scoped to the two
   destination IDs so the wider application is unaffected. */
#doPadelHealth,#doPadelUpDown{display:none}
body.do-padel-health-mode #introOverlay,
body.do-padel-health-mode #sampleOverlay,
body.do-padel-health-mode #mainApp,
body.do-padel-health-mode #doPlatformGateway,
body.do-padel-health-mode #doPadelPlaceholder,
body.do-padel-health-mode #doPadelIntent,
body.do-padel-updown-mode #introOverlay,
body.do-padel-updown-mode #sampleOverlay,
body.do-padel-updown-mode #mainApp,
body.do-padel-updown-mode #doPlatformGateway,
body.do-padel-updown-mode #doPadelPlaceholder,
body.do-padel-updown-mode #doPadelIntent{display:none !important}
body.do-padel-health-mode::before,
body.do-padel-updown-mode::before{display:none}
body.do-padel-health-mode #doPadelHealth{display:block}
body.do-padel-updown-mode #doPadelUpDown{display:block}
#doPadelHealth .do-padel-editorial,
#doPadelUpDown .do-padel-editorial{background:
  radial-gradient(circle at 50% 4%,rgba(139,197,46,.08),transparent 25%),
  radial-gradient(circle at 12% 32%,rgba(214,177,87,.08),transparent 24%),
  linear-gradient(180deg,#050505 0%,#080704 48%,#030303 100%)}
#doPadelHealth .do-padel-editorial-inner,
#doPadelUpDown .do-padel-editorial-inner{max-width:1040px}
#doPadelUpDown .do-padel-editorial-title{white-space:nowrap;font-size:clamp(21px,4.6vw,50px)}
#doPadelHealth .do-padel-editorial-rule,
#doPadelUpDown .do-padel-editorial-rule{width:112px;background:linear-gradient(90deg,transparent,var(--brand-green),var(--gold),transparent);box-shadow:0 0 20px rgba(139,197,46,.2)}
#doPadelHealth .do-feature-lead,
#doPadelUpDown .do-feature-lead{max-width:760px;margin:0 auto clamp(42px,6vw,68px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2.5vw,23px);line-height:1.62;letter-spacing:.025em;color:#e9dfc5;text-align:center}
#doPadelUpDown .do-updown-statement{display:grid;gap:4px;margin:0 auto clamp(48px,7vw,78px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(31px,6vw,62px);font-weight:400;line-height:1.03;letter-spacing:-.025em;text-align:center;color:#f6edda;text-shadow:0 12px 48px rgba(0,0,0,.85)}
#doPadelUpDown .do-updown-statement span:nth-child(2){color:var(--gold)}
#doPadelUpDown .do-updown-statement span:nth-child(3){color:var(--brand-green)}
#doPadelUpDown .do-programme{position:relative;margin:0 auto clamp(38px,5.5vw,58px);padding:clamp(25px,4vw,42px);border:1px solid rgba(214,177,87,.28);border-radius:26px;overflow:hidden;background:linear-gradient(145deg,rgba(21,16,8,.88),rgba(4,5,3,.94));box-shadow:0 28px 78px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,236,184,.08)}
#doPadelUpDown .do-programme::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(214,177,87,.07),transparent 38%,rgba(139,197,46,.04));opacity:.9}
#doPadelUpDown .do-programme.is-down{border-color:rgba(139,197,46,.26);background:linear-gradient(145deg,rgba(9,18,7,.88),rgba(3,4,3,.95))}
#doPadelUpDown .do-programme-head{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;margin-bottom:clamp(22px,3.5vw,34px);padding-bottom:clamp(20px,3vw,28px);border-bottom:1px solid rgba(214,177,87,.18)}
#doPadelUpDown .do-programme-heading{margin:0 0 8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(23px,3.4vw,35px);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
#doPadelUpDown .is-down .do-programme-heading{color:var(--brand-green)}
#doPadelUpDown .do-programme-copy{margin:0;max-width:620px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.1vw,20px);line-height:1.5;color:#e3d6b7}
#doPadelUpDown .do-programme-index{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.22em;color:rgba(214,177,87,.68);text-transform:uppercase}
#doPadelUpDown .do-session-grid{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,18px)}
#doPadelUpDown .do-session-control{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name duration" "status duration";gap:10px 18px;align-items:center;min-height:122px;width:100%;padding:clamp(18px,2.7vw,25px);border:1px solid rgba(214,177,87,.28);border-radius:18px;text-align:left;color:#f5edda;cursor:default;overflow:hidden;background:linear-gradient(145deg,rgba(16,13,8,.95),rgba(3,4,3,.96));box-shadow:0 16px 35px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,238,190,.08);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,filter .24s ease}
#doPadelUpDown .do-session-control::after{content:"";position:absolute;inset:auto -25% -70% 35%;height:120px;background:radial-gradient(circle,rgba(139,197,46,.16),transparent 66%);pointer-events:none}
#doPadelUpDown .do-session-control:hover,
#doPadelUpDown .do-session-control:focus-visible{outline:none;transform:translateY(-3px);border-color:rgba(214,177,87,.62);box-shadow:0 22px 44px rgba(0,0,0,.52),0 0 28px rgba(139,197,46,.08),inset 0 1px 0 rgba(255,238,190,.12);filter:brightness(1.05)}
#doPadelUpDown .do-session-control:active{transform:translateY(-1px) scale(.995)}
#doPadelUpDown .do-session-name{grid-area:name;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.9vw,17px);font-weight:700;letter-spacing:.12em;line-height:1.28;text-transform:uppercase}
#doPadelUpDown .do-session-duration{grid-area:duration;display:grid;place-items:center;min-width:76px;aspect-ratio:1;border:1px solid rgba(139,197,46,.3);border-radius:50%;font-family:Georgia,'Times New Roman',serif;font-size:clamp(26px,3.4vw,35px);line-height:1;color:var(--brand-green);box-shadow:inset 0 0 24px rgba(139,197,46,.06)}
#doPadelUpDown .do-session-duration small{display:block;margin-top:3px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:8px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#b9ab88;text-align:center}
#doPadelUpDown .do-guided-preview{margin:clamp(50px,7vw,76px) auto;padding:clamp(25px,4vw,40px);border-top:1px solid rgba(214,177,87,.24);border-bottom:1px solid rgba(214,177,87,.24);text-align:center}
#doPadelUpDown .do-guided-preview h2{margin:0 0 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,2vw,18px);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
#doPadelUpDown .do-guided-preview p{margin:0 auto 24px;max-width:680px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.1vw,20px);line-height:1.55;color:#e6d9ba}
#doPadelUpDown .do-guided-list{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0;padding:0;list-style:none}
#doPadelUpDown .do-guided-list li{padding:9px 13px;border:1px solid rgba(139,197,46,.2);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.08em;color:#c7b991;background:rgba(139,197,46,.035)}
#doPadelUpDown .do-feature-closing{display:grid;gap:4px;margin:0 auto clamp(42px,6vw,66px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(23px,3.5vw,35px);line-height:1.25;text-align:center;color:#f3e8d0}
#doPadelUpDown .do-feature-closing span:nth-child(2){color:var(--gold)}
#doPadelUpDown .do-feature-closing span:nth-child(3){color:var(--brand-green)}
#doPadelHealth .do-health-intro{max-width:790px;margin:0 auto clamp(42px,6vw,66px);text-align:center}
#doPadelHealth .do-health-intro .do-feature-lead{margin-bottom:0}
#doPadelHealth .do-health-section{margin:0 auto clamp(58px,8vw,88px)}
#doPadelHealth .do-health-section-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;margin-bottom:clamp(24px,4vw,38px)}
#doPadelHealth .do-health-section-number{font-family:Georgia,'Times New Roman',serif;font-size:clamp(31px,4.8vw,48px);font-style:italic;color:rgba(214,177,87,.4)}
#doPadelHealth .do-health-section-title{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(17px,2.7vw,25px);letter-spacing:.16em;line-height:1.2;text-transform:uppercase;color:var(--gold)}
#doPadelHealth .do-health-section-title::after{content:"";display:block;width:100%;height:1px;margin-top:13px;background:linear-gradient(90deg,rgba(214,177,87,.48),transparent)}
#doPadelHealth .do-health-pillars{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,2vw,18px)}
#doPadelHealth .do-health-pillar{position:relative;grid-column:span 4;min-height:220px;padding:clamp(20px,3vw,29px);border:1px solid rgba(214,177,87,.22);border-radius:20px;overflow:hidden;background:linear-gradient(150deg,rgba(18,14,8,.88),rgba(4,4,4,.94));box-shadow:0 20px 50px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,237,185,.06)}
#doPadelHealth .do-health-pillar:first-child{grid-column:span 7;min-height:250px;background:linear-gradient(145deg,rgba(24,17,8,.92),rgba(4,5,3,.96))}
#doPadelHealth .do-health-pillar:nth-child(2){grid-column:span 5}
#doPadelHealth .do-health-pillar:nth-child(3),
#doPadelHealth .do-health-pillar:nth-child(4){grid-column:span 6}
#doPadelHealth .do-health-pillar::after{content:"";position:absolute;width:160px;height:160px;right:-65px;bottom:-85px;border:1px solid rgba(139,197,46,.16);border-radius:50%;box-shadow:0 0 60px rgba(139,197,46,.04)}
#doPadelHealth .do-health-pillar-index{display:block;margin-bottom:clamp(28px,4vw,48px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;font-weight:700;letter-spacing:.2em;color:var(--brand-green)}
#doPadelHealth .do-health-pillar h3{position:relative;margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,3vw,30px);font-weight:400;line-height:1.15;color:#f3e8cf}
#doPadelHealth .do-health-pillar p{position:relative;margin:0;max-width:38ch;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.68;letter-spacing:.015em;color:#bcae8c}
#doPadelHealth .do-expert-panel{position:relative;padding:clamp(28px,5vw,52px);border:1px solid rgba(214,177,87,.3);border-radius:26px;overflow:hidden;background:linear-gradient(135deg,rgba(24,17,8,.94),rgba(4,6,3,.96));box-shadow:0 30px 76px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,238,190,.08)}
#doPadelHealth .do-expert-panel::after{content:"RC";position:absolute;right:clamp(16px,4vw,44px);top:clamp(6px,2vw,20px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(86px,16vw,160px);line-height:1;color:rgba(214,177,87,.035);pointer-events:none}
#doPadelHealth .do-expert-label{display:inline-flex;align-items:center;gap:10px;margin-bottom:28px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;font-weight:700;letter-spacing:.21em;text-transform:uppercase;color:var(--brand-green)}
#doPadelHealth .do-expert-label::before{content:"";width:28px;height:1px;background:var(--brand-green)}
#doPadelHealth .do-expert-name{position:relative;margin:0 0 10px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(28px,4.7vw,48px);font-weight:400;color:#f5ead2}
#doPadelHealth .do-expert-perspective{position:relative;margin:0 0 20px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--gold)}
#doPadelHealth .do-expert-summary{position:relative;max-width:760px;margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,2.4vw,22px);line-height:1.65;color:#e4d8bd}
#doPadelHealth .do-expert-note{position:relative;margin:22px 0 0;padding-top:20px;border-top:1px solid rgba(214,177,87,.16);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;line-height:1.6;letter-spacing:.035em;color:#9f9274}
#doPadelHealth .do-more-experts{margin-top:16px;padding:18px 20px;border:1px dashed rgba(139,197,46,.26);border-radius:16px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;text-align:center;color:#b8a873;background:rgba(139,197,46,.025)}
#doPadelHealth .do-resource-card{position:relative;margin-top:clamp(26px,4vw,38px);padding:clamp(22px,3.6vw,34px);border:1px solid rgba(139,197,46,.3);border-radius:20px;background:linear-gradient(150deg,rgba(18,20,10,.9),rgba(4,5,3,.95));box-shadow:0 22px 56px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,237,185,.05)}
#doPadelHealth .do-resource-card-label{display:inline-flex;align-items:center;gap:10px;margin-bottom:16px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;font-weight:700;letter-spacing:.21em;text-transform:uppercase;color:var(--brand-green)}
#doPadelHealth .do-resource-card-label::before{content:"";width:28px;height:1px;background:var(--brand-green)}
#doPadelHealth .do-resource-card h4{margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,3.4vw,32px);font-weight:400;color:#f3e8cf}
#doPadelHealth .do-resource-card p{margin:0 0 clamp(20px,3vw,26px);max-width:60ch;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.68;letter-spacing:.015em;color:#c3b590}
#doPadelHealth .do-resource-card .do-resource-btn{margin:0}
#doPadelHealth .do-social-note{margin:clamp(24px,3.5vw,32px) 0 0;max-width:760px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2.1vw,19px);line-height:1.62;color:#cabd9c}
#doPadelHealth .do-content-intro{max-width:760px;margin:0 0 clamp(24px,4vw,36px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,2.3vw,21px);line-height:1.62;color:#e4d7ba}
#doPadelHealth .do-content-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#doPadelHealth .do-content-topic{display:flex;align-items:center;min-height:92px;padding:18px;border:1px solid rgba(214,177,87,.18);border-radius:15px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:600;line-height:1.5;letter-spacing:.035em;color:#d4c7a8;background:rgba(8,8,6,.72)}
#doPadelHealth .do-content-topic::before{content:"";flex:0 0 auto;width:7px;height:7px;margin-right:12px;border:1px solid var(--brand-green);border-radius:50%;box-shadow:0 0 10px rgba(139,197,46,.22)}
#doPadelHealth .do-volution-connection{padding:clamp(28px,5vw,48px);border:1px solid rgba(139,197,46,.25);border-radius:24px;text-align:center;background:radial-gradient(circle at 50% 0,rgba(139,197,46,.08),transparent 55%),rgba(4,5,3,.88);box-shadow:0 24px 62px rgba(0,0,0,.5)}
#doPadelHealth .do-volution-connection p{margin:0 auto 24px;max-width:600px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2.6vw,23px);line-height:1.55;color:#eadfc5}
#doPadelHealth .do-volution-connection .btn{margin:0}
#doPadelHealth .do-health-closing{margin:clamp(62px,9vw,96px) auto clamp(42px,6vw,68px);text-align:center}
#doPadelHealth .do-health-closing-lines{display:grid;gap:3px;margin-bottom:22px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(28px,4.5vw,45px);line-height:1.12;color:#f5ead2}
#doPadelHealth .do-health-closing-lines span:nth-child(2){color:var(--gold)}
#doPadelHealth .do-health-closing-lines span:nth-child(3){color:var(--brand-green)}
#doPadelHealth .do-health-closing p{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#c4b68f}
@media(max-width:760px){
  #doPadelUpDown .do-programme-head{grid-template-columns:1fr}
  #doPadelUpDown .do-programme-index{display:none}
  #doPadelHealth .do-health-pillar,
  #doPadelHealth .do-health-pillar:first-child,
  #doPadelHealth .do-health-pillar:nth-child(2),
  #doPadelHealth .do-health-pillar:nth-child(3),
  #doPadelHealth .do-health-pillar:nth-child(4){grid-column:span 6;min-height:210px}
  #doPadelHealth .do-content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  #doPadelHealth .do-padel-editorial-inner,
  #doPadelUpDown .do-padel-editorial-inner{padding-left:18px;padding-right:18px}
  #doPadelUpDown .do-updown-statement{font-size:clamp(34px,11vw,48px)}
  #doPadelUpDown .do-programme{padding:22px 14px;border-radius:22px}
  #doPadelUpDown .do-session-grid{grid-template-columns:1fr}
  #doPadelUpDown .do-session-control{min-height:112px;padding:18px 16px}
  #doPadelUpDown .do-session-duration{min-width:68px;font-size:27px}
  #doPadelUpDown .do-guided-preview{padding-left:4px;padding-right:4px}
  #doPadelHealth .do-health-section-head{grid-template-columns:1fr;gap:6px}
  #doPadelHealth .do-health-section-number{font-size:28px}
  #doPadelHealth .do-health-pillars{grid-template-columns:1fr}
  #doPadelHealth .do-health-pillar,
  #doPadelHealth .do-health-pillar:first-child,
  #doPadelHealth .do-health-pillar:nth-child(2),
  #doPadelHealth .do-health-pillar:nth-child(3),
  #doPadelHealth .do-health-pillar:nth-child(4){grid-column:1;min-height:0}
  #doPadelHealth .do-health-pillar-index{margin-bottom:24px}
  #doPadelHealth .do-expert-panel{padding:25px 20px}
  #doPadelHealth .do-content-grid{grid-template-columns:1fr}
  #doPadelHealth .do-content-topic{min-height:76px}
}
@media(prefers-reduced-motion:reduce){#doPadelUpDown .do-session-control{transition:none}}

/* ── DO→PADEL™ Guided Session destinations ────────────────────────────────────
   The four pages opened from the existing PADEL UP™ / PADEL DOWN™ session cards
   (Express Activation, Match Ready, Quick Reset, Recovery Routine). One
   shared container renders all four from the same template, so every page is
   structurally identical. Presentation is entirely scoped to #doPadelSession /
   the do-padel-session-mode body class and reuses the established DO→PADEL
   editorial shell, gold/green tokens and card treatments — nothing outside this
   destination is touched. */
#doPadelSession{display:none}
body.do-padel-session-mode{min-height:100vh;background:#030402;color:#f7f2e6;overflow-x:hidden}
body.do-padel-session-mode #introOverlay,
body.do-padel-session-mode #sampleOverlay,
body.do-padel-session-mode #mainApp,
body.do-padel-session-mode #doPlatformGateway,
body.do-padel-session-mode #doPadelPlaceholder,
body.do-padel-session-mode #doPadelIntent{display:none !important}
body.do-padel-session-mode::before{display:none}
body.do-padel-session-mode #doPadelSession{display:block}
#doPadelSession .do-padel-editorial{background:
  radial-gradient(circle at 22% 8%,rgba(214,177,87,.055),transparent 46%),
  radial-gradient(circle at 80% 92%,rgba(139,197,46,.05),transparent 52%),
  #030303}
#doPadelSession .do-padel-editorial-inner{width:min(100%,1040px);text-align:left}
#doPadelSession .do-padel-editorial-kicker{display:inline-flex;align-items:center;gap:12px;margin-bottom:16px}
#doPadelSession .do-padel-editorial-kicker::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,rgba(214,177,87,0),var(--gold))}
#doPadelSession .do-padel-editorial-title{margin-left:0;margin-right:0;max-width:860px;font-size:clamp(27px,5.2vw,50px);letter-spacing:.08em}
#doPadelSession .do-padel-editorial-rule{width:112px;margin-left:0;margin-right:0;background:linear-gradient(90deg,transparent,var(--brand-green),var(--gold),transparent);box-shadow:0 0 20px rgba(139,197,46,.2)}

/* Session identity strip — duration, programme and format at a glance. */
#doPadelSession .do-session-meta{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(18px,3vw,28px);align-items:center;margin:0 0 clamp(40px,6vw,64px);padding:clamp(20px,3.2vw,30px);border:1px solid rgba(214,177,87,.28);border-radius:22px;background:linear-gradient(145deg,rgba(21,16,8,.88),rgba(4,5,3,.94));box-shadow:0 24px 62px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,236,184,.07)}
#doPadelSession.is-down .do-session-meta{border-color:rgba(139,197,46,.26);background:linear-gradient(145deg,rgba(9,18,7,.88),rgba(3,4,3,.95))}
#doPadelSession .do-session-meta-duration{display:grid;place-items:center;min-width:96px;aspect-ratio:1;border:1px solid rgba(139,197,46,.3);border-radius:50%;font-family:Georgia,'Times New Roman',serif;font-size:clamp(30px,4.4vw,40px);line-height:1;color:var(--brand-green);box-shadow:inset 0 0 28px rgba(139,197,46,.07)}
#doPadelSession .do-session-meta-duration small{display:block;margin-top:4px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:8px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#b9ab88;text-align:center}
#doPadelSession .do-session-meta-facts{display:grid;gap:14px}
#doPadelSession .do-session-meta-tags{display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0;list-style:none}
#doPadelSession .do-session-meta-tags li{padding:8px 13px;border:1px solid rgba(214,177,87,.24);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#cdb878;background:rgba(214,177,87,.04)}
#doPadelSession .do-session-meta-line{margin:0;max-width:62ch;font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.1vw,20px);line-height:1.55;color:#e6d9ba}

/* Numbered content sections — the same shell for all five sections on all four pages. */
#doPadelSession .do-session-section{margin:0 0 clamp(46px,7vw,74px)}
#doPadelSession .do-session-section-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;margin-bottom:clamp(20px,3.4vw,30px)}
#doPadelSession .do-session-section-number{font-family:Georgia,'Times New Roman',serif;font-size:clamp(28px,4.4vw,44px);font-style:italic;color:rgba(214,177,87,.4)}
#doPadelSession .do-session-section-title{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(15px,2.4vw,22px);letter-spacing:.16em;line-height:1.2;text-transform:uppercase;color:var(--gold)}
#doPadelSession .do-session-section-title::after{content:"";display:block;width:100%;height:1px;margin-top:13px;background:linear-gradient(90deg,rgba(214,177,87,.48),transparent)}
#doPadelSession.is-down .do-session-section-title{color:var(--brand-green)}
#doPadelSession.is-down .do-session-section-title::after{background:linear-gradient(90deg,rgba(139,197,46,.42),transparent)}
#doPadelSession .do-session-lead{margin:0 0 clamp(22px,3.2vw,30px);max-width:74ch;font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,2.3vw,21px);line-height:1.64;letter-spacing:.02em;color:#e9dfc5}
#doPadelSession .do-session-lead:last-child{margin-bottom:0}

/* "Who it is for" / "When to use it" — two calm supporting panels. */
#doPadelSession .do-session-context{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,18px)}
#doPadelSession .do-session-context-card{padding:clamp(20px,3vw,28px);border:1px solid rgba(214,177,87,.2);border-radius:20px;background:linear-gradient(150deg,rgba(18,14,8,.86),rgba(4,4,4,.93));box-shadow:0 20px 50px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,237,185,.05)}
#doPadelSession.is-down .do-session-context-card{border-color:rgba(139,197,46,.2);background:linear-gradient(150deg,rgba(10,17,7,.86),rgba(3,4,3,.94))}
#doPadelSession .do-session-context-label{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;font-weight:700;letter-spacing:.21em;text-transform:uppercase;color:var(--brand-green)}
#doPadelSession .do-session-context-label::before{content:"";width:26px;height:1px;background:var(--brand-green)}
#doPadelSession .do-session-context-card p{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.7;letter-spacing:.015em;color:#c3b590}

/* Benefits — a clear, scannable bullet list. */
#doPadelSession .do-session-benefits{display:grid;gap:0;margin:0;padding:0;list-style:none}
#doPadelSession .do-session-benefits li{position:relative;padding:16px 0 16px 30px;border-bottom:1px solid rgba(214,177,87,.14);font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.1vw,20px);line-height:1.55;letter-spacing:.015em;color:#ebe0c6}
#doPadelSession .do-session-benefits li:last-child{border-bottom:0}
#doPadelSession .do-session-benefits li::before{content:"";position:absolute;left:2px;top:26px;width:7px;height:7px;border:1px solid var(--brand-green);border-radius:50%;box-shadow:0 0 10px rgba(139,197,46,.24)}
#doPadelSession .do-session-benefits li strong{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:.72em;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:5px}
#doPadelSession.is-down .do-session-benefits li strong{color:var(--brand-green)}

/* What you'll do — the numbered overview of the session's stages. */
#doPadelSession .do-session-steps{display:grid;gap:clamp(10px,1.8vw,14px);margin:0;padding:0;list-style:none;counter-reset:doSessionStep}
#doPadelSession .do-session-steps li{counter-increment:doSessionStep;display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start;padding:clamp(17px,2.6vw,23px);border:1px solid rgba(214,177,87,.2);border-radius:18px;background:linear-gradient(145deg,rgba(16,13,8,.9),rgba(3,4,3,.94));box-shadow:0 16px 38px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,238,190,.06)}
#doPadelSession.is-down .do-session-steps li{border-color:rgba(139,197,46,.2);background:linear-gradient(145deg,rgba(9,16,7,.9),rgba(3,4,3,.95))}
#doPadelSession .do-session-steps li::before{content:counter(doSessionStep,decimal-leading-zero);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--brand-green);padding-top:4px}
#doPadelSession .do-session-step-name{display:block;margin-bottom:6px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.5px,1.7vw,14px);font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#f5edda}
#doPadelSession .do-session-step-copy{display:block;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.68;letter-spacing:.015em;color:#bcae8c}
#doPadelSession .do-session-steps-note{margin:clamp(18px,2.8vw,24px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;line-height:1.65;letter-spacing:.05em;color:#9f9274}

/* Before you begin — the standing preparation and safety guidance. */
#doPadelSession .do-session-prepare{padding:clamp(22px,3.6vw,34px);border:1px solid rgba(139,197,46,.28);border-radius:22px;background:radial-gradient(circle at 50% 0,rgba(139,197,46,.06),transparent 58%),rgba(4,5,3,.9);box-shadow:0 22px 56px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,237,185,.05)}
#doPadelSession .do-session-prepare-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
#doPadelSession .do-session-prepare-list li{display:flex;align-items:center;min-height:82px;padding:16px 18px;border:1px solid rgba(214,177,87,.18);border-radius:15px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:600;line-height:1.55;letter-spacing:.03em;color:#d4c7a8;background:rgba(8,8,6,.7)}
#doPadelSession .do-session-prepare-list li::before{content:"";flex:0 0 auto;width:7px;height:7px;margin-right:13px;border:1px solid var(--brand-green);border-radius:50%;box-shadow:0 0 10px rgba(139,197,46,.22)}
#doPadelSession .do-session-prepare-note{margin:clamp(18px,2.8vw,24px) 0 0;padding-top:18px;border-top:1px solid rgba(214,177,87,.16);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;line-height:1.7;letter-spacing:.03em;color:#a1946f}

/* Guided video — a premium placeholder panel sized for the real embed. The 16:9
   frame is the exact box a future <iframe>/<video> drops into, so adding the film
   later changes nothing about this page's layout. */
#doPadelSession .do-session-video{position:relative;padding:clamp(24px,4vw,44px);border:1px solid rgba(214,177,87,.3);border-radius:26px;overflow:hidden;background:linear-gradient(135deg,rgba(24,17,8,.94),rgba(4,6,3,.96));box-shadow:0 30px 76px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,238,190,.08)}
#doPadelSession .do-session-video::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(214,177,87,.06),transparent 40%,rgba(139,197,46,.04))}
#doPadelSession .do-session-video-label{position:relative;display:inline-flex;align-items:center;gap:10px;margin-bottom:clamp(18px,3vw,26px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9px;font-weight:700;letter-spacing:.21em;text-transform:uppercase;color:var(--brand-green)}
#doPadelSession .do-session-video-label::before{content:"";width:28px;height:1px;background:var(--brand-green)}
#doPadelSession .do-session-video-frame{position:relative;display:grid;place-items:center;aspect-ratio:16/9;min-height:220px;padding:clamp(20px,4vw,40px);border:1px solid rgba(214,177,87,.22);border-radius:20px;text-align:center;background:radial-gradient(circle at 50% 42%,rgba(139,197,46,.07),transparent 60%),linear-gradient(160deg,rgba(12,10,6,.94),rgba(2,3,2,.97));box-shadow:inset 0 0 70px rgba(0,0,0,.7)}
#doPadelSession .do-session-video-frame-inner{display:grid;justify-items:center;gap:clamp(12px,2vw,18px);max-width:600px}
#doPadelSession .do-session-video-mark{display:grid;place-items:center;width:clamp(58px,9vw,76px);aspect-ratio:1;border:1px solid rgba(214,177,87,.4);border-radius:50%;box-shadow:0 0 34px rgba(214,177,87,.1),inset 0 0 26px rgba(139,197,46,.05)}
#doPadelSession .do-session-video-mark::before{content:"";width:0;height:0;margin-left:5px;border-style:solid;border-width:11px 0 11px 17px;border-color:transparent transparent transparent rgba(214,177,87,.72)}
#doPadelSession .do-session-video-title{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11.5px,1.9vw,14px);font-weight:700;letter-spacing:.2em;line-height:1.6;text-transform:uppercase;color:var(--gold)}
#doPadelSession .do-session-video-status{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,2.5vw,22px);line-height:1.5;color:#f1e6cc}
#doPadelSession .do-session-video-note{margin:0;max-width:60ch;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.7;letter-spacing:.03em;color:#a99c78}
#doPadelSession .do-session-video-foot{position:relative;margin:clamp(20px,3vw,26px) 0 0;padding-top:18px;border-top:1px solid rgba(214,177,87,.16);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;line-height:1.65;letter-spacing:.035em;color:#9f9274}

/* Guided video — PADEL UP™ playable state. The approved frame is unchanged: the
   existing circular play mark simply becomes the button that starts the flow, and
   the embedded player drops into the same frame afterwards. */
#doPadelSession .do-session-video-play{display:grid;justify-items:center;gap:clamp(12px,2vw,16px);padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
#doPadelSession .do-session-video-play .do-session-video-mark{transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
#doPadelSession .do-session-video-play:hover .do-session-video-mark,
#doPadelSession .do-session-video-play:focus-visible .do-session-video-mark{transform:scale(1.06);border-color:rgba(214,177,87,.78);box-shadow:0 0 44px rgba(214,177,87,.2),inset 0 0 26px rgba(139,197,46,.09)}
#doPadelSession .do-session-video-play:hover .do-session-video-mark::before,
#doPadelSession .do-session-video-play:focus-visible .do-session-video-mark::before{border-left-color:var(--gold)}
#doPadelSession .do-session-video-play:focus-visible{outline:none}
#doPadelSession .do-session-video-play-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
#doPadelSession .do-session-video-play:hover .do-session-video-play-label,
#doPadelSession .do-session-video-play:focus-visible .do-session-video-play-label{color:#f4e2b4}

/* Playing state — the frame hands its whole area to the embed. The player keeps
   its own aspect ratio so nothing overflows on any screen, and portrait films are
   height-capped rather than letterboxed into a wide box. */
#doPadelSession .do-session-video-frame.is-playing{display:block;aspect-ratio:auto;min-height:0;padding:0;overflow:hidden;background:#000}
#doPadelSession .do-session-video-player{position:relative;width:100%;max-width:100%;aspect-ratio:16/9;margin:0 auto;background:#000}
#doPadelSession .do-session-video-player.is-portrait{width:auto;height:min(72vh,600px);aspect-ratio:9/16}
#doPadelSession .do-session-video-player iframe{position:absolute;top:0;left:0;width:100%;height:100%;display:block;border:0}

/* POWERED BY DO→?® — a small readability lift on the PADEL UP™ guided-video
   session pages only. Wording, position and centring are unchanged. */
#doPadelSession .do-padel-powered.is-emphasised{font-size:11.5px;color:rgba(226,196,116,.86)}
#doPadelSession .do-padel-powered.is-emphasised strong{font-size:14px}

/* Sponsor interstitial — ONE reusable full-screen presentation, shared by every
   guided session in both programmes, shown for five seconds between the Guided
   Video button and the embedded film. There is no per-page sponsor screen. */
.do-sponsor-screen{position:fixed;inset:0;z-index:10100;display:grid;place-items:center;padding:calc(env(safe-area-inset-top) + 28px) 24px calc(env(safe-area-inset-bottom) + 28px);background:radial-gradient(circle at 50% 34%,rgba(214,177,87,.09),transparent 58%),radial-gradient(circle at 50% 104%,rgba(139,197,46,.08),transparent 56%),#040404;animation:doSponsorScreenIn .42s ease both}
.do-sponsor-screen[hidden]{display:none}
.do-sponsor-screen::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(214,177,87,.05),transparent 42%,rgba(139,197,46,.04))}
/* Vertical rhythm: one shared spacing step that grows with the viewport height, so
   the block uses a tall phone screen naturally instead of sitting compressed in the
   middle, and tightens itself again on short screens. Every row is spaced from this
   one step, which keeps the distribution even from PADEL UP™ down to the footer. */
.do-sponsor-screen-inner{position:relative;--sp-step:clamp(18px,calc(1.2vw + 4.6vh),52px);display:grid;justify-items:center;gap:var(--sp-step);width:min(100%,620px);text-align:center}
.do-sponsor-screen-programme{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(15px,2.8vw,20px);font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.do-sponsor-screen-rule{width:clamp(90px,17vw,142px);height:1px;background:linear-gradient(90deg,transparent,var(--brand-green),var(--gold),transparent);box-shadow:0 0 18px rgba(139,197,46,.2)}
.do-sponsor-screen-presented{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.34em;text-transform:uppercase;color:#b0a184}
/* The sponsor name keeps only 40% of the spacing step above it, so Presented by and
   the name read as one connected unit. Being a fraction of the step, it can never
   collapse into an overlap on a short screen. */
.do-sponsor-screen-name{margin:calc(-.6 * var(--sp-step)) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(39px,10.6vw,74px);font-weight:700;line-height:1;letter-spacing:.14em;text-transform:uppercase;color:#fff;text-shadow:0 0 38px rgba(255,255,255,.16)}
/* Shown in place of the sponsor name once SPONSOR.logo is supplied. Unused today. */
.do-sponsor-screen-logo{display:block;width:auto;max-width:min(80%,340px);max-height:clamp(48px,14vw,96px);margin:calc(-.6 * var(--sp-step)) auto 0;object-fit:contain}
.do-sponsor-screen-triad{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(11px,2.9vw,22px);margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18.5px,3.7vw,28px);letter-spacing:.045em}
.do-sponsor-screen-triad span:nth-child(1){color:var(--gold)}
.do-sponsor-screen-triad span:nth-child(2){color:#fff}
.do-sponsor-screen-triad span:nth-child(3){color:var(--brand-green)}
.do-sponsor-screen-progress{width:min(80%,330px);height:2px;overflow:hidden;border-radius:999px;background:rgba(214,177,87,.16)}
.do-sponsor-screen-progress-bar{display:block;width:100%;height:100%;border-radius:999px;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--gold),var(--brand-green))}
.do-sponsor-screen-count{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#a29473}
/* Master-brand footer on the sponsor interstitial: POWERED BY DO→?®, the same
   mark used across the app, enlarged, brightened, and kept dead-centre. */
.do-sponsor-screen-brand{margin:calc(.2 * var(--sp-step)) auto 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:14px;letter-spacing:.2em;text-transform:uppercase;text-align:center;color:rgba(233,205,130,.92)}
.do-sponsor-screen-brand strong{font-family:Georgia,'Times New Roman',serif;font-size:17px;font-weight:400;letter-spacing:.12em}
.do-sponsor-screen-brand .wm-gold{color:#f2d489;-webkit-text-fill-color:#f2d489}
.do-sponsor-screen-brand .wm-arrow{color:#a4dc4e;-webkit-text-fill-color:#a4dc4e}
.do-sponsor-screen-note{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:8.8px;letter-spacing:.16em;text-transform:uppercase;color:rgba(163,152,126,.72)}
/* Optional CONTINUE control on the sponsor interstitial. Requested per call and
   hidden by default, so the guided-session screens keep exactly the approved
   layout they have today. Styling is the established DO→PADEL pill action, just
   sized for a full-screen surface. */
.do-sponsor-screen-continue{-webkit-appearance:none;appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(139,197,46,.42);border-radius:999px;background:rgba(139,197,46,.08);color:var(--brand-green);padding:13px 30px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.do-sponsor-screen-continue:hover,.do-sponsor-screen-continue:focus-visible{border-color:rgba(139,197,46,.74);background:rgba(139,197,46,.15);transform:translateY(-1px);outline:none}
.do-sponsor-screen-continue[hidden]{display:none}
@keyframes doSponsorScreenIn{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.do-sponsor-screen{animation:none}}
/* Landscape phones and other very short viewports: hold the same hierarchy but pull
   the spacing and the sponsor name back in so nothing is pushed off screen. */
@media(max-height:620px){
  .do-sponsor-screen-inner{--sp-step:clamp(10px,2.2vh,18px)}
  .do-sponsor-screen-name{font-size:clamp(30px,7vw,46px)}
  .do-sponsor-screen-triad{font-size:clamp(15px,3vw,21px)}
}

/* ── PADEL UP™ / PADEL DOWN™ — THE DO→PADEL™ HOUSE ADVERT ─────────────────────
   The advertising position in front of every guided film. The approved house
   advert already published elsewhere in this document is shown here — the very
   same file, assets/do-padel-portrait-advert.jpg, at its own 1284 × 1963
   proportions. It is never recoloured, recompressed, stretched, cropped or
   rebuilt: the framing below is copied from the approved landing-page treatment
   so the two moments in the journey are the same piece of design by
   construction.
   Black surround, the whole portrait on screen, and the controls beneath it in
   that same black — the 232px set aside in the image width covers the control
   strip in full, which is what lets a phone hold the entire artwork and both
   buttons together without scrolling. This is the same reserve the BOOK A COURT
   house advert uses for the same two controls, so the two placements measure
   identically. Nothing here runs a clock: the screen stays until CONTINUE is
   pressed. */
.do-session-advert{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10100;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100vw;height:100vh;height:100dvh;margin:0;padding:0;border:0;background:#000;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;animation:doSponsorScreenIn .42s ease both;
  /* The exact height the two-control strip below the artwork occupies: its own
     top padding, CONTINUE (54px), the gap, ADVERTISE YOUR BRAND GLOBALLY (54px),
     its bottom padding, the home-indicator inset, and 10px of clear black under
     the second button. Declared from the same values the strip itself uses, so
     the space reserved for it can never be less than the space it needs. */
  --do-advert-actions:calc(clamp(20px,3.4vh,32px) + 54px + clamp(11px,1.9vh,17px) + 54px + clamp(26px,4.4vh,42px) + env(safe-area-inset-bottom,0px) + 10px)}
.do-session-advert[hidden]{display:none}
/* The artwork keeps its own width rule untouched. max-height is the fix for short
   mobile viewports — in-app browsers and landscape, where the old flat 232px
   reserve was smaller than the strip, so the second button ran off the bottom.
   The image is never allowed past the line where the strip begins; with its
   intrinsic ratio it scales down proportionally, so nothing is distorted. On a
   normal phone in portrait the cap is never reached and the artwork is unchanged. */
.do-session-advert img{display:block;flex:0 0 auto;width:100%;max-width:min(560px,max(240px,calc((100dvh - 232px) * 0.65410)));max-height:max(120px,calc(100dvh - var(--do-advert-actions)));height:auto;margin:0 auto;padding:0;border:0;background:#000}
/* The two controls stack in the one strip, at the same width, with the same
   spacing between them the BOOK A COURT advert already publishes. */
.do-session-advert-actions{flex:0 0 auto;display:grid;gap:clamp(11px,1.9vh,17px);width:100%;max-width:420px;box-sizing:border-box;margin:0;padding:clamp(20px,3.4vh,32px) 22px calc(clamp(26px,4.4vh,42px) + env(safe-area-inset-bottom));background:#000}
/* The same premium green-and-gold CONTINUE treatment the approved advert carries
   on the landing page, so the control reads identically wherever the house
   advert appears. */
.do-session-advert-continue{-webkit-appearance:none;appearance:none;cursor:pointer;display:block;width:100%;height:54px;margin:0;padding:0 24px;border:1px solid rgba(197,247,116,.72);border-radius:999px;background:linear-gradient(175deg,#5f8825 0%,#49681d 42%,#385214 72%,#2d4210 100%);color:#f2d489;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 1px 3px rgba(18,42,4,.45);box-shadow:0 10px 28px rgba(0,0,0,.35),0 4px 18px rgba(139,197,46,.28),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.22);transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.do-session-advert-continue:hover,.do-session-advert-continue:focus-visible{border-color:rgba(212,252,140,.9);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 28px rgba(139,197,46,.34),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.22);outline:none}
.do-session-advert-continue:active{transform:translateY(1px)}
@media(prefers-reduced-motion:reduce){.do-session-advert{animation:none}}

/* Closing signature — the programme's own three-line statement. */
#doPadelSession .do-session-closing{display:grid;gap:4px;margin:clamp(52px,8vw,84px) auto clamp(40px,6vw,64px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,3.4vw,34px);line-height:1.25;text-align:center;color:#f3e8d0}
#doPadelSession .do-session-closing span:nth-child(2){color:var(--gold)}
#doPadelSession .do-session-closing span:nth-child(3){color:var(--brand-green)}
#doPadelSession .do-padel-back{margin-left:auto;margin-right:auto}
#doPadelSession .do-padel-powered{margin-left:auto;margin-right:auto;text-align:center}
@media(max-width:760px){
  #doPadelSession .do-session-meta{grid-template-columns:1fr;justify-items:start}
  #doPadelSession .do-session-context{grid-template-columns:1fr}
  #doPadelSession .do-session-section-head{grid-template-columns:1fr;gap:6px}
  #doPadelSession .do-session-section-number{font-size:26px}
}
@media(max-width:560px){
  #doPadelSession .do-padel-editorial-inner{padding-left:18px;padding-right:18px}
  #doPadelSession .do-session-meta{padding:20px 16px;border-radius:20px}
  #doPadelSession .do-session-prepare-list{grid-template-columns:1fr}
  #doPadelSession .do-session-prepare-list li{min-height:0}
  #doPadelSession .do-session-steps li{grid-template-columns:1fr;gap:8px}
  #doPadelSession .do-session-steps li::before{padding-top:0}
  #doPadelSession .do-session-video{padding:22px 16px;border-radius:22px}
  #doPadelSession .do-session-video-frame{aspect-ratio:auto;min-height:0;padding:30px 18px}
}
.do-winner-icon{width:clamp(80px,11.5vw,116px);aspect-ratio:1;margin:0 auto clamp(18px,3.2vw,26px);overflow:hidden;border-radius:21px;filter:drop-shadow(0 18px 34px rgba(0,0,0,.56)) drop-shadow(0 0 16px rgba(139,197,46,.08))}
.do-winner-icon img{display:block;width:100%;height:auto;transform:translateY(-26.9%) scale(1.18);transform-origin:50% 50%;user-select:none;-webkit-user-drag:none}
.do-winner-copy{max-width:760px;margin:0 auto clamp(34px,5vw,52px);text-align:center}
.do-winner-lines{margin:0 auto clamp(30px,5vw,48px);display:grid;gap:10px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,3.1vw,28px);line-height:1.35;letter-spacing:.03em;color:#f4ead4}
.do-winner-belief{margin:clamp(16px,3vw,26px) auto 0;padding-top:clamp(16px,3vw,24px);border-top:1px solid rgba(214,177,87,.22);font-family:Georgia,'Times New Roman',serif;color:#eadfbd}
.do-winner-belief span{display:block}
.do-winner-belief-main{font-size:clamp(18px,2.7vw,24px);line-height:1.45;letter-spacing:.03em}
.do-winner-belief-action{margin-top:10px;font-size:clamp(22px,3.5vw,32px);line-height:1.25;letter-spacing:.045em;color:var(--gold);text-shadow:0 0 24px rgba(214,177,87,.12)}
.do-winner-section{max-width:860px;margin:0 auto clamp(32px,4.8vw,46px);padding:clamp(22px,3.4vw,32px);border:1px solid rgba(214,177,87,.22);border-radius:20px;background:linear-gradient(180deg,rgba(16,12,7,.72),rgba(4,4,4,.86));box-shadow:0 18px 48px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,235,180,.06)}
.do-winner-section h2{margin:0 0 18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,2.2vw,18px);letter-spacing:.2em;text-transform:uppercase;color:var(--brand-green)}
.do-winner-section p{margin:0 0 14px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.2vw,20px);line-height:1.62;letter-spacing:.02em;color:#eadfbd}
.do-winner-section p:last-child{margin-bottom:0}
.do-winner-list{display:grid;gap:10px;margin:0;padding:0;list-style:none;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2.6vw,24px);line-height:1.35;color:#f1e4bf}
.do-winner-list li{padding:0 0 10px;border-bottom:1px solid rgba(214,177,87,.14)}
.do-winner-list li:last-child{border-bottom:0;padding-bottom:0}
.do-winner-list + p{margin-top:18px}
.do-winner-ecosystem{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(12px,2vw,20px);align-items:stretch;margin-top:18px}
.do-winner-pillar{border:1px solid rgba(214,177,87,.2);border-radius:16px;padding:18px;background:rgba(0,0,0,.24)}
.do-winner-pillar strong{display:block;margin-bottom:8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.do-winner-pillar span{display:block;font-family:Georgia,'Times New Roman',serif;font-size:16px;line-height:1.5;color:#e8dcc0}
.do-winner-plus{align-self:center;color:var(--brand-green);font-size:28px}
.do-winner-ecosystem-close{margin-top:clamp(22px,3.4vw,32px);display:grid;gap:8px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2.5vw,23px);line-height:1.45;letter-spacing:.035em;color:#f4ead4}
.do-winner-hope{display:block;margin:0 auto 12px;font-size:clamp(20px,2.9vw,28px);line-height:1.35;color:var(--gold);text-shadow:0 0 24px rgba(214,177,87,.12)}
.do-winner-closing{margin:clamp(46px,7vw,72px) auto clamp(34px,5vw,52px);display:grid;gap:clamp(14px,2.2vw,22px);font-family:Georgia,'Times New Roman',serif;letter-spacing:.04em;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 42%,#a76f1e 72%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text}
.do-winner-closing>span:first-child{font-size:clamp(21px,3.2vw,31px);line-height:1.35}
.do-winner-closing>span:last-child{font-size:clamp(24px,3.9vw,38px);line-height:1.24}
/* The closing slogan reuses the approved gold / neutral / green treatment from
   Our Values. .do-winner-closing paints one gold gradient through background-clip
   with transparent text, so the gradient is switched off on this line only —
   .wm-gold, .do-padel-community-neutral and .wm-green then supply their own
   -webkit-text-fill-color exactly as they do on the Our Values page. The direct
   child selectors above keep the two closing lines at their existing sizes now
   that the slogan line contains nested spans. */
.do-winner-closing>.do-winner-closing-slogan{background:none;-webkit-background-clip:border-box;background-clip:border-box}
body.do-winner-mode .do-padel-editorial-rule{width:104px;background:linear-gradient(90deg,transparent,rgba(152,216,58,.96),transparent);opacity:.95}
body.do-winner-mode .do-padel-powered{margin-top:clamp(44px,6vw,64px);padding-bottom:env(safe-area-inset-bottom);overflow:visible}
@media(max-width:680px){.do-winner-ecosystem{grid-template-columns:1fr}.do-winner-plus{display:none}.do-winner-section{border-radius:16px}}
/* DO→PADEL™ launch introduction and Media & Press area — this page only. Every
   selector below is a .do-media-* class that appears nowhere else in the
   application, so the hero, the approved introduction and the press area cannot
   reach another route or page. Colour, type scale, borders and rhythm are taken
   from the existing editorial language already used by .do-padel-editorial and
   .do-winner-section: deep black, gold headings, restrained green accents and
   soft neutral serif body copy. No new dependency and no animation library. */
.do-media-hero{max-width:900px;margin:0 auto clamp(54px,8.4vw,102px)}
.do-media-hero-mark{width:clamp(208px,32vw,332px);max-width:80vw;margin:0 auto clamp(22px,3.6vw,34px);filter:drop-shadow(0 20px 38px rgba(0,0,0,.6))}
.do-media-hero-mark img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.do-media-mark-philosophy{width:clamp(166px,24vw,246px);margin-bottom:clamp(18px,3.2vw,26px)}
.do-media-hero-title{margin:0 auto clamp(14px,2.4vw,20px);max-width:840px;font-weight:400;font-size:clamp(27px,5.1vw,50px);line-height:1.1;letter-spacing:.06em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 42%,#a76f1e 72%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 7px rgba(214,177,87,.08))}
.do-media-hero-line{display:block}
.do-media-hero-sub{margin:0 auto clamp(20px,3.2vw,28px);max-width:680px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2.9vw,27px);line-height:1.34;letter-spacing:.035em;color:#f4ead4}
.do-media-hero-lead{margin:0 auto clamp(28px,4.4vw,40px);max-width:660px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.8vw,16px);line-height:1.78;letter-spacing:.03em;color:#d8c79b}
.do-media-cta{display:inline-flex;align-items:center;gap:11px;padding:clamp(13px,1.8vw,16px) clamp(26px,3.6vw,38px);border:1px solid rgba(214,177,87,.42);border-radius:999px;background:linear-gradient(180deg,rgba(24,18,9,.86),rgba(6,6,6,.9));font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,1.5vw,13.5px);font-weight:700;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;color:var(--brand-gold);box-shadow:0 16px 38px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,235,180,.08);transition:border-color .22s ease,color .22s ease,transform .32s cubic-bezier(.2,.8,.22,1)}
.do-media-cta span{transition:transform .32s cubic-bezier(.2,.8,.22,1)}
.do-media-cta:hover,.do-media-cta:focus-visible{border-color:rgba(139,197,46,.6);color:#f6d77b}
.do-media-cta:hover span,.do-media-cta:focus-visible span{transform:translateY(3px)}
.do-media-hero-note{margin:clamp(18px,2.6vw,24px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,1.5vw,13.5px);letter-spacing:.05em;color:#a9986e}
.do-media-scroll{margin:clamp(30px,4.6vw,46px) auto 0;display:flex;flex-direction:column;align-items:center;gap:10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:rgba(139,197,46,.72)}
.do-media-scroll-line{width:1px;height:clamp(30px,4.6vw,44px);background:linear-gradient(180deg,rgba(139,197,46,.72),transparent)}
.do-media-block{max-width:820px;margin:0 auto clamp(48px,7.4vw,86px)}
.do-media-kicker{margin:0 0 clamp(12px,1.8vw,16px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.36em;text-transform:uppercase;color:var(--brand-green)}
.do-media-title{margin:0 auto clamp(22px,3.4vw,32px);font-weight:400;font-size:clamp(23px,4.2vw,40px);line-height:1.14;letter-spacing:.07em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 42%,#a76f1e 72%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text}
.do-media-block p{margin:0 0 clamp(15px,2.2vw,20px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.2vw,20px);line-height:1.66;letter-spacing:.02em;color:#eadfbd}
.do-media-block p:last-child{margin-bottom:0}
.do-media-couplet{margin:clamp(24px,3.6vw,34px) auto 0;padding-top:clamp(20px,3vw,28px);border-top:1px solid rgba(214,177,87,.22);display:grid;gap:8px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2.6vw,24px);line-height:1.4;letter-spacing:.035em;color:#f4ead4}
.do-media-emphasis{color:var(--gold);text-shadow:0 0 24px rgba(214,177,87,.12)}
.do-media-press{max-width:900px;margin:0 auto clamp(54px,8vw,96px);padding-top:clamp(34px,5vw,52px);border-top:1px solid rgba(214,177,87,.2)}
.do-media-press-intro{margin:0 auto clamp(34px,5.2vw,52px);max-width:700px}
.do-media-press-intro p{margin:0 0 clamp(14px,2vw,18px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.8vw,16px);line-height:1.78;letter-spacing:.03em;color:#d8c79b}
.do-media-press-intro p:last-child{margin-bottom:0}
.do-media-item{position:relative;max-width:860px;margin:0 auto clamp(18px,2.6vw,24px);padding:clamp(22px,3.4vw,32px);border:1px solid rgba(214,177,87,.22);border-radius:20px;background:linear-gradient(180deg,rgba(16,12,7,.72),rgba(4,4,4,.86));box-shadow:0 18px 48px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,235,180,.06);text-align:left}
.do-media-item-index{display:block;margin:0 0 10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.28em;color:var(--brand-green);opacity:.85}
.do-media-item h3{margin:0 0 clamp(14px,2vw,18px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(15px,2.1vw,19px);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-gold)}
.do-media-item p{margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15.5px,2.1vw,19px);line-height:1.64;letter-spacing:.02em;color:#eadfbd}
.do-media-item p:last-child{margin-bottom:0}
.do-media-action{display:inline-flex;align-items:center;gap:10px;margin-top:clamp(16px,2.4vw,22px);padding:12px clamp(20px,3vw,28px);border:1px solid rgba(139,197,46,.42);border-radius:999px;background:rgba(0,0,0,.3);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--brand-green);transition:border-color .22s ease,color .22s ease,background-color .22s ease}
.do-media-action:hover,.do-media-action:focus-visible{border-color:rgba(214,177,87,.6);color:var(--brand-gold);background:rgba(20,15,8,.6)}
.do-media-resources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.6vw,14px);margin-top:clamp(6px,1vw,10px)}
.do-media-resource{display:flex;flex-direction:column;gap:9px;padding:clamp(15px,2.2vw,19px);border:1px solid rgba(214,177,87,.18);border-radius:14px;background:rgba(0,0,0,.26)}
.do-media-resource-name{font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2vw,17px);line-height:1.42;letter-spacing:.02em;color:#f1e4bf}
.do-media-status{align-self:flex-start;padding:5px 12px;border:1px solid rgba(139,197,46,.34);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:rgba(139,197,46,.9)}
.do-media-status.is-available{border-color:rgba(214,177,87,.4);color:var(--brand-gold)}
a.do-media-status{text-decoration:none}
a.do-media-status:hover,a.do-media-status:focus-visible{border-color:rgba(139,197,46,.65)}
/* Approved launch detail inside a resource card. Deliberately quieter than the
   resource name above it, so the card layout, borders and spacing are untouched. */
.do-media-resource p.do-media-resource-detail{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.7vw,15px);line-height:1.7;letter-spacing:.025em;color:#d8c79b}
.do-media-resource-logo{margin:2px 0 0;width:100%;max-width:186px;filter:drop-shadow(0 12px 24px rgba(0,0,0,.5))}
.do-media-resource-logo img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.do-media-contact-lead{margin:0 0 clamp(16px,2.4vw,22px)}
.do-media-email{display:inline-block;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(18px,3.2vw,29px);font-weight:600;letter-spacing:.045em;text-decoration:none;color:var(--brand-gold);border-bottom:1px solid rgba(214,177,87,.4);padding-bottom:4px;word-break:break-word;transition:color .22s ease,border-color .22s ease}
.do-media-email:hover,.do-media-email:focus-visible{color:#f6d77b;border-color:rgba(139,197,46,.65)}
.do-media-coverage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.8vw,16px);margin-top:clamp(18px,2.6vw,24px)}
.do-media-coverage-panel{padding:clamp(18px,2.6vw,24px);border:1px solid rgba(214,177,87,.18);border-radius:16px;background:rgba(0,0,0,.26)}
.do-media-coverage-panel h4{margin:0 0 12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
/* Media & Press page furniture added for the press structure: approved strapline,
   the "in 60 seconds" summary, the five reasons, the differentiators, the resource
   placeholders, the two contact addresses and the two document downloads. Every
   selector stays inside the .do-media-* namespace used by this page alone. */
.do-media-strapline{margin:clamp(14px,2.2vw,20px) auto 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.7vw,15px);font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--brand-green)}
.do-media-section{max-width:900px;margin:0 auto clamp(52px,7.6vw,92px)}
.do-media-section-head{max-width:760px;margin:0 auto clamp(26px,3.8vw,38px)}
.do-media-lead{margin:0 auto;max-width:720px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.8vw,16px);line-height:1.78;letter-spacing:.03em;color:#d8c79b}
.do-media-summary{display:grid;gap:clamp(12px,1.8vw,16px)}
.do-media-summary-row{padding:clamp(20px,3.2vw,30px);border:1px solid rgba(214,177,87,.22);border-radius:20px;background:linear-gradient(180deg,rgba(16,12,7,.72),rgba(4,4,4,.86));box-shadow:0 18px 48px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,235,180,.06);text-align:left}
.do-media-summary-label{display:block;margin:0 0 clamp(10px,1.6vw,14px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--brand-green)}
.do-media-summary-row p{margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15.5px,2.1vw,19px);line-height:1.66;letter-spacing:.02em;color:#eadfbd}
.do-media-summary-row p:last-child{margin-bottom:0}
.do-media-points{display:grid;gap:clamp(10px,1.6vw,14px);margin:0;padding:0;list-style:none;text-align:left}
.do-media-point{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(14px,2.4vw,22px);align-items:start;padding:clamp(18px,2.8vw,26px);border:1px solid rgba(214,177,87,.2);border-radius:18px;background:rgba(0,0,0,.28)}
.do-media-point-index{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.2em;color:var(--brand-green);padding-top:4px;opacity:.85}
.do-media-point-name{display:block;margin:0 0 8px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.9vw,16.5px);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-gold)}
.do-media-point p{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2vw,18px);line-height:1.62;letter-spacing:.02em;color:#eadfbd}
.do-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.6vw,14px);text-align:left}
.do-media-panel{display:flex;flex-direction:column;gap:10px;padding:clamp(18px,2.8vw,26px);border:1px solid rgba(214,177,87,.2);border-radius:18px;background:linear-gradient(180deg,rgba(16,12,7,.66),rgba(4,4,4,.84));box-shadow:0 14px 36px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,235,180,.05)}
.do-media-panel-name{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.8vw,15.5px);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-gold)}
.do-media-panel p{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2vw,17.5px);line-height:1.62;letter-spacing:.02em;color:#eadfbd}
.do-media-contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.8vw,16px);margin-top:clamp(22px,3.2vw,30px);text-align:left}
.do-media-contact-single{max-width:640px;margin:clamp(22px,3.2vw,30px) auto 0;text-align:left}
.do-media-contact-card{display:flex;flex-direction:column;gap:10px;padding:clamp(20px,3vw,28px);border:1px solid rgba(214,177,87,.22);border-radius:18px;background:rgba(0,0,0,.3)}
.do-media-contact-role{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green)}
.do-media-contact-card .do-media-email{font-size:clamp(16px,2.4vw,22px)}
.do-media-contact-note{margin:8px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.7vw,14.5px);line-height:1.7;letter-spacing:.025em;color:#b8a678}
.do-media-downloads{max-width:900px;margin:0 auto clamp(46px,7vw,80px);padding-top:clamp(34px,5vw,52px);border-top:1px solid rgba(214,177,87,.2)}
.do-media-download-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.8vw,16px);text-align:left}
.do-media-download{display:flex;flex-direction:column;gap:12px;width:100%;padding:clamp(22px,3.2vw,30px);border:1px solid rgba(214,177,87,.32);border-radius:20px;background:linear-gradient(180deg,rgba(24,18,9,.82),rgba(5,5,5,.9));box-shadow:0 18px 44px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,235,180,.07);text-decoration:none;text-align:left;font:inherit;color:inherit;cursor:pointer;-webkit-appearance:none;appearance:none;transition:border-color .22s ease,background-color .22s ease}
.do-media-download:hover,.do-media-download:focus-visible{border-color:rgba(139,197,46,.55);background:linear-gradient(180deg,rgba(28,22,11,.9),rgba(6,6,6,.92))}
.do-media-download-label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.8vw,15px);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-gold)}
.do-media-download-desc{display:block;margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2vw,17.5px);line-height:1.62;letter-spacing:.02em;color:#eadfbd}
.do-media-download-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:2px}
.do-media-download-edition{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10.5px,1.4vw,11.5px);font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#8bc52e}
.do-media-download-spec{display:inline-flex;align-items:center;padding:4px 10px;border:1px solid rgba(214,177,87,.28);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10px,1.3vw,11px);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#cbb684}
/* THE CURRENT PACK IS ONE DOCUMENT IN TWO PARTS, SO IT IS DRAWN AS ONE OBJECT.
   The two part buttons live inside a single bordered, green-edged group under one
   edition header, and the header carries the date and the pack's total page count.
   Nobody should be able to read either part as a pack in its own right. */
.do-media-pack-current{grid-column:1/-1;display:flex;flex-direction:column;gap:clamp(16px,2.2vw,20px);padding:clamp(20px,3vw,28px);border:1px solid rgba(139,197,46,.42);border-radius:24px;background:linear-gradient(180deg,rgba(20,26,10,.72),rgba(5,6,4,.9));box-shadow:0 20px 50px rgba(0,0,0,.5),inset 0 1px 0 rgba(190,235,140,.08)}
.do-media-pack-head{display:flex;flex-direction:column;gap:8px}
.do-media-pack-edition{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,1.5vw,12.5px);font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:#8bc52e}
.do-media-pack-name{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(16px,2.4vw,21px);font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-gold)}
.do-media-pack-specs{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:4px 0 0}
.do-media-pack-note{margin:2px 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.5px,1.6vw,14px);line-height:1.7;letter-spacing:.03em;color:#cbb684}
.do-media-pack-note strong{color:#eadfbd}
.do-media-pack-parts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.8vw,16px)}
/* Inside the group the parts are quieter than the group itself, so the group reads
   as the pack and the buttons read as its two halves. */
.do-media-download.is-part{border-color:rgba(214,177,87,.26);background:linear-gradient(180deg,rgba(24,18,9,.7),rgba(5,5,5,.86))}
/* The archive sits underneath the current documents, across the full width, so the
   superseded pack reads as history rather than as an alternative to the current one. */
.do-media-download.is-archive{grid-column:1/-1;border-color:rgba(214,177,87,.18);background:linear-gradient(180deg,rgba(16,13,7,.7),rgba(4,4,4,.86))}
.do-media-download.is-archive .do-media-download-edition{color:#a9986e}
.do-media-download-note{margin:clamp(18px,2.6vw,24px) auto 0;max-width:720px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.5px,1.6vw,14px);line-height:1.7;letter-spacing:.03em;color:#a9986e}
/* Media download form — the small modal shown when either document is selected.
   Lives at the foot of #doWinnerPage so no transformed ancestor can affect the
   fixed positioning, and is hidden until one of the two tiles is used. */
.do-media-modal{position:fixed;inset:0;z-index:2600;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,40px)}
.do-media-modal[hidden]{display:none}
.do-media-modal-scrim{position:absolute;inset:0;background:rgba(2,2,2,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.do-media-modal-panel{position:relative;width:100%;max-width:520px;max-height:100%;overflow-y:auto;padding:clamp(24px,4vw,38px);border:1px solid rgba(214,177,87,.28);border-radius:26px;background:radial-gradient(circle at 18% 0%,rgba(139,197,46,.13),transparent 34%),linear-gradient(180deg,rgba(16,12,7,.97),rgba(4,4,4,.99));box-shadow:0 30px 80px rgba(0,0,0,.66),inset 0 1px 0 rgba(255,235,180,.10);text-align:left}
.do-media-modal-close{position:absolute;top:14px;right:14px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(214,177,87,.28);border-radius:999px;background:rgba(0,0,0,.4);color:#d8c79b;font:400 18px/1 'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;cursor:pointer;transition:border-color .22s ease,color .22s ease}
.do-media-modal-close:hover,.do-media-modal-close:focus-visible{border-color:rgba(139,197,46,.6);color:#f7f2e6}
.do-media-modal-kicker{margin:0 0 8px;padding-right:34px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--brand-green)}
.do-media-modal-title{margin:0;padding-right:34px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(18px,2.6vw,22px);font-weight:800;letter-spacing:.04em;background:linear-gradient(120deg,#8d5d16 0%,#f6d77b 42%,#a76f1e 72%,#f7dc84 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.do-media-modal-intro{margin:12px 0 0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(14.5px,1.9vw,16px);line-height:1.6;letter-spacing:.02em;color:#eadfbd}
.do-media-modal-form{display:grid;gap:14px;margin-top:clamp(18px,2.6vw,22px)}
.do-media-modal-form[hidden]{display:none}
.do-media-modal-field{display:flex;flex-direction:column;gap:7px}
.do-media-modal-field label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#d8c79b}
.do-media-modal-field input,.do-media-modal-field select{width:100%;border:1px solid rgba(214,177,87,.24);border-radius:14px;background:rgba(0,0,0,.3);color:#f7f2e6;padding:13px 14px;font:500 15px/1.4 'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;box-shadow:inset 0 1px 0 rgba(255,235,180,.05)}
.do-media-modal-field select{-webkit-appearance:none;appearance:none;cursor:pointer}
.do-media-modal-field input:focus,.do-media-modal-field select:focus{outline:none;border-color:rgba(139,197,46,.7);box-shadow:0 0 0 3px rgba(139,197,46,.12),inset 0 1px 0 rgba(255,235,180,.05)}
.do-media-modal-hint{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;line-height:1.5;letter-spacing:.02em;color:#8f8058;text-transform:none}
.do-media-modal-check{display:flex;align-items:flex-start;gap:11px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.55;letter-spacing:.02em;color:#d8c79b;cursor:pointer}
.do-media-modal-check input{flex:0 0 auto;width:17px;height:17px;margin-top:1px;accent-color:var(--brand-green);cursor:pointer}
.do-media-modal-error{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.55;letter-spacing:.02em;color:#e9a3a3}
.do-media-modal-error[hidden]{display:none}
.do-media-modal-submit{width:100%;padding:15px 22px;border:1px solid rgba(139,197,46,.5);border-radius:999px;background:linear-gradient(120deg,#4f7d18,#8bc52e 55%,#5c8e1c);color:#07130a;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;box-shadow:0 16px 34px rgba(0,0,0,.44);transition:filter .22s ease,border-color .22s ease}
.do-media-modal-submit:hover,.do-media-modal-submit:focus-visible{filter:brightness(1.06)}
.do-media-modal-submit[disabled]{cursor:default;filter:saturate(.35) brightness(.8)}
.do-media-modal-note{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;line-height:1.65;letter-spacing:.03em;color:#8f8058}
.do-media-modal-done{margin-top:clamp(18px,2.6vw,22px);display:grid;gap:14px}
.do-media-modal-done[hidden]{display:none}
.do-media-modal-done p{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2vw,16.5px);line-height:1.62;letter-spacing:.02em;color:#eadfbd}
.do-media-modal-done button{justify-self:start;padding:12px 26px;border:1px solid rgba(214,177,87,.34);border-radius:999px;background:rgba(0,0,0,.35);color:var(--brand-gold);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:border-color .22s ease}
.do-media-modal-done button:hover,.do-media-modal-done button:focus-visible{border-color:rgba(139,197,46,.6)}
body.do-winner-mode.do-media-modal-open{overflow:hidden}
@media(max-width:680px){
  .do-media-item{border-radius:16px}
  .do-media-resources,.do-media-coverage{grid-template-columns:1fr}
  .do-media-grid,.do-media-contact-grid,.do-media-download-grid,.do-media-pack-parts{grid-template-columns:1fr}
  .do-media-point{grid-template-columns:1fr;gap:10px}
  .do-media-point-index{padding-top:0}
  .do-media-hero-title{letter-spacing:.04em}
  .do-media-title{letter-spacing:.05em}
  .do-media-strapline{letter-spacing:.24em}
  .do-media-cta{width:100%;justify-content:center;letter-spacing:.16em}
  .do-media-action{width:100%;justify-content:center;letter-spacing:.14em}
  .do-media-modal{padding:14px;align-items:flex-start}
  .do-media-modal-panel{border-radius:20px}
}
@media(prefers-reduced-motion:reduce){.do-media-cta,.do-media-cta span,.do-media-action,.do-media-email,.do-media-download,.do-media-modal-close,.do-media-modal-submit,.do-media-modal-done button{transition:none}.do-media-cta:hover span,.do-media-cta:focus-visible span{transform:none}}
/* DO→PADEL™ Our Values — presentation for this page only. The .do-padel-value*
   and .do-padel-community-* classes are used by no other section, and the shared
   editorial hero rules are refined solely under body.do-padel-community-mode, so
   nothing here reaches another page. Premium comes from hierarchy, space and
   typography — no gradients, glass, glow or heavy shadows on the value entries. */
body.do-padel-community-mode .do-padel-editorial{padding-top:clamp(64px,11vh,118px)}
body.do-padel-community-mode .do-padel-editorial-kicker{margin-bottom:clamp(18px,2.6vw,24px);font-size:11.5px;letter-spacing:.44em}
body.do-padel-community-mode .do-padel-editorial-title{margin-bottom:clamp(24px,3.6vw,34px);font-size:clamp(31px,7.4vw,54px);line-height:1.14;letter-spacing:.05em;text-wrap:balance;overflow-wrap:break-word}
body.do-padel-community-mode .do-padel-editorial-sub{display:grid;justify-items:center;gap:clamp(7px,1vw,10px);max-width:min(100%,600px);margin-bottom:clamp(38px,5.2vw,54px);font-size:clamp(14px,1.75vw,15.5px);line-height:1.7;letter-spacing:.04em;color:rgba(226,213,181,.8);text-wrap:pretty}
body.do-padel-community-mode .do-padel-editorial-rule{margin-bottom:clamp(40px,5.6vw,60px)}
.do-padel-community-principle{margin-top:clamp(10px,1.6vw,16px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.5vw,21px);line-height:1.45;letter-spacing:.045em;color:rgba(224,187,99,.9)}
/* RESTORED OUR VALUES™ STATEMENT — the approved values line and its supporting line,
   returned from the authenticated hero to this page. Their typography, colour and glow
   come entirely from the classes they were published with, which are untouched; the only
   rule needed here is the group's own width, matched to the 600px measure the pair was
   published at. Nothing above or below the group moves. */
body.do-padel-community-mode .do-padel-community-values-statement{margin:0 auto;max-width:600px}
/* THE ORIGIN — a quiet, centred prelude. Serif for the personal lines, restrained
   gold for the question that started the platform. */
.do-padel-origin{max-width:660px;margin:0 auto clamp(46px,6.4vw,72px);text-align:center}
.do-padel-origin-title{margin:0 0 clamp(20px,2.8vw,28px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:clamp(12px,1.9vw,13.5px);letter-spacing:.42em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-origin-lead{margin:0 0 clamp(16px,2.2vw,22px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,2.7vw,22px);line-height:1.5;letter-spacing:.04em;color:#fff}
.do-padel-origin-body{margin:0 0 clamp(16px,2.2vw,22px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.75vw,15.5px);line-height:1.8;letter-spacing:.03em;color:rgba(238,232,218,.72);text-wrap:pretty}
.do-padel-origin-quote{margin:0 0 clamp(16px,2.2vw,22px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(17px,2.9vw,23px);line-height:1.5;letter-spacing:.03em;color:rgba(224,187,99,.94);text-wrap:balance}
.do-padel-origin-close{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2.2vw,18px);letter-spacing:.05em;color:#fff}
/* FOUNDER MARK — the existing DO→PADEL coin from the landing page closing the
   WHY DO→PADEL EXISTS section, before the charter. The same production artwork
   (assets/do-padel-club-badge.png), unmodified and at its own square ratio, held
   deliberately smaller than on the landing page so it reads as a restrained
   founder signature rather than a promotional mark. No frame, box, background or
   crop: the coin's own gold perimeter is the only edge. The caption beneath is
   unchanged and uses the same tracked uppercase Plus Jakarta Sans as the section
   titles. It scales fluidly, so mobile and desktop behaviour is preserved. */
.do-padel-origin-founder{margin:clamp(32px,4.4vw,46px) auto 0;text-align:center}
.do-padel-origin-coin{display:block;width:clamp(104px,24vw,138px);height:auto;aspect-ratio:1/1;margin:0 auto}
.do-padel-origin-caption{margin:clamp(11px,1.6vw,15px) 0 0}
.do-padel-origin-founder-name{display:block;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:clamp(11px,1.65vw,12.5px);letter-spacing:.34em;text-transform:uppercase;color:rgba(238,232,218,.92)}
.do-padel-origin-founder-role{display:block;margin-top:6px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(10.5px,1.5vw,11.5px);letter-spacing:.16em;color:rgba(238,232,218,.6)}
/* THE CHARTER — ONE FRAME, NOT TWELVE CARDS. A single hairline gold rectangle holds
   all five pillars with generous black space inside it; the pillars are separated by
   a hairline gold rule alone, and each carries a gold index numeral. Nothing inside
   is boxed, filled, shadowed or hoverable — the frame is the only container. */
.do-padel-charter{max-width:820px;margin:0 auto;border:1px solid rgba(214,177,87,.30);padding:clamp(30px,5vw,58px) clamp(20px,4.4vw,54px);text-align:left}
.do-padel-charter-title{margin:0 0 clamp(28px,4vw,42px);text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:500;font-size:clamp(12px,1.9vw,13.5px);letter-spacing:.42em;text-transform:uppercase;color:rgba(224,187,99,.95)}
.do-padel-pillars{list-style:none;margin:0;padding:0;display:grid}
.do-padel-pillar{display:grid;grid-template-columns:auto 1fr;gap:clamp(14px,2.6vw,26px);padding:clamp(20px,3vw,28px) 0}
.do-padel-pillar:first-child{padding-top:0}
.do-padel-pillar:last-child{padding-bottom:0}
.do-padel-pillar+.do-padel-pillar{border-top:1px solid rgba(214,177,87,.16)}
.do-padel-pillar-num{font-family:Georgia,'Times New Roman',serif;font-size:clamp(13px,1.9vw,15px);line-height:1.6;letter-spacing:.14em;color:rgba(214,177,87,.6)}
.do-padel-pillar-body{display:grid;gap:clamp(6px,.9vw,9px)}
.do-padel-pillar-name{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-weight:600;font-size:clamp(14.5px,2.1vw,17px);letter-spacing:.24em;text-transform:uppercase;color:#fff}
.do-padel-pillar-keys{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.5px,1.6vw,13.5px);letter-spacing:.14em;text-transform:uppercase;color:var(--brand-green)}
.do-padel-pillar-line{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13.5px,1.7vw,15px);line-height:1.7;letter-spacing:.02em;color:rgba(238,232,218,.68);text-wrap:pretty}
/* THE CLOSE — the invitation line above the signature. */
.do-padel-community-whoever{margin:clamp(52px,7.6vw,84px) auto 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,1.9vw,13.5px);letter-spacing:.30em;text-transform:uppercase;color:rgba(224,187,99,.9)}
/* The company line, standing in for the removed POWERED BY footer: legible, never loud. */
.do-padel-community-legal{margin:clamp(26px,3.6vw,34px) auto 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:400;letter-spacing:.14em;color:rgba(238,232,218,.62)}
.do-padel-community-close{margin:clamp(12px,1.8vw,18px) auto clamp(14px,2.2vw,20px);display:flex;flex-direction:column;gap:6px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(23px,5.4vw,38px);line-height:1.3;letter-spacing:.05em}
/* The hero heading and the closing signature share the approved word-by-word sequence from
   the DO master artwork shown on the gateway landing page (assets/do-master-logo-stronger.png):
   TOGETHER = brand gold, WE ARE = white, STRONGER = brand green. Gold and green are
   applied with the existing .wm-gold / .wm-green helpers so they cannot drift from the
   canonical palette; only the neutral middle segment needs a rule, scoped to this page.
   All three words share one size, weight and family — as in the artwork, colour alone
   carries the emphasis. */
.do-padel-community-neutral{color:#fff;-webkit-text-fill-color:#fff}
.do-padel-community-mark{margin:0 auto clamp(34px,5vw,48px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(14px,2.2vw,18px);letter-spacing:.06em}
@media(max-width:560px){.do-padel-charter{padding-left:18px;padding-right:18px}.do-padel-pillar{gap:12px}}

.sp-shell{position:fixed;inset:0;display:flex;flex-direction:column;background:radial-gradient(ellipse 80% 60% at 50% 40%,#0f0b05 0%,#050403 55%,#000 100%);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;overscroll-behavior:none;-webkit-user-select:none;user-select:none}
.sp-topbar{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(env(safe-area-inset-top) + 12px) clamp(14px,3vw,26px) 12px;background:linear-gradient(180deg,rgba(0,0,0,.72),transparent)}
.sp-back{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--gold);font-size:12px;letter-spacing:.16em;text-transform:uppercase;opacity:.82;transition:opacity .3s ease,transform .3s ease;background:none;border:0;cursor:pointer;font-family:inherit}
.sp-back:hover{opacity:1;transform:translateX(-2px)}
.sp-back .sp-back-arrow{font-size:17px;line-height:1}
.sp-deck-name{flex:1;text-align:center;font-family:Georgia,'Times New Roman',serif;font-size:clamp(11px,2.4vw,14px);letter-spacing:.20em;text-transform:uppercase;color:transparent;background:linear-gradient(120deg,#8d5d16,#f6d77b 46%,#a76f1e 78%,#f7dc84);-webkit-background-clip:text;background-clip:text;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-counter{min-width:58px;text-align:right;font-size:12px;letter-spacing:.14em;color:#d8c79b;font-variant-numeric:tabular-nums}
.sp-counter b{color:var(--gold);font-weight:600}

.sp-stage{position:relative;flex:1;min-height:0}
.sp-track{display:flex;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.sp-track::-webkit-scrollbar{display:none}
.sp-track.sp-zoomed{scroll-snap-type:none;overflow:hidden}
.sp-slide{flex:0 0 100%;width:100%;height:100%;scroll-snap-align:center;scroll-snap-stop:always;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(8px,2.2vw,26px);box-sizing:border-box;gap:clamp(16px,3vh,26px)}
.sp-frame{max-width:100%;max-height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:pan-x pinch-zoom}
.sp-frame img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:10px;box-shadow:0 24px 70px rgba(0,0,0,.7),0 0 0 1px rgba(214,177,87,.12);transform-origin:0 0;transition:transform .25s cubic-bezier(.2,.8,.22,1);will-change:transform}
.sp-frame.sp-panning img{transition:none}

.sp-infrastructure{width:min(1180px,100%);max-height:100%;overflow:auto;padding:clamp(12px,2vw,22px) clamp(10px,2vw,20px) clamp(28px,4vw,46px);scrollbar-width:thin;scrollbar-color:rgba(214,177,87,.36) rgba(0,0,0,.2)}
.sp-infrastructure-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,340px);gap:clamp(18px,4vw,54px);align-items:end;margin:0 auto clamp(18px,3vw,30px);text-align:left}
.sp-infrastructure-kicker{margin:0 0 10px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green)}
.sp-infrastructure-title{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(32px,5.5vw,64px);line-height:1.02;font-weight:400;letter-spacing:.03em;color:#f7f2e6}
.sp-infrastructure-copy{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.2vw,22px);line-height:1.5;color:#dacda8}
.sp-infrastructure-categories{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 clamp(16px,2.4vw,24px);padding:0;list-style:none}
.sp-infrastructure-category-btn{display:inline-flex;align-items:center;min-height:34px;padding:8px 12px;border:1px solid rgba(214,177,87,.2);border-radius:999px;background:rgba(0,0,0,.22);box-shadow:inset 0 1px 0 rgba(255,235,180,.05);font:700 10px/1.25 'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#d8c79b;cursor:pointer;transition:transform .22s ease,border-color .22s ease,background .22s ease,color .22s ease}
.sp-infrastructure-category-btn:hover,.sp-infrastructure-category-btn:focus-visible{transform:translateY(-1px);border-color:rgba(214,177,87,.46);color:#f4e8c6;outline:none}
.sp-infrastructure-category-btn.is-active{border-color:rgba(139,197,46,.62);background:rgba(139,197,46,.10);color:#eaf7d3;box-shadow:0 0 22px rgba(139,197,46,.12),inset 0 1px 0 rgba(255,255,255,.08)}
.sp-infrastructure-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(12px,1.7vw,18px);align-items:stretch;margin:0 0 clamp(16px,2.4vw,24px)}
.sp-infrastructure-card{grid-column:span 2;position:relative;display:flex;flex-direction:column;min-height:310px;padding:clamp(18px,2.2vw,24px);border:1px solid rgba(214,177,87,.22);border-radius:18px;background:linear-gradient(160deg,rgba(20,16,10,.88),rgba(3,5,3,.94));box-shadow:0 24px 58px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,235,180,.08);overflow:hidden;text-align:left}
.sp-infrastructure-card:nth-child(1),.sp-infrastructure-card:nth-child(2){grid-column:span 3}
.sp-infrastructure-card::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(139,197,46,.13),transparent 36%),radial-gradient(circle at 88% 0%,rgba(214,177,87,.14),transparent 30%);opacity:.9;pointer-events:none}
.sp-infrastructure-logo{position:relative;z-index:1;width:100%;height:68px;display:flex;align-items:center;justify-content:flex-start;margin-bottom:18px}
.sp-infrastructure-logo img{max-width:168px;max-height:58px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.45))}
.sp-infrastructure-logo-fallback{display:none;align-items:center;justify-content:center;width:58px;height:58px;border:1px solid rgba(214,177,87,.35);border-radius:14px;background:rgba(0,0,0,.28);font-family:Georgia,'Times New Roman',serif;font-size:20px;letter-spacing:.04em;color:var(--gold)}
.sp-infrastructure-card h3{position:relative;z-index:1;margin:0 0 10px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,2.8vw,30px);font-weight:400;line-height:1.1;color:#f7f2e6}
.sp-infrastructure-desc{position:relative;z-index:1;margin:0 0 18px;font-size:13.5px;line-height:1.65;color:#d8c79b}
.sp-infrastructure-meta{position:relative;z-index:1;display:grid;gap:9px;margin:auto 0 18px;padding-top:16px;border-top:1px solid rgba(214,177,87,.16)}
.sp-infrastructure-meta p{margin:0;font-size:11px;line-height:1.45;letter-spacing:.11em;text-transform:uppercase;color:#a99a76}
.sp-infrastructure-meta strong{display:block;margin-top:3px;font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.02em;text-transform:none;color:#f1e4bf;font-weight:400}
.sp-infrastructure-visit{position:relative;z-index:1;display:inline-flex;width:max-content;max-width:100%;align-items:center;gap:10px;padding:12px 18px;border:1px solid rgba(139,197,46,.58);border-radius:999px;background:rgba(139,197,46,.08);color:#eaf7d3;text-decoration:none;font-size:11px;letter-spacing:.16em;text-transform:uppercase;transition:transform .25s ease,background .25s ease,border-color .25s ease}
.sp-infrastructure-visit:hover,.sp-infrastructure-visit:focus-visible{transform:translateY(-2px);border-color:rgba(139,197,46,.9);background:rgba(139,197,46,.16);outline:none}
.sp-infrastructure-actions{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.sp-infrastructure-profile{position:relative;z-index:1;display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border:1px solid rgba(214,177,87,.65);border-radius:999px;background:linear-gradient(135deg,rgba(224,187,99,.95),rgba(241,212,136,.82));color:#1a1406;text-decoration:none;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;transition:transform .25s ease,box-shadow .25s ease,filter .25s ease}
.sp-infrastructure-profile:hover,.sp-infrastructure-profile:focus-visible{transform:translateY(-2px);box-shadow:0 14px 30px rgba(214,177,87,.34);filter:brightness(1.05);outline:none}
.sp-infrastructure-empty{grid-column:1/-1;position:relative;min-height:300px;display:grid;place-items:center;padding:clamp(28px,5vw,54px);border:1px solid rgba(214,177,87,.24);border-radius:22px;background:radial-gradient(circle at 50% 0%,rgba(139,197,46,.12),transparent 42%),linear-gradient(145deg,rgba(20,16,10,.88),rgba(3,5,3,.94));box-shadow:0 24px 58px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,235,180,.08);text-align:center;overflow:hidden}
.sp-infrastructure-empty::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(214,177,87,.12),transparent 42%);pointer-events:none}
.sp-infrastructure-empty-inner{position:relative;z-index:1;max-width:640px}
.sp-infrastructure-empty h3{margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(26px,4vw,42px);line-height:1.12;font-weight:400;color:#f7f2e6}
.sp-infrastructure-empty p{margin:0 auto 22px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2vw,19px);line-height:1.5;color:#dacda8}
.sp-infrastructure-cta{position:relative;margin:clamp(16px,2.6vw,26px) 0 0;padding:clamp(20px,3vw,30px);border:1px solid rgba(214,177,87,.24);border-radius:18px;background:linear-gradient(135deg,rgba(16,12,7,.84),rgba(3,6,3,.92));box-shadow:0 24px 58px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,235,180,.08);overflow:hidden;text-align:center}
.sp-infrastructure-cta::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(139,197,46,.12),transparent 42%),radial-gradient(circle at 50% 0%,rgba(214,177,87,.16),transparent 34%);pointer-events:none}
.sp-infrastructure-cta h3{position:relative;z-index:1;margin:0 0 8px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(24px,3.6vw,38px);line-height:1.12;font-weight:400;color:#f7f2e6}
.sp-infrastructure-cta p{position:relative;z-index:1;margin:0 auto 18px;max-width:620px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(15px,2vw,19px);line-height:1.5;color:#dacda8}
.sp-infrastructure-cta .sp-partner-btn{position:relative;z-index:1}
.sp-know{display:grid;gap:clamp(12px,1.7vw,18px);margin:0 0 clamp(16px,2.4vw,24px)}
.sp-know-hero{position:relative;padding:clamp(18px,2.2vw,24px);border:1px solid rgba(214,177,87,.22);border-radius:18px;background:linear-gradient(160deg,rgba(20,16,10,.88),rgba(3,5,3,.94));box-shadow:0 24px 58px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,235,180,.08);overflow:hidden;text-align:left}
.sp-know-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(139,197,46,.13),transparent 36%),radial-gradient(circle at 88% 0%,rgba(214,177,87,.14),transparent 30%);opacity:.9;pointer-events:none}
.sp-know-kicker{position:relative;z-index:1;margin:0 0 10px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green)}
.sp-know-hero h3{position:relative;z-index:1;margin:0 0 10px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,2.8vw,30px);font-weight:400;line-height:1.1;color:#f7f2e6}
.sp-know-lede{position:relative;z-index:1;margin:0;font-size:13.5px;line-height:1.65;color:#d8c79b}
.sp-know-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:9px;margin:18px 0 0;padding-top:16px;border-top:1px solid rgba(214,177,87,.16);list-style:none}
.sp-know-stats li{margin:0;font-size:11px;line-height:1.45;letter-spacing:.11em;text-transform:uppercase;color:#a99a76}
.sp-know-stats strong{display:block;margin-top:3px;font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.02em;text-transform:none;color:#f1e4bf;font-weight:400}
.sp-know-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.7vw,18px);align-items:stretch}
.sp-know-block{position:relative;display:flex;flex-direction:column;padding:clamp(18px,2.2vw,24px);border:1px solid rgba(214,177,87,.22);border-radius:18px;background:linear-gradient(160deg,rgba(20,16,10,.88),rgba(3,5,3,.94));box-shadow:0 24px 58px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,235,180,.08);overflow:hidden;text-align:left}
.sp-know-block.is-wide{grid-column:1/-1}
.sp-know-block::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(139,197,46,.08),transparent 40%);pointer-events:none}
.sp-know-block h4{position:relative;z-index:1;margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(19px,2.2vw,24px);font-weight:400;line-height:1.14;color:#f7f2e6}
.sp-know-block p{position:relative;z-index:1;margin:0 0 12px;font-size:13.5px;line-height:1.65;color:#d8c79b}
.sp-know-block p:last-child{margin-bottom:0}
.sp-know-defs{position:relative;z-index:1;display:grid;gap:12px;margin:0;padding:0}
.sp-know-defs dt{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.02em;color:#f1e4bf;font-weight:400}
.sp-know-defs dd{margin:3px 0 0;font-size:13px;line-height:1.62;color:#d8c79b}
.sp-know-steps{position:relative;z-index:1;display:grid;gap:12px;margin:0;padding:0 0 0 20px;list-style:decimal}
.sp-know-steps li{margin:0;font-size:13px;line-height:1.62;color:#d8c79b}
.sp-know-steps b{display:block;font-family:Georgia,'Times New Roman',serif;font-size:15px;font-weight:400;letter-spacing:.02em;color:#f1e4bf}
.sp-know-table{position:relative;z-index:1;display:grid;gap:0;margin:0}
.sp-know-row{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:10px 18px;padding:14px 0;border-top:1px solid rgba(214,177,87,.16)}
.sp-know-row:first-child{border-top:0;padding-top:0}
.sp-know-row-item{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.02em;color:#f1e4bf}
.sp-know-row-item span{display:block;margin-top:4px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:12.5px;line-height:1.6;color:#a99a76}
.sp-know-row-value{margin:0;font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:#a99a76;text-align:right}
.sp-know-row-value strong{display:block;margin-top:3px;font-family:Georgia,'Times New Roman',serif;font-size:15px;letter-spacing:.02em;text-transform:none;color:#eaf7d3;font-weight:400}
.sp-know-faq{position:relative;z-index:1;display:grid;gap:0}
.sp-know-faq details{border-top:1px solid rgba(214,177,87,.16)}
.sp-know-faq details:first-child{border-top:0}
.sp-know-faq summary{padding:14px 0;font-family:Georgia,'Times New Roman',serif;font-size:15.5px;letter-spacing:.02em;color:#f1e4bf;cursor:pointer;list-style:none;transition:color .22s ease}
.sp-know-faq summary::-webkit-details-marker{display:none}
.sp-know-faq summary::after{content:"+";float:right;margin-left:12px;color:var(--brand-green)}
.sp-know-faq details[open] summary::after{content:"\2013"}
.sp-know-faq summary:hover,.sp-know-faq summary:focus-visible{color:#f7f2e6;outline:none}
.sp-know-faq details p{margin:0 0 14px;font-size:13px;line-height:1.65;color:#d8c79b}
.sp-know-cases{position:relative;z-index:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.sp-know-case{padding:16px;border:1px solid rgba(214,177,87,.16);border-radius:14px;background:rgba(0,0,0,.22)}
.sp-know-case-tag{margin:0 0 8px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-green)}
.sp-know-case b{display:block;margin:0 0 6px;font-family:Georgia,'Times New Roman',serif;font-size:15.5px;font-weight:400;letter-spacing:.02em;color:#f1e4bf}
.sp-know-case p{margin:0;font-size:12.5px;line-height:1.6;color:#a99a76}
.sp-know-note{position:relative;z-index:1;margin:14px 0 0;padding-top:14px;border-top:1px solid rgba(214,177,87,.16);font-size:11px;line-height:1.6;letter-spacing:.06em;color:#a99a76}
.sp-know-lead{display:grid;gap:8px;margin:clamp(4px,1vw,10px) 0 0}
.sp-know-lead h3{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,2.8vw,30px);font-weight:400;line-height:1.1;color:#f7f2e6}
.sp-know-lead p{margin:0;font-size:13.5px;line-height:1.65;color:#d8c79b}
.do-padel-infrastructure-page{min-height:100vh;padding:clamp(48px,8vh,82px) 14px calc(44px + env(safe-area-inset-bottom));background:radial-gradient(ellipse 80% 60% at 50% 22%,rgba(139,197,46,.12),transparent 30%),radial-gradient(circle at 12% 18%,rgba(214,177,87,.12),transparent 20%),linear-gradient(180deg,#020302 0%,#050403 58%,#000 100%);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif}
.do-padel-infrastructure-page .sp-infrastructure{width:min(1180px,100%);max-height:none;margin:0 auto;overflow:visible;padding:0}

/* BECOME A PARTNER — official DO→PADEL green button beneath the final page (brand-consistent with the DO→PADEL card green #8bc52e) */
.sp-partner-wrap{flex:0 0 auto;display:flex;justify-content:center;padding-top:2px}
.sp-partner-btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:15px 40px;border:0;border-radius:999px;cursor:pointer;font-family:Georgia,'Times New Roman',serif;font-size:clamp(13px,2.4vw,16px);letter-spacing:.22em;text-transform:uppercase;color:#fff;text-decoration:none;background:linear-gradient(120deg,#78bd29 0%,#8bc52e 34%,#8ccf36 50%,#8bc52e 66%,#78bd29 100%);background-size:200% 100%;box-shadow:0 12px 34px rgba(0,0,0,.6),0 0 32px rgba(139,197,46,.45),inset 0 1px 0 rgba(255,255,255,.28);transition:transform .35s cubic-bezier(.2,.8,.22,1),box-shadow .35s ease,background-position .6s ease,filter .35s ease;font-weight:700}
.sp-partner-btn:hover{transform:translateY(-2px);background-position:100% 0;filter:brightness(1.08);box-shadow:0 18px 44px rgba(0,0,0,.7),0 0 48px rgba(140,207,54,.62),inset 0 1px 0 rgba(255,255,255,.34)}
.sp-partner-btn:active{transform:translateY(0);filter:brightness(1.04);box-shadow:0 10px 28px rgba(0,0,0,.6),0 0 34px rgba(140,207,54,.5),inset 0 1px 0 rgba(255,255,255,.28)}
.do-padel-partner-form-wrap{max-width:920px;margin:0 auto;text-align:left}
.do-padel-partner-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:clamp(22px,4vw,40px);border:1px solid rgba(214,177,87,.24);border-radius:28px;background:radial-gradient(circle at 18% 0%,rgba(139,197,46,.14),transparent 34%),linear-gradient(180deg,rgba(16,12,7,.76),rgba(4,4,4,.9));box-shadow:0 28px 76px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,235,180,.10)}
.do-padel-partner-field{display:grid;gap:8px}
.do-padel-partner-field.is-wide{grid-column:1/-1}
.do-padel-partner-field label{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d8c79b}
.do-padel-partner-field input,.do-padel-partner-field select,.do-padel-partner-field textarea{width:100%;border:1px solid rgba(214,177,87,.24);border-radius:14px;background:rgba(0,0,0,.30);color:#f7f2e6;padding:13px 14px;font:500 15px/1.4 'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;box-shadow:inset 0 1px 0 rgba(255,235,180,.05)}
.do-padel-partner-field textarea{min-height:144px;resize:vertical}
.do-padel-partner-field input:focus,.do-padel-partner-field select:focus,.do-padel-partner-field textarea:focus{outline:none;border-color:rgba(139,197,46,.7);box-shadow:0 0 0 3px rgba(139,197,46,.12),inset 0 1px 0 rgba(255,235,180,.07)}
.do-padel-partner-submit{grid-column:1/-1;justify-self:center;margin-top:8px}
.do-padel-partner-note{grid-column:1/-1;margin:0;text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.5;color:#d8c79b}

/* Discreet Previous / Next controls */
.sp-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:clamp(40px,7vw,54px);height:clamp(40px,7vw,54px);display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(214,177,87,.28);background:rgba(8,7,4,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--gold);font-size:26px;line-height:1;cursor:pointer;opacity:.55;transition:opacity .3s ease,transform .3s ease,border-color .3s ease,background .3s ease;font-family:Georgia,serif;padding-bottom:3px}
.sp-nav:hover{opacity:1;border-color:rgba(214,177,87,.6);background:rgba(14,11,5,.7)}
.sp-nav:active{transform:translateY(-50%) scale(.94)}
.sp-nav[disabled]{opacity:0;pointer-events:none}
.sp-prev{left:clamp(8px,2vw,22px)}
.sp-next{right:clamp(8px,2vw,22px)}

/* Progress dots */
.sp-dots{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom) + 12px);z-index:5;display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;padding:0 20px;pointer-events:none}
.sp-dot{width:6px;height:6px;border-radius:50%;background:rgba(214,177,87,.28);transition:background .3s ease,transform .3s ease}
.sp-dot.sp-dot-on{background:var(--gold);transform:scale(1.5);box-shadow:0 0 10px rgba(214,177,87,.6)}
.sp-hint{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom) + 30px);z-index:5;text-align:center;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:rgba(216,199,155,.5);pointer-events:none;transition:opacity .6s ease}
.sp-hint.sp-hint-hide{opacity:0}

@media(max-width:640px){
.sp-deck-name{letter-spacing:.14em}
.sp-dots{gap:5px}
.sp-slide{gap:14px}
.sp-infrastructure-head{grid-template-columns:1fr}
.sp-infrastructure-categories{gap:7px}
.sp-infrastructure-categories li{min-height:31px;padding:7px 10px;font-size:9px}
.sp-infrastructure-grid{grid-template-columns:1fr}
.sp-infrastructure-card,.sp-infrastructure-card:nth-child(1),.sp-infrastructure-card:nth-child(2){grid-column:auto}
.sp-know-grid{grid-template-columns:1fr}
.sp-know-row{grid-template-columns:1fr}
.sp-know-row-value{text-align:left}
.do-padel-partner-form{grid-template-columns:1fr;border-radius:22px}
}
/* Landscape phone — maximise the page, hide chrome that steals height */
@media(max-height:520px) and (orientation:landscape){
.sp-topbar{padding-top:calc(env(safe-area-inset-top) + 6px);padding-bottom:6px}
.sp-deck-name{display:none}
.sp-dots{display:none}
.sp-hint{display:none}
.sp-slide{padding:6px clamp(44px,9vw,64px)}
.sp-partner-wrap{padding-top:0}
.sp-partner-btn{padding:10px 28px}
}

/* ── PADEL FUN SHOTS ─────────────────────────────────────────────────────────
   The monthly themed member photo feature. Every rule below is scoped to
   #doPadelFunShots or to body.do-padel-fun-shots-mode, so nothing outside this
   one destination can be reached by it. The shell, kicker, title, rule, back
   link and powered line are the shared DO→PADEL editorial components, inherited
   as they are; only the theme line, the two photographs, their captions and the
   submission block are described here. Restrained on purpose — the '80s images
   are the only colour on the page. */
#doPadelFunShots{display:none}
body.do-padel-fun-shots-mode #introOverlay,
body.do-padel-fun-shots-mode #sampleOverlay,
body.do-padel-fun-shots-mode #mainApp,
body.do-padel-fun-shots-mode #doPlatformGateway,
body.do-padel-fun-shots-mode #doPadelPlaceholder,
body.do-padel-fun-shots-mode #doPadelIntent{display:none !important}
body.do-padel-fun-shots-mode::before{display:none}
body.do-padel-fun-shots-mode #doPadelFunShots{display:block}
#doPadelFunShots .do-padel-editorial{background:
  radial-gradient(circle at 50% 4%,rgba(139,197,46,.08),transparent 25%),
  radial-gradient(circle at 12% 32%,rgba(214,177,87,.08),transparent 24%),
  linear-gradient(180deg,#050505 0%,#080704 48%,#030303 100%)}
#doPadelFunShots .do-padel-editorial-inner{max-width:940px}
#doPadelFunShots .do-fun-logo{display:block;width:clamp(74px,10vw,98px);height:auto;margin:0 auto clamp(18px,2.6vw,24px);border-radius:50%}
#doPadelFunShots .do-padel-editorial-sub{margin-bottom:clamp(24px,3.4vw,32px)}
#doPadelFunShots .do-padel-editorial-rule{width:112px;background:linear-gradient(90deg,transparent,var(--brand-green),var(--gold),transparent);box-shadow:0 0 20px rgba(139,197,46,.2)}
#doPadelFunShots .do-fun-theme{margin:0 0 clamp(26px,3.6vw,34px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12px,1.9vw,15px);font-weight:700;letter-spacing:.2em;line-height:1.5;text-transform:uppercase;color:var(--gold)}
#doPadelFunShots .do-fun-intro{max-width:640px;margin:0 auto clamp(40px,5.6vw,60px)}
#doPadelFunShots .do-fun-intro p:not(.do-fun-lead):not(.do-fun-note){margin:0 0 clamp(14px,2vw,18px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,1.8vw,16px);line-height:1.75;letter-spacing:.035em;color:#d8c79b}
#doPadelFunShots .do-fun-lead{margin:0 0 clamp(20px,2.8vw,26px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(19px,2.8vw,26px);line-height:1.4;letter-spacing:.02em;color:#f0e6cd}
#doPadelFunShots .do-fun-note{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(11px,1.5vw,12px);font-weight:700;line-height:1.7;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-green)}
#doPadelFunShots .do-fun-shot{margin:0 auto clamp(44px,6vw,68px);padding:0;max-width:640px}
#doPadelFunShots .do-fun-shot img{display:block;width:100%;height:auto;border:1px solid rgba(214,177,87,.28);border-radius:20px;background:#000;box-shadow:0 26px 68px rgba(0,0,0,.6)}
#doPadelFunShots .do-fun-caption{display:grid;gap:5px;margin:clamp(14px,2vw,18px) 0 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;text-align:center}
#doPadelFunShots .do-fun-caption-title{font-size:10px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:rgba(242,212,137,.9)}
#doPadelFunShots .do-fun-caption-sub{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(216,199,155,.66)}
#doPadelFunShots .do-fun-submit{max-width:640px;margin:0 auto clamp(44px,6vw,68px);padding:clamp(26px,4vw,46px);border:1px solid rgba(214,177,87,.28);border-radius:24px;background:linear-gradient(150deg,rgba(20,15,8,.9),rgba(4,4,4,.95));box-shadow:0 26px 68px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,237,185,.06)}
#doPadelFunShots .do-fun-submit-title{margin:0 0 clamp(20px,3vw,26px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(14px,2.1vw,19px);font-weight:700;letter-spacing:.16em;line-height:1.32;text-transform:uppercase;color:var(--gold)}
#doPadelFunShots .do-fun-submit-intro,
#doPadelFunShots .do-fun-submit-copy,
#doPadelFunShots .do-fun-consent{margin:0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.7vw,15px);line-height:1.72;letter-spacing:.035em;color:#d8c79b}
#doPadelFunShots .do-fun-email{margin:clamp(10px,1.6vw,14px) 0 clamp(24px,3.4vw,32px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2.8vw,26px);line-height:1.3;word-break:break-word}
#doPadelFunShots .do-fun-email a{color:var(--brand-green);text-decoration:none;border-bottom:1px solid rgba(139,197,46,.38);padding-bottom:2px;transition:border-color .2s ease,color .2s ease}
#doPadelFunShots .do-fun-email a:hover,
#doPadelFunShots .do-fun-email a:focus-visible{color:#a9de4d;border-color:rgba(139,197,46,.8);outline:none}
#doPadelFunShots .do-fun-submit-label{margin:0 0 clamp(10px,1.6vw,14px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-green)}
#doPadelFunShots .do-fun-list{margin:0 0 clamp(24px,3.4vw,32px);padding:0;list-style:none;display:grid;gap:10px;text-align:left}
#doPadelFunShots .do-fun-list li{position:relative;padding-left:20px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.7vw,15px);line-height:1.6;letter-spacing:.03em;color:#d8c79b}
#doPadelFunShots .do-fun-list li::before{content:"\2022";position:absolute;left:2px;top:0;color:var(--gold)}
#doPadelFunShots .do-fun-submit-copy{margin-bottom:clamp(24px,3.4vw,32px)}
#doPadelFunShots .do-fun-submit-promise{margin:0 0 clamp(22px,3.2vw,28px);font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,2.2vw,20px);line-height:1.45;letter-spacing:.02em;color:#f0e6cd}
#doPadelFunShots .do-fun-submit-title{margin-bottom:clamp(12px,1.8vw,15px)}
#doPadelFunShots .do-fun-send-wrap{margin:0 0 clamp(24px,3.4vw,32px)}
#doPadelFunShots .do-fun-send{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:14px clamp(22px,3.4vw,32px);border:1px solid rgba(242,212,137,.62);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:#f7f2e6;cursor:pointer;background:linear-gradient(175deg,#385f24 0%,#32551f 42%,#2c4b1b 72%,#274317 100%);box-shadow:0 14px 34px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,235,180,.1);transition:transform .24s cubic-bezier(.2,.8,.22,1),border-color .18s ease,box-shadow .18s ease}
#doPadelFunShots .do-fun-send:hover,
#doPadelFunShots .do-fun-send:focus-visible{transform:translateY(-2px);border-color:rgba(242,212,137,.9);box-shadow:0 18px 40px rgba(0,0,0,.6),0 0 26px rgba(139,197,46,.16),inset 0 1px 0 rgba(255,235,180,.14);outline:none}
#doPadelFunShots .do-fun-send:active{transform:translateY(0) scale(.99)}
#doPadelFunShots .do-fun-consent{padding-top:clamp(20px,3vw,26px);border-top:1px solid rgba(214,177,87,.2);font-size:clamp(12px,1.55vw,13px);color:rgba(216,199,155,.78)}
#doPadelFunShots .do-fun-submit .do-fun-note{margin:clamp(16px,2.4vw,20px) 0 0}
@media(max-width:560px){
#doPadelFunShots .do-fun-submit{padding:22px 18px;border-radius:20px}
#doPadelFunShots .do-fun-shot img{border-radius:16px}
}
/* ── PADEL HOLIDAYS WORLDWIDE ─────────────────────────────────────────────────
   Button 19's destination. Every rule below is scoped to #doPadelHolidays or to
   body.do-padel-holidays-mode, so nothing outside this one destination can be
   reached by it. The shell, kicker, title, rule, lead, back link and powered
   line are the shared DO→PADEL editorial components, inherited as they are; only
   the discovery filters and the operator cards are described here, in the same
   black, gold and restrained green. */
#doPadelHolidays{display:none}
body.do-padel-holidays-mode #introOverlay,
body.do-padel-holidays-mode #sampleOverlay,
body.do-padel-holidays-mode #mainApp,
body.do-padel-holidays-mode #doPlatformGateway,
body.do-padel-holidays-mode #doPadelPlaceholder,
body.do-padel-holidays-mode #doPadelIntent{display:none !important}
body.do-padel-holidays-mode::before{display:none}
body.do-padel-holidays-mode #doPadelHolidays{display:block}
#doPadelHolidays .do-padel-editorial{align-items:flex-start;background:
  radial-gradient(circle at 50% 4%,rgba(139,197,46,.08),transparent 25%),
  radial-gradient(circle at 88% 30%,rgba(214,177,87,.08),transparent 24%),
  linear-gradient(180deg,#050505 0%,#080704 48%,#030303 100%)}
#doPadelHolidays .do-padel-editorial-inner{max-width:980px}
#doPadelHolidays .do-hol-logo{display:block;width:clamp(74px,10vw,98px);height:auto;margin:0 auto clamp(18px,2.6vw,24px);border-radius:50%}
#doPadelHolidays .do-padel-editorial-sub{margin-bottom:clamp(24px,3.4vw,32px);font-size:clamp(11px,1.5vw,13px);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#f2d489}
#doPadelHolidays .do-padel-editorial-rule{width:112px;background:linear-gradient(90deg,transparent,var(--brand-green),var(--gold),transparent);box-shadow:0 0 20px rgba(139,197,46,.2)}
#doPadelHolidays .do-hol-journey{display:grid;gap:10px;max-width:620px;margin:0 auto clamp(30px,4.4vw,44px);padding:clamp(16px,2.4vw,20px) clamp(18px,2.8vw,26px);border:1px solid rgba(214,177,87,.24);border-radius:18px;background:rgba(10,9,6,.55);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(12.5px,1.6vw,14px);line-height:1.6;letter-spacing:.03em;color:rgba(216,199,155,.92);text-align:left}
#doPadelHolidays .do-hol-journey strong{font-weight:700;letter-spacing:.14em;color:#f2d489}
#doPadelHolidays .do-hol-journey a{color:inherit;text-decoration:none}
#doPadelHolidays .do-hol-filter{margin:0 auto clamp(14px,2vw,18px);max-width:860px}
#doPadelHolidays .do-hol-filter-label{display:block;margin:0 0 10px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--brand-green)}
#doPadelHolidays .do-hol-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
#doPadelHolidays .do-hol-chip{appearance:none;cursor:pointer;min-height:36px;padding:8px 15px;border:1px solid rgba(242,212,137,.34);border-radius:999px;background:rgba(10,9,6,.6);color:#e9dcb6;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;transition:border-color .18s ease,color .18s ease,background .18s ease}
#doPadelHolidays .do-hol-chip:hover,#doPadelHolidays .do-hol-chip:focus-visible{border-color:rgba(242,212,137,.8);color:#f2d489;outline:none}
#doPadelHolidays .do-hol-chip[aria-pressed="true"]{border-color:rgba(242,212,137,.9);background:rgba(214,177,87,.14);color:#f2d489}
#doPadelHolidays .do-hol-chips.is-countries{margin-top:10px}
#doPadelHolidays .do-hol-chips.is-countries .do-hol-chip{min-height:32px;padding:6px 12px;font-size:10.5px;letter-spacing:.12em}
#doPadelHolidays .do-hol-count{margin:clamp(18px,2.6vw,24px) 0 clamp(16px,2.4vw,22px);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(189,173,132,.8)}
#doPadelHolidays .do-hol-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,2.2vw,22px);text-align:left}
#doPadelHolidays .do-hol-card{display:flex;flex-direction:column;padding:clamp(20px,3vw,28px);border:1px solid rgba(242,212,137,.42);border-radius:22px;background:linear-gradient(175deg,rgba(20,18,12,.92) 0%,rgba(8,8,6,.96) 100%);box-shadow:0 20px 50px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,235,180,.08)}
#doPadelHolidays .do-hol-card-name{margin:0 0 8px;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(20px,2.6vw,25px);line-height:1.2;letter-spacing:.04em;color:#f2d489}
#doPadelHolidays .do-hol-card-partner{display:inline-block;margin:0 0 10px;padding:4px 10px;border:1px solid rgba(139,197,46,.6);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-green);align-self:flex-start}
#doPadelHolidays .do-hol-card-where{margin:0 0 12px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:600;line-height:1.7;letter-spacing:.14em;text-transform:uppercase;color:rgba(216,199,155,.9)}
#doPadelHolidays .do-hol-card-desc{margin:0 0 14px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:clamp(13px,1.6vw,14.5px);line-height:1.65;letter-spacing:.02em;color:rgba(247,242,230,.88)}
#doPadelHolidays .do-hol-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:0;list-style:none}
#doPadelHolidays .do-hol-tags li{padding:4px 10px;border:1px solid rgba(139,197,46,.34);border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(200,232,150,.9)}
#doPadelHolidays .do-hol-benefit{margin:0 0 18px;padding:14px 16px;border:1px solid rgba(139,197,46,.5);border-radius:14px;background:rgba(139,197,46,.06);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.55;color:rgba(247,242,230,.92)}
#doPadelHolidays .do-hol-benefit-label{display:block;margin:0 0 6px;font-size:9.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-green)}
#doPadelHolidays .do-hol-benefit-code{font-weight:700;letter-spacing:.14em;color:#f2d489}
#doPadelHolidays .do-hol-visit{margin-top:auto;display:inline-flex;align-items:center;gap:10px;align-self:flex-start;min-height:44px;padding:11px 20px;border:1px solid rgba(242,212,137,.62);border-radius:999px;color:#f2d489;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;transition:border-color .18s ease,transform .18s ease}
#doPadelHolidays .do-hol-cta-row{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:14px}
#doPadelHolidays .do-hol-cta-row .do-hol-visit{margin-top:0;align-self:center;flex:0 1 auto;min-width:0}
#doPadelHolidays .do-hol-coin{flex:0 0 auto;display:block;width:65px;height:65px;border-radius:50%;object-fit:contain}
@media(min-width:641px){#doPadelHolidays .do-hol-coin{width:76px;height:76px}}
#doPadelHolidays .do-hol-journey2{max-width:620px;margin:clamp(34px,5vw,52px) auto 0;padding:clamp(22px,3.4vw,30px) clamp(18px,2.8vw,26px);border:1px solid rgba(214,177,87,.24);border-radius:18px;background:rgba(10,9,6,.55);text-align:center;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif}
#doPadelHolidays .do-hol-journey2-title{margin:0 0 8px;font-size:clamp(13px,1.8vw,15px);font-weight:700;letter-spacing:.18em;color:#f2d489}
#doPadelHolidays .do-hol-journey2-sub{margin:0 0 18px;font-size:clamp(12.5px,1.6vw,14px);line-height:1.6;color:rgba(245,238,220,.82)}
#doPadelHolidays .do-hol-journey2-cta{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:11px 22px;border:1px solid rgba(242,212,137,.62);border-radius:999px;color:#f2d489;font-size:11px;font-weight:700;letter-spacing:.2em;text-decoration:none}
#doPadelHolidays .do-hol-journey2-cta:hover,#doPadelHolidays .do-hol-journey2-cta:focus-visible{border-color:rgba(242,212,137,.95);outline:none}
#doPadelHolidays .do-hol-journey2-paths{list-style:none;margin:20px 0 0;padding:16px 0 0;border-top:1px solid rgba(214,177,87,.18);display:grid;gap:8px;font-size:12.5px;line-height:1.6;color:rgba(245,238,220,.72)}
#doPadelHolidays .do-hol-journey2-paths strong{color:#f2d489;font-weight:600}
#doPadelHolidays .do-hol-visit:hover,#doPadelHolidays .do-hol-visit:focus-visible{border-color:rgba(242,212,137,.95);transform:translateY(-2px);outline:none}
#doPadelHolidays .do-hol-empty{grid-column:1/-1;margin:0;padding:28px 18px;border:1px solid rgba(214,177,87,.2);border-radius:18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13.5px;line-height:1.7;color:rgba(216,199,155,.86);text-align:center}
#doPadelHolidays .do-hol-note{max-width:680px;margin:clamp(28px,4vw,40px) auto 0;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:11.5px;line-height:1.7;letter-spacing:.03em;color:rgba(189,173,132,.78)}
@media(max-width:640px){
#doPadelHolidays .do-hol-grid{grid-template-columns:1fr}
#doPadelHolidays .do-hol-card{border-radius:18px}
}
