/* Kate Willis — speaker site (draft).
   Brand: "Approved Brand Kit for Kate Willis" (Studio Rema), Option #2 "Spicy".
   Palette: Brand Blue #04B3D3, Space Blue #2A2F44, Pudding #FFEFD3, Lilac #D9BBF9 (kit label #CDC7E5), Peppermint Tea #C4FBBB.
   Type: Unbounded (primary / headings) + Figtree (secondary / body). Visual style: fine lines & curves, clean, minimal. */
:root{
  --blue:#04B3D3;          /* Brand Blue */
  --blue-ink:#037C93;      /* darker Brand Blue for small text on light backgrounds (AA contrast) */
  --space:#2A2F44;         /* Space Blue */
  --space-2:#343a53;
  --pudding:#FFEFD3;       /* Pudding */
  --lilac:#D9BBF9;         /* Lilac as rendered in the kit swatches & highlight covers */
  --mint:#C4FBBB;          /* Peppermint Tea */
  --paper:#FFFBF4; --ink:#2A2F44; --muted:#5d6278; --line:#ece3d3;
  --radius:20px; --shadow:0 24px 50px -24px rgba(42,47,68,.45);
  --display:"Unbounded","Figtree",system-ui,sans-serif;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.65;font-size:17px;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.2;margin:0 0 .55em;letter-spacing:-.015em}
h2{font-size:clamp(1.55rem,2.8vw,2.2rem)}
h3{font-size:1.1rem}
p{margin:0 0 1em}
.wrap{width:min(1120px,100% - 2.5rem);margin-inline:auto}
.skip{position:absolute;left:-999px}
.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem 1rem;z-index:100;border-radius:8px}
.eyebrow,.section p.eyebrow{font-family:var(--sans);font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--blue-ink);margin-bottom:.8rem}
.section--night .eyebrow,.hero .eyebrow{color:var(--blue)}
.lede{color:var(--muted);max-width:60ch;font-size:1.05rem}
.center{text-align:center;margin-top:2.5rem}
.hl{color:var(--blue)}                      /* one-word highlight, as in the kit's sample posts */
.section--night .hl,.hero .hl{color:var(--mint)}

/* Fine-line curves (brand "Visual Style") */
.curve{position:absolute;pointer-events:none;fill:none;stroke-linecap:round}

