/*
  Izenga Pages — public site styles (shared by every tenant site and the portal).
  Ported from the original static css/styles.css. Every rule is scoped under
  .iz-site (the public page root) so it never leaks into the Vaadin admin.
  Theme switching uses [data-theme="dark"] on <html>; colors are the variables on :root below.
  Shape rule: interactive elements (buttons, inputs, icon buttons) are full-pill;
  photography and layout blocks are square-cornered.
*/


/*
  Color palette. Each site can override these per mode in its admin (Color palette); the
  overrides are written into the page as :root / :root[data-theme="dark"] rules after this file.
*/
:root{
  --primary-color:#c2410c;          /* buttons, links, highlights */
  --primary-hover-color:#9a3412;    /* buttons and links on hover */
  --on-primary-color:#ffffff;       /* text on primary buttons */
  --background-color:#fafafa;       /* page background */
  --surface-color:#f2f2f3;          /* alternate section background, cards */
  --text-color:#18181b;             /* headings and body text */
  --muted-text-color:#52525b;       /* secondary text */
  --border-color:#e4e4e7;           /* lines and outlines */
  --error-color:#b91c1c;            /* form errors */
  --nav-background-color:color-mix(in srgb, var(--background-color) 82%, transparent);

  --font:'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --max:1200px;
  --gutter:clamp(1rem, 4vw, 2.5rem);
  --section:clamp(5rem, 10vw, 8.5rem);
  --nav-h:64px;
  --ease:cubic-bezier(0.16, 1, 0.3, 1);
}

:root[data-theme="dark"]{
  --primary-color:#f97316;
  --primary-hover-color:#fb923c;
  --on-primary-color:#0f0f11;
  --background-color:#0f0f11;
  --surface-color:#17171a;
  --text-color:#f4f4f5;
  --muted-text-color:#a1a1aa;
  --border-color:#27272a;
  --error-color:#f87171;
}

.iz-site *,.iz-site *::before,.iz-site *::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:64px;-webkit-text-size-adjust:100%;}
.iz-site{
  background:var(--background-color);
  color:var(--text-color);
  font-family:var(--font);
  font-size:1rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
  min-height:100vh;
}
.iz-site img{display:block;max-width:100%;height:auto;}
.iz-site a{color:inherit;text-decoration:none;}
.iz-site button,.iz-site input{font:inherit;color:inherit;}
.iz-site ul,.iz-site ol{list-style:none;}
.iz-site h1,.iz-site h2,.iz-site h3{color:inherit;font-weight:600;letter-spacing:-0.025em;line-height:1.1;}
.iz-site ::selection{background:var(--primary-color);color:var(--on-primary-color);}
.iz-site :focus-visible{outline:2px solid var(--primary-color);outline-offset:3px;}

.iz-site .wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);}
.iz-site section{padding:var(--section) 0;}

.iz-site .eyebrow{
  font-size:0.8125rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--primary-color);margin-bottom:1.25rem;
}
.iz-site .section-title{font-size:clamp(1.875rem, 3.6vw, 2.75rem);max-width:18ch;margin-bottom:clamp(2.5rem, 5vw, 4rem);}
.iz-site .accent{color:var(--primary-color);}


/* ---------- buttons & links ---------- */
.iz-site .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;
  height:48px;padding:0 1.5rem;border-radius:999px;
  font-size:0.9375rem;font-weight:500;white-space:nowrap;
  border:1px solid transparent;cursor:pointer;
  transition:background-color .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.iz-site .btn:active{transform:scale(0.98);}
.iz-site .btn .ph{font-size:1.125rem;}
.iz-site .btn-sm{height:38px;padding:0 1.1rem;font-size:0.875rem;}
.iz-site .btn-primary{background:var(--primary-color);color:var(--on-primary-color);}
.iz-site .btn-primary:hover{background:var(--primary-hover-color);}
.iz-site .btn-ghost{border-color:var(--border-color);color:var(--text-color);}
.iz-site .btn-ghost:hover{border-color:var(--text-color);}

.iz-site .text-link{
  display:inline-flex;align-items:center;gap:0.4rem;
  font-weight:500;color:var(--text-color);
  border-bottom:1px solid var(--border-color);padding-bottom:2px;
  transition:border-color .2s var(--ease), color .2s var(--ease);
}
.iz-site .text-link .ph{transition:transform .2s var(--ease);}
.iz-site .text-link:hover{color:var(--primary-color);border-color:var(--primary-color);}
.iz-site .text-link:hover .ph{transform:translateX(3px);}

