
:root{--background:#f8f0dc;--foreground:#202820;--primary:#244b32;--primary-foreground:#fff9e8;--border:#202820;--ring:#e77724;--font-sans:Arial,Helvetica,sans-serif;--radius:0rem}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--background);color:var(--foreground);font-family:Arial,Helvetica,sans-serif;font-size:16px}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #dc5815;outline-offset:5px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Georgia,'Times New Roman',serif}h1{font-size:clamp(4.4rem,7.5vw,8.6rem);font-weight:900;line-height:.93;letter-spacing:-.065em}h1 em{font-weight:400}h2{font-size:clamp(3rem,5.1vw,5.8rem);line-height:1;letter-spacing:-.05em}h3{font-size:2.2rem;letter-spacing:-.035em}p{line-height:1.6}.skip{position:absolute;top:-100px;left:15px;padding:15px;background:white;z-index:10}.skip:focus{top:10px}.nav{display:flex;align-items:center;justify-content:space-between;padding:25px 5%;border-bottom:1.5px solid}.wordmark{font-family:Georgia,serif;font-size:1.55rem;font-weight:900;line-height:.85;letter-spacing:-.06em}.wordmark span{font-size:.94rem;letter-spacing:.11em}.nav nav{display:flex;gap:35px;font-size:.9rem;font-weight:700}.nav nav a:last-child{border-bottom:1px solid;padding-bottom:4px}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:690px}.hero-copy{display:flex;flex-direction:column;padding:56px 8% 24px 10%}.eyebrow{font-family:monospace;font-size:.84rem;font-weight:700;letter-spacing:.12em;margin-bottom:32px}.hero h1{margin:24px 0 30px}.intro{font-size:1.17rem}.cta{display:inline-flex;justify-content:space-between;align-items:center;gap:45px;background:#244b32;color:#fff9e8;padding:18px 24px;font-size:.95rem;font-weight:700;width:fit-content;margin-top:30px;min-height:54px}.cta:hover{background:#182f21}.hero-foot{display:flex;justify-content:space-between;gap:10px;margin-top:auto;padding-top:48px;font: .75rem monospace;letter-spacing:.06em}.hero-art{position:relative;background:#fac384;overflow:hidden}.hero-art img{display:block;width:100%;height:100%;object-fit:cover}.art-caption{position:absolute;bottom:24px;left:24px;font:.75rem monospace;color:#fff7e8;background:#292719;padding:10px 14px}.ticker{display:flex;justify-content:space-around;gap:25px;align-items:center;padding:20px;background:#df7422;font-size:.85rem;font-weight:700;letter-spacing:.12em;overflow:hidden;white-space:nowrap;border-top:1.5px solid;border-bottom:1.5px solid}.ticker b{font-size:1.5rem}.beer-section{padding:90px 5% 100px}.section-top{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:44px}.section-top>p{max-width:350px}.beer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.beer{border:1.5px solid #222b23}.beer-art{display:block;position:relative;width:100%;border:0;padding:0;background:transparent;aspect-ratio:4/5;overflow:hidden}.beer-art img{display:block;width:100%;height:100%;object-fit:cover}.beer-art canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;opacity:0}.beer-art:hover canvas,.beer-art:focus-visible canvas,.beer-art.pixel-on canvas{opacity:1}.pixel-tag{position:absolute;left:16px;bottom:16px;background:#f8f0dc;padding:8px 10px;font:.75rem monospace;border:1px solid}.beer-label{border-top:1.5px solid;padding:22px 20px;display:flex;align-items:center;justify-content:space-between;gap:15px}.beer-label>span{font:.75rem/1.6 monospace;text-align:right;flex-shrink:0}.arcade{background:#202820;color:#f8f0dc;padding:88px 5% 90px;display:grid;grid-template-columns:.85fr 1.15fr;gap:6%}.arcade-heading p:last-child{margin-top:25px;max-width:350px;color:#d5dccb}.arcade-heading .eyebrow{color:#e9bb6a}.console{border:2px solid #abb692;background:#303b2b;padding:24px;box-shadow:10px 10px 0 #111a12}.console-bar{display:flex;justify-content:space-between;font:.8rem monospace;margin-bottom:20px;gap:10px}.status-light{color:#d9e790}.screen{border:5px solid #182017;background:#b5c792;color:#172317;min-height:170px;padding:25px 18px;display:flex;flex-direction:column;justify-content:center;gap:15px;font:.8rem monospace;overflow-wrap:anywhere}.screen strong{font-size:clamp(1.2rem,2vw,1.8rem);line-height:1.25;animation:flash .25s steps(2)}.screen-small{font-size:.75rem}.can-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:25px}.can-keys button{border:3px solid #111a12;box-shadow:0 6px 0 #111a12;padding:0 0 12px;transition:transform .15s}.can-keys button:hover{transform:translateY(-3px)}.can-keys button.selected{transform:translateY(5px);box-shadow:0 1px 0 #111a12;outline:2px solid #ecdaac}.can-keys canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.can-keys span{display:block;font-weight:700;font-size:.9rem}.can-keys small{display:block;font:.75rem monospace;margin-top:8px}.console-note{font:.75rem/1.5 monospace;color:#d1d7c5;margin-top:25px}.visit{padding:95px 5%}.visit-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%}.visit-lead{font-size:1.5rem;line-height:1.5;margin-bottom:18px}.draft-note{font-size:.875rem;max-width:370px;margin-top:25px;color:#5c6155}footer{padding:35px 5%;border-top:1.5px solid;display:flex;justify-content:space-between;gap:30px;align-items:center}footer>span{font:.75rem monospace}footer p{font-size:.9rem}@keyframes flash{50%{opacity:.3}}@media(min-width:1500px){.hero{max-height:860px}.hero-art img{object-position:center 54%}}@media(max-width:850px){.hero{min-height:0}.hero-copy{padding:35px 8%}.hero h1{font-size:4.5rem}.hero-foot{font-size:.75rem}.eyebrow{font-size:.75rem}.beer-grid{gap:12px}.beer-label{display:block;padding:15px}.beer-label>span{display:block;text-align:left;margin-top:10px}h3{font-size:1.7rem}.arcade{grid-template-columns:1fr;gap:40px}.console{max-width:650px}.hero-art img{object-fit:cover}.section-top{align-items:start}}@media(max-width:600px){.nav{padding:22px 6%}.nav nav{gap:17px;font-size:.8rem}.nav nav a:last-child{display:none}.wordmark{font-size:1.25rem}.wordmark span{font-size:.75rem}.hero{grid-template-columns:1fr}.hero-copy{padding:36px 6% 25px}.hero h1{font-size:clamp(4.4rem,16vw,6.5rem);margin-top:5px}.hero-art{height:450px}.hero-art img{object-position:center 57%}.hero-foot{padding-top:30px}.ticker{justify-content:start;padding:15px 6%}.beer-section,.arcade,.visit{padding:60px 6%}.section-top{display:block}.section-top>p{margin-top:25px}.beer-grid{grid-template-columns:1fr;gap:25px}.beer-label{display:flex}.beer-label>span{text-align:right}.beer-art{aspect-ratio:4/4.3}.beer-art img,.beer-art canvas{object-fit:cover}.console{padding:15px;box-shadow:6px 6px 0 #111a12}.can-keys{gap:7px}.can-keys span{font-size:.78rem}.can-keys small{font-size:.75rem}.visit-grid{grid-template-columns:1fr;gap:28px}footer{flex-wrap:wrap;padding:30px 6%}footer>span{width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

.custom-logo{max-width:110px;height:auto;display:block}.nav ul{list-style:none;display:flex;gap:24px;padding:0;margin:0}.nav li{margin:0}.entry-content{max-width:900px;margin:40px auto;line-height:1.7}.entry-content img{max-width:100%;height:auto}.entry-content p{margin-bottom:1em}.content-wrap{padding:60px 6%;min-height:60vh}.content-wrap h1{font-size:clamp(3rem,7vw,6rem);margin-bottom:30px}.updates{padding:70px 5%;border-top:1px solid;display:grid;grid-template-columns:1fr 1fr;gap:50px}.updates h2{font-size:3rem;margin-bottom:20px}.updates p{white-space:pre-line}.wp-block-image img{height:auto}.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}.can-keys button:disabled{cursor:wait}body.admin-bar .nav{scroll-margin-top:32px}@media(max-width:600px){.updates{grid-template-columns:1fr}.nav{flex-wrap:wrap;gap:22px}.nav nav{width:100%;justify-content:space-between}.nav nav a:last-child{display:block}.nav ul{flex-wrap:wrap}.beer-art{aspect-ratio:4/5}}

