/* HKSM site theme (2026 redesign, concept A6).
   Loaded after the template stylesheet (style.css) and section stylesheets, so it wins without changing markup.
   Funnel pages (body[data-funnel-theme]) keep their own look from funnel-design.css: only the shared header,
   footer and cookie banner below apply to them. */

@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-normal-400-latin.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-normal-500-latin.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-normal-600-latin.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans Condensed";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-condensed-normal-500-latin.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-condensed-normal-600-latin.woff2) format("woff2")}

:root{
  --hk-ink:#0f3554;          /* navy: headings, header text, footer background */
  --hk-text:#22405a;         /* body copy */
  --hk-muted:#4d6679;
  --hk-blue:#1f7fc8;         /* links and primary buttons */
  --hk-blue-dark:#17679f;
  --hk-lamp:#3fa9f5;
  --hk-soft:#f4f8fb;
  --hk-well:#e9f2f9;
  --hk-line:#d2e1ec;
  --hk-star:#f2a516;
  --hk-radius:10px;
  --hk-font:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --hk-display:"IBM Plex Sans Condensed","IBM Plex Sans",system-ui,sans-serif;
  --hk-ease:cubic-bezier(.32,.72,0,1);
  /* Bootstrap 5 tokens */
  --bs-primary:#1f7fc8;--bs-primary-rgb:31,127,200;--bs-link-color:#1f7fc8;--bs-link-hover-color:#17679f;
  --bs-body-font-family:var(--hk-font);--bs-body-color:#22405a;--bs-border-color:#d2e1ec;
}

