/* aperintelligence.com, shared styles for every page. The homepage adds home.css.
   Adapted from the Vantage site, on the navy palette from the logo pack. */

/* Manrope carries the headings and body, so it is served from this site and
   preloaded in the layout: from Google Fonts it arrived late enough that the
   headline repainted seconds after the page appeared. One variable file covers
   weights 200 to 700, Latin only (Google's latin range). SIL Open Font License,
   in fonts/LICENSE-Manrope. */
@font-face{
  font-family:"Manrope";font-style:normal;font-weight:200 700;font-display:swap;
  src:url("/assets/fonts/manrope-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  --navy-deep:   #091420;
  --navy:        #0D1B2A;
  --navy-raised: #12233A;
  --navy-high:   #183049;
  --navy-field:  #0A1624;
  --line:        rgba(226,234,246,0.10);
  --line-strong: rgba(226,234,246,0.18);
  --line-hover:  rgba(226,234,246,0.5);
  --tint:        rgba(226,234,246,0.04);
  /* Every button is a white outline with no fill (Julius, 2026-10-06). */
  --button-line: #FFFFFF;

  --text:        #EEF2F7;
  --text-soft:   rgba(226,234,246,0.8);
  --text-muted:  #93A3B8;
  --periwinkle:  #A9BCFF;
  --sky:         #7FB3E6;
  --steel:       #8FB8C9;
  --accent:       #5B73F5;

  --serif: "Instrument Serif", Georgia, serif;
  --sans:  "Manrope", system-ui, sans-serif;
  --mono:  "JetBrains Mono", ui-monospace, monospace;
  /* The company name beside the logo, set as on the live site (Julius, 2026-10-05). */
  --wordmark: "Questrial", "Manrope", system-ui, sans-serif;

  --nav-h:  76px;
  --logo-h: 44px;
  --wrap:   1240px;

  --fs-h2:    clamp(23.8px, 1.68vw + 12.6px, 36.4px);
  --fs-h4:    clamp(15.4px, 0.63vw + 10.5px, 19.6px);
  --fs-lead:  clamp(12px, 0.28vw + 10.15px, 14px);
  --fs-intro: clamp(12px, 0.21vw + 9.8px, 12.6px);
  --fs-title: 12px;
  --fs-meta:  12px;
  --sec-pad:  clamp(72px, 9vw, 120px);
  --head-gap: clamp(32px, 4vw, 56px);

  --card-pad-y: 32px;
  --card-pad-x: 28px;

  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 20px;
  --r-xl: 28px;

  --shadow-edge: inset 0 1px 0 rgba(226,234,246,0.05);
  --shadow-card: 0 50px 100px -60px rgba(0,0,0,0.9);
  --ease-out: cubic-bezier(.2,.8,.2,1);
  --t-fast: 160ms;
  --t: 240ms;
}

/* ---------- base ---------- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion:no-preference){ html{scroll-behavior:smooth;} }
body{margin:0;background:var(--navy);color:var(--text);font:400 12px/1.65 var(--sans);-webkit-font-smoothing:antialiased;}
/* Headings are Manrope (font gate, 2026-10-05): ExtraLight at display sizes,
   Regular for the small titles, where 200 is too thin to read. Instrument Serif
   stays only inside the sample-build mockups, as the hotel brand face. */
h1,h2,h3{font-family:var(--sans);font-weight:400;margin:0;letter-spacing:-0.025em;line-height:1.1;text-wrap:balance;}
h1,h2{font-weight:200;letter-spacing:-0.02em;}
p{margin:0;}
p,figcaption,summary{text-wrap:pretty;}
b,strong{font-weight:600;}
a{color:inherit;text-decoration:none;}
/* height:auto lets the width and height attributes set the shape without fixing the height in pixels. */
img{max-width:100%;height:auto;display:block;}
button{font:inherit;color:inherit;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;}
/* The hex field (hexfield.js) is one fixed layer over every section background,
   the hero photograph and the footer included, and under every .wrap, so it
   shows through the whole page but never over text or controls. For that to
   hold, neither main nor the footer may form a stacking context of its own:
   neither carries a z-index. */
#hexField{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.wrap{position:relative;z-index:1;}
section{padding:var(--sec-pad) 0;}
/* Sections on the darker ground, alternating with the base colour down a page. */
.band{background:var(--navy-deep);border-block:1px solid var(--line);}
.tight-top{padding-top:0;}
:focus-visible{outline:2px solid var(--periwinkle);outline-offset:3px;}
section[id]{scroll-margin-top:calc(var(--nav-h) + 16px);}
@keyframes rise{from{opacity:0;transform:translateY(6px);}}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:10px 22px;line-height:1.25;text-align:center;
  border-radius:999px;font-weight:400;font-size:12.6px;font-family:inherit;
  border:1px solid var(--button-line);cursor:pointer;
  background:transparent;color:var(--text);
  transition:background-color var(--t) var(--ease-out), transform var(--t-fast) var(--ease-out);
}
.btn[disabled]{opacity:.42;pointer-events:none;}

