/* =========================================================
   KOLLEL HAKLAL — landing page styles
   Paste into: Appearance → Customize → Additional CSS
   (Do not paste into the theme's style.css — theme updates erase it.)
   ========================================================= */

/* ---------- Shared base: colors, fonts, resets ---------- */
.khk-page{
  --font-heading:"Cormorant Garamond",Georgia,serif;
  --font-body:"Lora",Georgia,serif;
  --color-bg:#eef2f6;
  --color-surface:#dfe8f0;
  --color-text:#182a3a;
  --color-accent:#2c5f86;
  --color-accent-2:#a8863c;
  --color-divider:rgba(24,42,58,0.13);
  --color-accent-100:#eef3f8;
  --color-accent-200:#d9e5ef;
  --color-accent-300:#b8cee1;
  --color-accent-600:#245273;
  --color-accent-700:#1b3c58;
  --color-accent-900:#101f2e;
  --color-neutral-400:#8a97a4;
  --khk-gold:#a8863c;
  --khk-gold-soft:#c8a961;
  --khk-crimson:#9d2a35;
  --khk-mist:#dde7f0;
  --khk-warm:#f6f9fc;
  --khk-veil-rgb:27 60 88;
  --khk-veil:1;
  --khk-btn-radius:999px;
  background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);
  width:100%;max-width:100%;overflow-x:hidden;
}
.khk-page *{box-sizing:border-box}
.khk-page img{display:block;max-width:100%}
.khk-page a{text-decoration:none;color:var(--color-accent-700);transition:background .18s ease,color .18s ease}
.khk-page a:hover{color:var(--khk-crimson)}
.khk-page h1,.khk-page h2,.khk-page h3,.khk-page p{margin:0}
.khk-page :focus-visible{outline:2px solid var(--khk-gold);outline-offset:2px}

