:root{
    color-scheme: light;
    --paper:#F6F1E6;
    --paper-raised:#FFFFFF;
    --ink:#1C2430;
    --ink-soft:#59606C;
    --ink-faint:#8A8F98;
    --seal:#8B2E3A;
    --seal-ink:#FFFFFF;
    --seal-soft:#F3DEDE;
    --gold:#9C7B2E;
    --line:rgba(28,36,48,0.14);
    --line-strong:rgba(28,36,48,0.28);
    --shadow: 0 1px 2px rgba(28,20,10,0.06), 0 8px 24px -12px rgba(28,20,10,0.18);
    --radius:14px;
    --sans:'Inter',system-ui,sans-serif;
    --serif:'Fraunces','Iowan Old Style',serif;
    --mono:'IBM Plex Mono',monospace;
  }
  html[data-theme="dark"]{
    color-scheme: dark;
    --paper:#12151C;
    --paper-raised:#1A1F28;
    --ink:#EFEAE0;
    --ink-soft:#AEB3BE;
    --ink-faint:#767C88;
    --seal:#D9808A;
    --seal-ink:#1C0C0E;
    --seal-soft:rgba(217,128,138,0.14);
    --gold:#D6B565;
    --line:rgba(239,234,224,0.14);
    --line-strong:rgba(239,234,224,0.28);
    --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 12px 28px -14px rgba(0,0,0,0.6);
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:var(--sans);
    background:var(--paper);
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    transition:background .35s ease, color .35s ease;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px;}

  /* subtle security-paper texture */
  body::before{
    content:"";
    position:fixed; inset:0;
    pointer-events:none;
    opacity:.5;
    background-image:
      radial-gradient(circle at 1px 1px, var(--line) 1px, transparent 1px);
    background-size:22px 22px;
    z-index:0;
  }
  html[data-theme="dark"] body::before{opacity:.25;}

  .eyebrow{
    font-family:var(--mono);
    font-size:12px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--seal);
    display:inline-flex;
    align-items:center;
    gap:8px;
  }
  .eyebrow::before{
    content:"";
    width:16px;height:1px;background:var(--seal);display:inline-block;
  }

  h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.08;margin:0;color:var(--ink);}
  p{line-height:1.65;color:var(--ink-soft);margin:0;}

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:color-mix(in srgb, var(--paper) 88%, transparent);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .header-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 24px; gap:20px;
  }
  .brand{display:flex; align-items:center; gap:12px;}
  .brand-plate{
    background:#fff; border-radius:10px; padding:6px 10px;
    box-shadow:var(--shadow);
  }
  .brand-plate img{height:30px; width:auto;}
  .brand-name{font-family:var(--serif); font-weight:600; font-size:19px; letter-spacing:.01em;}
  .brand-name span{color:var(--seal);}

  nav.primary-nav{display:flex; align-items:center; gap:6px;}
  nav.primary-nav a{
    font-size:14.5px; font-weight:500; color:var(--ink-soft);
    padding:9px 14px; border-radius:8px;
  }
  nav.primary-nav a:hover{color:var(--ink); background:var(--line);}

  .header-actions{display:flex; align-items:center; gap:10px;}

  .theme-toggle{
    display:flex; align-items:center; gap:6px;
    border:1px solid var(--line-strong);
    background:var(--paper-raised);
    border-radius:999px; padding:4px; cursor:pointer;
    width:64px; height:34px; position:relative;
  }
  .theme-toggle .knob{
    width:26px; height:26px; border-radius:50%;
    background:var(--seal); color:var(--seal-ink);
    display:flex; align-items:center; justify-content:center;
    transition:transform .3s ease; font-size:14px;
    transform:translateX(0);
  }
  html[data-theme="dark"] .theme-toggle .knob{transform:translateX(28px);}

  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    font-family:var(--sans); font-weight:600; font-size:14.5px;
    padding:12px 22px; border-radius:9px; cursor:pointer;
    border:1px solid transparent; transition:transform .15s ease, box-shadow .15s ease, background .2s ease;
    white-space:nowrap;
  }
  .btn-primary{background:var(--seal); color:var(--seal-ink); box-shadow:var(--shadow);}
  .btn-primary:hover{transform:translateY(-1px);}
  .btn-ghost{background:transparent; border-color:var(--line-strong); color:var(--ink);}
  .btn-ghost:hover{background:var(--line);}
  .btn-sm{padding:9px 16px; font-size:13.5px;}
  .btn-block{width:100%;}

  .nav-toggle{display:none; border:1px solid var(--line-strong); background:var(--paper-raised); border-radius:8px; width:38px; height:38px; align-items:center; justify-content:center; cursor:pointer;}
  .nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
    content:""; display:block; width:16px; height:2px; background:var(--ink); position:relative;
  }
  .nav-toggle span::before{position:absolute; top:-5px;}
  .nav-toggle span::after{position:absolute; top:5px;}

  /* ---------- Hero ---------- */
  .hero{position:relative; z-index:1; padding:76px 0 96px;}
  .hero-inner{display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;}
  .hero-copy h1{font-size:clamp(38px,5vw,58px); margin:18px 0 8px; letter-spacing:-.01em;}
  .hero-copy .sub{font-family:var(--serif); font-size:clamp(18px,2vw,22px); color:var(--seal); margin-bottom:20px; display:block; font-weight:500;}
  .hero-copy p.lede{font-size:16.5px; max-width:46ch; margin-bottom:30px;}
  .hero-cta{display:flex; gap:14px; flex-wrap:wrap;}

  .hero-seal-wrap{position:relative; display:flex; align-items:center; justify-content:center;}
  .cert-card{
    position:relative;
    width:100%; max-width:400px;
    background:var(--paper-raised);
    border:1px solid var(--line);
    border-radius:18px;
    padding:34px 30px 30px;
    box-shadow:var(--shadow);
  }
  .cert-card::before{
    content:"";
    position:absolute; inset:10px;
    border:1px dashed var(--line-strong);
    border-radius:10px;
    pointer-events:none;
  }
  .cert-top{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:22px;}
  .cert-top .cert-label{font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--ink-faint); text-transform:uppercase;}
  .seal-badge{
    width:74px; height:74px; border-radius:50%;
    background:radial-gradient(circle at 32% 28%, color-mix(in srgb, var(--seal) 88%, white), var(--seal));
    color:var(--seal-ink);
    display:flex; align-items:center; justify-content:center; flex-direction:column;
    font-family:var(--serif); font-weight:700; text-align:center; line-height:1.05;
    box-shadow:0 6px 16px -6px color-mix(in srgb, var(--seal) 60%, transparent);
    border:2px solid color-mix(in srgb, var(--gold) 60%, transparent);
  }
  .seal-badge b{font-size:20px;}
  .seal-badge small{font-size:9px; letter-spacing:.08em; font-family:var(--mono); font-weight:500;}
  .cert-title{font-family:var(--serif); font-size:22px; font-weight:600; margin-bottom:6px;}
  .cert-row{display:flex; justify-content:space-between; padding:10px 0; border-top:1px solid var(--line); font-size:13.5px;}
  .cert-row span:first-child{color:var(--ink-faint); font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase;}
  .cert-row span:last-child{color:var(--ink); font-weight:500;}

  /* ---------- Section shell ---------- */
  section{position:relative; z-index:1; padding:88px 0;}
  section.alt{background:color-mix(in srgb, var(--paper) 60%, var(--paper-raised) 40%);}
  .section-head{max-width:640px; margin-bottom:44px;}
  .section-head h2{font-size:clamp(28px,3.4vw,38px); margin-top:14px;}

  /* ---------- Course cards ---------- */
  .grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
  .course-card{
    background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius);
    overflow:hidden; box-shadow:var(--shadow); display:flex; flex-direction:column;
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .course-card:hover{transform:translateY(-4px);}
  .course-media{aspect-ratio:4/3; overflow:hidden; position:relative;}
  .course-media img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
  .course-card:hover .course-media img{transform:scale(1.06);}
  .course-media .tag{
    position:absolute; top:12px; left:12px;
    background:color-mix(in srgb, var(--ink) 78%, transparent); color:#fff;
    font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
    padding:5px 10px; border-radius:999px;
  }
  .course-body{padding:22px 22px 24px; display:flex; flex-direction:column; gap:16px; flex:1;}
  .course-body h3{font-size:19px;}
  .course-body .btn{margin-top:auto;}

  /* ---------- Service blocks ---------- */
  .service{display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; align-items:center;}
  .service.reverse .service-media{order:2;}
  .service.reverse .service-copy{order:1;}
  .service-media{border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line);}
  .service-media img{width:100%; height:100%; object-fit:cover; aspect-ratio:4/3;}
  .service-copy h2{font-size:clamp(26px,3vw,34px); margin:14px 0 18px;}
  .service-copy p + p{margin-top:14px;}
  .service-copy .btn{margin-top:24px;}

  .checklist{list-style:none; margin:22px 0 0; padding:0; display:grid; gap:12px;}
  .checklist li{
    display:flex; gap:12px; align-items:flex-start; font-size:15px; color:var(--ink-soft);
    padding:12px 14px; background:var(--paper-raised); border:1px solid var(--line); border-radius:10px;
  }
  .checklist li::before{
    content:"✓"; flex:0 0 auto; width:20px; height:20px; border-radius:50%;
    background:var(--seal-soft); color:var(--seal); font-size:12px; font-weight:700;
    display:flex; align-items:center; justify-content:center; margin-top:1px;
  }

  /* ---------- Categories ---------- */
  .grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
  .cat-card{
    position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
    box-shadow:var(--shadow); aspect-ratio:3/3.4;
  }
  .cat-card img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
  .cat-card:hover img{transform:scale(1.08);}
  .cat-overlay{
    position:absolute; inset:0;
    background:linear-gradient(180deg, transparent 40%, rgba(10,8,6,.78) 100%);
    display:flex; align-items:flex-end; padding:18px;
  }
  .cat-overlay h4{color:#fff; font-size:17px;}
  .cat-cta{text-align:center; margin-top:40px;}

  /* ---------- Footer ---------- */
  footer{position:relative; z-index:1; background:var(--ink); color:#D8DAE0; padding:64px 0 28px;}
  html[data-theme="dark"] footer{background:#0B0D12;}
  .footer-grid{display:grid; grid-template-columns:1.3fr .8fr 1fr; gap:48px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.12);}
  .footer-brand .brand-plate{display:inline-flex;}
  .footer-brand p{color:#9AA0AC; margin-top:16px; max-width:34ch;}
  footer h5{font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:#9AA0AC; margin-bottom:16px; font-weight:500;}
  footer ul{list-style:none; margin:0; padding:0; display:grid; gap:10px;}
  footer ul a{color:#D8DAE0; font-size:14.5px;}
  footer ul a:hover{color:var(--gold);}
  .foot-contact li{display:flex; gap:10px; font-size:14.5px; color:#D8DAE0; align-items:flex-start;}
  .foot-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:24px; flex-wrap:wrap; gap:12px; font-size:13px; color:#7D828C;}
  .foot-bottom a{color:#9AA0AC;}
  .foot-bottom a:hover{color:var(--gold);}

  /* ---------- Responsive ---------- */
  @media (max-width:960px){
    .hero-inner{grid-template-columns:1fr;}
    .hero-seal-wrap{order:-1;}
    .cert-card{max-width:460px;}
    .grid-3{grid-template-columns:repeat(2,1fr);}
    .grid-4{grid-template-columns:repeat(2,1fr);}
    .service, .service.reverse{grid-template-columns:1fr;}
    .service.reverse .service-media, .service.reverse .service-copy{order:initial;}
    .footer-grid{grid-template-columns:1fr 1fr;}
  }
  @media (max-width:720px){
    nav.primary-nav{
      position:fixed; inset:64px 16px auto 16px; background:var(--paper-raised);
      border:1px solid var(--line); border-radius:12px; padding:10px; flex-direction:column; align-items:stretch;
      box-shadow:var(--shadow); display:none; gap:2px;
    }
    nav.primary-nav.open{display:flex;}
    nav.primary-nav a{padding:12px 14px;}
    .nav-toggle{display:flex;}
    .header-actions .btn-ghost.desktop-only{display:none;}
    .grid-3{grid-template-columns:1fr;}
    .grid-4{grid-template-columns:repeat(2,1fr);}
    .footer-grid{grid-template-columns:1fr;}
    section{padding:64px 0;}
    .hero{padding:52px 0 64px;}
  }
  @media (prefers-reduced-motion: reduce){
    *{transition:none !important; scroll-behavior:auto !important;}
  }

  :focus-visible{outline:2px solid var(--seal); outline-offset:2px;}