/*
Theme Name: MONDOM
Theme URI: https://mondom.co
Author: MONDOM Communications
Description: Bespoke bilingual (EN/HU) theme for MONDOM Communications — a creative communications collective.
Version: 1.0.4
Text Domain: mondom
*/


@font-face{font-family:'Squid Boy';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/squidboy-400.woff2) format('woff2');}
@font-face{font-family:'Squid Boy';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/squidboy-700.woff2) format('woff2');}
:root{
  --paper:#FFFFFF;
  --paper-2:#F5F0E7;
  --card:#FFFFFF;
  --ink:#141312;
  --charcoal:#232120;
  --ink-soft:#4a4842;
  --ink-faint:#8f8b7f;
  --line:rgba(20,19,18,.16);
  --line-soft:rgba(20,19,18,.09);
  /* neutral fallbacks for global chrome (nav, footer) — per-page pairs override inside each .view */
  --midnight:#3B2A20;
  --plum:#345780;
  --yellow:#E0B94A;
  --blue:#AAC1DC;
  --green:#6E9160;
  --red:#923059;
  /* pair-system defaults; each view sets its own --deep / --soft / --accent below */
  --deep:#345780;
  --soft:#6E9160;
  --accent:#345780;
  --sans:'Inter',system-ui,-apple-system,sans-serif;
  --serif:'Fraunces',Georgia,serif;
  --brush:'Squid Boy',var(--sans);
  --mx:clamp(20px,6vw,110px);
  --maxw:1300px;
}
/* ---- FULL-COLOUR per-menu worlds. Per page: --base (page bg), --panel (light element/card), --block (manifesto block), --mid (band/image), with matching text colours ---- */
#view-home    {--base:#34502F;--on-base:#FFFFFF;--panel:#E4EDDF;--panel-ink:#16261A;--block:#9DBE92;--block-ink:#16261A;--mid:#6E9160;--marker:#9DBE92;--extra:#AAC1DC;--band-bg:#AAC1DC;--band-ink:#16261A;--band-accent:#34502F;} /* Green + more light blue */
#view-who     {--base:#9DBE92;--on-base:#17301C;--panel:#FFFFFF;--panel-ink:#17301C;--block:#2A4225;--block-ink:#FFFFFF;--mid:#6E9160;--marker:#2A4225;--extra:#E4A3BB;--band-bg:#E4A3BB;--band-ink:#4A1418;--band-accent:#2A4225;} /* Light green base + dark green + light pink */
#view-services{--base:#2B4A6F;--on-base:#FFFFFF;--panel:#E2EAF3;--panel-ink:#22415F;--block:#AAC1DC;--block-ink:#22415F;--mid:#5F86AD;--marker:#AAC1DC;--extra:#AAC1DC;--band-bg:#213754;--band-ink:#FFFFFF;--band-accent:#AAC1DC;} /* Blue */
#view-work    {--base:#9DBE92;--on-base:#22415F;--panel:#E4EDDF;--panel-ink:#22415F;--block:#2B4A6F;--block-ink:#FFFFFF;--mid:#6E9160;--marker:#2B4A6F;--extra:#2B4A6F;--band-bg:#2B4A6F;--band-ink:#FFFFFF;--band-accent:#9DBE92;} /* Light green + dark blue */
#view-journal {--base:#433663;--on-base:#FFFFFF;--panel:#E6E3F2;--panel-ink:#2A2148;--block:#A7AEE0;--block-ink:#2A2148;--mid:#6E5E96;--marker:#A7AEE0;--extra:#AAC1DC;--band-bg:#33274F;--band-ink:#FFFFFF;--band-accent:#A7AEE0;} /* Dark purple + light purple + light blue */
#view-article {--base:#F4F2FB;--on-base:#2A2148;--panel:#FFFFFF;--panel-ink:#2A2148;--block:#433663;--block-ink:#FFFFFF;--mid:#6E5E96;--marker:#6E5E96;--extra:#A7AEE0;--band-bg:#433663;--band-ink:#FFFFFF;--band-accent:#A7AEE0;} /* Article reading page */
#view-contact {--base:#AAC1DC;--on-base:#22415F;--panel:#F5F0E7;--panel-ink:#22415F;--block:#E4A3BB;--block-ink:#4A1418;--mid:#E4A3BB;--marker:#C25E82;--extra:#E4A3BB;--band-bg:#F5F0E7;--band-ink:#22415F;--band-accent:#C25E82;} /* Light blue + light pink, ivory fields */
.view{
  background:var(--base);color:var(--on-base);
  --ink:var(--on-base);
  --ink-soft:color-mix(in srgb,var(--on-base) 82%,transparent);
  --ink-faint:color-mix(in srgb,var(--on-base) 58%,transparent);
  --line:color-mix(in srgb,var(--on-base) 26%,transparent);
  --line-soft:color-mix(in srgb,var(--on-base) 13%,transparent);
  --paper:var(--panel);--card:var(--panel);
  --deep:var(--base);--soft:var(--block);--accent:var(--marker);
  --plum:var(--mid);--midnight:var(--mid);--red:var(--marker);--blue:var(--block);--green:var(--block);--yellow:var(--block);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);background:var(--paper);color:var(--ink);
  line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;
}
/* paper grain overlay */
body::before{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.32;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--yellow);color:var(--ink)}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--mx);padding-right:var(--mx);position:relative;z-index:2}
.section{padding-top:clamp(70px,10vw,140px);padding-bottom:clamp(70px,10vw,140px);position:relative;z-index:2}

