/* Knightlings site: brand refresh 2026-10-30 (logo L1, crest I4: navy, parchment, gold, ink outlines, Lilita One) over the slice 38 layout. No third-party requests. */
@font-face{font-family:"Lilita One";src:url(/assets/LilitaOne.6952821f.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow Semi Condensed";src:url(/assets/BarlowSemiCondensed-Regular.6da1bffd.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow Semi Condensed";src:url(/assets/BarlowSemiCondensed-SemiBold.6b61bf61.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Semi Condensed";src:url(/assets/BarlowSemiCondensed-Bold.ecf50652.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
  /* the brand: the boot splash navy, the icon's parchment, the wordmark's cream, gold and ink */
  --navy-950:#0e1330;--navy-900:#151c3c;--navy-800:#1c2446;--navy-700:#263161;--navy-600:#36447f;
  --parch-100:#fbf3e1;--parch-200:#f3e4c4;--parch-300:#e6d0a2;
  --ink:#341e10;--ink-soft:#6b4f36;--lip:#0a0e24;
  --cream:#fff4dc;--gold:#f2c14e;--gold-deep:#d4962c;--gold-light:#fde49a;
  --crest-blue:#3f6fd8;--crest-green:#4f9a46;
  --text:#f2ecdf;--text-dim:#c4c8dc;
  --f-display:"Lilita One","Arial Rounded MT Bold",system-ui,sans-serif;
  --f-ui:"Barlow Semi Condensed","Helvetica Neue",Helvetica,sans-serif;
  --r-s:6px;--r-m:10px;--r-l:18px;--r-pill:999px;
  --gutter:16px;--wrap:1120px;
  --outline:0 0 0 3px var(--ink);
}
@media (min-width:720px){:root{--gutter:32px}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--navy-900);color:var(--text);font:400 17px/1.55 var(--f-ui);-webkit-font-smoothing:antialiased;text-wrap:pretty}
img{display:block;max-width:100%}
a{color:var(--gold);text-underline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;z-index:20;padding:10px 14px;border-radius:var(--r-m);background:var(--parch-100);color:var(--ink);font:700 15px/1 var(--f-ui);text-decoration:none}
.skip:focus{top:12px}
a:hover{color:var(--cream)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.lbl{font:700 13px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
h1,h2,h3{font-family:var(--f-display);font-weight:400;line-height:1.05;letter-spacing:.01em;margin:0;text-wrap:balance}
p{margin:0}

/* header */
.top{position:absolute;inset:0 0 auto;z-index:5}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:72px}
.brand{display:flex;align-items:center;text-decoration:none;filter:drop-shadow(0 2px 4px rgba(5,8,24,.5))}
.brand img{width:112px;height:auto}
.top-link{font:700 13px/1 var(--f-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--cream);text-decoration:none;height:40px;display:inline-flex;align-items:center;padding:0 14px;border-radius:var(--r-m);background:rgba(14,19,48,.72);box-shadow:inset 0 0 0 1.5px rgba(242,193,78,.55)}
.top-link:hover{color:var(--gold)}

/* hero: the Thornwick still under a navy wash, the logo lockup over its foot */
.hero{position:relative;background:var(--navy-900)}
.hero-art{position:relative;height:clamp(360px,58vw,600px);overflow:hidden;background:var(--navy-800)}
.hero-art img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:45% 60%}
.hero-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,19,48,.55) 0,rgba(14,19,48,0) 22%,rgba(14,19,48,0) 45%,rgba(21,28,60,.82) 80%,var(--navy-900) 100%)}
.hero-copy{position:relative;margin-top:clamp(-210px,-17vw,-90px);display:grid;justify-items:center;text-align:center;gap:18px;padding-bottom:60px}
.hero-copy .lbl{text-shadow:0 1px 0 var(--lip),0 0 8px var(--lip)}
.hero h1.logo{margin:0;width:min(560px,100%);filter:drop-shadow(0 10px 22px rgba(5,8,24,.55))}
.hero h1.logo img{width:100%;height:auto}
.pitch{font-size:clamp(19px,2.5vw,23px);line-height:1.4;color:var(--text);max-width:44ch}
.pitch b{color:var(--gold);font-weight:700}
.stores{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center}
.soon-lbl{flex-basis:100%;font:600 14px/1.2 var(--f-ui);color:var(--text-dim)}
.badge{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 16px 0 12px;border-radius:var(--r-m);background:var(--navy-950);color:var(--cream);box-shadow:inset 0 0 0 1.5px rgba(196,200,220,.4);cursor:default;user-select:none}
.badge .t{display:grid;gap:2px;text-align:left}
.badge small{font:700 10px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.badge span{font:600 19px/1 var(--f-ui);letter-spacing:.01em}
.cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 16px}
/* the gold button: the wordmark's LINGS, ink outline, a lip under it */
.btn{height:50px;padding:0 22px;border-radius:14px;display:inline-flex;align-items:center;gap:8px;font:400 19px/1 var(--f-display);letter-spacing:.04em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.btn-pri{background:linear-gradient(180deg,var(--gold-light),var(--gold) 45%,var(--gold-deep));color:var(--ink);box-shadow:0 0 0 3px var(--ink),0 5px 0 3px var(--ink),0 10px 22px rgba(5,8,24,.45);margin-bottom:5px}
.btn-pri:hover{color:var(--ink);filter:brightness(1.06)}
.btn-pri:active{transform:translateY(3px);box-shadow:0 0 0 3px var(--ink),0 2px 0 3px var(--ink)}
.cta-note{font-size:15px;color:var(--text-dim)}

/* header nav (desktop only; the page is one scroll on a phone) */
.top-nav{display:none;gap:4px 22px;margin-left:auto;margin-right:8px}
.top-nav a{font:600 15px/1 var(--f-ui);color:var(--cream);text-decoration:none;text-shadow:0 1px 0 var(--lip),0 0 6px var(--lip);padding:10px 0}
.top-nav a:hover{color:var(--gold)}
@media (min-width:900px){.top-nav{display:flex}}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
[id]{scroll-margin-top:16px}

/* facts strip: a gold ribbon under the hero */
.facts{background:linear-gradient(180deg,var(--gold),var(--gold-deep));border-block:3px solid var(--ink)}
.facts ul{list-style:none;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 30px;padding-block:14px;font:700 16px/1.2 var(--f-ui);color:var(--ink)}
.facts li{display:flex;align-items:center;gap:8px}
.facts li::before{content:"";width:7px;height:7px;background:var(--ink);transform:rotate(45deg);flex:none}

/* shared section heads: cream Lilita with the wordmark's dark lip */
.head{display:grid;gap:12px;max-width:62ch;margin-bottom:34px}
h2{font-size:clamp(36px,5.4vw,54px);color:var(--cream);text-shadow:0 3px 0 var(--lip)}
h3{font-size:24px;color:var(--cream)}
.head p,.story-copy p,.gentle-copy p,.feat-copy p{color:var(--text);max-width:60ch}
.band{padding-block:76px}
.frame{position:relative;margin:0;border-radius:var(--r-l);overflow:hidden;background:var(--navy-700);aspect-ratio:16/9;box-shadow:0 0 0 3px var(--ink),0 0 0 6px rgba(242,193,78,.85),0 0 0 8px var(--ink),0 16px 34px rgba(5,8,24,.5)}
.frame img{width:100%;height:100%;object-fit:cover}

/* story */
.story{display:grid;gap:36px;padding-block:80px;align-items:center}
.story-copy{display:grid;gap:14px}
.story-copy h2{margin-bottom:4px}
@media (min-width:860px){.story{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px}}
.parch{background:radial-gradient(120% 90% at 30% 20%,var(--parch-100),var(--parch-200) 60%,var(--parch-300));color:var(--ink);border-radius:var(--r-l);box-shadow:0 0 0 3px var(--ink),0 6px 0 3px var(--ink),0 22px 44px rgba(5,8,24,.5)}
.carved{padding:30px 26px;display:grid;gap:14px;justify-items:center;text-align:center}
.carved .lbl{color:var(--ink-soft)}
.carved blockquote{margin:0;font:400 clamp(23px,2.6vw,28px)/1.12 var(--f-display);color:var(--ink);text-wrap:balance}
.carved blockquote+blockquote{padding-top:14px;border-top:2px dashed rgba(107,79,54,.35);width:100%}
.carved p{font-size:15px;line-height:1.45;color:var(--ink-soft);max-width:34ch}

/* gameplay: a parchment band, like the icon's ground */
.play-band{background:radial-gradient(90% 70% at 20% 0,var(--parch-100),var(--parch-200) 70%);color:var(--ink);border-block:3px solid var(--ink)}
.play-band h2{color:var(--navy-800);text-shadow:0 3px 0 rgba(242,193,78,.55)}
.play-band .lbl{color:var(--gold-deep)}
.play-band .head p,.play-band .feat-copy p{color:var(--ink)}
.play-band h3{color:var(--navy-800)}
.pillars{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.pillar{display:grid;grid-template-columns:56px 1fr;gap:4px 16px;align-content:start;padding:20px;border-radius:var(--r-l);background:#fffaf0;box-shadow:0 0 0 2.5px var(--ink),0 5px 0 2.5px var(--ink)}
.pillar .slot{grid-row:span 2}
.pillar h3{font-size:23px;align-self:center}
.pillar p{font-size:16px;line-height:1.5;color:var(--ink-soft)}
.slot{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(180deg,var(--crest-blue),#28479a);box-shadow:0 0 0 2.5px var(--ink),inset 0 0 0 3px var(--gold)}
.slot img{width:44px;height:44px;filter:drop-shadow(0 2px 0 rgba(5,8,24,.45))}
.feat{display:grid;gap:28px;align-items:center;margin-top:60px}
.pair-art{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pair-art .frame:last-child{transform:translateY(18px)}
.feat-copy{display:grid;gap:12px}
.feat-copy h3{font-size:clamp(30px,4vw,42px)}
@media (min-width:860px){.feat{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px}}

/* regions */
.regions{padding-block:80px}
.region-grid{display:grid;gap:26px}
@media (min-width:720px){.region-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.region{grid-column:span 2}.region.wide{grid-column:span 3}}
.region{display:grid;gap:16px;align-content:start}
.rc{display:grid;gap:6px}
.lv{justify-self:start;font:700 12px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--gold);padding:5px 9px;border-radius:var(--r-pill);box-shadow:0 0 0 2px var(--ink)}
.rc h3{font-size:30px;text-shadow:0 2px 0 var(--lip)}
.rc p{font-size:16px;line-height:1.5;color:var(--text-dim)}

/* the Underdeep: always night, lantern gold */
.deep{position:relative;padding-block:84px;background:radial-gradient(80% 55% at 50% 0,rgba(242,193,78,.16),transparent 70%),var(--navy-950);border-block:3px solid var(--ink)}
.deep .lbl{color:var(--gold)}
.deep-grid{display:grid;gap:26px;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
.dcard{display:grid;gap:10px;align-content:start}
.dcard .frame{box-shadow:0 0 0 3px var(--ink),0 0 0 6px rgba(242,193,78,.85),0 0 0 8px var(--ink),0 0 40px rgba(242,193,78,.18)}
.dcard .zoom img{transform:scale(1.45)}
.dcard h3{font-size:25px;margin-top:8px}
.dcard p{font-size:16px;line-height:1.5;color:var(--text-dim)}
.light{list-style:none;margin:44px 0 0;padding:24px;display:grid;gap:14px;border-radius:var(--r-l);background:var(--navy-800);box-shadow:0 0 0 3px var(--ink),inset 0 0 0 1.5px rgba(242,193,78,.4)}
@media (min-width:860px){.light{grid-template-columns:repeat(2,1fr);gap:18px 36px}}
.light li{display:grid;grid-template-columns:18px 1fr;align-items:start;gap:10px;font-size:16px;line-height:1.5;color:var(--text)}
.light li::before{content:"";width:10px;height:10px;margin-top:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px 3px rgba(242,193,78,.55)}
.light b{color:var(--cream)}

/* kind by design: the crest's blue and green */
.gentle{display:grid;gap:36px;padding-block:84px;align-items:center}
@media (min-width:860px){.gentle{grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:56px}}
.gentle-copy{display:grid;gap:14px}
.kind{padding:24px 22px;display:grid;gap:18px}
.crowd{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}
.crowd img{height:96px;width:auto}
@media (max-width:480px){.crowd img{height:64px}}
.kind ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.kind li{display:grid;grid-template-columns:22px 1fr;gap:8px;font-size:16px;line-height:1.45}
.kind li::before{content:"";width:9px;height:9px;margin:7px 0 0 5px;background:var(--crest-green);box-shadow:0 0 0 2px var(--ink);transform:rotate(45deg)}
.kind li b{color:var(--navy-800)}

/* gallery: four stills, two by two */
.gallery-band{background:var(--navy-800);border-block:3px solid var(--ink)}
.gallery{display:grid;gap:22px}
@media (min-width:720px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}}
.gallery figcaption{position:absolute;left:12px;bottom:12px;padding:6px 11px;border-radius:var(--r-pill);font:700 13px/1.1 var(--f-ui);color:var(--ink);background:var(--parch-100);box-shadow:0 0 0 2px var(--ink)}
.gallery .frame img{position:absolute;inset:0}

/* join: the crest */
.join{padding-block:92px 76px;display:grid;justify-items:center;text-align:center;gap:18px}
.join-crest{width:auto;height:180px;filter:drop-shadow(0 14px 26px rgba(5,8,24,.55))}
.join p{max-width:52ch;color:var(--text)}
.join .stores{justify-content:center;margin-top:6px}

/* made by + footer */
.made{border-top:2px solid rgba(196,200,220,.14);padding-block:40px;display:grid;gap:14px;justify-items:start}
.made p{font-size:18px;color:var(--text);max-width:60ch}
.made .sig{display:flex;align-items:center;gap:12px;font:400 24px/1 var(--f-display);color:var(--cream)}
.made .sig img{width:44px;height:44px;border-radius:22.5%;box-shadow:0 0 0 2px var(--ink)}
.foot{background:var(--navy-950);border-top:3px solid var(--ink);font-size:15px;color:var(--text-dim)}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 24px;padding-block:24px 28px}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 20px}
.foot nav a{color:var(--text);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.foot nav a:hover{color:var(--gold)}
.foot address{font-style:normal}

/* legal template */
.page-top{background:var(--navy-800);border-bottom:3px solid var(--ink)}
.page-top .top{position:static}
.legal{padding-block:40px 72px}
.sheet{max-width:720px;margin:0 auto;padding:32px 22px 40px}
@media (min-width:720px){.sheet{padding:56px 64px 64px}}
.sheet .lbl{color:var(--ink-soft)}
.sheet h1{font-size:clamp(38px,7vw,52px);color:var(--navy-800);margin:10px 0 6px}
.sheet .meta{font-size:15px;color:var(--ink-soft);margin-bottom:28px}
.sheet .toc{display:flex;flex-wrap:wrap;gap:6px 16px;padding:14px 0;border-block:2px dashed rgba(107,79,54,.3);margin-bottom:8px;font:600 14px/1.3 var(--f-ui)}
.sheet .toc a{color:var(--ink-soft)}
.sheet h2{font-size:28px;color:var(--navy-800);text-shadow:none;margin:36px 0 10px}
.sheet p,.sheet li{font-size:18px;line-height:1.65;color:var(--ink);max-width:64ch}
.sheet p+p{margin-top:14px}
.sheet ul{padding-left:22px;margin:12px 0;display:grid;gap:8px}
.sheet li::marker{color:var(--gold-deep)}
.sheet strong{font-weight:700}
.sheet a{color:#2f56b8}
.sheet a:hover{color:var(--ink)}
.back{display:inline-flex;align-items:center;gap:6px;margin-bottom:18px;font:600 15px/1 var(--f-ui);color:var(--text-dim);text-decoration:none;min-height:32px}
.back:hover{color:var(--gold)}
@media (prefers-color-scheme:light){
  .legal{background:var(--parch-300)}
  .legal .back{color:var(--ink-soft)}
}
.legal .back-row{max-width:720px;margin:0 auto}