.iz-site .icon-btn{
  width:38px;height:38px;border-radius:999px;border:1px solid var(--border-color);
  background:transparent;display:inline-flex;align-items:center;justify-content:center;
  color:var(--muted-text-color);cursor:pointer;font-size:1.05rem;flex-shrink:0;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.iz-site .icon-btn:hover{color:var(--text-color);border-color:var(--muted-text-color);}
.iz-site .icon-moon{display:none;}
[data-theme="dark"] .iz-site .icon-sun{display:none;}
[data-theme="dark"] .iz-site .icon-moon{display:inline;}


/* ---------- nav ---------- */
.iz-site .nav{
  position:sticky;top:0;z-index:50;
  background:var(--nav-background-color);
  backdrop-filter:saturate(160%) blur(12px);
  -webkit-backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--border-color);
}
.iz-site .nav-inner{
  max-width:var(--max);margin:0 auto;padding:0 var(--gutter);
  height:var(--nav-h);display:flex;align-items:center;gap:2rem;
}
.iz-site .brand{display:flex;align-items:center;gap:0.7rem;font-weight:600;font-size:0.9375rem;letter-spacing:-0.01em;white-space:nowrap;}
.iz-site .brand img{height:28px;width:auto;}
.iz-site .nav-links{display:flex;gap:1.75rem;margin-left:auto;}
.iz-site .nav-links a{font-size:0.9rem;color:var(--muted-text-color);transition:color .2s var(--ease);}
.iz-site .nav-links a:hover{color:var(--text-color);}
.iz-site .nav-actions{display:flex;align-items:center;gap:0.6rem;}
.iz-site .menu-btn{display:none;}

@media (max-width:900px){
  .iz-site .nav-inner{gap:1rem;}
  .iz-site .nav-actions{margin-left:auto;}
  .iz-site .menu-btn{display:inline-flex;}
  .iz-site .nav-links{
    display:none;position:absolute;top:var(--nav-h);left:0;right:0;
    flex-direction:column;gap:0;margin:0;
    padding:0.5rem var(--gutter) 1.25rem;
    background:var(--background-color);border-bottom:1px solid var(--border-color);
  }
  .iz-site .nav.is-open .nav-links{display:flex;}
  .iz-site .nav-links a{padding:0.85rem 0;font-size:1.0625rem;color:var(--text-color);border-bottom:1px solid var(--border-color);}
  .iz-site .nav-links a:last-child{border-bottom:0;}
}
@media (max-width:520px){
  .iz-site .brand span{display:none;}
}


/* ---------- hero ---------- */
.iz-site .hero{padding:clamp(2.5rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem);}
.iz-site .hero-grid{
  display:grid;grid-template-columns:1.25fr 0.75fr;gap:clamp(2rem, 6vw, 6rem);
  align-items:center;min-height:calc(100dvh - var(--nav-h) - 8rem);
}
.iz-site .hero h1{font-size:clamp(2.5rem, 5vw, 4rem);letter-spacing:-0.04em;line-height:1.04;text-wrap:balance;}
.iz-site .hero .lede{font-size:clamp(1.0625rem, 1.4vw, 1.1875rem);color:var(--muted-text-color);max-width:40ch;margin:1.75rem 0 2.25rem;}
.iz-site .cta-row{display:flex;flex-wrap:wrap;gap:0.75rem;}
.iz-site .hero-media{margin:0;}
.iz-site .hero-media img{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%;
  max-height:calc(100dvh - var(--nav-h) - 6rem);
}

@media (max-width:860px){
  .iz-site .hero-grid{grid-template-columns:1fr;min-height:0;gap:2.5rem;}
  .iz-site .hero-media img{aspect-ratio:4/3;max-height:none;object-position:50% 30%;}
}


/* ---------- welcome ---------- */
.iz-site .welcome{border-top:1px solid var(--border-color);padding:clamp(3.5rem, 7vw, 5.5rem) 0;}
.iz-site .welcome-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem, 6vw, 6rem);}
.iz-site .welcome-item h2{font-size:1.5rem;margin-bottom:0.9rem;}
.iz-site .welcome-item p{color:var(--muted-text-color);max-width:46ch;margin-bottom:1.5rem;}
@media (max-width:760px){ .iz-site .welcome-grid{grid-template-columns:1fr;} }