/* Draft 2: the place, people and story. */
.brand-logo{width:110px;height:auto;display:block;mix-blend-mode:multiply}.nav{padding-top:12px;padding-bottom:12px}.story-panel{display:grid;grid-template-columns:1fr 1fr;border-bottom:1.5px solid}.story-photo{position:relative;min-height:590px;overflow:hidden}.story-photo img{width:100%;height:100%;object-fit:cover;display:block}.story-copy{padding:85px 10%;display:flex;flex-direction:column;justify-content:center}.story-copy>p:last-child{font-size:1.1rem;margin-top:32px;max-width:540px}.photo-stamp{position:absolute;bottom:25px;left:25px;background:#f8f0dc;padding:13px 17px;font: .85rem monospace;transform:rotate(-2deg);border:1px solid}.life-panel{padding:90px 5%;background:#e6b963}.life-panel figure{margin:0}.life-wide img{width:100%;height:auto;max-height:710px;object-fit:cover;display:block}.life-panel figcaption{font:.8rem monospace;letter-spacing:.08em;padding:15px 0}.life-notes{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center;margin-top:40px}.life-notes>p{font-family:Georgia,serif;font-size:clamp(2rem,4vw,4.5rem);font-weight:bold;line-height:1.12;letter-spacing:-.035em}.life-notes img{width:100%;height:auto;display:block}.makers{background:#b0d4e9}.updates{background:#efdfbd}.updates>div{border:2px solid;padding:35px;box-shadow:6px 6px 0 #202820}.updates h2{font-size:clamp(2.5rem,4vw,4rem)}.nav nav{flex-wrap:wrap;gap:22px}
@media(max-width:760px){.story-panel{grid-template-columns:1fr}.story-photo{min-height:0;height:360px}.story-copy{padding:55px 6%}.life-panel{padding:60px 6%}.life-notes{grid-template-columns:1fr;gap:30px}.makers .story-photo{grid-row:1}.brand-logo{width:85px}.updates>div{padding:25px}.nav nav{gap:15px}}

/* Revision 3: snapshots and interactive reveals. */
.beer-art canvas{opacity:0}.beer-art canvas[data-loaded="true"]{opacity:1}.beer-art:hover canvas,.beer-art:focus-visible canvas,.beer-art.pixel-on canvas{opacity:0}.portrait-reveal{padding:0;border:0;background:#202820;text-align:left;color:#202820;width:100%;cursor:pointer}.portrait-top{position:absolute;inset:0;opacity:0;transition:opacity .3s}.portrait-reveal:hover .portrait-top,.portrait-reveal:focus-visible .portrait-top,.portrait-reveal.is-revealed .portrait-top{opacity:1}.portrait-reveal img{object-position:center}.photo-wall{padding:90px 5%;background:#e9ddc6;border-top:1px solid;border-bottom:1px solid}.community-copy{max-width:520px}.community-copy h3{font-size:2rem;margin-bottom:16px}.snapshot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;padding:20px 8px}.snapshot{margin:0;padding:12px 12px 20px;background:#fff9e9;box-shadow:4px 7px 0 #20282025;transform:rotate(-2deg);border:1px solid #20282030}.snapshot:nth-child(2n){transform:rotate(2deg)}.snapshot:nth-child(3n){transform:rotate(-1deg)}.snapshot img{display:block;width:100%;height:280px;object-fit:cover}.snapshot figcaption{font:1rem/1.5 monospace;padding:15px 4px 0}.snapshot figcaption span{display:block;font-size:.7rem;letter-spacing:.15em;margin-bottom:5px}.game-controls{display:flex;gap:12px;margin-top:20px}.game-controls button{background:#e6b963;color:#182017;border:2px solid #111a12;padding:14px 20px;font:bold .85rem monospace;box-shadow:0 4px #111a12}.game-controls button:disabled{opacity:.5;cursor:default}.can-keys button.cue{outline:5px solid #fff8c5;filter:brightness(1.3);transform:translateY(-5px)}.can-keys button:disabled{cursor:default}.arcade:focus-within{outline-offset:-3px}
@media(max-width:850px){.snapshot-grid{grid-template-columns:repeat(2,1fr)}.snapshot img{height:240px}}@media(max-width:600px){.photo-wall{padding:60px 6%}.snapshot-grid{grid-template-columns:1fr;gap:30px}.snapshot img{height:auto;max-height:420px;object-fit:cover}.community-copy{margin-top:25px}}

/* Keep the hero artwork inside its grid track at every viewport width. */
.hero{max-height:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.hero>*{min-width:0;min-height:0}.hero-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-copy{min-height:690px}.ticker{position:relative;z-index:1}.ticker>*{flex-shrink:0}
@media(min-width:1500px){.hero-copy{min-height:760px}.hero-art img{object-position:center 54%}}
@media(max-width:850px){.hero-copy{min-height:620px}}
@media(max-width:600px){.hero{grid-template-columns:1fr}.hero-copy{min-height:0}.hero-art{height:450px}.hero-art img{object-position:center 57%}}
.game-stage{height:155px;position:relative;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(0deg,#182b1810 0px,#182b1810 1px,transparent 1px,transparent 5px);border-top:2px solid #22351d;border-bottom:2px solid #22351d;overflow:hidden}.game-stage::after{content:'TOC / MEMORY BANK';position:absolute;bottom:7px;left:8px;font:10px monospace;letter-spacing:.08em}.game-stage img{height:135px;width:108px;object-fit:contain;opacity:0;transform:translateY(10px);border:2px solid #23321d}.game-stage.active img{opacity:1;transform:translateY(0);animation:can-pop .35s steps(4)}.game-stage.active{background-color:#d7dda4}.can-keys button.cue canvas{filter:contrast(1.2);animation:can-key .3s steps(3)}@keyframes can-pop{0%{transform:translateY(35px) scale(.75)}60%{transform:translateY(-7px) scale(1.08)}100%{transform:translateY(0) scale(1)}}@keyframes can-key{50%{transform:translateY(-7px)}}

.streak-line{white-space:nowrap}.can-keys .game-key-art{display:block;position:relative;margin:0;line-height:0}.game-key-art img{display:block;width:100%;height:auto}.can-keys .game-key-art canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0}.can-keys button.answer-pixel canvas,.can-keys button.wrong-pixel canvas{opacity:1}.can-keys button.wrong-pixel{outline:4px solid #edab70}

.hero-actions{display:flex;gap:15px;flex-wrap:wrap}.cta.secondary{color:#244b32;background:transparent;border:2px solid #244b32}.visit-strip{padding:30px 5%;display:grid;grid-template-columns:1.1fr 1fr;gap:20px 6%;border-bottom:2px solid}.visit-strip strong{font: bold .9rem monospace}.visit-strip a{text-decoration:underline;font-weight:bold}.special-hours{background:#ffdd8c;border-left:4px solid #244b32;padding:14px 18px;grid-column:1/-1}.beer-notes{padding:0 20px 20px}.beer-notes summary{cursor:pointer;font:bold .9rem monospace;padding:12px 0}.beer-notes p{padding-top:10px}.review-note{font:.78rem/1.5 monospace;margin-top:20px}.take-home{font-size:1.1rem;margin-top:22px}.more-snaps>summary{cursor:pointer;font:bold 1rem monospace;padding:20px 0}.makers-portrait{margin:28px 0 0;max-width:420px}.makers-portrait img{width:100%;height:auto;border:8px solid #fff9e9}.makers-portrait figcaption{font:.75rem monospace;margin-top:10px}.noticeboard{padding:80px 5%;background:#e4b969;border-block:2px solid}.notice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.notice{background:#fff6dc;padding:30px;border:2px solid;box-shadow:5px 5px 0 #202820;transform:rotate(-1deg)}.notice:nth-child(2){transform:rotate(1deg);background:#b0d4e9}.notice time{font:bold .85rem monospace;text-transform:uppercase;display:block;margin-bottom:20px}.notice h3{margin-bottom:18px}.before-visit{padding:70px 5%;display:grid;grid-template-columns:1fr 1fr;gap:6%}.visit-faq details{border-bottom:1px solid;padding:20px 0}.visit-faq summary{cursor:pointer;font-weight:bold;font-size:1.1rem}.visit-faq p{margin-top:16px}.footer-links{display:flex;gap:16px;flex-wrap:wrap;font:.85rem monospace}summary:focus-visible{outline:3px solid #b84610;outline-offset:5px}.streak-line{display:inline-block;white-space:normal}footer{flex-wrap:wrap}.hero h1{overflow-wrap:normal}.arcade>*{min-width:0}
@media(max-width:850px){.notice-grid{grid-template-columns:1fr}.before-visit{grid-template-columns:1fr;gap:30px}.hero-actions{gap:0 12px}.hero-actions .cta{gap:20px;padding:15px}.nav nav{font-size:.85rem}}@media(max-width:600px){.visit-strip{grid-template-columns:1fr}.noticeboard,.before-visit{padding:55px 6%}.hero h1{font-size:clamp(3.3rem,15vw,6.5rem)}.visit-grid a{overflow-wrap:anywhere}}

/* Phone-first header: centred brand with compact, wrapping navigation. */
@media(max-width:600px){
 .nav{justify-content:center;padding:18px 6%;gap:18px}
 .nav>.wordmark,.nav>.custom-logo-link{margin-inline:auto}
 .nav .brand-logo,.nav .custom-logo{width:96px;max-width:110px;height:auto}
 .nav nav{justify-content:center;gap:12px 20px;line-height:1.5}
 .nav nav a{padding-block:8px}
 .nav ul{justify-content:center;gap:12px 20px}
}

/* Brewery-first hero and gentle, reversible beer reveals. */
.hero-art{background:#384c3d}.hero-art img{object-position:64% center}.beer-notes[open] p{animation:notes-in .2s ease-out}.beer:has(.beer-notes[open]) .pixel-tag{background:#244b32;color:#fff9e8}.beer-art canvas{transition:opacity .2s ease-out}@keyframes notes-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.hero-art{height:360px}.hero-art img{object-position:60% center}}

/* Give story copy breathing room even when a portrait follows it. */
.story-copy>h2+p{margin-top:32px;font-size:1.1rem;max-width:540px}
.community-copy>h3+p{margin-top:20px}
.story-copy h2{line-height:1.05;text-wrap:balance}
.hero-art{background:#e6b963;border-left:1.5px solid #202820}
.hero-art img{inset:22px 22px 70px;width:calc(100% - 44px);height:calc(100% - 92px);border:1.5px solid #202820;box-shadow:6px 6px 0 #202820;filter:saturate(.9)}
.hero-art .art-caption{bottom:20px;left:22px;right:22px;background:none;color:#202820;padding:0;font-weight:bold;letter-spacing:.08em;line-height:1.5}
@media(max-width:600px){.story-copy>h2+p{margin-top:26px}.hero-art{height:390px;border-left:0;border-top:1.5px solid}.hero-art img{inset:18px 18px 64px;width:calc(100% - 36px);height:calc(100% - 82px)}.hero-art .art-caption{left:18px;right:18px;bottom:18px;font-size:.7rem}.hero-foot{line-height:1.5}.hero-foot span{max-width:48%}}