/* ---- type ---- */
h1,h2,h3{font-weight:700;letter-spacing:-.025em;line-height:1.02}
.display{font-size:clamp(2.7rem,8vw,7rem);font-weight:800;letter-spacing:-.04em;line-height:.92}
.h-lg{font-size:clamp(2rem,4.2vw,3.4rem);letter-spacing:-.03em;line-height:1.04;font-weight:700}
.lead{font-size:clamp(1.1rem,1.5vw,1.4rem);line-height:1.5;color:var(--ink-soft)}
.serif{font-family:var(--serif)}
p.body{font-size:1.06rem;line-height:1.62;color:var(--ink-soft);max-width:60ch}
.stamp{font-family:var(--brush);font-weight:700;font-size:clamp(1rem,1.5vw,1.35rem);letter-spacing:.02em;line-height:1}
.stamp.red{color:var(--red)}
.eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
.eyebrow.red{color:var(--red)}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;gap:.6em;background:var(--ink);color:var(--paper);font-size:.9rem;font-weight:600;padding:.9em 1.5em;border-radius:2px;transition:transform .2s,background .2s;border:2px solid var(--ink)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.btn .arw{transition:transform .3s}
.btn:hover .arw{transform:translateX(4px)}
.link-more{display:inline-flex;align-items:center;gap:.45em;font-size:.92rem;font-weight:600;border-bottom:2px solid var(--red);padding-bottom:2px;transition:gap .2s}
.link-more .arw{color:var(--red);transition:transform .3s}
.link-more:hover{gap:.8em}

/* ---- nav ---- */
header.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.88);backdrop-filter:blur(9px);border-bottom:2px solid var(--ink)}
.nav-inner{max-width:var(--maxw);margin:0 auto;padding:0 var(--mx);height:72px;display:flex;align-items:center;justify-content:space-between;gap:2rem}
.brandmark{font-family:var(--brush);font-weight:700;font-size:2rem;line-height:1;padding-top:7px;letter-spacing:.01em}
.nav-links{display:flex;align-items:center;gap:1.7rem;list-style:none}
.nav-links a{font-size:.9rem;font-weight:600;color:var(--ink-soft);cursor:pointer;position:relative;padding:4px 0;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--ink)}
.nav-right{display:flex;align-items:center;gap:1.2rem}
.lang{font-size:.8rem;font-weight:700;letter-spacing:.08em;color:var(--ink-faint)}
.lang b{color:var(--ink)}
.menu-btn{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.menu-btn span{width:24px;height:2.5px;background:var(--ink);display:block}

.view{display:none}
.view.active{display:block}

/* ---- hero ---- */
.hero{padding-top:clamp(40px,6vw,80px);padding-bottom:clamp(50px,7vw,90px);position:relative}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,5vw,70px);align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:36px}}
.hero .display .brushword{font-family:var(--brush);font-weight:700;letter-spacing:0}
.hero-verbs{margin:1.6rem 0 0;display:flex;flex-direction:column;align-items:flex-start;gap:.1em}
.hero-verbs .verb{font-size:clamp(1.5rem,3vw,2.4rem);font-weight:800;letter-spacing:-.03em;line-height:1.16}
.hero-sub{margin-top:1.8rem;max-width:40ch}
.hero-cta{margin-top:2.4rem;display:flex;gap:1.4rem;align-items:center;flex-wrap:wrap}
.hero-fig{position:relative}

/* ---- brush verb underline ---- */
.verb{position:relative;display:inline-block;white-space:nowrap;z-index:0}
.verb svg{position:absolute;left:-2%;right:0;bottom:-.1em;width:104%;height:.42em;overflow:visible;transform:rotate(-.6deg);z-index:-1}

/* ---- paste-up image frame ---- */
.frame{position:relative;background:var(--card);padding:12px;border:1.5px solid var(--ink);box-shadow:7px 7px 0 rgba(20,19,18,.16);transition:transform .35s ease,box-shadow .35s ease}
.frame img{width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.02) saturate(.96)}
.frame .imgwrap{position:relative;overflow:hidden}
.frame .imgwrap::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");mix-blend-mode:multiply;opacity:.5}
.frame .cap{font-family:var(--brush);font-weight:700;font-size:1rem;margin-top:9px;color:var(--ink)}
.tape{position:absolute;width:88px;height:26px;background:color-mix(in srgb,var(--soft) 72%,transparent);z-index:3;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.tape.b{background:color-mix(in srgb,var(--deep) 55%,transparent)}
.tape.tl{top:-12px;left:16px;transform:rotate(-6deg)}
.tape.tr{top:-12px;right:16px;transform:rotate(5deg)}
.tape.br{bottom:-12px;right:24px;transform:rotate(-4deg)}
.rot-l{transform:rotate(-2.2deg)}
.rot-r{transform:rotate(2deg)}
.frame:hover{transform:rotate(0) translateY(-4px);box-shadow:10px 10px 0 rgba(20,19,18,.2)}

/* ---- scribble O ---- */
.scribO{position:absolute;pointer-events:none;z-index:2}

/* ---- split ---- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,90px);align-items:start}
@media(max-width:820px){.split{grid-template-columns:1fr;gap:22px}}

/* ---- pillars ---- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--ink);background:var(--ink)}
.pillars>*{gap:2px}
.pillar{background:var(--paper);padding:clamp(26px,2.6vw,40px) clamp(22px,2.2vw,34px) clamp(34px,3.5vw,48px)}
.pillar+.pillar{border-left:2px solid var(--ink)}
.pillar .num{font-family:var(--brush);font-size:1.5rem;color:var(--ink-faint)}
.pillar h3{margin:.8rem 0 .5rem;font-size:2.1rem}
.pillar h3 .verb svg{bottom:-.1em}
.pillar .sub{color:var(--ink-soft);font-size:1rem;margin-bottom:1.3rem}
.pillar ul{list-style:none}
.pillar li{font-size:.94rem;color:var(--ink-soft);padding:.5em 0;border-top:1px solid var(--line-soft)}
@media(max-width:820px){.pillars{grid-template-columns:1fr}.pillar+.pillar{border-left:0;border-top:2px solid var(--ink)}}

/* ---- work ---- */
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3vw,40px)}
@media(max-width:900px){.work-grid{grid-template-columns:1fr;gap:44px}}
.case .cat{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:.8rem}
.case .stat{font-size:clamp(2.6rem,4.6vw,3.7rem);font-weight:800;letter-spacing:-.04em;line-height:1;margin:.3rem 0 .2rem}
.case .stat-label{font-size:.92rem;color:var(--ink-soft);margin-bottom:1.1rem}
.case .ct{font-size:1.1rem;font-weight:600;line-height:1.28;margin-top:1rem}
.case .ct .arw{color:var(--red);opacity:0;transition:opacity .3s,transform .3s}
.case:hover .ct .arw{opacity:1;transform:translateX(3px)}
.case .frame{margin-bottom:1.3rem}

