  :root{
    /* brand colors — dark theme (unchanged, original palette) */
    --c-blue:#003087;
    --c-blue-light:#004BB5;
    --c-blue-rgb:0 48 135;
    --c-cyan:#00A1D6;
    --c-cyan-rgb:0 161 214;
    --c-green:#00A651;
    --c-green-rgb:0 166 81;
    --c-teal:#00BA8C;

    /* accent-3: purple in dark, blue in light */
    --c-accent3:#8B5CF6;
    --c-accent3-rgb:139 92 246;

    /* section backgrounds — dark (default) */
    --bg-1:#080808;
    --bg-2:#06080F;
    --bg-3:#060A07;
    --bg-4:#060A0E;
    --bg-5:#060606;

    /* foreground text/border base, expressed as space-separated RGB for alpha compositing */
    --fg-rgb:245 246 248;

    /* hero decorative orbs */
    --orb1:#003087;
    --orb2:#00A651;
    --orb3:#00A1D6;

    /* hero / CTA vignette washes */
    --hero-wash-from:#0D1B2A;
    --hero-wash-to:#080808;
    --cta-wash-from:#0D1B2A;
    --cta-wash-to:#060606;

    /* header background while scrolled */
    --header-bg:rgba(8,8,8,.82);

    --bg:var(--bg-1);
    --fg:rgb(var(--fg-rgb));
  }

  html.light{
    /* brand colors — light theme, recalibrated to match @escolavocacionados on Instagram:
       vivid indigo blue, punchy lime green, same cyan */
    --c-blue:#2453D6;
    --c-blue-light:#3F6BE8;
    --c-blue-rgb:36 83 214;
    --c-cyan:#00AEE0;
    --c-cyan-rgb:0 174 224;
    --c-green:#1FC93A;
    --c-green-rgb:31 201 58;
    --c-teal:#14C79A;

    --c-accent3:#0F8BFF;
    --c-accent3-rgb:15 139 255;

    --bg-1:#FFFFFF;
    --bg-2:#F5F9FF;
    --bg-3:#F3FBF6;
    --bg-4:#F2F9FC;
    --bg-5:#FAFBFC;

    --fg-rgb:11 18 32;

    --orb1:#2453D6;
    --orb2:#1FC93A;
    --orb3:#00AEE0;

    --hero-wash-from:#EAF1FF;
    --hero-wash-to:#FFFFFF;
    --cta-wash-from:#E9FBEA;
    --cta-wash-to:#FFFFFF;

    --header-bg:rgba(255,255,255,.82);
  }

  html{scroll-behavior:smooth;}
  body{
    background:var(--bg-1);
    color:rgb(var(--fg-rgb));
    font-family:'Inter',system-ui,sans-serif;
    overflow-x:hidden;
    transition:background-color .35s ease, color .35s ease;
  }
  .text-foreground{color:rgb(var(--fg-rgb));}
  ::selection{background:var(--c-blue);color:#fff;}
  .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease, transform .8s ease;}
  .reveal.in{opacity:1;transform:none;}
  .marquee-track{display:flex;width:max-content;animation:marquee 32s linear infinite;}
  @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .ticker-track{display:flex;width:max-content;animation:ticker 40s linear infinite;}
  @keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .gradient-text{background:linear-gradient(90deg,var(--c-cyan),var(--c-teal),var(--c-green));-webkit-background-clip:text;background-clip:text;color:transparent;}
  .skip-link{position:absolute;left:-9999px;top:0;background:#fff;color:#000;padding:.75rem 1.25rem;z-index:9999;border-radius:0 0 .5rem 0;}
  .skip-link:focus{left:0;}
  .avatar-fallback{display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;}
  .glass-card{background:rgb(var(--fg-rgb)/3%);border:1px solid rgb(var(--fg-rgb)/8%);transition:background-color .35s ease, border-color .35s ease;}
  input:focus, textarea:focus{outline:none;}
  .accordion-panel{max-height:0;overflow:hidden;transition:max-height .4s ease, padding .4s ease;}
  .accordion-panel.open{max-height:300px;}
  figure img, .gal-ph{transition:transform .7s ease;}
  figure:hover img, figure:hover .gal-ph{transform:scale(1.05);}

  /* ---- theme toggle button ---- */
  .theme-toggle{
    display:inline-flex;align-items:center;justify-content:center;
    width:38px;height:38px;border-radius:9999px;flex-shrink:0;
    border:1px solid rgb(var(--fg-rgb)/12%);
    background:rgb(var(--fg-rgb)/4%);
    color:rgb(var(--fg-rgb)/80%);
    cursor:pointer;transition:background-color .25s ease, border-color .25s ease, color .25s ease;
  }
  .theme-toggle:hover{background:rgb(var(--fg-rgb)/9%);color:rgb(var(--fg-rgb));}
  .theme-toggle svg{width:17px;height:17px;}
  .theme-toggle .icon-sun{display:none;}
  html.light .theme-toggle .icon-moon{display:none;}
  html.light .theme-toggle .icon-sun{display:block;}