/* ---------- calling ---------- */
.iz-site .calling{background:var(--surface-color);}
.iz-site .statement{
  font-size:clamp(1.875rem, 4.2vw, 3.5rem);font-weight:500;
  letter-spacing:-0.035em;line-height:1.1;max-width:22ch;
}
.iz-site .calling-body{max-width:62ch;margin-top:2.5rem;color:var(--muted-text-color);font-size:1.0625rem;}
.iz-site .calling-body p + p{margin-top:1rem;}
.iz-site .flames{display:flex;flex-wrap:wrap;gap:0.75rem;margin-top:1.5rem;}
.iz-site .flames li{
  font-weight:500;font-size:0.9375rem;
  padding:0.6rem 1.1rem;border:1px solid var(--border-color);border-radius:999px;background:var(--background-color);
}
.iz-site .flames li span{color:var(--muted-text-color);font-weight:400;margin-left:0.35rem;}

.iz-site .anchors{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem, 5vw, 5rem);
  margin-top:clamp(4rem, 8vw, 6rem);padding-top:clamp(2.5rem, 5vw, 3.5rem);
  border-top:1px solid var(--border-color);
}
.iz-site .anchor{margin:0;}
.iz-site .anchor blockquote{font-size:clamp(1.25rem, 2vw, 1.5rem);font-weight:500;letter-spacing:-0.02em;line-height:1.3;}
.iz-site .anchor figcaption{font-size:0.875rem;font-weight:500;color:var(--primary-color);margin-top:1rem;}
.iz-site .anchor p{color:var(--muted-text-color);font-size:0.9375rem;margin-top:0.75rem;max-width:48ch;}
@media (max-width:760px){ .iz-site .anchors{grid-template-columns:1fr;} }


/* ---------- leadership ---------- */
.iz-site .leader-grid{display:grid;grid-template-columns:0.8fr 1.2fr;gap:clamp(2.5rem, 7vw, 7rem);align-items:end;}
.iz-site .leader-media{margin:0;}
.iz-site .leader-media img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 15%;}
.iz-site .leader-copy h2{font-size:clamp(1.875rem, 3.6vw, 2.75rem);margin-bottom:2.5rem;}
.iz-site .leader-copy h3{font-size:1.25rem;letter-spacing:-0.015em;}
.iz-site .leader-copy .role{color:var(--primary-color);font-size:0.9375rem;font-weight:500;margin:0.3rem 0 1.25rem;}
.iz-site .leader-copy > p{color:var(--muted-text-color);max-width:54ch;}
.iz-site .facts{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
  margin-top:2.5rem;padding-top:1.75rem;border-top:1px solid var(--border-color);
}
.iz-site .facts dt{font-size:0.8125rem;color:var(--muted-text-color);}
.iz-site .facts dd{font-size:1.75rem;font-weight:500;letter-spacing:-0.03em;margin-top:0.25rem;}
.iz-site .affiliations{margin-top:2rem;font-size:0.9375rem;color:var(--muted-text-color);}
.iz-site .affiliations span{display:block;font-size:0.8125rem;color:var(--text-color);font-weight:500;margin-bottom:0.35rem;}
@media (max-width:860px){
  .iz-site .leader-grid{grid-template-columns:1fr;}
  .iz-site .leader-media{max-width:420px;}
}
@media (max-width:480px){ .iz-site .facts{grid-template-columns:1fr 1fr;} }


/* ---------- mission ---------- */
.iz-site .mission{border-top:1px solid var(--border-color);}
.iz-site .mission-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(2.5rem, 6vw, 6rem);row-gap:3rem;}
.iz-site .mission-grid article{padding-top:1.5rem;border-top:1px solid var(--border-color);}
.iz-site .mission-grid h3{font-size:1.25rem;letter-spacing:-0.015em;margin-bottom:0.75rem;max-width:26ch;}
.iz-site .mission-grid p{color:var(--muted-text-color);max-width:48ch;}
@media (max-width:700px){ .iz-site .mission-grid{grid-template-columns:1fr;row-gap:2rem;} }


/* ---------- gallery ---------- */
.iz-site .gallery{padding-top:0;}
.iz-site .gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(0.75rem, 1.5vw, 1.25rem);align-items:start;}
.iz-site .gallery-grid img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 20%;}
.iz-site .gallery-grid img:nth-child(even){margin-top:clamp(2rem, 5vw, 4rem);}
@media (max-width:900px){
  .iz-site .gallery-grid{grid-template-columns:1fr 1fr;}
}


