/* ============================================================
   Know Adam holding page
   Core(ten) palette and type scale per Brand Identity, June 2026.
   Typeface loading is handled in inc/fonts.php, not here.
   ============================================================ */
:root{
  /* Core(ten) palette */
  --ka-corten:      #BF4F00;
  --ka-new-corten:  #CF6B14;
  --ka-off-white:   #FAF7F5;
  --ka-aged-corten: #26211A;

  /* Derived, this page only */
  --ka-body:  rgba(38,33,26,.78);
  --ka-line:  rgba(38,33,26,.16);
  --ka-paper: 250,247,245;

  /* First name is what the Adobe Fonts kit publishes. Second is the self-hosted
     @font-face name and any desktop install. Then the Helvetica lineage. */
  --ka-font: "neue-haas-grotesk-display", "Neue Haas Grotesk Display", "Neue Haas Grotesk Display Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;

  --ka-max: 1240px;
  --ka-gutter: clamp(20px, 5vw, 56px);
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--ka-font);
  font-weight:400;
  background:var(--ka-off-white);
  color:var(--ka-aged-corten);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--ka-corten);outline-offset:3px}

.ka-page{
  min-height:100svh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

/* ---------- hero ---------- */
.ka-bg{position:absolute;inset:0;z-index:-2}
.ka-bg img{width:100%;height:100%;object-fit:cover;object-position:72% 24%}
.ka-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to right,
    rgba(var(--ka-paper),1) 0%,
    rgba(var(--ka-paper),1) 44%,
    rgba(var(--ka-paper),.92) 54%,
    rgba(var(--ka-paper),.45) 66%,
    rgba(var(--ka-paper),0) 78%);
}

/* ---------- header ---------- */
.ka-header{padding:clamp(26px,4vw,46px) var(--ka-gutter)}
.ka-logo{width:clamp(196px,25vw,280px);height:auto}

/* ---------- main ---------- */
.ka-main{flex:1;display:flex;align-items:center;padding:clamp(20px,3vw,40px) var(--ka-gutter)}
.ka-inner{width:100%;max-width:var(--ka-max);margin:0 auto}
.ka-col{max-width:620px}

.ka-flag{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin:0;
  padding:9px 15px 9px 12px;
  font-size:.6875rem;
  font-weight:500;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--ka-off-white);
  background:var(--ka-corten);
  border-radius:2px;
}
.ka-flag::before{
  content:"";
  width:6px;height:6px;border-radius:50%;
  background:var(--ka-off-white);
  animation:ka-pulse 2.8s ease-out infinite;
}
@keyframes ka-pulse{
  0%{box-shadow:0 0 0 0 rgba(250,247,245,.7)}
  70%{box-shadow:0 0 0 8px rgba(250,247,245,0)}
  100%{box-shadow:0 0 0 0 rgba(250,247,245,0)}
}

/* Headline: Roman for line one, Medium for line two, per the type spec */
h1{
  font-size:clamp(2.9rem,7.6vw,5.5rem);
  line-height:.98;
  letter-spacing:-.032em;
  font-weight:400;
  margin:22px 0 0;
  color:var(--ka-aged-corten);
}
h1 .ka-break{
  display:block;
  font-weight:500;
  color:var(--ka-corten);
}

.ka-lede{
  margin:24px 0 0;
  font-size:clamp(1rem,1.75vw,1.125rem);
  color:var(--ka-body);
  max-width:48ch;
}

/* ---------- the three pillars ---------- */
.ka-pillars{
  list-style:none;
  margin:28px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  border-top:1px solid var(--ka-line);
  border-bottom:1px solid var(--ka-line);
}
.ka-pillars li{
  flex:1 1 0;
  min-width:158px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:16px 20px 16px 0;
  font-size:clamp(.9375rem,1.35vw,1.0625rem);
  font-weight:500;
}
.ka-pillars li + li{padding-left:20px;border-left:1px solid var(--ka-line)}
.ka-pillars img{width:32px;height:32px;flex:0 0 auto}

/* ---------- form ---------- */
.ka-form{margin:26px 0 0;max-width:520px}
.ka-field{display:flex;gap:10px;flex-wrap:wrap}
.ka-input{
  flex:1 1 230px;
  min-width:0;
  font:inherit;
  font-size:1rem;
  color:var(--ka-aged-corten);
  background:var(--ka-off-white);
  border:1px solid var(--ka-line);
  border-radius:2px;
  padding:14px 15px;
  transition:border-color .18s ease;
}
.ka-input::placeholder{color:rgba(38,33,26,.5)}
.ka-input:hover{border-color:rgba(38,33,26,.34)}
.ka-input:focus{border-color:var(--ka-corten);outline:none}

.ka-btn{
  flex:0 0 auto;
  font-family:inherit;
  font-size:.6875rem;
  font-weight:500;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--ka-off-white);
  background:var(--ka-corten);
  border:1px solid var(--ka-corten);
  border-radius:2px;
  padding:14px 24px;
  cursor:pointer;
  transition:background .18s ease, border-color .18s ease;
}
.ka-btn:hover{background:var(--ka-aged-corten);border-color:var(--ka-aged-corten)}
.ka-btn[disabled]{opacity:.6;cursor:default}

.ka-legal{margin:11px 0 0;font-size:.8125rem;color:var(--ka-body)}
.ka-legal a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.ka-legal a:hover{color:var(--ka-corten)}

