/* Banner and social glyphs are half their original size; touch targets stay at least 48px. */
:root{color-scheme:light;--ink:#17263a;--muted:#647080;--paper:#f3e3bf;--social-size:3.15vw;--line:#14284b20}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:24px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid #c8282b;outline-offset:5px}
.sr-only,.socials a span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:fixed;top:-100px;left:20px;padding:12px 18px;z-index:10;background:var(--paper);border:1px solid var(--ink)}
.skip:focus{top:12px}
.hero{margin:0}
.banner{display:block;width:50%;margin-inline:auto;height:auto;aspect-ratio:1640/720;object-fit:contain}
.social-strip{width:100%;background:var(--paper);color:#14284b;display:flex;align-items:center;justify-content:center;padding:20px}
.socials{display:flex;gap:2.5vw;align-items:center;justify-content:center}
.socials a{width:calc(var(--social-size) + 16px);height:calc(var(--social-size) + 16px);min-width:48px;min-height:48px;display:grid;place-items:center;border-radius:50%;transition:background .15s}
.socials a:hover{background:#14284b12}
.socials a:focus-visible{outline-color:#14284b}
.socials svg{width:var(--social-size);height:var(--social-size);fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.socials .fill{fill:currentColor;stroke:none}
.arrow-icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wall{padding:20px 20px 0;max-width:1800px;margin:0 auto}
h2{font-size:32px;line-height:1.2;letter-spacing:-1.15px;font-weight:500;margin:0}
.reel-wall{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.reel{aspect-ratio:9/16;position:relative;overflow:hidden;border-radius:10px;background:#e8eaec;display:block}
.reel img,.reel video{height:100%;width:100%;object-fit:cover;display:block}
.reel::after{content:"";pointer-events:none;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Cpath d='M3 9h18M8 3l4 6M15 3l4 6'/%3E%3C/g%3E%3Cpath d='m10 12 5 3-5 3Z'/%3E%3C/svg%3E") center/contain no-repeat;position:absolute;right:13px;top:13px;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;color:white;filter:drop-shadow(0 1px 3px #0009)}

.buying{margin:58px auto 0;padding:44px 3.4% 48px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);max-width:1800px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.buying p{font-size:16px;line-height:1.6;color:var(--muted);margin:12px 0 0}
.email-button{padding:17px 23px;border-radius:999px;background:var(--ink);color:white;white-space:nowrap;display:flex;gap:30px;align-items:center;font-size:14px;transition:background .15s}
.email-button:hover{background:#284668}
footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 3.4%;max-width:1800px;margin:auto;font-size:12px;color:var(--muted)}
footer a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:1000px){.reel-wall{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.social-strip{padding:12px}.wall{padding:12px 12px 0}h2{font-size:26px;letter-spacing:-.8px}.reel-wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.reel{border-radius:8px}.reel::after{width:19px;height:19px;top:10px;right:10px}.buying{margin-top:32px;padding:30px 18px;display:block}.buying p{font-size:14px;margin-top:10px;max-width:300px}.email-button{display:inline-flex;margin-top:22px;padding:15px 20px;font-size:13px}footer{padding:22px 18px;align-items:start;flex-direction:column;gap:10px;font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.motion-controls{display:flex;justify-content:flex-end}
.reels-motion{margin:12px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:inherit;font-size:12px;cursor:pointer}
.reels-motion:focus-visible{outline:3px solid #c8282b;outline-offset:3px}