/* ---------- gatherings ---------- */
.iz-site .gatherings{background:var(--surface-color);}
.iz-site .schedule li{
  display:grid;grid-template-columns:10rem 1fr 16rem;gap:2rem;align-items:baseline;
  padding:2rem 0;border-top:1px solid var(--border-color);
}
.iz-site .schedule li:last-child{border-bottom:1px solid var(--border-color);}
.iz-site .schedule .time{font-size:1.5rem;font-weight:500;letter-spacing:-0.03em;color:var(--primary-color);}
.iz-site .schedule h3{font-size:1.25rem;letter-spacing:-0.015em;margin-bottom:0.35rem;}
.iz-site .schedule p{color:var(--muted-text-color);}
.iz-site .schedule .meta{display:flex;flex-direction:column;gap:0.2rem;font-size:0.9375rem;color:var(--muted-text-color);text-align:right;}
@media (max-width:820px){
  .iz-site .schedule li{grid-template-columns:1fr;gap:0.6rem;}
  .iz-site .schedule .meta{text-align:left;flex-direction:row;flex-wrap:wrap;gap:0 1.25rem;}
}


/* ---------- resources + newsletter ---------- */
.iz-site .resources-grid{display:grid;grid-template-columns:1.2fr 0.8fr;gap:clamp(3rem, 7vw, 7rem);align-items:start;}
.iz-site .resource-list li a{
  display:grid;grid-template-columns:auto 1fr auto;gap:1.25rem;align-items:start;
  padding:1.5rem 0;border-top:1px solid var(--border-color);
  transition:color .2s var(--ease);
}
.iz-site .resource-list li:last-child a{border-bottom:1px solid var(--border-color);}
.iz-site .resource-list .ph{font-size:1.375rem;color:var(--muted-text-color);margin-top:0.1rem;transition:color .2s var(--ease), transform .2s var(--ease);}
.iz-site .resource-list strong{display:block;font-weight:600;font-size:1.0625rem;margin-bottom:0.2rem;}
.iz-site .resource-list span{color:var(--muted-text-color);}
.iz-site .resource-list a:hover strong,.iz-site .resource-list a:hover .ph{color:var(--primary-color);}
.iz-site .resource-list a:hover .ph-arrow-up-right{transform:translate(2px,-2px);}

.iz-site .newsletter{padding:2rem;border:1px solid var(--border-color);background:var(--surface-color);}
.iz-site .newsletter h3{font-size:1.25rem;letter-spacing:-0.015em;}
.iz-site .newsletter > p{color:var(--muted-text-color);margin:0.6rem 0 1.75rem;font-size:0.9375rem;}
.iz-site .newsletter-form label{display:block;font-size:0.875rem;font-weight:500;margin-bottom:0.5rem;}
.iz-site .field-row{display:flex;gap:0.5rem;flex-wrap:wrap;}
.iz-site .field-row input{
  flex:1;min-width:0;height:48px;padding:0 1.25rem;border-radius:999px;
  border:1px solid var(--border-color);background:var(--background-color);color:var(--text-color);
  transition:border-color .2s var(--ease);
}
.iz-site .field-row input::placeholder{color:var(--muted-text-color);}
.iz-site .field-row input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb, var(--primary-color) 22%, transparent);}
.iz-site .form-status{font-size:0.875rem;color:var(--muted-text-color);margin-top:0.75rem;min-height:1.4em;}
.iz-site .has-error input{border-color:var(--error-color);}
.iz-site .has-error .form-status{color:var(--error-color);}
@media (max-width:900px){ .iz-site .resources-grid{grid-template-columns:1fr;} }
@media (max-width:420px){ .iz-site .field-row .btn{width:100%;} .iz-site .field-row input{flex-basis:100%;} }


/* ---------- closing ---------- */
.iz-site .why{border-top:1px solid var(--border-color);text-align:center;}
.iz-site .why .wrap{max-width:820px;}
.iz-site .why blockquote{font-size:clamp(2.25rem, 5.5vw, 4.25rem);font-weight:500;letter-spacing:-0.04em;line-height:1.05;}
.iz-site .why .ref{font-size:0.875rem;font-weight:500;color:var(--primary-color);margin-top:1.25rem;}
.iz-site .why .body{color:var(--muted-text-color);max-width:56ch;margin:1.75rem auto 2.5rem;}


