/* Calvary Chapel South Lake Tahoe — matches the Wix original: dark teal bar,
   Poppins headings, warm-grey page, white cards, outlined pill buttons. */
:root{
  --teal:#173540; --teal-2:#21485a; --ink:#1d1d1f; --ink-soft:#4a4f55; --muted:#6b7177;
  --paper:#e4e2df; --card:#fff; --line:#d6d3cf; --accent:#5f8fa3;
  --fs-h1:clamp(36px,6vw,64px); --fs-h2:clamp(26px,3.4vw,36px); --fs-h3:22px; --fs-body:16px;
  --r:4px; --pill:999px; --wrap:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--fs-body)/1.65 Mulish,system-ui,sans-serif;overscroll-behavior:none}
img{max-width:100%;display:block}
a{color:var(--teal-2)}
h1,h2,h3{font-family:Poppins,sans-serif;font-weight:600;line-height:1.15;margin:0 0 16px;color:var(--ink)}
p{margin:0 0 16px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;min-width:0}
.narrow{max-width:820px}
.center{text-align:center}
.muted{color:var(--muted);font-size:14px}
.lede{font-size:18px;color:var(--ink-soft)}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 12px;z-index:100}
.skip:focus{left:8px}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:var(--teal);box-shadow:0 1px 0 rgba(255,255,255,.06)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;height:56px}
.logo img{height:40px;width:auto}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px}
nav a{display:block;padding:8px 12px;color:#fff;text-decoration:none;font:500 14px Poppins,sans-serif;letter-spacing:.04em}
nav a[aria-current=page]{text-decoration:underline;text-underline-offset:4px}
nav a:hover{color:#cfe3ea}
.has-sub{position:relative}
.sub{display:none!important;position:absolute;top:100%;left:0;min-width:240px;flex-direction:column;background:var(--teal);padding:8px 0!important;box-shadow:0 12px 24px rgba(0,0,0,.25)}
.has-sub:hover .sub,.has-sub:focus-within .sub{display:flex!important}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:#fff;margin:5px 0}

/* buttons */
.btn{display:inline-block;padding:12px 32px;border:1px solid var(--ink);border-radius:var(--pill);background:#fff;color:var(--ink);text-decoration:none;font:500 14px Poppins,sans-serif;transition:background .2s,color .2s}
.btn:hover{background:var(--ink);color:#fff}
.btn.is-light{background:#fff;border-color:#fff;color:var(--ink)}
.btn.is-light:hover{background:transparent;color:#fff}
.btn.is-ghost{background:transparent}

/* home hero */
.hero{min-height:calc(100vh - 56px);min-height:calc(100svh - 56px);display:grid;place-items:center;text-align:center;color:#fff;
  background:linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,.28)),var(--bg) center/cover}
.hero-in{padding:64px 24px}
.script{font-family:"Kaushan Script",cursive;font-weight:400;font-size:clamp(64px,12vw,128px);color:#fff;margin:0 0 8px;text-shadow:0 2px 12px rgba(0,0,0,.25)}
.hero-lines{font:400 clamp(20px,3vw,30px)/1.3 "Kaushan Script",cursive;text-transform:uppercase;letter-spacing:.02em;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.hero-note{font:400 clamp(18px,2.4vw,24px) "Kaushan Script",cursive;margin:24px 0 32px;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.social{display:flex;gap:16px;align-items:center}
.social a{color:inherit;display:inline-flex}
.social svg{width:24px;height:24px}
.hero-social{justify-content:center;margin-top:16px}

/* tiles */
.tiles{padding:16px 0}
.tiles-in{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tile{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r);color:#fff;text-decoration:none}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.tile:hover img{transform:scale(1.04)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(0,0,0,.65))}
.tile-body{position:absolute;inset:auto 0 0;padding:32px;z-index:1;text-align:center}
.tile-body h2{color:#fff;font-size:28px}

/* verse */
.verse{background:var(--paper) var(--mark) center/auto 80% no-repeat;padding:96px 0;text-align:center}
.verse blockquote{margin:0 auto;max-width:860px}
.verse p{font:italic 500 clamp(22px,3vw,32px)/1.35 Poppins,sans-serif}
.verse cite{font:500 16px Poppins,sans-serif;font-style:normal}

/* sections + split cards */
.sec{padding:48px 0}
.sec-paper{background:#efedea}
.sec-title{text-align:center;font-size:var(--fs-h2);margin-bottom:32px}
.split-card{display:grid;grid-template-columns:1fr 1fr;background:var(--card);border-radius:var(--r);overflow:hidden;min-height:440px}
.split-card.is-flip .split-body{order:2}
.split-body{padding:clamp(32px,5vw,64px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.split-body h1{font-size:clamp(36px,5vw,56px);font-weight:700}
.split-body h2{font-size:var(--fs-h2)}
.split-photo img{width:100%;height:100%;object-fit:cover;min-height:320px}

/* page hero */
.page-hero{padding:96px 0;text-align:center;color:#fff;background:linear-gradient(rgba(10,30,38,.45),rgba(10,30,38,.55)),var(--bg) center/cover}
.page-hero.is-tall{padding:128px 0}
.page-hero.is-dark{background:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.8)),var(--bg) center/cover}
.page-hero h1{color:#fff;font-size:var(--fs-h1)}
.hero-sub{max-width:760px;margin:16px auto 0;font-size:17px}
.page-hero .btn{margin-top:16px}

/* service times */
.times{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start}
.time-block{margin-bottom:32px}
.time-block h2{font-size:28px;margin-bottom:8px}
.time-block p{margin:0 0 8px;font-weight:700}
.time-block span{display:block;font-weight:400;color:var(--ink-soft)}
.visit-card{background:var(--card);border-radius:var(--r);overflow:hidden}
.map{width:100%;height:320px;border:0;display:block}
.visit-body{padding:24px 32px 32px}

/* doctrine pages */
.doc h2{text-align:center;font-size:var(--fs-h2);margin-bottom:4px}
.kicker{text-align:center;color:var(--accent);font:500 18px Poppins,sans-serif;margin-bottom:24px}
.doc-photo{border-radius:var(--r);margin:0 auto 24px;max-height:360px;width:100%;object-fit:cover}
.hearts,.crosses{list-style:none;padding:0;margin:32px auto 0;max-width:720px;text-align:left}
.hearts li,.crosses li{display:flex;gap:16px;margin-bottom:20px}
.hearts span{color:#fff;font-size:20px;line-height:1.5}
.hearts.is-light span{color:#c0392b}
.crosses span{font-size:20px;color:var(--accent);line-height:1.5}
.hearts p,.crosses p{margin:0}

/* about */
.staff{display:grid;gap:24px}
.person{display:grid;grid-template-columns:280px 1fr;gap:32px;background:var(--card);border-radius:var(--r);padding:32px;align-items:start}
.person img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r)}
.person h3{font-size:28px;margin-bottom:0}
.role{color:var(--accent);font:500 16px Poppins,sans-serif;margin-bottom:16px}

/* sermons */
.video{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--r);overflow:hidden;margin-bottom:24px}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* give */
.give-quote{font:italic 400 22px/1.5 Poppins,sans-serif;color:var(--ink-soft);margin:0 0 32px}
.give-quote cite{display:block;font:500 14px Poppins,sans-serif;font-style:normal;margin-top:8px}
.give-alt{margin-top:40px;padding-top:32px;border-top:1px solid var(--line)}

/* events */
.events{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.ev{display:block;background:var(--card);border-radius:var(--r);padding:24px;color:var(--ink);text-decoration:none;min-height:160px;transition:box-shadow .2s}
a.ev:hover{box-shadow:0 8px 24px rgba(0,0,0,.08)}
.ev-date{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:64px;border-radius:var(--r);background:var(--teal);color:#fff;margin-bottom:16px}
.ev-date span{font:500 12px Poppins,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.ev-date b{font:600 24px/1 Poppins,sans-serif}
.ev h3{font-size:20px;margin-bottom:4px}
.ev p{color:var(--ink-soft);margin-bottom:8px}
.ev .more{font:500 14px Poppins,sans-serif;color:var(--teal-2)}
.ev.is-skel{background:linear-gradient(90deg,#f3f2f0,#fff,#f3f2f0);background-size:200% 100%;animation:shimmer 1.4s infinite}
.events-empty{grid-column:1/-1;background:var(--card);border-radius:var(--r);padding:32px;text-align:center;font:600 18px Poppins,sans-serif;margin:0}
.events-home{padding:48px 0 0}
.events-home .center{margin-top:24px}
@keyframes shimmer{to{background-position:-200% 0}}

/* studio form embeds */
.studio-form{position:relative;border-radius:var(--r);overflow:hidden}
.studio-form iframe{display:block;width:100%;min-height:560px;border:0;background:transparent;transition:opacity .3s}
.studio-form.is-compact iframe{min-height:360px}
.studio-form.is-loading iframe{opacity:0}
.studio-form.is-loading::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f3f2f0,#fff,#f3f2f0);background-size:200% 100%;animation:shimmer 1.4s infinite}
.form-fallback{font-size:13px;color:var(--muted);margin-top:8px}

/* signup band + footer */
.signup{background:#bdbcbb;padding:64px 0}
.signup-in{display:grid;grid-template-columns:1fr 1.4fr;gap:48px;align-items:center}
.signup h2{font-size:28px}
.signup p{font-size:20px;color:var(--ink);max-width:28ch}
.signup .form-fallback{color:var(--ink-soft)}
.ftr{background:var(--teal);color:#fff;padding:24px 0}
.ftr-in{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.ftr p{margin:0;font-size:12px;letter-spacing:.04em}
.ftr-link{color:#fff;font-size:12px;letter-spacing:.04em;margin-left:auto}

/* mobile */
@media (max-width:900px){
  .burger{display:block}
  nav{position:absolute;top:56px;left:0;right:0;background:var(--teal);display:none;max-height:calc(100vh - 56px);overflow:auto}
  nav.is-open{display:block}
  nav ul{flex-direction:column;padding:8px 16px 16px}
  .sub{display:flex!important;position:static;box-shadow:none;padding:0 0 0 16px!important;min-width:0}
  .tiles-in,.split-card,.times,.signup-in{grid-template-columns:1fr}
  .split-card.is-flip .split-body{order:0}
  .split-card{min-height:0}
  .split-photo img{min-height:240px;max-height:360px}
  .person{grid-template-columns:1fr;padding:24px}
  .person img{max-width:280px}
  .tile{aspect-ratio:16/11}
  .ftr-link{margin-left:0}
  .wrap{padding:0 16px}
}
@media (pointer:coarse){input,select,textarea{font-size:16px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.hearts strong,.crosses strong{font-family:Poppins,sans-serif;font-weight:600}
