:root{
  --container-max:1220px;
  --header-height:86px;
  --footer-height:170px;
  --h1-desktop:60px;
  --h1-mobile:38px;
  --h2-size:32px;
  --body-size:16px;
  --footnote-size:12px;
  --button-size:15px;
  --button-height:48px;
  --button-padding:22px;
  --card-w:420px;
  --card-h:210px;
  --card-radius:18px;
  --rule-w:680px;
  --rule-h:240px;
  --side-note-w:300px;
  --spacing-step-1:12px;
  --spacing-step-2:24px;
  --spacing-step-3:44px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family:"Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  font-size:var(--body-size);
  color:rgb(15,23,42);
  background-color:rgb(255,255,255);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.container{
  max-width:var(--container-max);
  margin-left:auto;
  margin-right:auto;
  padding-left:1rem;
  padding-right:1rem;
}
h1{font-family:"Cabinet Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; font-size:var(--h1-desktop); line-height:1.02; letter-spacing:-0.01em; margin:0}
h2{font-family:"Cabinet Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; font-size:var(--h2-size); line-height:1.12; margin:0}
h3,h4{font-family:"Cabinet Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial}
p{margin-top:0; margin-bottom:0}
a{color:inherit}
header{height:var(--header-height)}
footer{height:var(--footer-height)}
/* Buttons */
a[class*="inline-flex"],button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:var(--button-height);
  padding-left:var(--button-padding);
  padding-right:var(--button-padding);
  font-size:var(--button-size);
  border-radius:22px;
  text-decoration:none;
}
button:disabled, a[aria-disabled="true"]{opacity:0.5; cursor:not-allowed}
:focus{outline:none}
:focus-visible{box-shadow:0 0 0 4px rgba(0,122,204,0.12); border-radius:8px}
/* Cards and panels */
.card-standard{width:var(--card-w); height:var(--card-h); border-radius:18px; overflow:hidden}
.card-standard img{max-width:100%; height:auto; display:block; object-fit:cover}
.rule-panel{width:var(--rule-w); max-width:100%; height:var(--rule-h); border-radius:18px; overflow:hidden}
.side-note{max-width:var(--side-note-w)}
/* Layout helpers */
.grid-12{display:grid; grid-template-columns:repeat(12,1fr); gap:24px}
@media (max-width:1024px){.grid-12{grid-template-columns:repeat(8,1fr)}}
@media (max-width:640px){.grid-12{grid-template-columns:1fr}}
/* Image constraints */
img{max-width:100%; height:auto; display:block}
/* Cookie consent */
#cookie-consent{border-radius:14px}
@media (max-width:640px){
  :root{--h1-desktop:38px}
  h1{font-size:var(--h1-mobile)}
  .container{padding-left:3%; padding-right:3%}
  .card-standard{width:100%; height:auto}
  .rule-panel{width:100%; height:auto}
  header{height:86px}
  section{padding-top:60px; padding-bottom:60px}
}
/* Accessibility helpers for keyboard users */
a:focus, button:focus, input:focus, textarea:focus{outline-offset:2px}
/* Modal and menu overlay helpers */
#mobile-menu[aria-hidden="false"]{display:block}
#mobile-menu[aria-hidden="true"]{display:none}
.lock-scroll{overflow:hidden}
/* Minor utility to ensure text contrast on darker backgrounds */
.contrast-light{color:rgb(255,255,255)}
.contrast-dark{color:rgb(17,24,39)}
/* Small print */
.footnote{font-size:var(--footnote-size); color:rgb(107,114,128)}
/* Motion safe reduced animations */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important}
}