/* The press, on every kind of button: a soft white wash spreads from the exact
   point pressed and fades, and a glow rings the outline. site.js sets
   --press-x, --press-y and --press-size and adds .is-pressed. */
.btn,.cookie-btn,.icon-btn,.play-pill,.lumen-trigger,.lumen-icon{position:relative;overflow:hidden;isolation:isolate;}
.btn:active,.cookie-btn:active,.icon-btn:active,.play-pill:active,.lumen-trigger:active,.lumen-icon:active{transform:scale(.97);}
.btn::after,.cookie-btn::after,.icon-btn::after,.play-pill::after,.lumen-trigger::after,.lumen-icon::after{
  content:"";position:absolute;z-index:-1;left:var(--press-x, 50%);top:var(--press-y, 50%);
  width:var(--press-size, 200%);aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle, rgba(255,255,255,.55) 0, rgba(255,255,255,.18) 45%, transparent 70%);
  opacity:0;transform:translate(-50%, -50%) scale(0);
}
.is-pressed{animation:press-glow 700ms var(--ease-out);}
.is-pressed::after{animation:press-wash 700ms var(--ease-out);}
@keyframes press-wash{
  from{opacity:1;transform:translate(-50%, -50%) scale(0);}
  to{opacity:0;transform:translate(-50%, -50%) scale(1);}
}
@keyframes press-glow{
  from{box-shadow:0 0 0 0 rgba(255,255,255,.4);}
  to{box-shadow:0 0 0 8px rgba(255,255,255,0);}
}

/* ---------- nav ---------- */
/* Transparent at rest so the homepage photograph runs behind it; it darkens as
   soon as the page moves, because text scrolling under a see-through bar is
   unreadable. The :has() arm covers the open phone menu, whose panel is solid. */