/* ---------- connect ---------- */
.iz-site .connect{background:var(--surface-color);}
.iz-site .contact-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:clamp(2rem, 5vw, 4rem);margin-bottom:3rem;}
.iz-site .contact-grid > div{padding-top:1.5rem;border-top:1px solid var(--border-color);}
.iz-site .contact-grid dt{font-size:0.875rem;color:var(--muted-text-color);margin-bottom:0.75rem;}
.iz-site .contact-value{font-size:1.25rem;font-weight:500;letter-spacing:-0.02em;transition:color .2s var(--ease);}
.iz-site .contact-value:hover{color:var(--primary-color);}
.iz-site .contact-value.muted{color:var(--muted-text-color);font-size:1.0625rem;}
.iz-site .contact-value.break{font-size:1.0625rem;overflow-wrap:anywhere;}
.iz-site .contact-grid .note{color:var(--muted-text-color);font-size:0.9375rem;margin-top:0.75rem;}
@media (max-width:860px){ .iz-site .contact-grid{grid-template-columns:1fr;} }


/* ---------- footer ---------- */
.iz-site .footer{border-top:1px solid var(--border-color);padding:2.5rem 0;}
.iz-site .footer-inner{display:grid;grid-template-columns:1fr auto;gap:1.5rem 2rem;align-items:center;}
.iz-site .footer-brand{display:flex;align-items:center;gap:0.8rem;}
.iz-site .footer-brand img{height:28px;width:auto;}
.iz-site .footer-brand strong{display:block;font-weight:600;font-size:0.9375rem;}
.iz-site .footer-brand span{font-size:0.875rem;color:var(--muted-text-color);}
.iz-site .social{display:flex;gap:0.5rem;}
.iz-site .social a{
  width:40px;height:40px;border-radius:999px;border:1px solid var(--border-color);
  display:inline-flex;align-items:center;justify-content:center;font-size:1.125rem;
  color:var(--muted-text-color);transition:color .2s var(--ease), border-color .2s var(--ease);
}
.iz-site .social a:hover{color:var(--primary-color);border-color:var(--primary-color);}
.iz-site .copyright{grid-column:1 / -1;font-size:0.8125rem;color:var(--muted-text-color);padding-top:1.5rem;border-top:1px solid var(--border-color);}
@media (max-width:560px){ .iz-site .footer-inner{grid-template-columns:1fr;} }


/* ---------- motion ---------- */
@media (prefers-reduced-motion: no-preference){
  .iz-site .hero-copy > *{animation:rise .9s var(--ease) both;}
  .iz-site .hero-copy > :nth-child(2){animation-delay:.06s;}
  .iz-site .hero-copy > :nth-child(3){animation-delay:.12s;}
  .iz-site .hero-copy > :nth-child(4){animation-delay:.18s;}
  .iz-site .hero-media{animation:fade 1.2s var(--ease) .1s both;}
  @keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
  @keyframes fade{from{opacity:0;transform:scale(1.02);}to{opacity:1;transform:none;}}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .iz-site *,.iz-site *::before,.iz-site *::after{transition:none !important;animation:none !important;}
}

/* ---------- platform additions ---------- */
.iz-site .message-page{min-height:70vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:1.25rem;padding-top:4rem;padding-bottom:4rem;}
.iz-site .message-page h1{font-size:clamp(2rem, 4vw, 3rem);letter-spacing:-0.035em;}
.iz-site .message-page .lede{color:var(--muted-text-color);max-width:52ch;}
.iz-site .showcase a{display:block;}
.iz-site .showcase figcaption{font-size:0.875rem;color:var(--muted-text-color);margin-top:0.75rem;}
.iz-site .showcase figcaption a{color:var(--primary-color);}
.iz-site .mission-grid article .eyebrow{margin-bottom:0.5rem;}
.preview-banner{position:sticky;top:0;z-index:60;display:flex;gap:1rem;justify-content:center;align-items:center;flex-wrap:wrap;padding:0.5rem 1rem;background:#18181b;color:#fafafa;font:500 0.875rem/1.4 'Geist', system-ui, sans-serif;}
.preview-banner a{color:#fdba74;}
.preview-banner + .iz-site .nav{top:2.3rem;}
