/* EVERY SHOT™ page — the landing clock's own rules, copied verbatim from index.html (net, lighting, ball, lockup), so the dedicated page draws the identical clock. */
.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}
/* NET LIGHTING — a static, warm gold light laid OVER the untouched net artwork,
   never baked into it. ::before lifts the top tape, the two posts and their caps;
   ::after lays a soft gold reflection on the black beneath the net and under each
   post. Both are drawn in the net's own box (same width, centred, same height), so
   every position is a share of the artwork and follows it at every width. Screen
   blending only ever adds light, so the black stays black away from the gold. No
   animation, no flashing; pure CSS gradients, no extra requests. */
.do-padel-hero-net::before,.do-padel-hero-net::after{content:"";position:absolute;top:0;left:50%;width:var(--do-padel-net-w);height:100%;margin-left:calc(-.5 * var(--do-padel-net-w));pointer-events:none;mix-blend-mode:screen}
.do-padel-hero-net::before{background:
  radial-gradient(46% 4.2% at 50% 36.3%,rgba(255,214,140,.22),rgba(255,214,140,0) 100%),
  radial-gradient(3.4% 23% at 3.3% 51%,rgba(242,196,110,.2),rgba(242,196,110,0) 100%),
  radial-gradient(3.4% 23% at 96.6% 51%,rgba(242,196,110,.2),rgba(242,196,110,0) 100%),
  radial-gradient(3.6% 3.4% at 3.3% 32.6%,rgba(255,222,160,.3),rgba(255,222,160,0) 100%),
  radial-gradient(3.6% 3.4% at 96.6% 32.6%,rgba(255,222,160,.3),rgba(255,222,160,0) 100%)}
/* FLOOR LIGHTING — the glossy black floor in front of the net, lit from the two
   posts. ::after is its own taller box, starting just above the post feet and
   running forward past the net's lower edge, so the light can travel across the
   floor towards the viewer. The floor is flat and horizontal, so every pool is a
   wide, shallow ellipse that spreads sideways along the court before it reaches
   forward -- no tall vertical beams, which read as a wall or a drop. Each post
   throws a hot pool at its foot that fans out across the floor; a soft,
   continuous warm wash spans the floor from post to post, brightest along the
   net's foot and fading towards the viewer into the black. A fine noise
   mask breaks the light into the grain of a wet court surface. Sized in net
   widths, so it follows the net at every screen size. */
