/* Britizenship — shared site chrome & resource-page component styles.
   Loaded by every "resource" page (contact, before-test, test-day-tips,
   official-resources, latest-updates, terms-privacy, mistakes) so nav,
   footer, theme colours, .card and .faq-item can't drift between pages.
   Do not duplicate these rules back into a page's own <style> block —
   edit here instead. */

:root{--bg:#fff;--bg2:#f7f7f5;--bg3:#f0efeb;--border:#e8e8e4;--border2:#d4d4cf;--text:#111;--text2:#555;--text3:#6b6b6b;--accent:#1d70b8;--success:#16a34a;--danger:#dc2626;--warning:#d97706;--card:#fff;--input-bg:#fff;}
[data-theme="dark"]{--bg:#111;--bg2:#1a1a1a;--bg3:#222;--border:#2a2a2a;--border2:#333;--text:#f0f0f0;--text2:#aaa;--text3:#868686;--accent:#60a5fa;--success:#4ade80;--danger:#f87171;--warning:#fbbf24;--card:#1a1a1a;--input-bg:#222;}
*{margin:0;padding:0;box-sizing:border-box;}
html{overflow-y:scroll;}
body{font-family:'Inter',-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;transition:background .2s,color .2s;display:flex;flex-direction:column;min-height:100vh;}
a{color:inherit;text-decoration:none;}
nav{position:sticky;top:0;z-index:100;background:var(--bg2);border-bottom:1px solid var(--border);padding:0 28px;display:flex;align-items:center;justify-content:space-between;height:56px;gap:12px;}
.nav-left{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.flag-svg{width:28px;height:18px;border-radius:3px;overflow:hidden;flex-shrink:0;}
.brand{font-size:.93rem;font-weight:700;color:var(--text);letter-spacing:-.2px;}
.nav-links{display:flex;gap:2px;overflow:hidden;}
.nav-link{font-size:.8rem;font-weight:500;color:var(--text2);padding:6px 10px;border-radius:7px;transition:background .12s,color .12s;display:flex;align-items:center;gap:6px;white-space:nowrap;}
.nav-link svg{opacity:.6;}
.nav-link:hover,.nav-link.active{background:var(--bg2);color:var(--text);}
.nav-link.active svg{opacity:1;}
.nav-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.theme-btn{background:none;border:1px solid var(--border2);color:var(--text2);width:34px;height:34px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s;flex-shrink:0;}
.theme-btn:hover{background:var(--bg2);}
.btn-cta{background:var(--text);color:var(--bg);border:none;padding:7px 13px;border-radius:8px;font-size:.8rem;font-weight:600;cursor:pointer;font-family:inherit;transition:opacity .15s;display:flex;align-items:center;gap:6px;white-space:nowrap;height:34px;min-width:130px;justify-content:center;}
.btn-cta:hover{opacity:.85;}
.page-wrap{max-width:720px;margin:0 auto;padding:44px 24px 64px;flex:1;}
.back-link{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;color:var(--text2);margin-bottom:32px;transition:color .12s;}
.back-link:hover{color:var(--text);}
.page-title{font-size:1.65rem;font-weight:700;letter-spacing:-.5px;margin-bottom:8px;}
.page-sub{font-size:.88rem;color:var(--text2);margin-bottom:36px;line-height:1.55;}
.card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:20px 22px;margin-bottom:12px;}
.card-title{font-size:.86rem;font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:8px;color:var(--text);}
.card-title svg{color:var(--text2);}
.card p,.card li{font-size:.84rem;color:var(--text2);line-height:1.6;}
.card ul{margin-left:18px;margin-top:8px;}
.card li{margin-bottom:5px;}
.card a{color:var(--accent);text-decoration:underline;}
.card a.btn-primary{color:var(--bg);text-decoration:none;}
.card strong{color:var(--text);}
@media(max-width:768px){.nav-links{display:none;}}
.main-content{flex:1;}
footer{background:var(--bg2);border-top:1px solid var(--border);padding:32px 28px 24px;}
.footer-inner{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:20px 40px;}
.footer-cols{display:flex;gap:56px;flex-wrap:wrap;}
.footer-col{display:flex;flex-direction:column;gap:10px;min-width:130px;}
.footer-heading{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin-bottom:6px;}
.footer-col a{font-size:.78rem;color:var(--text3);transition:color .12s;}
.footer-col a:hover{color:var(--text2);}
.footer-social{display:flex;gap:14px;margin-top:2px;}
.footer-social a{color:var(--text3);display:flex;align-items:center;transition:color .12s;}
.footer-social a:hover{color:var(--text2);}
.footer-bottom{font-size:.72rem;color:var(--text3);}
@media(max-width:640px){footer{padding:28px 20px 20px;text-align:center;}.footer-inner{flex-direction:column;align-items:center;gap:24px;}.footer-cols{flex-direction:column;align-items:center;gap:24px;}.footer-col{align-items:center;}.footer-social{justify-content:center;}.footer-bottom{padding-top:20px;border-top:1px solid var(--border);width:100%;}}
.menu-toggle{display:none;background:none;border:1px solid var(--border2);color:var(--text2);width:34px;height:34px;border-radius:8px;cursor:pointer;align-items:center;justify-content:center;flex-shrink:0;}
.mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg);border-bottom:1px solid var(--border);flex-direction:column;padding:8px;z-index:99;box-shadow:0 8px 20px rgba(0,0,0,.1);}
.mobile-menu.open{display:flex;}
.mobile-menu-link{display:flex;align-items:center;gap:10px;padding:12px 14px;font-size:.88rem;font-weight:500;color:var(--text2);border-radius:8px;text-decoration:none;}
.mobile-menu-link:hover{background:var(--bg2);color:var(--text);}
@media(max-width:768px){.menu-toggle{display:flex;}}
.highlight{background:var(--bg3);border-left:3px solid var(--accent);padding:12px 16px;margin:12px 0;font-size:.83rem;color:var(--text2);line-height:1.6;}
.highlight strong{color:var(--text);}
.faq-h2{font-size:1.05rem;font-weight:700;margin:36px 0 14px;letter-spacing:-.3px;}
.faq-item{border:1px solid var(--border);border-radius:12px;padding:14px 18px;margin-bottom:10px;background:var(--bg2);}
.faq-item summary{font-size:.87rem;font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--text);}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+';font-size:1.1rem;color:var(--text3);flex-shrink:0;}
.faq-item[open] summary::after{content:'−';}
.faq-item p{margin-top:10px;font-size:.84rem;color:var(--text2);line-height:1.6;}