.nav{
  position:sticky;top:0;z-index:50;height:var(--nav-h);
  transition:background-color var(--t) var(--ease-out);
}
.nav.scrolled,
.nav:has(.nav-links.open){
  background:rgba(9,20,32,0.3);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.nav .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.nav .logo{display:flex;align-items:center;flex-shrink:0;min-height:44px;}
.nav .logo img{height:var(--logo-h);width:auto;}
/* The icon with the company name set beside it, in the nav and the footer. */
.logo{display:flex;align-items:center;gap:12px;}
.logo span{position:relative;top:2px;font-family:var(--wordmark);font-weight:400;font-size:20px;letter-spacing:-0.01em;line-height:1;color:#fff;white-space:nowrap;}
.nav-links{display:flex;align-items:center;gap:22px;font-size:12.6px;font-weight:400;}
.nav-links a{white-space:nowrap;}
.nav-links a:not(.btn){color:var(--text-soft);transition:color var(--t) var(--ease-out);}
.nav-links .btn{min-height:36px;padding:0 16px;}
/* 10px padding round a 24px icon makes a 44px target; the negative margin keeps the icon on the page edge. */
.nav-burger{display:none;background:none;border:0;padding:10px;margin-right:-10px;cursor:pointer;color:var(--text);}

/* ---------- long-form legal pages ---------- */
.prose{max-width:70ch;}
.prose h2{font-size:clamp(18.2px, 2.1vw, 22.4px);margin-top:44px;}
.prose h2:first-child{margin-top:0;}
.prose h3{font-size:14.7px;margin-top:28px;}
.prose p,.prose li{color:var(--text-muted);font-size:12px;}
.prose p{margin-top:14px;}
.prose ul{margin:14px 0 0;padding-left:22px;}
.prose li{margin-bottom:8px;}
.prose a{color:var(--text);text-decoration:underline;text-underline-offset:3px;}
.prose strong{color:var(--text);}
.prose .legal-contact{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);}
.prose code{font-family:var(--mono);font-size:.95em;color:var(--text);}

/* ---------- single-message pages ---------- */
.centred{max-width:52ch;margin:0 auto;text-align:center;}
.centred h1{font-size:clamp(23.8px, 3.22vw, 33.6px);}
.centred p{margin-top:18px;color:var(--text-muted);font-size:12px;}
.centred p a{color:var(--text);text-decoration:underline;text-underline-offset:3px;}
.centred .actions{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap;justify-content:center;}

/* Read by screen readers, not shown. */
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- forms ---------- */
.inline-error{margin-top:16px;padding:12px 16px;border-radius:var(--r-xs);font-size:14px;color:#B5D3F2;background:rgba(127,179,230,.12);border:1px solid rgba(127,179,230,.4);}
.inline-error[hidden]{display:none;}
.form-group{margin-bottom:22px;}
.form-group label{display:block;font-size:12px;font-weight:600;margin-bottom:8px;}
.form-group label .req{color:var(--periwinkle);margin-left:2px;}
.form-control{
  width:100%;min-height:44px;padding:12px 16px;border:1px solid var(--line-strong);border-radius:var(--r-xs);
  font-family:inherit;font-size:12px;color:var(--text);background:var(--navy-field);
  transition:border-color var(--t) var(--ease-out), box-shadow var(--t) var(--ease-out);
}
.form-control::placeholder{color:rgba(147,163,184,0.7);}
.form-control:focus{outline:none;border-color:var(--periwinkle);box-shadow:0 0 0 3px rgba(169,188,255,0.16);}
.form-control[aria-invalid="true"]{border-color:var(--sky);}
select.form-control{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a69f95' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 14px center;background-size:16px;padding-right:42px;}
select.form-control option{background:var(--navy-raised);color:var(--text);}
textarea.form-control{resize:vertical;min-height:90px;}
.form-terms-note{font-size:12px;color:var(--text-muted);margin-top:16px;line-height:1.5;}

/* ---------- footer ---------- */
.site-foot{position:relative;padding:56px 0 40px;border-top:1px solid var(--line);background:var(--navy-deep);font-size:12px;color:var(--text-muted);}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:48px;}
.foot-brand img{height:38px;width:auto;}
.foot-brand .logo span{font-size:18px;}
.foot-tagline{margin-top:18px;max-width:38ch;line-height:1.6;}
.foot-contact{display:inline-block;margin-top:14px;padding-block:6px;font-weight:500;color:var(--periwinkle);}
.foot-title{margin-bottom:10px;font-weight:600;color:var(--text);}
.foot-col ul{list-style:none;margin:0;padding:0;}
.foot-col a,.foot-bottom a{display:inline-block;padding-block:5px;transition:color var(--t) var(--ease-out);}
.foot-bottom{margin-top:36px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:14px;font-size:var(--fs-meta);}
.foot-company a{text-decoration:underline;text-underline-offset:3px;}
.legal{display:flex;flex-wrap:wrap;gap:4px 20px;}

/* ========== Homepage sections and the content pages ========== */

/* Big section headings. */
.split-head h2,.register h2{font-size:var(--fs-h2);line-height:1.08;}

/* A heading with its intro paragraph set beside it. */
.split-head{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:20px;align-items:last baseline;margin-bottom:var(--head-gap);}
.split-head p{grid-column:2 / -1;max-width:54ch;color:var(--text-muted);font-size:var(--fs-intro);line-height:1.6;}
/* A split head whose line under the heading is a statement: stacked, full width, set like a subheading. */
.split-head.statement{grid-template-columns:1fr;}
.split-head.statement p{grid-column:auto;max-width:62ch;font-size:var(--fs-h4);font-weight:200;letter-spacing:-0.01em;line-height:1.45;color:var(--text);}
.split-head p a{color:var(--text);text-decoration:underline;text-underline-offset:3px;}

/* ---------- page hero (content pages) ---------- */
.page-hero{padding:clamp(40px, 4.5vw, 64px) 0 clamp(28px, 3vw, 40px);}
.page-hero h1{font-size:clamp(28px, 2.1vw + 14px, 47.6px);line-height:1.04;max-width:16ch;}
.standfirst{margin-top:24px;max-width:58ch;font-size:clamp(12.6px, 0.35vw + 10.5px, 15.4px);line-height:1.55;color:var(--text-soft);}
.standfirst a{color:var(--text);text-decoration:underline;text-underline-offset:4px;}

/* Photographs with a hairline drawn over them, so the image never bleeds past a border at the rounded corners. */
.feature-media,.room-card .ph{position:relative;margin:0;overflow:hidden;}
.feature-media::after,.room-card .ph::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--line);pointer-events:none;}
.feature-media img,.room-card img{width:100%;height:100%;object-fit:cover;}