/* ---- image showcase ---- */
.showcase{background:var(--midnight);color:var(--paper)}
.showcase .eyebrow,.showcase .stamp{color:var(--yellow)}
.showcase .h-lg{color:var(--paper);max-width:20ch}
.showcase p.body{color:rgba(243,239,227,.72)}
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,2vw,26px);margin-top:3.4rem}
.gal .frame{background:#0a141f;border-color:rgba(243,239,227,.9);box-shadow:7px 7px 0 rgba(0,0,0,.35)}
.gal .frame .cap{color:var(--paper)}
.g1{grid-column:span 5}
.g2{grid-column:span 4}
.g3{grid-column:span 3}
.g4{grid-column:span 4}
.g5{grid-column:span 4}
.g6{grid-column:span 4}
@media(max-width:820px){.gal{grid-template-columns:repeat(2,1fr)}.g1,.g2,.g3,.g4,.g5,.g6{grid-column:span 1}}
.made-tag{display:inline-flex;align-items:center;gap:.5em;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--midnight);background:var(--yellow);padding:.4em .8em;border-radius:2px}

/* ---- testimonials ---- */
.tst{text-align:center}
.tst .stamp{display:block}
.tst-stage{position:relative;min-height:280px}
.tst-item{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .5s;align-items:center}
.tst-item.on{opacity:1;visibility:visible;position:relative}
.tst-quote{font-family:var(--serif);font-size:clamp(1.6rem,3.4vw,2.7rem);line-height:1.22;letter-spacing:-.01em;max-width:22ch;margin:0 auto}
.tst-meta{margin-top:1.8rem;display:flex;gap:.6rem;flex-wrap:wrap;align-items:baseline;justify-content:center}
.tst-name{font-weight:700}
.tst-role{color:var(--ink-soft);font-size:.95rem}
.tst-nav{position:relative;display:flex;gap:.8rem;margin-top:2.4rem;align-items:center;justify-content:center}
.tst-dot{width:10px;height:10px;border-radius:50%;border:2px solid var(--ink);background:transparent;cursor:pointer;padding:0}
.tst-dot.on{background:var(--ink)}
.tst-count{position:absolute;right:0;font-family:var(--brush);font-size:1.1rem;color:var(--ink-faint)}

