.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
word-break: normal !important;
}
.wpcf7 .hidden-fields-container {
display: none;
}
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2; }
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
display: none;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232; }
.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: #ffb900; }
.wpcf7-form-control-wrap {
position: relative;
}
.wpcf7-not-valid-tip {
color: #dc3232; font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip .wpcf7-not-valid-tip {
position: relative;
top: -2ex;
left: 1em;
z-index: 100;
border: 1px solid #dc3232;
background: #fff;
padding: .2em .8em;
width: 24em;
}
.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-spinner {
visibility: hidden;
display: inline-block;
background-color: #23282d; opacity: 0.75;
width: 24px;
height: 24px;
border: none;
border-radius: 100%;
padding: 0;
margin: 0 24px;
position: relative;
}
form.submitting .wpcf7-spinner {
visibility: visible;
}
.wpcf7-spinner::before {
content: '';
position: absolute;
background-color: #fbfbfc; top: 4px;
left: 4px;
width: 6px;
height: 6px;
border: none;
border-radius: 100%;
transform-origin: 8px 8px;
animation-name: spin;
animation-duration: 1000ms;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: reduce) {
.wpcf7-spinner::before {
animation-name: blink;
animation-duration: 2000ms;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes blink {
from {
opacity: 0;
}
50% {
opacity: 1;
}
to {
opacity: 0;
}
}
.wpcf7 [inert] {
opacity: 0.5;
}
.wpcf7 input[type="file"] {
cursor: pointer;
}
.wpcf7 input[type="file"]:disabled {
cursor: default;
}
.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
direction: ltr;
}
.wpcf7-reflection > output {
display: list-item;
list-style: none;
}
.wpcf7-reflection > output[hidden] {
display: none;
}@font-face {
font-family: "Sora";
src: url(//hatterentertainment.co.uk/wp-content/themes/hatter/assets/fonts/sora-var.woff2) format("woff2");
font-weight: 400 800; font-style: normal; font-display: swap;
}
@font-face {
font-family: "Inter";
src: url(//hatterentertainment.co.uk/wp-content/themes/hatter/assets/fonts/inter-var.woff2) format("woff2");
font-weight: 300 700; font-style: normal; font-display: swap;
} :root { --hatter-bg:            #16161A;
--hatter-bg-2:          #1D1D22;
--hatter-surface:       #222227;
--hatter-surface-2:     #2B2B31;
--hatter-border:        #34343B;
--hatter-border-strong: #4A4A53; --hatter-text:          #F5F1EA;
--hatter-text-muted:    #B4B0A8;
--hatter-text-dim:      #85817A; --hatter-violet:        #D8D3C8; --hatter-violet-bright: #F5F1EA; --hatter-magenta:       #9C978C; --hatter-indigo-deep:   #2A2A30; --hatter-grad:          linear-gradient(120deg, #FFFFFF 0%, #CFC9BC 100%);
--hatter-glow-violet:   0 0 34px rgba(245,241,234,.10);
--hatter-glow-magenta:  0 0 34px rgba(245,241,234,.10); --hatter-btn-bg:        #F5F1EA;
--hatter-btn-fg:        #17161A; --hatter-ok:  #86C79E;  --hatter-err: #E0868F; --hatter-font-display: "Sora", "Inter", system-ui, sans-serif;
--hatter-font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
--hatter-font-kicker:  "Inter", system-ui, sans-serif; --hatter-s1: .5rem;  --hatter-s2: 1rem;   --hatter-s3: 1.5rem;
--hatter-s4: 2rem;   --hatter-s5: 3rem;   --hatter-s6: 4rem;  --hatter-s7: 6rem;
--hatter-section-y: clamp(4rem, 9vw, 8rem); --hatter-r-card: 0px;
--hatter-r-ui:   4px;
--hatter-r-img:  6px; --hatter-content-max: 1200px;
--hatter-content-wide: 1400px;
--hatter-gutter: clamp(1.25rem, 5vw, 3rem);
--hatter-header-height: 76px;
} .hatter-invert,
.hatter-intro,
.hatter-packages,
.hatter-event-grid,
.hatter-testimonials,
.hatter-faq,
.hatter-contact {
--hatter-bg:            #F1ECE3;
--hatter-bg-2:          #E9E3D8;
--hatter-surface:       #FFFFFF;
--hatter-surface-2:     #F7F3EB;
--hatter-border:        #DED8CB;
--hatter-border-strong: #C0B8A8;
--hatter-text:          #191721;
--hatter-text-muted:    #565248;
--hatter-text-dim:      #8A867B;
--hatter-violet:        #2C2A26;
--hatter-violet-bright: #191721;
--hatter-magenta:       #7C776B;
--hatter-indigo-deep:   #CFC8B9;
--hatter-grad:          linear-gradient(120deg, #2C2A26 0%, #575249 100%);
--hatter-glow-violet:   0 0 0 rgba(0,0,0,0);
--hatter-glow-magenta:  0 0 0 rgba(0,0,0,0);
--hatter-btn-bg:        #191721;
--hatter-btn-fg:        #F5F1EA;
background: var(--hatter-bg);
color: var(--hatter-text);
} *, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
font-family: var(--hatter-font-body);
font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.0625rem);
line-height: 1.65;
color: var(--hatter-text);
background-color: var(--hatter-bg);
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
overflow-x: hidden;
position: relative;
} body::after {
content: "";
position: fixed; inset: 0; z-index: 9999; pointer-events: none;
opacity: .035; mix-blend-mode: overlay;
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
img { border-style: none; }
a { color: var(--hatter-violet-bright); text-decoration: none; transition: color .2s ease, opacity .2s ease; }
a:hover { opacity: .78; }
ul, ol { list-style: none; padding: 0; }
button { font-family: inherit; font-size: inherit; color: inherit; cursor: pointer; }
input, textarea, select, button { font-family: inherit; } h1, h2, h3, h4 {
font-family: var(--hatter-font-display);
font-weight: 600;
line-height: 1.03;
letter-spacing: -0.03em;
color: var(--hatter-text);
text-wrap: balance;
}
h1 { font-size: clamp(2.75rem, 6vw, 5.5rem); font-weight: 800; }
h2 { font-size: clamp(2rem, 4vw, 3.4rem); font-weight: 700; }
h3 { font-size: clamp(1.375rem, 2vw, 1.8rem); font-weight: 600; }
h4 { font-size: clamp(1.1rem, 1.4vw, 1.3rem); }
p { text-wrap: pretty; }
strong, b { font-weight: 700; } .hatter-grad-text {
background: var(--hatter-grad);
-webkit-background-clip: text; background-clip: text; color: transparent;
font-style: normal;
} .hatter-kicker {
display: inline-block;
font-family: var(--hatter-font-kicker);
font-weight: 600;
font-size: clamp(0.72rem, 0.9vw, 0.82rem);
letter-spacing: 0.28em;
text-transform: uppercase;
color: var(--hatter-magenta);
line-height: 1;
}
.hatter-kicker--muted { color: var(--hatter-text-muted); }
.hatter-lead { font-size: clamp(1.05rem, 1.4vw, 1.3rem); color: var(--hatter-text-muted); line-height: 1.6; }
.hatter-muted { color: var(--hatter-text-muted); } .hatter-container {
width: 100%; max-width: var(--hatter-content-max);
margin-inline: auto; padding-inline: var(--hatter-gutter);
}
.hatter-container--wide { max-width: var(--hatter-content-wide); }
.hatter-section { padding-block: var(--hatter-section-y); position: relative; }
.hatter-section--band { background: var(--hatter-bg-2); }
.hatter-section--tight { padding-block: clamp(2.5rem, 5vw, 4rem); }
.hatter-sec-head { max-width: 46rem; margin-bottom: var(--hatter-s5); }
.hatter-sec-head--center { margin-inline: auto; text-align: center; }
.hatter-sec-head .hatter-kicker { margin-bottom: var(--hatter-s3); }
.hatter-sec-head h2 { margin-bottom: var(--hatter-s2); }
.hatter-rule { border: 0; height: 1px; background: var(--hatter-border); }
.hatter-card {
background: var(--hatter-surface);
border: 1px solid var(--hatter-border);
border-radius: var(--hatter-r-card);
} .hatter-btn {
display: inline-flex; align-items: center; justify-content: center; gap: .55em;
padding: 0.95em 1.6em;
font-family: var(--hatter-font-kicker); font-weight: 600;
font-size: 0.82rem; letter-spacing: 0.18em; text-transform: uppercase; line-height: 1;
border-radius: var(--hatter-r-ui); border: 1px solid transparent;
transition: transform .2s ease, box-shadow .25s ease, background-color .2s ease, color .2s ease, border-color .2s ease, opacity .2s ease;
will-change: transform;
}
.hatter-btn:hover { transform: translateY(-2px); }
.hatter-btn:active { transform: translateY(0); }
.hatter-btn--primary {
color: var(--hatter-btn-fg);
background: var(--hatter-btn-bg);
border-color: var(--hatter-btn-bg);
}
.hatter-btn--primary:hover { color: var(--hatter-btn-fg); opacity: .88; transform: translateY(-2px); }
.hatter-btn--ghost {
color: var(--hatter-text); background: transparent; border-color: var(--hatter-border-strong);
}
.hatter-btn--ghost:hover { color: var(--hatter-text); opacity: 1; border-color: var(--hatter-text); }
.hatter-btn--sm { padding: 0.72em 1.15em; font-size: 0.76rem; } .hatter-arrow-link {
display: inline-flex; align-items: center; gap: .5em;
font-family: var(--hatter-font-kicker); font-weight: 600; letter-spacing: .16em;
text-transform: uppercase; font-size: .78rem; color: var(--hatter-text);
}
.hatter-arrow-link:hover { opacity: .75; }
.hatter-arrow-link span { transition: transform .2s ease; }
.hatter-arrow-link:hover span { transform: translateX(4px); } .hatter-suit { display: inline-block; width: 1em; height: 1em; fill: currentColor; vertical-align: -0.12em; }
.hatter-divider {
display: flex; align-items: center; justify-content: center; gap: 1rem;
color: var(--hatter-text-dim); margin-block: var(--hatter-s5);
}
.hatter-divider::before, .hatter-divider::after {
content: ""; height: 1px; flex: 1; max-width: 120px;
background: linear-gradient(to var(--_d, right), transparent, var(--hatter-border-strong));
}
.hatter-divider::before { --_d: left; }
.hatter-divider .hatter-suit { width: 1.1rem; height: 1.1rem; color: var(--hatter-text); }  .hatter-img-proof { position: relative; overflow: hidden; border-radius: var(--hatter-r-img); background: var(--hatter-surface); }
.hatter-img-proof img {
width: 100%; height: 100%; object-fit: cover;
filter: saturate(.45) contrast(1.06) brightness(.92);
transition: filter .5s ease, transform .6s cubic-bezier(.2,.7,.2,1);
}
.hatter-img-proof::before {
content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
background: var(--hatter-indigo-deep); mix-blend-mode: color; opacity: .25;
transition: opacity .5s ease;
}
.hatter-img-proof::after {
content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
background: linear-gradient(to top, var(--hatter-bg) 2%, transparent 55%);
}
.hatter-img-proof:hover img { filter: saturate(.9) contrast(1.02) brightness(1.02); transform: scale(1.04); }
.hatter-img-proof:hover::before { opacity: .08; } .hatter-img-duotone img { filter: url(#hatter-duotone) contrast(1.05); }
@media (prefers-reduced-motion: reduce) {
.hatter-img-proof img { transition: none; }
.hatter-img-proof:hover img { transform: none; }
} :where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
outline: 2px solid var(--hatter-text); outline-offset: 2px; border-radius: 2px;
}
.hatter-on-media:focus-visible { outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 5px rgba(0,0,0,.6); }
.hatter-visually-hidden {
position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.hatter-skip-link {
position: absolute; left: 50%; transform: translateX(-50%) translateY(-120%);
top: 8px; z-index: 10000; background: var(--hatter-surface); color: var(--hatter-text);
padding: .6em 1em; border: 1px solid var(--hatter-text); border-radius: var(--hatter-r-ui);
transition: transform .2s ease;
}
.hatter-skip-link:focus { transform: translateX(-50%) translateY(0); color: var(--hatter-text); }
::selection { background: var(--hatter-text); color: var(--hatter-bg); } .hatter-grid { display: grid; gap: var(--hatter-s4); }
@media (max-width: 640px) { :root { --hatter-header-height: 64px; } }.hatter-header {
position: fixed;
inset: 0 0 auto 0;
z-index: 1000;
height: var(--hatter-header-height);
display: flex;
align-items: center;
background: color-mix(in srgb, var(--hatter-bg) 82%, transparent);
backdrop-filter: blur(14px) saturate(1.2);
-webkit-backdrop-filter: blur(14px) saturate(1.2);
border-bottom: 1px solid transparent;
transition: background .3s ease, border-color .3s ease, transform .35s ease;
}
.hatter-header.is-scrolled {
background: color-mix(in srgb, var(--hatter-bg) 94%, transparent);
border-bottom-color: var(--hatter-border);
} .hatter-header.is-hidden { transform: translateY(-100%); }
.hatter-header__inner {
display: flex;
align-items: center;
gap: var(--hatter-s3);
width: 100%;
} .hatter-header__brand { display: inline-flex; align-items: center; gap: .6rem; flex-shrink: 0; }
.hatter-crest {
height: calc(var(--hatter-header-height) - 30px); width: auto; flex-shrink: 0;
filter: drop-shadow(0 0 10px rgba(245,241,234,.18));
}
.hatter-wordmark { display: inline-flex; flex-direction: column; line-height: .92; }
.hatter-wordmark__top {
font-family: var(--hatter-font-display);
font-weight: 600;
font-size: 1.6rem;
letter-spacing: -0.01em;
color: var(--hatter-text);
}
.hatter-wordmark__bottom {
font-family: var(--hatter-font-kicker);
font-size: .82rem;
letter-spacing: .34em;
text-transform: uppercase;
color: var(--hatter-text-muted);
padding-left: 2px;
}
.hatter-wordmark--sm .hatter-wordmark__top { font-size: 1.4rem; } .hatter-nav { margin-left: auto; }
.hatter-nav__list { display: flex; align-items: center; gap: clamp(1rem, 2vw, 2rem); }
.hatter-nav__list a {
font-family: var(--hatter-font-kicker);
font-size: 1.05rem;
letter-spacing: .16em;
text-transform: uppercase;
color: var(--hatter-text);
position: relative;
padding: .35em 0;
}
.hatter-nav__list a::after {
content: ""; position: absolute; left: 0; bottom: -2px; height: 2px; width: 0;
background: var(--hatter-grad); transition: width .25s ease;
}
.hatter-nav__list a:hover,
.hatter-nav__list .current-menu-item > a { color: var(--hatter-text); }
.hatter-nav__list a:hover::after,
.hatter-nav__list .current-menu-item > a::after { width: 100%; } .hatter-header__actions { display: flex; align-items: center; gap: var(--hatter-s3); } .hatter-burger { display: none; width: 44px; height: 44px; background: transparent; border: 0; position: relative; }
.hatter-burger span {
position: absolute; left: 10px; right: 10px; height: 2px; background: var(--hatter-text);
transition: transform .3s ease, opacity .2s ease; border-radius: 2px;
}
.hatter-burger span:nth-child(1) { top: 15px; }
.hatter-burger span:nth-child(2) { top: 21px; }
.hatter-burger span:nth-child(3) { top: 27px; }
.hatter-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hatter-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hatter-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); } .hatter-main { padding-top: var(--hatter-header-height); } body.home .hatter-main { padding-top: 0; } .hatter-drawer { position: fixed; inset: 0; z-index: 1100; }
.hatter-drawer[hidden] { display: none; } .hatter-drawer__scrim {
position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1;
background: rgba(5,3,10,.72); border: 0; opacity: 0; transition: opacity .3s ease;
}
.hatter-drawer__panel {
position: absolute; top: 0; right: 0; height: 100%; z-index: 2;
width: min(88vw, 360px);
background: var(--hatter-bg-2);
border-left: 1px solid var(--hatter-border);
padding: calc(var(--hatter-header-height) + 1rem) var(--hatter-s4) var(--hatter-s4);
display: flex; flex-direction: column;
transform: translateX(100%); transition: transform .35s cubic-bezier(.2,.7,.2,1);
text-align: right;
}
.hatter-drawer.is-open .hatter-drawer__scrim { opacity: 1; }
.hatter-drawer.is-open .hatter-drawer__panel { transform: translateX(0); }
.hatter-drawer__close {
position: absolute; top: 1rem; right: 1.25rem; font-size: 2.2rem; line-height: 1;
background: transparent; border: 0; color: var(--hatter-text-muted);
}
.hatter-drawer__close:hover { color: var(--hatter-magenta); }
.hatter-drawer__list { display: flex; flex-direction: column; gap: .25rem; }
.hatter-drawer__list a {
display: block; padding: .7rem 0;
font-family: var(--hatter-font-display); font-size: 1.6rem; color: var(--hatter-text);
border-bottom: 1px solid var(--hatter-border);
}
.hatter-drawer__list a:hover { color: var(--hatter-violet-bright); }
.hatter-drawer__foot { margin-top: auto; display: flex; flex-direction: column; gap: 1rem; align-items: flex-end; }
.hatter-drawer__foot .hatter-btn { width: 100%; } .hatter-totop {
position: fixed; right: clamp(1rem, 3vw, 1.75rem); bottom: clamp(1rem, 3vw, 1.75rem);
z-index: 900; width: 44px; height: 44px; border-radius: 50%;
display: grid; place-items: center; color: var(--hatter-text);
background: var(--hatter-surface-2); border: 1px solid var(--hatter-border-strong);
opacity: 0; visibility: hidden; transform: translateY(8px);
transition: opacity .3s ease, transform .3s ease, visibility .3s, border-color .2s, color .2s;
}
.hatter-totop.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.hatter-totop:hover { color: var(--hatter-violet-bright); border-color: var(--hatter-violet); } @media (max-width: 900px) {
.hatter-nav, .hatter-header__cta { display: none; }
.hatter-burger { display: block; }
.hatter-header__actions { margin-left: auto; gap: var(--hatter-s2); }
}
@media (min-width: 901px) {
.hatter-drawer { display: none; }
}
@media (prefers-reduced-motion: reduce) {
.hatter-header, .hatter-drawer__panel, .hatter-drawer__scrim, .hatter-totop { transition: none; }
}.hatter-footer {
background: var(--hatter-bg-2);
border-top: 1px solid var(--hatter-border);
padding-top: clamp(3rem, 6vw, 5rem);
padding-bottom: clamp(2rem, 4vw, 3rem);
position: relative;
overflow: hidden;
}
.hatter-footer__inner {
display: grid;
grid-template-columns: 1.6fr 1fr 1fr;
gap: var(--hatter-s5);
align-items: start;
position: relative;
}
.hatter-footer__lockup { display: inline-flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.hatter-footer__lockup .hatter-crest { height: 64px; width: auto; filter: drop-shadow(0 0 12px rgba(245,241,234,.16)); }
.hatter-footer__tagline { color: var(--hatter-text-muted); max-width: 32ch; margin-top: .75rem; }
.hatter-footer__area {
font-family: var(--hatter-font-kicker); letter-spacing: .2em; text-transform: uppercase;
color: var(--hatter-violet-bright); font-size: .85rem; margin-top: .75rem;
}
.hatter-footer__h {
font-family: var(--hatter-font-kicker); font-size: 1rem; letter-spacing: .22em;
text-transform: uppercase; color: var(--hatter-text-dim); margin-bottom: 1rem;
}
.hatter-footer__list { display: flex; flex-direction: column; gap: .55rem; }
.hatter-footer__list a { color: var(--hatter-text); }
.hatter-footer__list a:hover { color: var(--hatter-violet-bright); }
.hatter-footer__contact-link {
font-family: var(--hatter-font-display); font-size: 1.25rem; color: var(--hatter-text);
display: inline-block; margin-bottom: 1rem;
}
.hatter-footer__contact-link:hover { color: var(--hatter-violet-bright); }
.hatter-footer__socials { display: flex; gap: .75rem; }
.hatter-footer__socials a {
width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center;
background: var(--hatter-surface); border: 1px solid var(--hatter-border); color: var(--hatter-text);
transition: color .2s, border-color .2s, transform .2s;
}
.hatter-footer__socials a:hover { color: var(--hatter-violet-bright); border-color: var(--hatter-violet); transform: translateY(-2px); }
.hatter-footer__socials .hatter-suit { width: 1.15rem; height: 1.15rem; } .hatter-footer__ticket {
position: absolute; right: -10px; bottom: -30px; pointer-events: none; opacity: .5;
}
.hatter-footer__ticket-num {
font-family: var(--hatter-font-display); font-style: italic;
font-size: clamp(3rem, 8vw, 6rem); font-weight: 600;
color: transparent; -webkit-text-stroke: 1px var(--hatter-border-strong);
line-height: 1;
}
.hatter-footer__bar {
margin-top: clamp(2.5rem, 5vw, 4rem);
padding-block: 1.5rem;
border-top: 1px solid var(--hatter-border);
display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
color: var(--hatter-text-dim); font-size: .85rem;
}
.hatter-footer__bar a { color: var(--hatter-text-muted); }
.hatter-footer__bar a:hover { color: var(--hatter-violet-bright); }
@media (max-width: 780px) {
.hatter-footer__inner { grid-template-columns: 1fr 1fr; }
.hatter-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
.hatter-footer__inner { grid-template-columns: 1fr; }
.hatter-footer__bar { flex-direction: column; } .hatter-footer { padding-bottom: 4rem; }
}.hatter-fade-up {
opacity: 0;
transform: translateY(28px);
transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
will-change: opacity, transform;
}
.hatter-fade-up.is-in { opacity: 1; transform: none; }
.hatter-fade-up-item {
opacity: 0;
transform: translateY(24px);
transition: opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1);
}
.hatter-fade-up-stagger.is-in .hatter-fade-up-item { opacity: 1; transform: none; }
.hatter-fade-up-stagger.is-in .hatter-fade-up-item:nth-child(1) { transition-delay: .05s; }
.hatter-fade-up-stagger.is-in .hatter-fade-up-item:nth-child(2) { transition-delay: .12s; }
.hatter-fade-up-stagger.is-in .hatter-fade-up-item:nth-child(3) { transition-delay: .19s; }
.hatter-fade-up-stagger.is-in .hatter-fade-up-item:nth-child(4) { transition-delay: .26s; }
.hatter-fade-up-stagger.is-in .hatter-fade-up-item:nth-child(5) { transition-delay: .33s; }
.hatter-fade-up-stagger.is-in .hatter-fade-up-item:nth-child(6) { transition-delay: .40s; } @keyframes hatter-glow-drift {
0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: .55; }
50%      { transform: translate(-50%, -52%) scale(1.08); opacity: .8; }
}
@media (prefers-reduced-motion: reduce) {
.hatter-fade-up, .hatter-fade-up-item {
opacity: 1 !important; transform: none !important; transition: none !important;
}
[class*="hatter-"] { animation: none !important; }
}