/* Buttons */
.btn{display:inline-block;background:var(--blue);color:var(--space);text-decoration:none;padding:.9rem 1.6rem;border-radius:999px;border:0;cursor:pointer;font:700 1rem var(--sans);letter-spacing:.01em;transition:transform .2s,background .2s,box-shadow .2s;box-shadow:0 10px 26px -12px rgba(4,179,211,.9)}
.btn:hover{transform:translateY(-2px);background:#22c3e0}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--lilac);outline-offset:3px}
.btn--sm{padding:.5rem 1.1rem;font-size:.9rem;box-shadow:none}
.btn--ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45);box-shadow:none}
.btn--ghost:hover{background:transparent;border-color:var(--lilac)}
.btn--ghost-dark{background:transparent;color:var(--space);border:1.5px solid var(--space);box-shadow:none}
.btn--ghost-dark:hover{background:var(--space);color:#fff}

/* Nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(42,47,68,.92);backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.nav__brand{font-family:var(--display);font-size:1.05rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:#fff;text-decoration:none;display:flex;align-items:center;gap:.55rem}
.nav__brand::before{content:"";width:22px;height:12px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 24'%3E%3Cpath d='M2 18c6-14 12-14 16-4s10 10 14-2 8-8 10-6' fill='none' stroke='%2304B3D3' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E")}
.nav__links{display:flex;gap:1.6rem;list-style:none;margin:0;padding:0;align-items:center}
.nav__links a:not(.btn){color:rgba(255,255,255,.82);text-decoration:none;font-size:.95rem;font-weight:500}
.nav__links a:not(.btn):hover{color:var(--blue)}

/* Hero */
.hero{position:relative;overflow:hidden;color:#fff;background:var(--space);padding:clamp(3.5rem,8vw,6.5rem) 0 clamp(4rem,9vw,7rem)}
.hero__sky{position:absolute;inset:0;pointer-events:none}
.hero__sky .c1{top:-40px;left:-60px;width:min(760px,90%);stroke:var(--blue);stroke-width:2.2;opacity:.9}
.hero__sky .c2{bottom:-30px;right:-40px;width:min(680px,80%);stroke:var(--lilac);stroke-width:1.6;opacity:.7}
.sparkle{position:absolute;color:var(--mint);opacity:.9}
.hero__grid{position:relative;isolation:isolate;display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero h1{font-size:clamp(2.4rem,6vw,4.4rem);font-weight:400;letter-spacing:.02em;text-transform:uppercase;color:var(--blue);margin-bottom:.35em}
.hero__line{font-family:var(--display);font-weight:300;font-size:clamp(1.15rem,2.1vw,1.5rem);line-height:1.45;color:#fff;max-width:30ch}
.hero__line em{font-style:normal;color:var(--lilac)}
.hero__sub{color:rgba(255,255,255,.78);max-width:52ch}
.hero__ctas{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.8rem}

/* Photo slots with graceful fallback */
.photo{position:relative;margin:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:linear-gradient(160deg,var(--space-2),var(--space) 55%,#4b4f7a)}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo__fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;color:rgba(255,255,255,.85)}
.photo__fallback small{font-size:.72rem;letter-spacing:.06em;opacity:.6;font-family:ui-monospace,Menlo,monospace}
.photo__initials{font-family:var(--display);font-size:4rem;font-weight:400;letter-spacing:.04em;color:var(--lilac)}
.photo--portrait{aspect-ratio:4/5}
.photo--wide{aspect-ratio:4/5}
.photo--square{aspect-ratio:1/1}
.hero__photo{max-width:400px;justify-self:end;width:100%;overflow:visible;background:none;box-shadow:none}
.hero__photo .frame{position:absolute;inset:0;border-radius:var(--radius);overflow:hidden;box-shadow:0 30px 60px -25px rgba(0,0,0,.6);background:linear-gradient(160deg,var(--space-2),#4b4f7a)}
.hero__photo::before{content:"";position:absolute;inset:-14px 14px 14px -14px;border:1.5px solid var(--lilac);border-radius:calc(var(--radius) + 6px)}
.hero__photo::after{content:"";position:absolute;right:-18px;bottom:-18px;width:86px;height:86px;border-radius:50%;background:var(--mint);z-index:-1}

/* Strip */
.strip{background:var(--pudding);color:var(--space);border-bottom:1px solid var(--line)}
.strip__list{list-style:none;margin:0 auto;padding:1.6rem 0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.strip__list li{display:flex;flex-direction:column;text-align:center;padding:0 .5rem}
.strip__list li+li{border-left:1px solid rgba(42,47,68,.15)}
.strip__list strong{font-family:var(--display);font-weight:500;font-size:1rem;color:var(--space)}
.strip__list span{font-size:.88rem;color:var(--muted)}

/* Sections */
.section{position:relative;padding:clamp(4rem,8vw,6.5rem) 0;overflow:hidden}
.section--night{background:var(--space);color:#fff}
.section--night .lede{color:rgba(255,255,255,.74)}
.section--night .curve{stroke:var(--blue);stroke-width:1.6;opacity:.4}
.section--dawn{background:var(--pudding)}

/* About */
.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.about__copy p{color:#454a60}
.social{list-style:none;padding:0;margin:1.5rem 0 0;display:flex;flex-wrap:wrap;gap:.6rem}
.social a{display:inline-block;text-decoration:none;font-size:.88rem;font-weight:600;padding:.45rem 1rem;border:1.5px solid var(--space);border-radius:999px;background:transparent;transition:background .2s,color .2s}
.social a:hover{background:var(--space);color:#fff}

/* Topic cards */
.cards{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem;margin-top:2.5rem}
.card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:2rem;transition:transform .25s,border-color .25s,background .25s}
.card:hover{transform:translateY(-3px);border-color:var(--blue);background:rgba(255,255,255,.06)}
.card__num{display:inline-block;font-family:var(--display);font-size:.85rem;font-weight:500;color:var(--space);background:var(--lilac);border-radius:999px;padding:.2rem .75rem;margin-bottom:1rem}
.card:nth-child(2) .card__num{background:var(--mint)}
.card:nth-child(3) .card__num{background:var(--pudding)}
.card:nth-child(4) .card__num{background:var(--blue)}
.card h3{font-size:1.12rem;color:#fff;line-height:1.35}
.card p{color:rgba(255,255,255,.76);margin:0}

/* Press */
.press{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);margin-top:2rem}
.press__head{font-family:var(--sans);font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:700;margin:1.5rem 0 .5rem}
.press>div>.press__head:first-child{margin-top:0}
.list{list-style:none;margin:0;padding:0}
.list li{display:grid;grid-template-columns:88px 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.list__date{font-size:.85rem;color:var(--blue-ink);font-weight:700;padding-top:.15rem}
.list li div{display:flex;flex-direction:column}
.list strong{font-family:var(--display);font-size:1rem;font-weight:500}
.list a{text-decoration:none}
.list a strong{background:linear-gradient(var(--blue),var(--blue)) 0 100%/0 2px no-repeat;transition:background-size .25s}
.list a:hover strong{background-size:100% 2px}
.list a strong::after{content:" \2197";font-size:.8em;color:var(--blue-ink)}
.list span{color:var(--muted);font-size:.95rem}
.placeholder-note{margin-top:1.5rem;padding:1rem 1.25rem;border:1.5px dashed var(--blue);border-radius:12px;color:var(--muted);font-size:.92rem;background:#fff}

/* Honors */
.honors{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem)}
.ticks{list-style:none;padding:0;margin:0}
.ticks li{position:relative;padding:.7rem 0 .7rem 2rem;border-bottom:1px solid rgba(42,47,68,.12)}
.ticks li::before{content:"";position:absolute;left:0;top:1.15rem;width:12px;height:12px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 4px rgba(4,179,211,.18)}

/* Partnerships */
.partner{isolation:isolate;display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.partner__copy p{color:#454a60}
.stats{list-style:none;padding:0;margin:1.5rem 0 .4rem;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stats li{padding:1rem .5rem;text-align:center;display:flex;flex-direction:column}
.stats strong{font-family:var(--display);font-weight:500;font-size:1.35rem;color:var(--space)}
.stats span{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.stats__src{font-size:.82rem;color:var(--muted)!important;margin-bottom:1.4rem!important}
.fine{font-size:.88rem;color:var(--muted)!important;font-style:italic}
.partner__photo{overflow:visible;background:none;box-shadow:none}
.partner__photo .frame{position:absolute;inset:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:linear-gradient(160deg,var(--space-2),#4b4f7a)}
.partner__photo::after{content:"";position:absolute;left:-16px;top:-16px;width:70px;height:70px;border-radius:50%;background:var(--lilac);z-index:-1}

/* Contact */
.contact{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.contact__copy p{color:rgba(255,255,255,.8)}
.contact__copy a{color:var(--blue)}
.form{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:clamp(1.5rem,3vw,2.25rem);display:grid;gap:1rem}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form label{display:flex;flex-direction:column;gap:.4rem;font-size:.85rem;font-weight:600;color:rgba(255,255,255,.86)}
.form input,.form select,.form textarea{font:inherit;font-weight:400;font-size:1rem;color:#fff;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:.75rem .9rem;width:100%}
.form select option{color:var(--ink)}
.form input::placeholder{color:rgba(255,255,255,.42)}
.form .btn{justify-self:start;margin-top:.25rem}

/* Footer */
.footer{background:var(--space);color:rgba(255,255,255,.62);padding:2rem 0;font-size:.88rem;border-top:1px solid rgba(255,255,255,.08)}
.footer__inner{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.footer p{margin:0}
.social--footer{margin:0}
.social--footer a{border-color:rgba(255,255,255,.25);color:rgba(255,255,255,.85)}
.social--footer a:hover{background:var(--blue);border-color:var(--blue);color:var(--space)}


/* Speaking photo (Topics section) */
.topics__intro{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.topics__copy h2{max-width:22ch}
.stage-photo{overflow:visible;background:none;box-shadow:none;aspect-ratio:4/3;margin:0 0 2.2rem 14px}
.stage-photo .frame{position:absolute;inset:0;border-radius:var(--radius);overflow:hidden;box-shadow:0 30px 60px -25px rgba(0,0,0,.6);background:linear-gradient(160deg,var(--space-2),#4b4f7a)}
.stage-photo img{object-position:45% 30%}
.stage-photo::before{content:"";position:absolute;inset:-14px 14px 14px -14px;border:1.5px solid var(--lilac);border-radius:calc(var(--radius) + 6px);pointer-events:none}
.stage-photo::after{content:"";position:absolute;right:-16px;top:-16px;width:64px;height:64px;border-radius:50%;background:var(--mint);z-index:-1}
.stage-photo figcaption{position:absolute;left:0;right:0;top:100%;padding-top:.8rem;font-size:.85rem;color:rgba(255,255,255,.7)}
#topics .wrap{position:relative;isolation:isolate}

/* Media headshot (Press) */
.mediakit{display:grid;grid-template-columns:104px 1fr;gap:1.1rem;align-items:center;margin-top:1.75rem;padding:1rem;border:1px solid var(--line);border-radius:16px;background:#fff}
.mediakit img{width:104px;height:130px;object-fit:cover;object-position:50% 20%;border-radius:12px}
.mediakit .press__head{margin:0 0 .3rem}
.mediakit p{margin:0 0 .7rem;color:var(--muted);font-size:.92rem}

/* Responsive */
@media (max-width:900px){
  .nav__links li:not(:last-child){display:none}
  .hero__grid,.about,.partner,.contact,.press,.honors,.topics__intro{grid-template-columns:1fr}
  .stage-photo{max-width:640px;margin-bottom:3.4rem}
  .hero__photo{justify-self:start;max-width:300px;order:-1;margin:14px 0 0 14px}
  .about__photo{max-width:440px}
  .partner__photo{max-width:440px;margin-left:16px}
  .strip__list{grid-template-columns:repeat(2,1fr);row-gap:1.25rem}
  .strip__list li:nth-child(3){border-left:0}
}
@media (max-width:600px){
  body{font-size:16px}
  .nav__brand{font-size:.92rem}
  .cards{grid-template-columns:1fr}
  .card{padding:1.5rem}
  .form__row{grid-template-columns:1fr}
  .hero__photo{max-width:210px}
  .hero__ctas .btn{flex:1 1 100%;text-align:center}
  .list li{grid-template-columns:1fr;gap:.2rem}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stats li:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .footer__inner{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}