/* ---- beliefs ---- */
.beliefs{background:var(--plum);color:var(--paper)}
.beliefs.believe-green{background:var(--soft);color:var(--ink)}
.beliefs.believe-green .stamp{color:var(--ink)}
.beliefs.believe-green .belief{border-color:rgba(20,19,18,.25)}
.beliefs.believe-green .belief-list{border-color:rgba(20,19,18,.25)}
.beliefs.believe-green .belief .bn{color:rgba(20,19,18,.55)}
.beliefs.believe-green .btn{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.beliefs .stamp,.beliefs .eyebrow{color:var(--yellow)}
.belief-list{margin-top:2.4rem;border-top:2px solid rgba(243,239,227,.28)}
.belief{font-family:var(--serif);font-size:clamp(1.5rem,2.9vw,2.15rem);line-height:1.22;padding:clamp(14px,1.9vw,24px) 0;border-bottom:2px solid rgba(243,239,227,.28);display:flex;gap:1.1rem;align-items:baseline}
.belief .bn{font-family:var(--brush);font-size:1.3rem;color:color-mix(in srgb,var(--soft) 90%,transparent);flex:0 0 auto}
.beliefs .btn{background:var(--yellow);color:var(--ink);border-color:var(--yellow);margin-top:2.6rem}
.beliefs .btn:hover{box-shadow:4px 4px 0 rgba(243,239,227,.5)}

/* ---- journal ---- */
.jrn-list{border-top:2px solid var(--ink);margin-top:2.4rem}
.jrn{display:grid;grid-template-columns:110px 1fr auto;gap:1.5rem;align-items:baseline;padding:clamp(18px,2.2vw,28px) 0;border-bottom:2px solid var(--ink);cursor:pointer;transition:padding-left .3s,background .3s}
.jrn:hover{padding-left:14px}
.jrn .date{font-family:var(--brush);font-size:1.05rem;color:var(--ink-faint)}
.jrn .jt{font-size:clamp(1.15rem,2vw,1.55rem);font-weight:600;line-height:1.2}
.jrn .jcat{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
@media(max-width:640px){.jrn{grid-template-columns:1fr;gap:.4rem}.jrn .jcat{order:-1}}

/* ---- process steps ---- */
.steps{border-top:2px solid var(--ink);margin-top:2.2rem}
.step{display:grid;grid-template-columns:84px 1fr;gap:clamp(16px,3vw,48px);padding:clamp(22px,2.8vw,36px) 0;border-bottom:2px solid var(--ink)}
.step .sn{font-family:var(--brush);font-size:1.7rem;color:var(--red)}
.step h3{font-size:clamp(1.3rem,2.2vw,1.8rem);margin-bottom:.5rem}
.step p{color:var(--ink-soft);font-size:1rem;line-height:1.55;max-width:62ch}
@media(max-width:640px){.step{grid-template-columns:1fr;gap:.5rem}}

/* ---- rules ---- */
.rules{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(8px,1.4vw,16px)}
.rules .verb{font-size:clamp(2.3rem,6vw,4.6rem);font-weight:800;letter-spacing:-.035em;line-height:1.02}
.rules .verb svg{bottom:-.08em;height:.4em}

/* ---- footer ---- */
footer{background:var(--ink);color:var(--paper);padding:clamp(54px,7vw,88px) 0 38px;position:relative;z-index:2}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2rem}
@media(max-width:820px){.foot-top{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot-top{grid-template-columns:1fr}}
.foot-brand .brandmark{color:var(--paper);font-size:2.6rem}
.foot-brand p{margin-top:1rem;color:rgba(243,239,227,.6);font-size:.95rem;max-width:30ch}
.foot-col h4{font-family:var(--brush);font-size:1.1rem;color:var(--yellow);margin-bottom:.9rem}
.foot-col a,.foot-col p{display:block;color:rgba(243,239,227,.85);font-size:.95rem;padding:.3em 0;transition:color .2s}
.foot-col a:hover{color:var(--yellow)}
.foot-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:clamp(38px,6vw,64px);padding-top:24px;border-top:1px solid rgba(243,239,227,.2);color:rgba(243,239,227,.5);font-size:.82rem}

/* advantages */
.adv{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,4vw,54px);margin-top:2.4rem}
.adv-item .an{font-family:var(--brush);font-size:1.3rem;color:var(--red)}
.adv-item h3{font-size:clamp(1.4rem,2.2vw,1.9rem);margin:.3rem 0 .5rem}
.adv-item p{color:var(--ink-soft);font-size:1.02rem;line-height:1.55;max-width:46ch}
@media(max-width:760px){.adv{grid-template-columns:1fr}}
/* clients logo wall */
.clients-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:2.4rem}
.client-cell{background:var(--paper);display:flex;align-items:center;justify-content:center;min-height:112px;padding:1rem;text-align:center;border:1px solid rgba(23,48,28,.12);transition:background .25s}
.client-cell:hover{background:var(--paper-2)}
.client-cell span{font-weight:700;letter-spacing:.03em;text-transform:uppercase;font-size:1rem;color:var(--ink-soft)}
@media(max-width:800px){.clients-grid{grid-template-columns:repeat(2,1fr)}}
/* contact */
.contact-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(32px,6vw,88px);margin-top:2.6rem}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:44px}}
.field{margin-bottom:1.3rem}
.field label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.5rem}
.field input,.field select,.field textarea{width:100%;padding:.85em 1em;border:2px solid var(--ink);background:var(--paper);color:var(--ink);font-size:1rem;font-family:inherit;border-radius:2px}
.field textarea{min-height:150px;resize:vertical}
.consent{display:flex;gap:.6rem;align-items:flex-start;margin:1.1rem 0 1.6rem;font-size:.92rem;color:var(--ink-soft);max-width:52ch}
.consent input{width:18px;height:18px;margin-top:2px;flex:0 0 auto}
.cdetails .cd{margin-bottom:1.6rem}
.cdetails h4{font-family:var(--brush);font-size:1.15rem;margin-bottom:.35rem;color:var(--ink)}
.cdetails p,.cdetails a{font-size:1rem;color:var(--ink-soft);line-height:1.5}
.cdetails .cd a{color:var(--ink);border-bottom:1.5px solid var(--red);padding-bottom:1px}
.cdetails .soc a{display:inline-block;margin:.2rem 1rem .2rem 0;border:0;font-weight:600;color:var(--ink)}
/* journal */
.jfeat{border-top:3px solid var(--ink);border-bottom:2px solid var(--ink);padding:clamp(30px,4vw,52px) 0;margin-top:2.4rem}
.jfeat .jcatline{font-size:.8rem;color:var(--ink-faint);letter-spacing:.04em;margin-bottom:.9rem}
.jfeat .jcatline .jcat{color:var(--red);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.72rem}
.jfeat-title{font-size:clamp(2rem,4vw,3.2rem);letter-spacing:-.03em;line-height:1.06;margin-bottom:1rem;max-width:22ch}
.jmore{display:inline-block;margin-top:2rem;font-family:var(--brush);font-size:1.15rem;color:var(--ink-faint)}
.nl{display:flex;gap:.8rem;margin-top:2rem;max-width:460px;flex-wrap:wrap}
.nl input{flex:1;min-width:220px;padding:.9em 1.1em;border:2px solid var(--paper);background:transparent;color:var(--paper);font-size:1rem;border-radius:2px}
.nl input::placeholder{color:rgba(243,239,227,.6)}
.nl .btn{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
/* our work */
.cs-list{border-top:2px solid var(--ink);margin-top:2.4rem}
.cs{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,72px);padding:clamp(38px,5vw,66px) 0;border-bottom:2px solid var(--ink)}
.cs .cat{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:1rem}
.cs-stat{font-size:clamp(2.6rem,5.5vw,4.4rem);font-weight:800;letter-spacing:-.04em;line-height:1}
.cs-statlabel{color:var(--ink-soft);font-size:1rem;margin-top:.35rem}
.cs-title{font-size:clamp(1.5rem,2.6vw,2.2rem);letter-spacing:-.02em;line-height:1.14;margin-bottom:.8rem}
.cs-body .body{margin-bottom:1.2rem}
@media(max-width:820px){.cs{grid-template-columns:1fr;gap:14px}}
/* Our Work — client & project showcase cards */
.wc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;margin-top:2.4rem}
@media(max-width:980px){.wc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.wc-grid{grid-template-columns:1fr}}
.wc-card{scroll-margin-top:90px;background:var(--panel);color:var(--panel-ink);border:1.5px solid var(--ink);box-shadow:6px 6px 0 rgba(20,19,18,.13);display:flex;flex-direction:column;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}
.wc-card:hover{transform:translateY(-4px);box-shadow:9px 9px 0 rgba(20,19,18,.2)}
.wc-card.tgt{animation:wcflash 1.6s ease}
@keyframes wcflash{0%,100%{box-shadow:6px 6px 0 rgba(20,19,18,.13)}25%{box-shadow:0 0 0 3px var(--marker),6px 6px 0 rgba(20,19,18,.13)}}
.wc-vis{aspect-ratio:3/2;overflow:hidden;position:relative;background:var(--block)}
.wc-vis img{width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.02) saturate(.97)}
.wc-vis.mono{display:flex;align-items:center;justify-content:center;padding:1.1rem}
.wc-vis.mono span{font-family:var(--serif);font-weight:600;font-size:clamp(1.35rem,3.2vw,2rem);line-height:1.03;color:var(--block-ink);text-align:center;letter-spacing:-.01em}
.wc-body{padding:1.3rem 1.45rem 1.55rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.wc-cat{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--marker)}
.wc-name{font-family:var(--serif);font-size:1.42rem;line-height:1.06;color:var(--panel-ink)}
.wc-desc{font-size:.94rem;line-height:1.5;color:color-mix(in srgb,var(--panel-ink) 86%,transparent)}
.wc-tags{display:flex;flex-wrap:wrap;gap:.38rem;margin-top:.3rem}
.wc-tag{font-size:.66rem;letter-spacing:.04em;text-transform:uppercase;font-weight:600;padding:.24rem .58rem;border:1px solid color-mix(in srgb,var(--panel-ink) 34%,transparent);border-radius:100px;color:color-mix(in srgb,var(--panel-ink) 74%,transparent)}
.wc-card .link-more{margin-top:.55rem;font-size:.86rem}
.cs-img{margin-bottom:1.15rem;overflow:hidden;border:1.5px solid var(--ink);box-shadow:5px 5px 0 rgba(20,19,18,.14)}
.cs-img img{width:100%;aspect-ratio:1200/630;object-fit:cover;display:block}
.client-cell .clogo{max-width:80%;max-height:54px;width:auto;object-fit:contain;display:block}
.view .client-cell[data-nav]{cursor:pointer;text-decoration:none}
.view .client-cell[data-nav]::after{content:"↳";position:absolute;top:.5rem;right:.6rem;font-size:.72rem;opacity:0;transition:opacity .25s;color:var(--marker)}
.view .client-cell[data-nav]{position:relative}
.view .client-cell[data-nav]:hover::after{opacity:.7}
/* graphic tiles */
.imgwrap.gfx{display:flex;align-items:center;justify-content:center}
.gfx svg{width:50%;height:auto}
.gtype{font-family:var(--brush);font-weight:700;font-size:clamp(2.4rem,6vw,4rem);line-height:1}
.gword{font-family:var(--brush);font-weight:700;font-size:clamp(1.6rem,4vw,2.6rem);color:var(--paper);letter-spacing:.02em}
/* services */
.phase{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(28px,5vw,78px);padding:clamp(38px,5vw,70px) 0;border-top:2px solid var(--ink)}
.phase:first-child{border-top:0;padding-top:clamp(8px,2vw,22px)}
.pnum{font-family:var(--brush);font-size:1.6rem;color:var(--ink-faint)}
.phase-head h2{font-family:var(--brush);font-weight:700;font-size:clamp(2.4rem,5.5vw,4.4rem);margin:.5rem 0 .5rem;letter-spacing:-.01em}
.phase-sub{color:var(--ink-soft);font-size:1.1rem}
.svc{list-style:none;columns:2;column-gap:2.4rem;margin-top:1.5rem}
.svc li{padding:.6em 0;border-top:1px solid var(--line-soft);font-size:1rem;break-inside:avoid}
@media(max-width:800px){.phase{grid-template-columns:1fr;gap:14px}.svc{columns:1}}
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);margin-top:2.2rem}
.way{border-top:3px solid var(--ink);padding-top:1.1rem}
.way h3{font-size:1.5rem;margin-bottom:.5rem}
.way p{color:var(--ink-soft);font-size:1rem;line-height:1.5}
@media(max-width:760px){.ways{grid-template-columns:1fr}}
/* video strip */
.vstrip{position:relative;z-index:2;background:var(--midnight)}
.vframe{position:relative;width:100%;aspect-ratio:21/8;overflow:hidden;background:var(--midnight)}
.vframe img{width:100%;height:100%;object-fit:cover;opacity:.72}
.vplay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(64px,7vw,92px);height:clamp(64px,7vw,92px);border-radius:50%;background:var(--yellow);border:0;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 34px rgba(0,0,0,.4);transition:transform .25s;z-index:3}
.vplay:hover{transform:translate(-50%,-50%) scale(1.07)}
.vtag{position:absolute;left:clamp(20px,6vw,110px);bottom:clamp(16px,3vw,30px);color:var(--paper);font-family:var(--brush);font-size:clamp(1.1rem,1.6vw,1.5rem);z-index:3}
@media(max-width:700px){.vframe{aspect-ratio:16/10}}
/* instagram */
.insta{background:var(--soft)}
.insta .ig-note{color:var(--ink-soft)}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,1vw,14px);margin-top:2rem}
@media(max-width:560px){.ig-grid{grid-template-columns:repeat(2,1fr)}}
.ig-tile{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--midnight);border:1.5px solid var(--ink);display:block}
.ig-tile img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.ig-tile:hover img{transform:scale(1.06)}
.ig-tile .igc{position:absolute;inset:0;display:flex;align-items:flex-end;padding:10px;font-family:var(--brush);color:var(--paper);font-size:1rem;background:linear-gradient(180deg,transparent 52%,rgba(13,27,42,.5))}
.ig-tile .ig-badge{position:absolute;top:8px;right:9px;color:#fff;font-size:.72rem;filter:drop-shadow(0 1px 2px rgba(0,0,0,.55));pointer-events:none}
.ig-grid:empty{min-height:120px}
.ig-note{margin-top:1.1rem;font-size:.82rem;color:var(--ink-faint)}
/* ticker */
.ticker{overflow:hidden;position:relative;z-index:2;line-height:0}
.pat-wave{display:block;width:100%;height:clamp(74px,8.5vw,124px)}
.pat-wave text{font-family:var(--brush);font-size:40px}
.ticker-in{display:inline-flex;align-items:baseline;font-size:clamp(1.3rem,2.6vw,2.2rem)}
.ticker-in span{font-family:var(--brush);font-weight:700;font-size:clamp(1.6rem,3.2vw,2.8rem);line-height:1;text-transform:uppercase;letter-spacing:.03em;color:var(--soft);padding-right:.15em;animation:tick 40s linear infinite;will-change:transform}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-100%)}}
.ticker.static .ticker-in span{animation:none}
@media(prefers-reduced-motion:reduce){.ticker-in span{animation:none}}
.spin{position:absolute;pointer-events:none;z-index:4}
.spin svg{width:100%;height:100%;animation:spin 20s linear infinite}
.spin text{font-family:var(--brush);font-weight:700;font-size:15px;letter-spacing:.5px;fill:var(--ink)}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.spin svg{animation:none}}
@media(max-width:700px){.spin{display:none}}
.beliefs.lite{background:var(--soft)}
.beliefs.lite .stamp{color:var(--ink)}
.beliefs.lite .rules{color:var(--ink)}
.beliefs.lite .rules .verb{font-size:clamp(1.7rem,4vw,3rem)}
.beliefs.lite .btn{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.beliefs.green-lite{background:var(--soft)}
.beliefs.green-lite .stamp{color:var(--ink)}
.beliefs.green-lite .btn{background:var(--ink);color:var(--paper);border-color:var(--ink)}
/* reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

@media(max-width:860px){
  .nav-links{position:fixed;inset:72px 0 auto 0;background:var(--paper);flex-direction:column;align-items:flex-start;gap:0;padding:1rem var(--mx) 2rem;border-bottom:2px solid var(--ink);transform:translateY(-130%);transition:transform .35s}
  .nav-links.open{transform:none}
  .nav-links a{padding:.9rem 0;font-size:1.05rem;width:100%;border-bottom:1px solid var(--line-soft)}
  .menu-btn{display:flex}
  .nav-right .btn{display:none}
}
.faq-wrap{max-width:820px}
.faq-list{margin-top:clamp(24px,3vw,40px);border-top:1px solid rgba(20,19,18,.16)}
.faq-list details{border-bottom:1px solid rgba(20,19,18,.16)}
.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:1.2rem;padding:clamp(16px,2vw,24px) 0;font-family:var(--serif);font-size:clamp(1.15rem,2.1vw,1.5rem);line-height:1.3;color:var(--ink)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary .faq-plus{flex:none;font-family:var(--body);font-weight:600;font-size:1.4rem;line-height:1;color:var(--accent);transition:transform .25s ease}
.faq-list details[open] summary .faq-plus{transform:rotate(45deg)}
.faq-list .faq-a{padding:0 0 clamp(20px,2.4vw,28px);max-width:64ch}
.faq-list .faq-a p{font-size:clamp(1rem,1.4vw,1.12rem);line-height:1.6;color:rgba(20,19,18,.82)}
.faq-list .faq-a strong{color:var(--ink)}
/* ===== FULL-COLOUR theming: per-page base + light element panels ===== */
.view .beliefs,.view .beliefs.believe-green,.view .beliefs.lite,.view .beliefs.green-lite{background:var(--block);color:var(--block-ink)}
.view .beliefs .stamp,.view .beliefs .eyebrow{color:var(--block-ink)}
.view .beliefs .belief,.view .beliefs .belief-list{border-color:color-mix(in srgb,var(--block-ink) 22%,transparent)}
.view .beliefs .belief .bn{color:color-mix(in srgb,var(--block-ink) 50%,transparent)}
.view .beliefs .btn{background:var(--block-ink);color:var(--block);border-color:var(--block-ink)}
.view .beliefs.lite .rules{color:var(--block-ink)}
.view .pillar{background:var(--panel);color:var(--panel-ink)}
.view .pillar .sub{color:color-mix(in srgb,var(--panel-ink) 72%,transparent)}
.view .pillar li{color:color-mix(in srgb,var(--panel-ink) 84%,transparent)}
.view .pillar+.pillar{border-left-color:color-mix(in srgb,var(--panel-ink) 18%,transparent)}
@media(max-width:820px){.view .pillar+.pillar{border-top-color:color-mix(in srgb,var(--panel-ink) 18%,transparent)}}
.view .client-cell{background:var(--panel);color:var(--panel-ink)}
.view .frame .cap{color:var(--panel-ink)}
/* plain white frame (no tape / rotation / paper noise) */
.frame.plain{background:#fff;border:0;box-shadow:0 10px 34px rgba(20,19,18,.18);transform:none}
.frame.plain .imgwrap::after{display:none}
.frame.plain:hover{transform:translateY(-5px);box-shadow:0 16px 44px rgba(20,19,18,.22)}
/* scattered, clickable polaroid stack (Home hero) */
.stack{position:relative;z-index:2;cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}
.stack .frame{background:#fff;border:0;box-shadow:0 10px 30px rgba(20,19,18,.22);transition:transform .45s cubic-bezier(.22,.61,.36,1),box-shadow .45s ease,opacity .3s ease}
.stack .frame .imgwrap::after{display:none}
.stack .frame.s0{position:relative;z-index:4;transform:rotate(-2.5deg)}
.stack .frame.s1,.stack .frame.s2,.stack .frame.s3{position:absolute;left:0;top:0;width:100%}
.stack .frame.s1{transform:rotate(5.5deg) translate(8%,10%);z-index:3}
.stack .frame.s2{transform:rotate(-8deg) translate(-7%,-6%);z-index:2}
.stack .frame.s3{transform:rotate(3.5deg) translate(6%,-9%);z-index:1}
.stack .frame .cap{opacity:0;transition:opacity .3s ease}
.stack .frame.s0 .cap{opacity:1}
.stack:hover .frame.s0{transform:rotate(-2.5deg) translateY(-6px)}
.stack:focus-visible{box-shadow:none}
.stack:focus-visible .frame.s0{transform:rotate(-2.5deg) translateY(-6px)}
.stack-hint{position:absolute;left:3%;bottom:-1.7rem;font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.04em;color:var(--on-base);opacity:.5;pointer-events:none;white-space:nowrap}
.view .field label{color:var(--on-base)}
.view .field input,.view .field select,.view .field textarea{background:var(--panel);color:var(--panel-ink);border-color:color-mix(in srgb,var(--panel-ink) 40%,transparent)}
.view .field input::placeholder,.view .field textarea::placeholder{color:color-mix(in srgb,var(--panel-ink) 52%,transparent)}
.view .faq-list,.view .faq-list details{border-color:color-mix(in srgb,var(--on-base) 24%,transparent)}
.view .faq-list summary{color:var(--on-base)}
.view .faq-list summary .faq-plus{color:var(--marker)}
.view .faq-a p{color:color-mix(in srgb,var(--on-base) 84%,transparent)}
.view .faq-a strong{color:var(--on-base)}
.view .consent span,.view .ig-note,.view .mono-note{color:color-mix(in srgb,var(--on-base) 72%,transparent)}
.view .btn{background:var(--on-base);color:var(--base);border-color:var(--on-base)}
.view .btn:hover{box-shadow:5px 5px 0 color-mix(in srgb,var(--on-base) 40%,transparent)}
/* alternate colour bands (colour box + matching text) */
.view .band{background:var(--band-bg);color:var(--band-ink);--ink:var(--band-ink);--ink-soft:color-mix(in srgb,var(--band-ink) 82%,transparent);--ink-faint:color-mix(in srgb,var(--band-ink) 55%,transparent);--line:color-mix(in srgb,var(--band-ink) 24%,transparent)}
.view .band .stamp,.view .band .eyebrow,.view .band .an,.view .band .sn{color:var(--band-accent)}
/* colored bands as full-width strips: background edge-to-edge, content stays in the centered column */
.view .band.wrap{max-width:none;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-left:max(var(--mx), calc(50vw - var(--maxw)/2 + var(--mx)));padding-right:max(var(--mx), calc(50vw - var(--maxw)/2 + var(--mx)))}
/* What we do numbers */
.view .pillar .num{color:var(--base)}
/* mondom strip picks up the page's third colour */
.view .ticker-in span{color:var(--extra)}
/* Our Work closing CTA = green */
#view-work .beliefs.green-lite{background:#2B4A6F;color:#FFFFFF}
#view-work .beliefs.green-lite .stamp{color:#FFFFFF}
#view-work .beliefs.green-lite .btn{background:#FFFFFF;color:#2B4A6F;border-color:#FFFFFF}
/* Journal — light blue as the third colour (featured entry card) */
#view-journal .jfeat{background:#AAC1DC;color:#22415F;border:0;border-radius:3px;padding:clamp(26px,3.4vw,46px);margin-top:2.4rem}
#view-journal .jfeat-title{color:#22415F}
#view-journal .jfeat .body{color:rgba(20,25,45,.82)}
#view-journal .jfeat .jcatline{color:rgba(20,25,45,.62)}
#view-journal .jfeat .jcatline .jcat{color:#433663}
#view-journal .jfeat .jmore{color:#433663}
#view-journal .jrn:hover{background:rgba(167,174,224,.20)}
/* Journal article page */
.article-wrap{max-width:768px}
.article-meta{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--marker);margin-top:1.6rem}
.article-meta .adot{opacity:.5;margin:0 .5em}
.article-title{font-family:var(--serif);font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.05;letter-spacing:-.02em;margin-top:.9rem;color:var(--on-base)}
.article-lead{font-family:var(--serif);font-size:clamp(1.14rem,2vw,1.42rem);line-height:1.5;color:color-mix(in srgb,var(--on-base) 82%,transparent);margin-top:1.3rem}
.article-cover{margin-top:clamp(26px,4vw,46px)}
.article-cover img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;border:1.5px solid var(--on-base);box-shadow:8px 8px 0 rgba(42,33,72,.16)}
.article-cover figcaption{font-size:.8rem;color:color-mix(in srgb,var(--on-base) 58%,transparent);padding:.7rem .1rem 0;font-style:italic}
.article-body{margin-top:clamp(28px,4vw,44px)}
.article-body p{font-size:1.07rem;line-height:1.72;color:color-mix(in srgb,var(--on-base) 88%,transparent);margin-bottom:1.3rem}
.article-body h3{font-family:var(--serif);font-size:clamp(1.35rem,2.6vw,1.85rem);line-height:1.15;margin:2.2rem 0 .9rem;color:var(--on-base)}
.article-body blockquote{margin:2.2rem 0;padding-left:1.4rem;border-left:3px solid var(--extra);font-family:var(--serif);font-style:italic;font-size:clamp(1.35rem,2.8vw,1.85rem);line-height:1.3;color:var(--block)}
.article-foot{margin-top:clamp(34px,5vw,58px);padding-top:2rem;border-top:1.5px solid color-mix(in srgb,var(--on-base) 20%,transparent);display:flex;justify-content:space-between;align-items:center;gap:1.4rem;flex-wrap:wrap}
.article-back{font-weight:600;color:var(--on-base);border-bottom:2px solid var(--extra);padding-bottom:2px;cursor:pointer;align-self:flex-start;display:inline-block}
.jrn{cursor:pointer}
/* Who — Why MONDOM on dark bordeaux, white text, light-pink numbers + label */
#view-who .band-wine{--band-bg:#6E2433;--band-ink:#FFFFFF;--band-accent:#E4A3BB}
/* Who — Our rules set in white */
#view-who .beliefs.lite .rules{color:#FFFFFF}
/* Who — client logo wordmarks dark grey (placeholder) */
#view-who .client-cell{color:#3B3B3B}
/* Services — service list items in light pink */
#view-services .svc li{color:#E4A3BB}
/* palindrome pattern — straight band */
.pat-straight{overflow:hidden;white-space:nowrap;line-height:1;padding:.2em 0;position:relative;z-index:2}
.pat-straight span{font-family:var(--brush);font-size:clamp(1.4rem,3vw,2.3rem);letter-spacing:.01em}
/* palindrome pattern — big half-circle in Who hero */
.hero{overflow:visible}
.halfcircle{position:absolute;top:50%;right:clamp(-260px,-14vw,-160px);transform:translateY(-50%);width:clamp(360px,44vw,580px);height:clamp(360px,44vw,580px);pointer-events:none;z-index:1}
.halfcircle svg{width:100%;height:100%;transition:transform .12s linear}
.halfcircle text{font-family:var(--brush);font-size:24px}
@media(max-width:860px){.halfcircle{display:none}}
/* moving gallery — earlier work, right→left, pause on hover */
.gallery{overflow:hidden;position:relative;z-index:2;padding:clamp(18px,2.4vw,30px) 0}
.gtrack{display:flex;gap:clamp(14px,1.6vw,22px);width:max-content;animation:gscroll 55s linear infinite;will-change:transform}
.gallery:hover .gtrack,.gallery:focus-within .gtrack{animation-play-state:paused}
@keyframes gscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.gcard{flex:0 0 auto;width:clamp(230px,25vw,330px);display:block;text-decoration:none}
.gcard .gimg{display:block;aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--mid);border-radius:2px}
.gcard .gimg img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s ease}
.gcard:hover .gimg img{transform:scale(1.05)}
.gcard .gcap{display:block;margin-top:.55rem;font-size:.82rem;font-weight:600;letter-spacing:.01em;color:var(--on-base);opacity:.92}
@media(prefers-reduced-motion:reduce){.gtrack{animation:none}}
/* ===== header + footer adopt the active page's colours ===== */
header.nav{background:color-mix(in srgb,var(--chrome-bg,#ffffff) 82%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:2px solid color-mix(in srgb,var(--chrome-ink,#141312) 26%,transparent)}
.nav .brandmark{color:var(--chrome-ink,#141312)}
.nav-links a{color:color-mix(in srgb,var(--chrome-ink,#141312) 66%,transparent)}
.nav-links a:hover,.nav-links a.active{color:var(--chrome-ink,#141312)}
.nav-links a.active::after{background:var(--chrome-ink,#141312)}
.nav .btn{background:var(--chrome-ink,#141312);color:var(--chrome-bg,#fff);border-color:var(--chrome-ink,#141312)}
footer{background:var(--chrome-bg,#141312);color:var(--chrome-ink,#F6F0E5)}
.foot-brand .brandmark{color:var(--chrome-ink,#F6F0E5)}
.foot-brand p{color:color-mix(in srgb,var(--chrome-ink,#F6F0E5) 66%,transparent)}
.foot-col h4{color:var(--chrome-acc,#E0B94A)}
.foot-col a,.foot-col p{color:color-mix(in srgb,var(--chrome-ink,#F6F0E5) 82%,transparent)}
.foot-col a:hover{color:var(--chrome-acc,#E0B94A)}
.foot-bottom{border-top-color:color-mix(in srgb,var(--chrome-ink,#F6F0E5) 20%,transparent);color:color-mix(in srgb,var(--chrome-ink,#F6F0E5) 55%,transparent)}
.lang .lopt{cursor:pointer;opacity:.4;transition:opacity .2s}.lang .lopt.on{opacity:1}
