*{box-sizing:border-box}html,body{margin:0;background:#121314;color:#fff}body{font-family:Arial,Helvetica,sans-serif}.intro{position:relative;width:100%;max-width:2200px;margin:0 auto;isolation:isolate}.concept{display:block;width:100%;height:auto}.cleanup{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.title-cleanup{clip-path:inset(15.4% 23.8% 61.9% 35.4%)}.button-cleanup{clip-path:inset(39.2% 34.1% 55.5% 45.7%)}.intro-logo{position:absolute;left:50%;top:18%;width:34%;margin:0;transform:translateX(-50%);filter:drop-shadow(0 5px 9px #000b)}.intro-logo img{display:block;width:100%;height:auto}.intro-button{position:absolute;left:50%;top:39.5%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:.7em;width:22%;min-height:44px;padding:1.05% 1.2%;background:#ff8900;color:#111;font-size:clamp(16px,2.1vw,36px);font-weight:800;text-decoration:none;clip-path:polygon(0 0,94% 0,100% 24%,100% 100%,6% 100%,0 76%)}.intro-button:hover{background:#ffa32e}.intro-button:focus-visible{outline:4px solid #fff;outline-offset:7px;clip-path:none}.hotspot{position:absolute;display:block;min-height:24px}.hotspot:focus-visible{outline:3px solid #ff8900;outline-offset:3px}.products{left:72.5%;top:1.5%;width:7.5%;height:4%}.craft{left:81.5%;top:1.5%;width:8%;height:4%}.contact{left:91.7%;top:1.5%;width:5.5%;height:4%}.detail{left:64.5%;top:88%;width:17%;height:4%}@media(max-width:600px){.intro-logo{width:40%;top:18%}.intro-button{width:46%;font-size:16px;top:40%;padding:10px 14px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
/* Feather only the two cleared text regions into the untouched concept image. */
.title-cleanup{clip-path:none;mask-image:linear-gradient(to right,transparent 30%,#000 35.8%,#000 76.2%,transparent 82%),linear-gradient(to bottom,transparent 10%,#000 15.5%,#000 38.1%,transparent 44%);mask-composite:intersect}.button-cleanup{clip-path:none;mask-image:linear-gradient(to right,transparent 41%,#000 46%,#000 66%,transparent 72%),linear-gradient(to bottom,transparent 37%,#000 39.4%,#000 44.4%,transparent 48%);mask-composite:intersect}

/* Keep the original full composition intact; extend only the surrounding scenery. */
html{height:100%;overflow:hidden}
body{height:100vh;height:100dvh;overflow:hidden;display:grid;place-items:center;background:#121314}
.intro{width:min(100vw,114.139693vh);width:min(100vw,114.139693dvh);max-width:none;margin:0;container-type:inline-size}
.intro-button{font-size:clamp(12px,2.1cqw,36px);width:32%;min-height:0;padding:1.4% 1.2%;white-space:nowrap}
.hotspot{min-height:0}
@media(min-aspect-ratio:2/1){body{background-size:100% 100%}}
@media(max-aspect-ratio:1340/1174){body{background-size:auto 100%}.intro-button{width:46%;font-size:clamp(12px,3cqw,20px)}}

@font-face{font-family:"BAX Buckets";src:url("assets/fonts/baxbuckets-stencil.woff2") format("woff2"),url("assets/fonts/baxbuckets-stencil.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
.logo-cleanup{mask-image:linear-gradient(to right,transparent 2%,#000 3.5%,#000 14.5%,transparent 17%),linear-gradient(to bottom,#000 0%,#000 8%,transparent 10%);mask-composite:intersect}
.strength-cleanup{mask-image:linear-gradient(to right,transparent 63%,#000 64.7%,#000 94%,transparent 96%),linear-gradient(to bottom,transparent 69.8%,#000 70.8%,#000 81.2%,transparent 82.6%);mask-composite:intersect}
.intro-logo{top:10%;width:28%}
.intro-tagline,.strength-title,.intro-button{font-family:"BAX Buckets",Impact,sans-serif;font-weight:400}
.intro-tagline{position:absolute;left:50%;top:29%;transform:translateX(-50%);margin:0;text-align:center;font-size:5cqw;line-height:1;white-space:nowrap;color:#fff;text-shadow:0 2px 5px #0008}
.intro-button{top:42%;width:22%;font-size:2.1cqw;line-height:1.15;padding:.8% 1%;min-height:0;gap:0}
.strength-title{position:absolute;left:65%;top:70.7%;width:30%;margin:0;font-size:3.35cqw;line-height:1.12;color:white}

.intro-button{text-transform:uppercase}

/* Original BAX Buckets typeface, with its own cap-height proportions. */
.intro-tagline{font-size:6cqw;line-height:.95}
.strength-title{font-size:3.6cqw;line-height:1.08}
.intro-button{font-size:2.2cqw}

/* Video and site photo replace only the two photographic regions. */
.practice-photo{position:absolute;top:56.5%;bottom:0;left:calc(50% - 50vw);right:39.5%;overflow:hidden;clip-path:polygon(0 0,100% 0,calc(100% - 8.5cqw) 100%,0 100%)}
.practice-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 57%}
.video-scene{position:absolute;top:0;left:50%;transform:translateX(-50%);width:100vw;height:100%;overflow:hidden;pointer-events:none;clip-path:polygon(0 0,100% 0,100% calc(60% - 5.075vw),0 calc(60% + 5.075vw));background:url("assets/intro-video-poster.jpg") center top / cover no-repeat}
.video-scene video{display:block;width:100%;height:74%;object-fit:cover;object-position:center 55%}
.video-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0004,#0006 50%,#0003)}
.video-edge{position:absolute;left:50%;top:60%;width:102vw;height:2px;background:#ff8900;transform:translateX(-50%) rotate(-5.795deg);pointer-events:none}
.products,.craft,.contact{color:white;text-decoration:none;font-family:Arial,sans-serif;font-size:1.3cqw;font-weight:700;display:flex;align-items:center;justify-content:center;text-shadow:0 1px 4px #000}
.video-toggle{position:absolute;left:calc(50% - 50vw + 18px);top:3%;border:1px solid #fff8;border-radius:3px;padding:7px 10px;color:#fff;background:#0005;font:11px Arial,sans-serif;cursor:pointer}
.video-toggle:focus-visible{outline:2px solid #ff8900;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.video-scene video{visibility:hidden}.video-scene.is-playing video{visibility:visible}}

/* Follow the bucket; the branding and page geometry remain fixed. */
.video-scene.is-tracking video{position:absolute;top:0;left:0;max-width:none;object-fit:fill;object-position:initial;will-change:transform}

/* The translated CTA grows with its label; no stencil or cropped text. */
.intro-button{font-family:Arial,Helvetica,sans-serif;font-weight:700;font-size:clamp(14px,2.2cqw,30px);line-height:1.35;text-transform:none;letter-spacing:normal;width:max-content;max-width:88%;height:auto;min-height:44px;padding:.7em 1.35em;white-space:normal;overflow-wrap:anywhere;text-align:center;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}

/* Replace the lower-right text panel with the supplied bucket photograph. */
.orange-bucket-photo{position:absolute;top:49%;bottom:0;left:52%;right:calc(50% - 50vw);overflow:hidden;background:#68645b}
.orange-bucket-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%}

.practice-photo::after{content:"";position:absolute;inset:0;background:#ff8900;pointer-events:none;clip-path:polygon(calc(100% - 3px) 0,100% 0,calc(100% - 8.5cqw) 100%,calc(100% - 8.5cqw - 3px) 100%)}