.do-padel-hero-net::after{top:calc(.335 * var(--do-padel-net-w));left:50%;width:calc(1.3 * var(--do-padel-net-w));height:calc(.66 * var(--do-padel-net-w));margin-left:calc(-.65 * var(--do-padel-net-w));background:
  radial-gradient(6% 3.6% at 14.1% 4.6%,rgba(255,222,150,.95),rgba(255,214,140,0) 100%),
  radial-gradient(6% 3.6% at 85.9% 4.6%,rgba(255,222,150,.95),rgba(255,214,140,0) 100%),
  radial-gradient(13% 7% at 14.3% 4%,rgba(255,200,104,.5),rgba(240,182,84,.18) 45%,rgba(216,181,103,0) 100%),
  radial-gradient(13% 7% at 85.7% 4%,rgba(255,200,104,.5),rgba(240,182,84,.18) 45%,rgba(216,181,103,0) 100%),
  radial-gradient(17% 12% at 18% 3.5%,rgba(236,180,86,.22),rgba(216,181,103,0) 100%),
  radial-gradient(17% 12% at 82% 3.5%,rgba(236,180,86,.22),rgba(216,181,103,0) 100%),
  radial-gradient(27% 12% at 32% 3.5%,rgba(238,188,98,.22),rgba(228,180,92,.08) 50%,rgba(216,181,103,0) 100%),
  radial-gradient(27% 12% at 68% 3.5%,rgba(238,188,98,.22),rgba(228,180,92,.08) 50%,rgba(216,181,103,0) 100%),
  radial-gradient(44% 8% at 50% 3.5%,rgba(255,212,132,.44),rgba(242,192,104,.16) 55%,rgba(216,181,103,0) 100%),
  radial-gradient(45% 20% at 50% 3%,rgba(240,190,100,.3),rgba(232,184,96,.13) 45%,rgba(216,181,103,0) 100%),
  radial-gradient(48% 36% at 50% 2%,rgba(236,186,96,.2),rgba(228,180,92,.08) 45%,rgba(222,176,92,.02) 75%,rgba(216,181,103,0) 100%);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 1.7 0 0 0 -.1'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(#0000,#000 3.5%);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 1.7 0 0 0 -.1'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(#0000,#000 3.5%);
  -webkit-mask-size:180px 180px,100% 100%;mask-size:180px 180px,100% 100%;
  -webkit-mask-composite:source-in;mask-composite:intersect}
/* 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}
@media (max-width:600px){.do-padel-hero-net,.do-every-shot-more{--do-padel-net-w:min(91vw,520px)}}
.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.004 * var(--dp-hero-w));font-size:max(7.2px,calc(0.0228 * 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(8.75px,calc(0.025625 * var(--dp-hero-w)));letter-spacing:.16em;padding-left:.16em;color:rgba(246,242,233,.82)}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption{margin-top:calc(0.045 * var(--dp-hero-w))}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-value{margin-top:calc(0.07 * var(--dp-hero-w))}
/* THE WORLD'S PADEL CLOCK 10px lower and the caption 5px lower, drawn as relative
   offsets so neither takes space in the flow: EVERY PADEL SHOT™, the counter, the
   methodology line and the net keep their exact places. */
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-sub{position:relative;top:calc(10px + 0.02 * var(--dp-hero-w))}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption{position:relative;top:calc(5px + 0.045 * var(--dp-hero-w))}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-value{position:relative;top:calc(0.07 * var(--dp-hero-w))}
/* MAKE EVERY SHOT COUNT — warm-gold lettering with thin illuminated gold rules either side,
   centred on the lettering, softly fading outward. The trailing letter-spacing is netted off
   the right-hand gap so both rules sit the same distance from the words. */
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption{display:flex;align-items:center;justify-content:center;padding-left:0;color:#e2bf72;background:linear-gradient(180deg,#f6dc9a 0%,#d8b567 55%,#b88d3e 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 4px rgba(226,184,100,.35))}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption::before,html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption::after{content:"";flex:0 0 auto;width:4.5em;height:1px;box-shadow:0 0 4px rgba(232,192,110,.7)}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption::before{margin-right:.9em;background:linear-gradient(90deg,rgba(232,192,110,0),#e8c06e)}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-caption::after{margin-left:calc(.9em - .16em);background:linear-gradient(90deg,#e8c06e,rgba(232,192,110,0))}
/* ⓘ HOW IS EVERY PADEL SHOT™ ESTIMATED? — the link stays in its own place in the
   markup (it cannot live inside the card's link) and is drawn into this reserved
   line between the counter and the net by the script beside the counter. */
.do-every-shot-slot{display:none}
html:not(.do-landing-volution-only) .do-every-shot-head .do-every-shot-slot{display:block;height:16px;margin-top:calc(0.056 * var(--dp-hero-w) - 8px)}
/* THE NET — the Buttons page net (assets/do-padel-court-champagne-green.jpg, 1284x462),
   which already carries its own light and ball, so the drawn lighting and the overlaid
   ball are not shown over it. Framed as on the Buttons page: a fine 1px champagne gold
   edge with ~8px corners, inside the image's own width. */
.do-padel-hero-net:has(> img.do-padel-net-court)::before,.do-padel-hero-net:has(> img.do-padel-net-court)::after{content:none}
.do-padel-hero-net:has(> img.do-padel-net-court) .do-every-shot{display:none}
.do-padel-hero-net > img.do-padel-net-court{box-sizing:border-box;aspect-ratio:1284/462;border:1px solid #E9CCA1;border-radius:8px}