/* ------------------------------------------------------------ base (not funnels) */
body:not([data-funnel-theme]){font-family:var(--hk-font);color:var(--hk-text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
/* Base layer at zero specificity: any section's own colours win. */
body:not([data-funnel-theme]) :is(h1,h2,h3,h4,h5,h6){font-family:var(--hk-display);letter-spacing:-.005em}
:where(body:not([data-funnel-theme])) :where(.h1,.h2,.h3,.h4,.h5,.h6){font-family:var(--hk-display)}
:where(body:not([data-funnel-theme])) :where(a){color:var(--hk-blue)}
:where(body:not([data-funnel-theme])) :where(a:hover){color:var(--hk-blue-dark)}
:where(body:not([data-funnel-theme])) :focus-visible{outline:3px solid var(--hk-blue);outline-offset:2px}
:where(body:not([data-funnel-theme])) ::selection{background:#cfe6f8}

/* Buttons */
body:not([data-funnel-theme]) .btn{font-family:var(--hk-font);font-weight:600;border-radius:999px}
body:not([data-funnel-theme]) .btn-primary{background:var(--hk-blue);border-color:var(--hk-blue);color:#fff}
body:not([data-funnel-theme]) .btn-primary:hover,body:not([data-funnel-theme]) .btn-primary:focus{background:var(--hk-blue-dark);border-color:var(--hk-blue-dark);color:#fff}
body:not([data-funnel-theme]) .btn-outline-primary{color:var(--hk-blue);border-color:var(--hk-blue)}
body:not([data-funnel-theme]) .btn-outline-primary:hover{background:var(--hk-blue);color:#fff}
body:not([data-funnel-theme]) .form-control:focus,body:not([data-funnel-theme]) .form-select:focus{border-color:var(--hk-lamp);box-shadow:0 0 0 .2rem rgb(63 169 245 / .25)}
body:not([data-funnel-theme]) .form-control,body:not([data-funnel-theme]) .form-select{border-color:var(--hk-line);border-radius:8px}
body:not([data-funnel-theme]) .form-label{color:var(--hk-ink);font-weight:500}

/* Cards (Bootstrap): account pages, reports, downloads */
body:not([data-funnel-theme]) .card{border:1px solid var(--hk-line);border-radius:16px;box-shadow:0 24px 50px -36px rgb(15 53 84 / .45)!important}
body:not([data-funnel-theme]) .card .card-header{background:var(--hk-soft);border-bottom-color:var(--hk-line)}
/* Account pages (auth/templates): a soft blue page behind the form card */
body:has(> main#main > .container > .row > [class*="col-"] > .card):not([data-funnel-theme]){background:linear-gradient(180deg,#eef5fb 0,#fff 520px) no-repeat,#fff}

/* Template sections (BootstrapMade OnePage leftovers still used by several pages) */
body:not([data-funnel-theme]) .section-bg{background-color:var(--hk-soft)}
body:not([data-funnel-theme]) .section-title h2{font-family:var(--hk-display);color:var(--hk-ink);font-weight:600;text-transform:none;letter-spacing:-.01em}
body:not([data-funnel-theme]) .section-title h2::before,body:not([data-funnel-theme]) .section-title h2::after{display:none}
body:not([data-funnel-theme]) .section-title p{color:var(--hk-muted)}
body:not([data-funnel-theme]) .services .icon-box{border-radius:var(--hk-radius);border:1px solid var(--hk-line);box-shadow:0 18px 40px -34px rgb(15 53 84 / .5);transition:transform .4s var(--hk-ease),border-color .3s}
body:not([data-funnel-theme]) .services .icon-box:hover{transform:translateY(-2px);border-color:var(--hk-blue)}
body:not([data-funnel-theme]) .services .icon-box h4 a{color:var(--hk-ink)}
body:not([data-funnel-theme]) .services .icon-box h4 a:hover{color:var(--hk-blue)}
/* Promo call-to-action band (standard_ads/CTA/*): complete here, because some pages (exam prep) do not load style.css */
body:not([data-funnel-theme]) section.cta{background:var(--hk-ink);background-size:auto;padding:56px 0;color:#d6e6f2;text-align:center}
body:not([data-funnel-theme]) section.cta h3{color:#fff;font-family:var(--hk-display);font-weight:600;font-size:clamp(1.5rem,2.6vw,2rem);margin:0 0 14px}
body:not([data-funnel-theme]) section.cta p{color:#c7dbea;max-width:72ch;margin:0 auto 22px;font-size:1rem;line-height:1.65}
body:not([data-funnel-theme]) section.cta .cta-btn{display:inline-block;padding:11px 28px;border-radius:999px;border:0;background:var(--hk-blue);color:#fff;font-family:var(--hk-font);font-weight:600;text-decoration:none;transition:background .3s}
body:not([data-funnel-theme]) section.cta .cta-btn:hover{background:#fff;color:var(--hk-ink)}
body:not([data-funnel-theme]) .breadcrumb a,body:not([data-funnel-theme]) .breadcrumbs a{color:var(--hk-blue)}
.back-to-top{background:var(--hk-blue)!important;border-radius:50%!important}
.back-to-top:hover{background:var(--hk-blue-dark)!important}
body:not([data-funnel-theme]) .badge.bg-primary{background:var(--hk-blue)!important}
body:not([data-funnel-theme]) .alert-info{background:var(--hk-well);border-color:var(--hk-line);color:var(--hk-ink)}

/* ------------------------------------------------------------ shared header (navbar.php), all pages */
#header.homepage-header{background:#fff;border-bottom:1px solid var(--hk-line);box-shadow:none}
#header .homepage-nav-brand{gap:12px}
#header .homepage-nav-brand img{height:44px;width:auto;max-height:none}
#header .homepage-nav-brand strong{font-family:var(--hk-display);font-weight:600;color:var(--hk-ink);font-size:1.06rem;letter-spacing:0;text-transform:none}
#header .homepage-nav-brand small{font-family:var(--hk-font);font-weight:400;color:var(--hk-muted);letter-spacing:0;text-transform:none;font-size:.76rem}
#header .homepage-navbar a,#header .homepage-navbar a:focus{font-family:var(--hk-font);font-weight:600;color:var(--hk-ink);font-size:.93rem}
#header .homepage-navbar > ul > li > a:hover,#header .homepage-navbar > ul > li:hover > a,#header .homepage-navbar .active{color:var(--hk-blue)}
#header .homepage-navbar .getstarted,#header .homepage-navbar .getstarted:focus{background:var(--hk-blue);color:#fff;border-radius:999px;padding:9px 18px}
#header .homepage-navbar .getstarted:hover{background:var(--hk-blue-dark);color:#fff}
#header .homepage-navbar .homepage-mega-menu,#header .homepage-navbar .dropdown ul{border-radius:14px;border:1px solid var(--hk-line);box-shadow:0 30px 70px -36px rgb(15 53 84 / .55)}
#header .homepage-navbar .homepage-menu-title{font-family:var(--hk-display);color:var(--hk-ink);letter-spacing:0;text-transform:none;font-size:.9rem}
#header .homepage-navbar .homepage-menu-title i{color:var(--hk-blue)}
#header .homepage-navbar .homepage-menu-group > a{color:var(--hk-text);font-weight:400}
#header .homepage-navbar .homepage-menu-group > a:hover{color:var(--hk-blue);background:var(--hk-soft)}
#header .homepage-navbar .homepage-menu-action > a{background:var(--hk-well);color:var(--hk-ink);border-radius:999px}
#header .homepage-navbar .homepage-menu-action > a:hover{background:var(--hk-blue);color:#fff}
#header .mobile-nav-toggle{color:var(--hk-ink)}
#header .navbar-mobile ul{border-radius:14px}

/* ------------------------------------------------------------ footers, all pages */
#footer,.hksm-section-footer,.library-footer,.blog-footer{background:var(--hk-ink)!important;color:#bcd2e3!important;border-top:0!important}
#footer .footer-top{background:transparent!important;border:0!important}
#footer :is(h3,h4),.hksm-section-footer :is(h3,h4){color:#fff!important;font-family:var(--hk-display)}
#footer a,.hksm-section-footer a,.library-footer a,.blog-footer a{color:#dbe9f4!important;text-decoration:none}
#footer a:hover,.hksm-section-footer a:hover,.library-footer a:hover,.blog-footer a:hover{color:#fff!important;text-decoration:underline}
#footer .footer-top .footer-links ul i{color:var(--hk-lamp)!important}
#footer .footer-top .footer-links ul li{border-color:rgb(255 255 255 / .08)!important}
#footer .copyright,#footer .credits,.blog-footer-note{color:#9fb8cc!important}
#footer .container.d-md-flex{border-top:1px solid rgb(255 255 255 / .1)}
#footer p,#footer span{color:inherit}
.hksm-section-footer-inner{max-width:1240px;margin:0 auto;padding:22px 24px!important;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 24px}
.hksm-section-footer-inner nav{display:flex;flex-wrap:wrap;gap:4px 14px}
.hksm-section-footer-inner > span::before{content:"";display:inline-block;width:22px;height:28px;margin-right:10px;vertical-align:-8px;background:url(/assets/img/crest-white.webp) no-repeat center/contain}

/* Shared site footer (includes/site-footer.php) */
.hk-footer{padding:56px 0 28px!important;font-size:.93rem}
.hk-footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:32px}
.hk-footer-brand{display:flex;flex-direction:column;gap:8px}
.hk-footer-brand img{width:40px;height:auto;margin-bottom:6px}
.hk-footer-brand strong{color:#fff;font-family:var(--hk-display);font-size:1.15rem;font-weight:600}
.hk-footer nav{display:flex;flex-direction:column;gap:7px}
.hk-footer nav h3{font-size:1rem!important;margin:0 0 6px;font-weight:600}
.hk-footer-legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 24px;margin-top:36px;padding-top:20px;border-top:1px solid rgb(255 255 255 / .12);font-size:.85rem;color:#9fb8cc}
.hk-footer-legal .credits a{margin:0 2px}
@media (max-width:860px){.hk-footer-grid{grid-template-columns:1fr 1fr}.hk-footer-brand{grid-column:1/-1}}

/* Section sub-navigation (definitions libraries) */
.hksm-subnav{background:var(--hk-soft);border-bottom:1px solid var(--hk-line);margin-top:76px}
.hksm-subnav-inner{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;padding-top:12px;padding-bottom:12px;font-size:.88rem}
.hksm-subnav-title{font-family:var(--hk-display);font-weight:600;color:var(--hk-ink);margin-right:6px}
.hksm-subnav a{color:var(--hk-text)!important;text-decoration:none}
.hksm-subnav a:hover{color:var(--hk-blue)!important;text-decoration:underline}

/* Definition pages (definitions/design/*_template.php): a readable article column */
.definition-page{background:#fff!important;padding:48px 0 72px!important}
.definition-page > .container{max-width:860px}
.definition-page .section-title{text-align:left;padding-bottom:8px}
.definition-page .section-title h1{font-size:clamp(2rem,4vw,2.8rem);font-weight:600;line-height:1.1;margin:0}
.definition-page p.definition-lead{font-size:1.25rem;line-height:1.55;color:var(--hk-ink);margin:0 0 28px;padding:18px 22px;background:var(--hk-soft);border-left:4px solid var(--hk-blue);border-radius:0 var(--hk-radius) var(--hk-radius) 0}
.definition-page :is(.definition-details,p,li,td){font-size:1.05rem;line-height:1.7;color:var(--hk-text)}
.definition-page :is(h2,h3,h4){margin-top:1.8em;font-weight:600}
.definition-page h3{font-size:1.35rem}
.definition-page table{border-color:var(--hk-line)}
.definition-page th{background:var(--hk-well);color:var(--hk-ink)}

/* ------------------------------------------------------------ books library (books/index.php) */
.books-landing{padding-top:72px!important;background:var(--hk-soft)!important}
.books-landing-header{background:transparent!important;border:0!important;max-width:1180px;margin:0 auto;padding:18px 24px 0!important}
.books-landing-title h1{color:var(--hk-ink);font-weight:600!important;font-size:clamp(2rem,3.4vw,2.8rem)!important}
.book-card{border-radius:16px!important;border:1px solid var(--hk-line)!important;box-shadow:0 18px 40px -34px rgb(15 53 84 / .5)!important}
.book-card-title{font-family:var(--hk-display)!important;color:var(--hk-ink)!important;font-weight:600!important}
.book-card-btn{border-radius:999px!important;background:var(--hk-blue)!important;font-weight:600!important}
.book-card-btn:hover{background:var(--hk-blue-dark)!important}
.book-card-btn + .book-card-btn{margin-top:10px;background:#fff!important;color:var(--hk-blue)!important;box-shadow:inset 0 0 0 1px var(--hk-blue)}
.book-card-btn + .book-card-btn:hover{background:var(--hk-well)!important}
/* 3D covers have a see-through background: shadow the book, not its rectangle */
img[src*="-cover-3d"]{box-shadow:none!important;border-radius:0!important;background:none!important;filter:drop-shadow(0 10px 16px rgb(15 53 84 / .28))}
.book-card-cover img[src*="-cover-3d"]{max-height:220px}

/* ------------------------------------------------------------ book chapters (books/design/*) — readability first */
.book-layout{background:#fff}
.book-sidebar{background:var(--hk-soft)!important;border-right:1px solid var(--hk-line)!important}
.book-sidebar .sidebar-header{background:#fff;border-bottom-color:var(--hk-line)}
.book-sidebar .sidebar-book-title{font-family:var(--hk-display);font-size:15px;font-weight:600;color:var(--hk-ink)}
.book-sidebar .sidebar-link{font-size:14px;line-height:1.45;color:#2b4a62}
.book-sidebar .sidebar-link:hover{background:var(--hk-well);color:var(--hk-blue)}
.book-sidebar .sidebar-link.active{background:#e1eef9;color:var(--hk-ink);border-left-color:var(--hk-blue);font-weight:600}
.book-sidebar .chapter-num{color:var(--hk-blue);font-weight:600}
.book-topbar{background:rgb(255 255 255 / .96);border-bottom:1px solid var(--hk-line);padding:12px 40px;font-size:13.5px;color:var(--hk-muted)}
.book-topbar a,.topbar-toggle{color:var(--hk-blue)}
.book-topbar .topbar-current{color:var(--hk-text)}
.book-content{max-width:860px;width:100%;margin:0;padding:48px 56px 80px}
.book-chapter-header{border-bottom:1px solid var(--hk-line);padding-bottom:22px;margin-bottom:30px}
.book-chapter-header .chapter-label{font-family:var(--hk-font);font-size:.9rem;font-weight:600;letter-spacing:0;text-transform:none;color:var(--hk-blue)}
.book-chapter-header h1{font-family:var(--hk-display);font-size:clamp(2rem,3.4vw,2.6rem);font-weight:600;line-height:1.12;color:var(--hk-ink)}
.book-chapter-body .section-bg{background:transparent!important;padding:0 0 8px!important}
.book-chapter-body .container{padding-left:0;padding-right:0;max-width:none}
.book-chapter-body :is(p,li){font-size:1.125rem;line-height:1.78;color:var(--hk-text)}
.book-chapter-body p{margin:0 0 1.15em}
.book-chapter-body :is(h2,h3,h4){font-family:var(--hk-display);color:var(--hk-ink);font-weight:600;line-height:1.2}
.book-chapter-body h2{font-size:1.65rem;margin:2.1em 0 .6em}
.book-chapter-body h3{font-size:1.3rem;margin:1.7em 0 .5em}
.book-chapter-body strong{color:var(--hk-ink);font-weight:600}
.book-chapter-body a{color:var(--hk-blue);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.book-chapter-body img{border-radius:8px}
.book-chapter-body table{font-size:.98rem}
.book-chapter-body table th{background:var(--hk-well)!important;color:var(--hk-ink)!important;font-weight:600}
.book-chapter-body blockquote{border-left:4px solid var(--hk-blue);background:var(--hk-soft);padding:14px 20px;border-radius:0 8px 8px 0;color:var(--hk-ink)}
@media (max-width:768px){
  .book-content{padding:28px 18px 60px}
  .book-topbar{padding:10px 16px}
  .book-chapter-body :is(p,li){font-size:1.0625rem;line-height:1.72}
}

/* Legal pages (PrivacyPolicy.html, TermsOfService.html, RefundPolicy.html): a readable column */
.hk-legal{background:#fff}
.hk-legal #header{background:#fff!important;border-bottom:1px solid var(--hk-line);box-shadow:none}
.hk-legal #header .logo,.hk-legal #header .logo a{font-family:var(--hk-display);font-weight:600;color:var(--hk-ink)!important;font-size:1.3rem;text-transform:none;letter-spacing:0}
.hk-legal #header a.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.hk-legal #header a.logo::before{content:"";width:30px;height:38px;background:url(/assets/img/crest-navy.webp) no-repeat center/contain}
.hk-legal main .container{max-width:860px}
.hk-legal main .section-bg{background:#fff!important}
.hk-legal main :is(p,li){font-size:1.05rem;line-height:1.72;color:var(--hk-text)}
.hk-legal main :is(h2,h3){margin-top:1.6em}

/* Definition lists: the A-Z bar wraps instead of widening the page */
.definition-letters{display:flex;flex-wrap:wrap;gap:2px 0;justify-content:flex-start}
@media (min-width:768px){.definition-letters{justify-content:flex-end}}

/* Download centre: let the category list wrap on phones instead of widening the page */
@media (max-width:768px){.dl-layout > *{min-width:0}.dl-sidebar .dl-nav-item{max-width:100%}}

/* ------------------------------------------------------------ cookie banner (assets/js/cookie-consent.js) */
#hksm-cookie-banner{font-family:var(--hk-font)!important}

@media (max-width:991px){
  #header .homepage-nav-brand img{height:38px}
}