/* ---------- HEADER ---------- */
@media (max-width:900px){
  .khk-page[data-khk-block="header"] [data-khk-header]{gap:12px!important;padding-left:16px!important;padding-right:16px!important}
  .khk-page[data-khk-block="header"] [data-khk-nav]{justify-content:flex-end;gap:8px 14px!important}
}
@media (max-width:760px){
  .khk-page[data-khk-block="header"] [data-khk-header]{position:static!important;flex-direction:column;align-items:center!important;gap:10px!important;padding:12px 16px!important;background:#eef2f6!important}
  .khk-page[data-khk-block="header"] [data-khk-header] > a{justify-content:center}
  .khk-page[data-khk-block="header"] [data-khk-nav]{width:100%;justify-content:center!important;gap:8px 14px!important}
  .khk-page[data-khk-block="header"] [data-khk-nav] a{font-size:11px!important;letter-spacing:0.1em!important;display:inline-block;padding:4px 2px}
}

/* ---------- HERO ---------- */
.khk-page[data-khk-block="hero"] [data-khk-hero-kicker]{color:#e3cb92!important}
.khk-page[data-khk-block="hero"] [data-khk-hero-title]{color:#fbf9f4!important}
@media (max-width:760px){
  .khk-page[data-khk-block="hero"] section{padding-left:20px!important;padding-right:20px!important}
  .khk-page[data-khk-block="hero"] h1{font-size:clamp(28px,7.6vw,38px)!important;line-height:1.12!important}
  .khk-page[data-khk-block="hero"] section p[style*="font-size: 20px"],.khk-page[data-khk-block="hero"] section p[style*="font-size:20px"]{font-size:16.5px!important}
}
@media (max-width:640px){
  .khk-page[data-khk-block="hero"] section{padding-left:18px!important;padding-right:18px!important}
}

/* ---------- WELCOME ---------- */
@media (max-width:900px){
  .khk-page[data-khk-block="welcome"] h3{white-space:normal!important}
}
@media (max-width:760px){
  .khk-page[data-khk-block="welcome"] section{padding-left:20px!important;padding-right:20px!important}
  .khk-page[data-khk-block="welcome"] section h2{font-size:clamp(28px,7.6vw,40px)!important;line-height:1.08!important}
  .khk-page[data-khk-block="welcome"] h3{font-size:16px!important;white-space:normal!important}
}
@media (max-width:640px){
  .khk-page[data-khk-block="welcome"] section{padding-left:18px!important;padding-right:18px!important}
}

/* ---------- LEARNING ---------- */
@media (max-width:1024px){
  .khk-page[data-khk-block="learning"] [data-khk-grid4]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:760px){
  .khk-page[data-khk-block="learning"] [data-khk-learn]{gap:12px!important}
  .khk-page[data-khk-block="learning"] [data-khk-learn] p{font-size:16px!important;line-height:1.68!important;text-align:center!important}
  .khk-page[data-khk-block="learning"] section{padding-left:20px!important;padding-right:20px!important}
  .khk-page[data-khk-block="learning"] section h2{font-size:clamp(28px,7.6vw,40px)!important;line-height:1.08!important}
  .khk-page[data-khk-block="learning"] a[style*="font-size: 18px"]{font-size:14px!important}
}
@media (max-width:640px){
  .khk-page[data-khk-block="learning"] [data-khk-grid4]{grid-template-columns:1fr!important}
  .khk-page[data-khk-block="learning"] section{padding-left:18px!important;padding-right:18px!important}
}

/* Fall 2026 announcement */
.khk-page[data-khk-block="learning"] [data-khk-learn] p{text-wrap:balance!important}
.khk-page[data-khk-block="learning"] .khk-fall{display:flex;flex-direction:column;max-width:1180px;width:100%;margin:0 auto;border:1px solid #c8a961;border-radius:4px;overflow:hidden;box-shadow:0 18px 40px -28px rgba(16,31,46,0.55)}
.khk-page[data-khk-block="learning"] .khk-fall-main{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:clamp(28px,4vw,64px);align-items:end;padding:clamp(32px,4vw,56px);background:#1b3c58;color:#fbf9f4}
.khk-page[data-khk-block="learning"] .khk-fall-intro{display:flex;flex-direction:column;gap:16px}
.khk-page[data-khk-block="learning"] .khk-fall-cta{display:flex;flex-direction:column;gap:20px;padding-left:clamp(24px,3vw,40px);border-left:1px solid rgba(200,169,97,0.35)}
.khk-page[data-khk-block="learning"] .khk-fall-badge{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;padding:6px 14px;border:1px solid rgba(200,169,97,0.7);border-radius:999px;font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:#e3cb92}
.khk-page[data-khk-block="learning"] .khk-fall-dot{width:8px;height:8px;border-radius:50%;background:#c8a961;box-shadow:0 0 0 0 rgba(200,169,97,0.6);animation:khkPulse 2.4s ease-out infinite}
@keyframes khkPulse{0%{box-shadow:0 0 0 0 rgba(200,169,97,0.6)}70%{box-shadow:0 0 0 9px rgba(200,169,97,0)}100%{box-shadow:0 0 0 0 rgba(200,169,97,0)}}
@media (prefers-reduced-motion:reduce){.khk-page[data-khk-block="learning"] .khk-fall-dot{animation:none}}
.khk-page[data-khk-block="learning"] .khk-fall-range{margin:0;font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:#e3cb92}
.khk-page[data-khk-block="learning"] .khk-fall-title{margin:0;font-family:var(--font-heading);font-weight:400;font-size:clamp(36px,4.2vw,56px);line-height:1.04;color:#fbf9f4}
.khk-page[data-khk-block="learning"] .khk-fall-sub{margin:-6px 0 0;font-family:var(--font-heading);font-style:italic;font-size:clamp(20px,1.9vw,25px);line-height:1.3;color:#e3cb92}
.khk-page[data-khk-block="learning"] .khk-fall-overview{margin:0;max-width:680px;font-family:var(--font-body);font-size:15.5px;line-height:1.72;color:rgba(251,249,244,0.9);text-wrap:pretty}
.khk-page[data-khk-block="learning"] .khk-fall-when{margin:0;font-family:var(--font-body);font-size:16px;line-height:1.7;color:rgba(251,249,244,0.88)}
.khk-page[data-khk-block="learning"] a.khk-fall-btn{display:inline-block;align-self:flex-start;padding:16px 34px;background:#c8a961;border:1px solid #c8a961;border-radius:999px;font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;white-space:nowrap;color:#101f2e;transition:background .18s ease,border-color .18s ease,color .18s ease}
.khk-page[data-khk-block="learning"] a.khk-fall-btn:hover{background:#e3cb92;border-color:#e3cb92;color:#101f2e}
.khk-page[data-khk-block="learning"] .khk-fall-dates{padding:clamp(26px,3vw,40px) clamp(32px,4vw,56px);background:#f6f9fc}
.khk-page[data-khk-block="learning"] .khk-fall-dates h3{margin:0 0 8px;font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:#a8863c}
.khk-page[data-khk-block="learning"] .khk-fall-dates ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(24px,3vw,44px)}
.khk-page[data-khk-block="learning"] .khk-fall-dates li{display:flex;flex-direction:column;gap:4px;padding:16px 0;border-bottom:1px solid rgba(24,42,58,0.13);font-family:var(--font-body);font-feature-settings:'tnum'}
.khk-page[data-khk-block="learning"] .khk-fall-dates li:nth-last-child(-n+3){border-bottom:none}
.khk-page[data-khk-block="learning"] .khk-fall-dates li span:first-child{font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:#6f7d8a}
.khk-page[data-khk-block="learning"] .khk-fall-dates li span:last-child{font-family:var(--font-heading);font-size:22px;line-height:1.2;color:#1b3c58}
@media (max-width:900px){
  .khk-page[data-khk-block="learning"] .khk-fall-main{grid-template-columns:1fr;align-items:start}
  .khk-page[data-khk-block="learning"] .khk-fall-cta{padding-left:0;border-left:none;padding-top:18px;border-top:1px solid rgba(200,169,97,0.35)}
  .khk-page[data-khk-block="learning"] .khk-fall-dates ol{grid-template-columns:repeat(2,minmax(0,1fr))}
  .khk-page[data-khk-block="learning"] .khk-fall-dates li:nth-last-child(-n+3){border-bottom:1px solid rgba(24,42,58,0.13)}
  .khk-page[data-khk-block="learning"] .khk-fall-dates li:nth-last-child(-n+2){border-bottom:none}
}
@media (max-width:640px){
  .khk-page[data-khk-block="learning"] .khk-fall-main{padding:26px 22px;gap:18px}
  .khk-page[data-khk-block="learning"] .khk-fall-dates{padding:20px 22px}
  .khk-page[data-khk-block="learning"] .khk-fall-dates ol{grid-template-columns:1fr}
  .khk-page[data-khk-block="learning"] .khk-fall-dates li{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:baseline;gap:14px;padding:13px 0}
  .khk-page[data-khk-block="learning"] .khk-fall-dates li:nth-last-child(-n+2){border-bottom:1px solid rgba(24,42,58,0.13)}
  .khk-page[data-khk-block="learning"] .khk-fall-dates li:last-child{border-bottom:none}
  .khk-page[data-khk-block="learning"] a.khk-fall-btn{display:block;align-self:stretch;text-align:center;padding:15px 20px}
  .khk-page[data-khk-block="learning"] .khk-fall-dates li span:last-child{font-size:20px}
}

/* ---------- JOIN ---------- */
@media (max-width:1024px){
  .khk-page[data-khk-block="join"] [data-khk-grid4]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:760px){
  .khk-page[data-khk-block="join"] section{padding-left:20px!important;padding-right:20px!important}
  .khk-page[data-khk-block="join"] section h2{font-size:clamp(28px,7.6vw,40px)!important;line-height:1.08!important}
  .khk-page[data-khk-block="join"] section p[style*="font-size: 18px"],.khk-page[data-khk-block="join"] section p[style*="font-size:18px"]{font-size:15px!important;letter-spacing:0.14em!important}
}
@media (max-width:640px){
  .khk-page[data-khk-block="join"] [data-khk-grid4]{grid-template-columns:1fr!important}
  .khk-page[data-khk-block="join"] section{padding-left:18px!important;padding-right:18px!important}
}
/* hover (replaces the old inline script) */
.khk-page[data-khk-block="join"] a[data-khk-hover]:hover{border-color:var(--khk-gold)!important}

/* ---------- SPONSORS ---------- */
@media (max-width:900px){
  .khk-page[data-khk-block="sponsors"] [data-khk-2col]{grid-template-columns:1fr!important;width:100%!important}
  .khk-page[data-khk-block="sponsors"] [data-khk-2col] img[data-khk-sponsor]{height:72px!important;width:auto!important;max-width:100%!important;object-fit:contain!important}
  .khk-page[data-khk-block="sponsors"] [data-khk-sponsors]{justify-content:center!important;gap:24px 40px!important}
  .khk-page[data-khk-block="sponsors"] [data-khk-2col] h2{white-space:normal!important;text-align:center}
  .khk-page[data-khk-block="sponsors"] [data-khk-2col] > div[style*="grid-column:2"],.khk-page[data-khk-block="sponsors"] [data-khk-2col] > div[style*="grid-column: 2"]{grid-column:1!important;justify-content:center!important}
}
@media (max-width:760px){
  .khk-page[data-khk-block="sponsors"] [data-khk-2col] img[data-khk-sponsor]{height:60px!important}
  .khk-page[data-khk-block="sponsors"] section{padding-left:20px!important;padding-right:20px!important}
  .khk-page[data-khk-block="sponsors"] section h2{font-size:clamp(28px,7.6vw,40px)!important;line-height:1.08!important}
}
@media (max-width:640px){
  .khk-page[data-khk-block="sponsors"] [data-khk-2col] img[data-khk-sponsor]{height:52px!important}
  .khk-page[data-khk-block="sponsors"] section{padding-left:18px!important;padding-right:18px!important}
  .khk-page[data-khk-block="sponsors"] section > div > div[style*="flex-wrap: wrap"]{justify-content:center!important;gap:24px!important}
  .khk-page[data-khk-block="sponsors"] a[style*="padding:14px 28px"],.khk-page[data-khk-block="sponsors"] a[style*="padding: 14px 28px"]{display:block;width:100%;text-align:center}
}
/* hover (replaces the old inline script) */
.khk-page[data-khk-block="sponsors"] a[data-khk-hover]:hover{background:color-mix(in srgb,var(--khk-gold) 12%,transparent)!important}

/* ---------- FOOTER ---------- */
@media (max-width:760px){
  .khk-page[data-khk-block="footer"] footer{padding-left:20px!important;padding-right:20px!important}
  .khk-page[data-khk-block="footer"] footer h2{font-size:11px!important;line-height:1.4!important}
}
@media (max-width:640px){
  .khk-page[data-khk-block="footer"] footer{padding-left:18px!important;padding-right:18px!important}
}