.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:focus-visible{outline:3px solid var(--coral);outline-offset:4px}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (min-width:761px){.section-head,.genrebar{max-width:760px;margin-left:auto;margin-right:auto}}:root{--cream:#f5f0e8;--ink:#182a3c;--coral:#f05b4b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--cream);color:var(--ink);font-family:var(--font-dm-sans),Arial,sans-serif;margin:0}button,input{font:inherit}.nav{z-index:4;background:#f5f0e8;border-bottom:1px solid #182a3c20;justify-content:space-between;align-items:center;height:74px;padding:0 clamp(22px,5vw,76px);display:flex;position:relative}.logo{letter-spacing:-1.5px;color:var(--ink);font-size:20px;font-weight:700;text-decoration:none}.logo span{color:var(--coral)}.logo i{font:8px var(--font-dm-mono);vertical-align:top;margin-left:2px}.navlinks{align-items:center;gap:28px;font-size:13px;display:flex}.navlinks a{color:inherit;text-decoration:none}.navlinks button,.cta{background:var(--ink);color:#fff;cursor:pointer;border:0;padding:11px 16px;font-size:12px;font-weight:700;text-decoration:none}.eyebrow{font:11px var(--font-dm-mono),monospace;letter-spacing:1.8px;margin:0 0 20px;font-weight:500}.section-head h2,.pairing h2,.how h2{letter-spacing:-5px;margin:0;font-size:clamp(58px,8vw,116px);font-weight:500;line-height:.82}.how h2 em{font-family:var(--font-instrument-serif),Georgia,serif;font-weight:400}.intro{max-width:390px;margin:38px 0 28px;font-size:17px;line-height:1.45}.cta{align-items:center;gap:35px;padding:17px 19px;display:inline-flex}.tiny{font:10px var(--font-dm-mono);color:#53616e;margin-top:42px}.discover{background:#e3f0e9;padding:110px clamp(22px,8vw,130px)}.section-head h2{letter-spacing:-3px;font-size:clamp(45px,6vw,77px)}.section-head>p:last-child{margin-top:16px;font-size:16px}.finder{max-width:760px;margin:45px auto 18px;position:relative}.finder input{background:#f9f6f0;border:1px solid #182a3c;outline:0;width:100%;padding:19px 56px 19px 20px;font-size:16px}.finder span{font-size:31px;position:absolute;top:10px;right:18px}.genrebar{flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:40px;display:flex}.genrebar button{cursor:pointer;background:0 0;border:1px solid #182a3c7d;padding:8px 12px;font-size:12px}.genrebar .active{background:var(--ink);color:#fff}.game-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.game-card{text-align:left;background:var(--i);color:#fff;cursor:pointer;border:0;min-height:190px;padding:20px;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}.game-card:before{content:"";border:1px solid var(--a);border-radius:50%;width:170px;height:170px;position:absolute;top:-55px;right:-35px}.game-card:hover{box-shadow:8px 8px 0 var(--a);transform:translateY(-5px)}.game-mark{color:var(--a);font-size:47px;line-height:1;display:block;position:relative}.game-type{font:10px var(--font-dm-mono);letter-spacing:1px;color:var(--a);text-transform:uppercase;margin-top:17px;display:block}.game-card strong{margin:4px 0;font-size:20px;display:block}.game-card small{font:12px var(--font-dm-mono)}.game-card i{color:var(--a);font-size:20px;position:absolute;bottom:16px;right:17px}.pairing{background:var(--i);color:#f9f6f0;grid-template-columns:1fr 1fr;min-height:650px;display:grid}.pairing-visual{background:var(--a);position:relative;overflow:hidden}.big-mark{color:var(--i);opacity:.94;font-size:min(30vw,280px);position:absolute;top:38%;left:50%;transform:translate(-50%,-50%)}.vertical{writing-mode:vertical-rl;font:10px var(--font-dm-mono);letter-spacing:2px;color:var(--i);position:absolute;top:30px;right:22px}.wine-glass{border:5px solid var(--i);border-radius:6px 6px 70px 70px;width:145px;height:245px;position:absolute;bottom:55px;left:50%;transform:translate(-50%)}.wine-glass:before{content:"";background:var(--i);width:6px;height:120px;position:absolute;bottom:-124px;left:calc(50% - 3px)}.wine-glass:after{content:"";background:var(--i);border-radius:50%;width:125px;height:6px;position:absolute;bottom:-128px;left:7px}.wine-glass div{background:var(--i);border-radius:0 0 65px 65px;height:55%;position:absolute;bottom:0;left:0;right:0}.pairing-copy{padding:clamp(58px,10vw,130px) clamp(27px,9vw,125px)}.pairing h2{letter-spacing:-3px;font-size:clamp(44px,6vw,78px)}.beer-name{font:28px var(--font-instrument-serif);border-top:1px solid #ffffff65;border-bottom:1px solid #ffffff65;margin:30px 0;padding:20px 0}.beer-name span{font:10px var(--font-dm-mono);letter-spacing:1px;margin-top:7px;display:block}.mood{color:var(--a);font:22px var(--font-instrument-serif)!important}.pairing-copy>p{font-size:16px;line-height:1.55}.notes{margin-top:27px}.notes span{font:10px var(--font-dm-mono);letter-spacing:1px;color:#cbd3d2;display:block}.notes b{font:14px var(--font-dm-mono);margin-top:5px;display:block}.save{color:#fff;cursor:pointer;background:0 0;border:1px solid #fff;margin-top:30px;padding:13px 16px;font-size:12px}.how{background:#f5f0e8;padding:115px clamp(22px,8vw,130px)}.how h2{letter-spacing:-3px;font-size:clamp(44px,6vw,78px)}.steps{grid-template-columns:repeat(3,1fr);gap:40px;margin-top:70px;display:grid}.steps div{border-top:2px solid var(--ink);padding-top:15px}.steps b{font:13px var(--font-dm-mono);color:var(--coral)}.steps h3{margin:38px 0 10px;font-size:23px}.steps p{color:#405063;max-width:290px;line-height:1.5}footer{background:var(--ink);color:#f4efe6;justify-content:space-between;align-items:center;padding:40px clamp(22px,5vw,76px);display:flex}footer .logo{color:#fff}footer p{font:9px var(--font-dm-mono);letter-spacing:1px;text-align:center;line-height:1.7}footer>span{font:11px var(--font-dm-mono);color:#9aa4a9}@media (max-width:760px){.navlinks>a{display:none}.pairing{grid-template-columns:1fr}.game-grid{grid-template-columns:repeat(2,1fr)}.pairing-visual{min-height:400px}.pairing-copy{padding:66px 24px}.steps{grid-template-columns:1fr;gap:34px;margin-top:45px}footer{flex-direction:column;align-items:flex-start;gap:20px}footer p{text-align:left}}