/* ---------- photo link cards (We build and We govern on the homepage) ---------- */
.room-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:20px;align-items:start;}
.room-card{display:block;}
.room-card .ph{height:clamp(280px, 24vw, 340px);border-radius:var(--r-lg);}
.room-card img{transition:transform 1.6s var(--ease-out);}
.room-text{margin-top:14px;max-width:40ch;font-size:12px;color:var(--text-muted);}
.room-text strong{display:block;margin-bottom:2px;font-size:var(--fs-title);color:var(--text);}
.room-text .more{display:block;margin-top:10px;font-size:12px;font-weight:600;color:var(--periwinkle);}

/* ---------- feature rows (We build, We govern, Products) ---------- */
.features{display:grid;gap:clamp(64px, 8vw, 120px);}
.feature{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(40px, 5vw, 80px);align-items:center;scroll-margin-top:calc(var(--nav-h) + 24px);}
.feature-media{aspect-ratio:4 / 3;border-radius:var(--r-xl);}
.feature h2{font-size:clamp(21px, 1.12vw + 14px, 30.8px);}
.feature-lead{margin-top:16px;font-size:var(--fs-lead);line-height:1.5;color:var(--text);}
.feature p:not(.feature-lead){margin-top:14px;max-width:52ch;font-size:12px;line-height:1.7;color:var(--text-muted);}
.feature p a{color:var(--text);text-decoration:underline;text-decoration-color:rgba(169,188,255,.55);text-underline-offset:3px;}

/* ---------- capability catalogue (We build, We govern) ---------- */
.catalogue{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
.catalogue h3 a{text-decoration:none;}
.catalogue li a,.point p a{color:var(--text);text-decoration:underline;text-underline-offset:3px;}
.catalogue h3{padding-bottom:14px;border-bottom:1px solid var(--line-strong);font-size:var(--fs-h4);font-weight:200;letter-spacing:-0.02em;}
.catalogue ul{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:12px;}
.catalogue li{display:flex;gap:12px;align-items:baseline;color:var(--text-soft);}
.catalogue li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent);transform:translateY(-2px);}

/* ---------- sector tiles: a photograph with the sector named over its foot ---------- */
.sectors{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.sector{position:relative;margin:0;aspect-ratio:16 / 10;border-radius:var(--r-lg);overflow:hidden;}
.sector img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease-out);}
.sector::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg, rgba(9,20,32,.85), rgba(9,20,32,0) 55%);box-shadow:inset 0 0 0 1px var(--line);border-radius:inherit;}
.sector figcaption{position:absolute;left:20px;bottom:16px;z-index:1;font-size:var(--fs-h4);font-weight:200;letter-spacing:-0.02em;}

/* ---------- ways to work with us ---------- */
.ways{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.way{padding:28px 24px;border-radius:var(--r-lg);background:var(--navy-raised);border:1px solid var(--line);box-shadow:var(--shadow-edge);}
.way-n{font-family:var(--mono);font-size:12px;color:var(--periwinkle);}
.way h3{margin-top:28px;font-size:var(--fs-h4);font-weight:200;letter-spacing:-0.02em;}
.way p{margin-top:10px;color:var(--text-muted);}

/* ---------- good fit and questions, side by side ---------- */
.fit-faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px, 6vw, 96px);align-items:start;}
.fit-faq h2{font-size:var(--fs-h2);margin-bottom:24px;}
.fit-list{list-style:none;margin:0;padding:0;display:grid;gap:14px;}
.fit-list li{display:flex;gap:12px;align-items:baseline;color:var(--text-soft);}
.fit-list li::before{content:"";flex:none;width:14px;height:8px;border-left:2px solid var(--steel);border-bottom:2px solid var(--steel);transform:rotate(-45deg) translateY(-3px);}
.faq-list details{border-bottom:1px solid var(--line);}
.faq-list details:first-of-type{border-top:1px solid var(--line);}
.faq-list summary{list-style:none;cursor:pointer;padding:18px 40px 18px 0;position:relative;color:var(--text);}
.faq-list summary::-webkit-details-marker{display:none;}
/* A drawn plus that turns into a cross when the answer opens. */
.faq-list summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;margin-top:-6px;background:linear-gradient(currentColor, currentColor) center / 12px 1.5px no-repeat, linear-gradient(currentColor, currentColor) center / 1.5px 12px no-repeat;color:var(--text-muted);transition:transform var(--t) var(--ease-out), color var(--t) var(--ease-out);}
.faq-list details[open] summary::after{transform:rotate(45deg);color:var(--periwinkle);}
.faq-list details p{padding:0 40px 20px 0;max-width:62ch;color:var(--text-muted);}
.faq-list details[open] p{animation:rise .35s var(--ease-out) both;}