.ka-msg{margin:13px 0 0;font-size:.9375rem;font-weight:500;display:none}
.ka-msg[data-state="ok"]{display:block;color:#105758}
.ka-msg[data-state="error"]{display:block;color:var(--ka-corten)}

.ka-hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}

/* ---------- footer ---------- */
.ka-footer{
  padding:18px var(--ka-gutter) clamp(22px,4vw,32px);
  font-size:.8125rem;
  color:var(--ka-body);
  display:flex;
  flex-wrap:wrap;
  gap:6px 20px;
  justify-content:space-between;
  align-items:center;
}
.ka-footer a{text-decoration:none}
.ka-footer a:hover{color:var(--ka-corten)}

/* ---------- load reveal ---------- */
.ka-rise{opacity:0;transform:translateY(12px);animation:ka-rise .65s cubic-bezier(.22,.61,.36,1) forwards}
.ka-rise:nth-child(1){animation-delay:.05s}
.ka-rise:nth-child(2){animation-delay:.14s}
.ka-rise:nth-child(3){animation-delay:.23s}
.ka-rise:nth-child(4){animation-delay:.32s}
.ka-rise:nth-child(5){animation-delay:.41s}
@keyframes ka-rise{to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
  .ka-rise{opacity:1;transform:none}
}

/* ---------- stacked below 900: image becomes a band, no scrim over faces ---------- */
@media (max-width:900px){
  .ka-page{overflow:visible}
  .ka-bg{position:relative;inset:auto;z-index:0;height:min(40svh,300px);order:-1}
  .ka-bg::after{display:none}
  .ka-bg img{object-position:62% 22%}
  .ka-header{order:-2}
  .ka-main{padding-top:clamp(24px,6vw,40px)}
  .ka-pillars li{flex:1 1 100%;padding:13px 0}
  .ka-pillars li + li{padding-left:0;border-left:0;border-top:1px solid var(--ka-line)}
}

/* ============================================================
   Legal pages (page.php): privacy, cookies, terms, complaints.
   Off White page, Aged Corten prose, measure held for reading.
   ============================================================ */
.ka-doc{
  min-height:100svh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  background:var(--ka-off-white);
}
.ka-doc-head{padding:clamp(26px,4vw,46px) var(--ka-gutter) 0}
.ka-doc-head .ka-logo{width:clamp(180px,22vw,240px);height:auto}

.ka-doc-body{
  flex:1;
  width:100%;
  max-width:74ch;
  margin:0 auto;
  padding:clamp(30px,5vw,56px) var(--ka-gutter) clamp(40px,6vw,72px);
}

.ka-doc-title{
  font-size:clamp(2.1rem,5vw,3.25rem);
  line-height:1.02;
  letter-spacing:-.028em;
  font-weight:400;
  margin:0 0 6px;
  color:var(--ka-aged-corten);
}
.ka-doc-title::after{
  content:"";
  display:block;
  width:64px;
  height:3px;
  margin-top:20px;
  background:var(--ka-corten);
}

.ka-prose{margin-top:28px;color:var(--ka-body);font-size:1.0625rem;line-height:1.65}
.ka-prose > *:first-child{margin-top:0}
.ka-prose h2{
  font-size:clamp(1.3rem,2.4vw,1.625rem);
  font-weight:500;
  line-height:1.2;
  letter-spacing:-.012em;
  color:var(--ka-aged-corten);
  margin:38px 0 10px;
}
.ka-prose h3{
  font-size:1.0625rem;
  font-weight:500;
  color:var(--ka-aged-corten);
  margin:26px 0 8px;
}
.ka-prose p,
.ka-prose ul,
.ka-prose ol{margin:0 0 16px}
.ka-prose ul,
.ka-prose ol{padding-left:22px}
.ka-prose li{margin-bottom:7px}
.ka-prose li::marker{color:var(--ka-corten)}
.ka-prose a{color:var(--ka-corten);text-decoration:underline;text-underline-offset:2px}
.ka-prose a:hover{color:var(--ka-aged-corten)}
.ka-prose strong{font-weight:500;color:var(--ka-aged-corten)}
.ka-prose hr{border:0;border-top:1px solid var(--ka-line);margin:32px 0}
.ka-prose blockquote{
  margin:24px 0;
  padding:2px 0 2px 20px;
  border-left:3px solid var(--ka-corten);
  color:var(--ka-aged-corten);
}
.ka-prose table{
  width:100%;
  border-collapse:collapse;
  margin:0 0 20px;
  font-size:.9375rem;
}
.ka-prose th,
.ka-prose td{
  text-align:left;
  padding:10px 12px 10px 0;
  border-bottom:1px solid var(--ka-line);
  vertical-align:top;
}
.ka-prose th{font-weight:500;color:var(--ka-aged-corten)}
.ka-prose img{margin:20px 0;border-radius:2px}
.ka-prose code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.875em;
  background:rgba(38,33,26,.06);
  padding:2px 5px;
  border-radius:2px;
}

.ka-back{margin:40px 0 0;padding-top:24px;border-top:1px solid var(--ka-line);font-size:.9375rem}
.ka-back a{
  color:var(--ka-corten);
  text-decoration:none;
  font-weight:500;
}
.ka-back a::before{content:"\2190";margin-right:7px}
.ka-back a:hover{color:var(--ka-aged-corten)}

.ka-doc .ka-footer{border-top:1px solid var(--ka-line)}