/* ---------- plain points (products, how we work, where to start) ---------- */
.points{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;}
.points.cols-3{grid-template-columns:repeat(3,1fr);gap:44px 40px;}
.points.cols-2{grid-template-columns:repeat(2,1fr);gap:44px 40px;}
.point{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:8px;align-content:start;border-top:1px solid var(--line-strong);padding-top:20px;}
.point h3{font-family:var(--sans);font-weight:600;font-size:var(--fs-title);line-height:1.35;}
.point p{max-width:36ch;font-size:12px;color:var(--text-muted);}
.point p a{color:var(--text);text-decoration:underline;text-underline-offset:3px;}

/* ---------- register panel (end of the homepage and every content page) ---------- */
.register{display:grid;grid-template-columns:1fr 1fr;gap:56px;padding:56px;border-radius:var(--r-xl);background:linear-gradient(160deg, var(--navy-high), var(--navy-raised));border:1px solid var(--line);box-shadow:var(--shadow-edge);}
.register-lead{margin-top:18px;max-width:46ch;font-size:var(--fs-intro);line-height:1.6;color:var(--text-muted);}
.register ul{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:12px;}
.register li{display:flex;gap:12px;align-items:baseline;}
.register li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--line-hover);flex:none;transform:translateY(-2px);}
.register-actions{display:grid;gap:12px;align-self:stretch;align-content:center;padding-left:56px;border-left:1px solid var(--line);}
.register-note{margin-bottom:8px;font-size:12px;color:var(--text-muted);}
.register-actions .btn{width:100%;max-width:440px;}

/* The homepage contact card is a register panel: how to reach us on the left, the form on the right. */
.contact-details{display:grid;gap:16px;margin:28px 0 0;}
.contact-details dt{font-size:12px;color:var(--text-muted);}
.contact-details dd{margin:2px 0 0;color:var(--text);}
.contact-details a{color:var(--text);text-decoration:underline;text-underline-offset:3px;}
.contact-sent h3{font-size:var(--fs-h4);font-weight:200;}
.contact-sent p{margin-top:8px;color:var(--text-muted);}

/* ---------- accessibility ---------- */
.skip{
  position:absolute;left:-9999px;top:0;z-index:100;
  padding:12px 20px;background:var(--text);color:var(--navy-deep);border-radius:0 0 10px 0;
  font-size:12px;font-weight:600;
}
.skip:focus{left:0;}

/* Every hover state lives here, so touch screens never keep a stuck hover after a tap. */
@media (hover:hover){
  .btn:hover,.cookie-btn:hover,.icon-btn:hover,.play-pill:hover,.lumen-trigger:hover,.lumen-icon:hover{background-color:var(--tint);}
  .nav-links a:not(.btn):hover,.foot-col a:hover,.foot-bottom a:hover,.foot-contact:hover{color:var(--text);}
  .room-card:hover img{transform:scale(1.025);}
  .room-card:hover .more{text-decoration:underline;text-underline-offset:4px;}
  .sector:hover img{transform:scale(1.03);}
  .faq-list summary:hover::after{color:var(--periwinkle);}
}

/* Image and text swap sides on every other row, and on any row marked media-right, on screens wide enough to have two sides. */
@media (min-width:901px){
  .feature:nth-child(even) .feature-media,.feature.media-right .feature-media{order:2;}
}

@media (max-width:1080px){
  .points,.points.cols-3{grid-template-columns:1fr 1fr;}
}
@media (max-width:900px){
  .wrap{padding:0 20px;}
  /* iPhones zoom the whole page into any field set under 16px, so fields are 16px on phones and tablets. */
  .form-control{font-size:16px;}
  .split-head{grid-template-columns:1fr;gap:16px;}
  .split-head p{grid-column:auto;}
  .room-grid{grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));}
  .room-card .ph{height:auto;aspect-ratio:4 / 3;}
  .feature,.register,.fit-faq{grid-template-columns:1fr;gap:36px;}
  .catalogue,.sectors{grid-template-columns:1fr 1fr;}
  .ways{grid-template-columns:1fr 1fr;}
  .register{padding:32px 24px;}
  .register-actions{padding:28px 0 0;border-left:0;border-top:1px solid var(--line);}
  .foot-grid{grid-template-columns:1fr 1fr;gap:36px 24px;}
  .foot-brand{grid-column:1 / -1;}
  /* 44px tap areas on touch screens. The list and footer links get full rows; the headings
     and the footer logo get padding with a matching negative margin, so nothing visibly moves. */
  .catalogue ul:has(> li > a){gap:0;}
  .catalogue li > a{display:inline-flex;align-items:center;min-height:44px;}
  .catalogue h3 a,.point h3 a{display:inline-block;padding:14px 0;margin:-14px 0;}
  .foot-brand .logo{padding:3px 0;margin:-3px 0;}
  .foot-col a,.legal a,.foot-contact{display:inline-flex;align-items:center;min-height:44px;padding-block:0;}
  .legal a{min-width:44px;justify-content:center;}
  .foot-contact{margin-top:6px;}
}
/* Eight links and a button need about 1220px on one row, so below this the menu folds into the burger. */
@media (max-width:1230px){
  .nav-links{
    display:none;position:absolute;top:var(--nav-h);left:0;right:0;
    background:var(--navy-deep);border-bottom:1px solid var(--line);
    flex-direction:column;align-items:flex-start;gap:0;padding:12px 32px 20px;
  }
  .nav-links.open{display:flex;}
  .nav-links a:not(.btn){padding:12px 0;width:100%;font-size:14px;}
  .nav-links .btn{margin-top:10px;margin-bottom:6px;min-height:44px;padding:0 24px;}
  .nav-burger{display:block;}
}
@media (max-width:720px){
  :root{--nav-h:68px;--logo-h:38px;}
  .nav .logo span{font-size:15px;top:1px;}
  .nav-links{padding:12px 20px 20px;}
}
@media (max-width:560px){
  .room-grid,.points,.points.cols-3,.points.cols-2,.catalogue,.sectors,.ways{grid-template-columns:1fr;}
  .points,.points.cols-3{gap:28px;}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;}
}

/* ---------- cookie card (cookie-consent.js) ---------- */
#cookie-card{
  position:fixed;z-index:60;left:16px;bottom:calc(16px + env(safe-area-inset-bottom, 0px));
  width:min(300px, calc(100vw - 32px));padding:16px 16px 14px;border-radius:14px;
  background:var(--navy-raised);border:1px solid var(--line-strong);box-shadow:var(--shadow-card);
  font-size:12px;line-height:1.5;color:var(--text-muted);
  opacity:0;transform:translateY(8px);transition:opacity .4s var(--ease-out), transform .4s var(--ease-out);
}
#cookie-card.is-visible{opacity:1;transform:none;}
#cookie-card p{padding-right:20px;}
#cookie-card a{color:var(--text);text-decoration:underline;text-underline-offset:3px;}
.cookie-close{position:absolute;top:0;right:0;width:44px;height:44px;background:none;border:0;color:var(--text-muted);font-size:12.6px;line-height:1;cursor:pointer;}
.cookie-actions,.cookie-settings{display:flex;align-items:center;gap:8px;margin-top:12px;}
.cookie-settings{justify-content:space-between;color:var(--text);}
.cookie-settings[hidden]{display:none;}
.cookie-btn{min-height:44px;padding:0 14px;border-radius:999px;cursor:pointer;font-weight:600;font-size:12px;color:var(--text);background:transparent;border:1px solid var(--button-line);transition:background-color var(--t) var(--ease-out), transform var(--t-fast) var(--ease-out);}
/* Padding makes a 44px tap area; the matching negative margin keeps the card the same size. */
.cookie-link{margin:-13px 0 -13px auto;background:none;border:0;padding:13px 0;cursor:pointer;font-size:12px;color:var(--text-muted);text-decoration:underline;text-underline-offset:3px;}
@media (hover:hover){
  .cookie-close:hover,.cookie-link:hover{color:var(--text);}
}