:root{
  --bg:#dde6eb;
  --bg-soft:#eef4f7;
  --bg-card:rgba(255,255,255,.55);
  --text:#20313c;
  --text-soft:#4d6674;
  --text-muted:#5a7280;
  --text-faint:#6f8593;
  --line:#afbec7;
  --line-soft:#bfd0d9;
  --brand:#3e6f86;
  --accent:#c65a2e;
  --accent-dark:#a44722;
  --shadow:0 18px 50px rgba(111,136,152,.08);
  --shadow-lg:0 24px 60px rgba(111,136,152,.08);
  --radius:28px;
  --container:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Manrope',sans-serif;
  color:var(--text);
  background:var(--bg);
  background-image:
    repeating-linear-gradient(to bottom, rgba(32,49,60,.025) 0px, rgba(32,49,60,.025) 1px, transparent 1px, transparent 48px),
    repeating-linear-gradient(to right, rgba(32,49,60,.02) 0px, rgba(32,49,60,.02) 1px, transparent 1px, transparent 96px);
}
::selection{background:var(--brand);color:#fff}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}

.page-polish{position:relative;min-height:100vh}
.page-polish::before{
  content:'';
  position:fixed; inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 15% 12%, rgba(255,255,255,.42), transparent 28%),
    radial-gradient(circle at 82% 18%, rgba(255,255,255,.18), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.12), transparent 22%);
  mix-blend-mode:screen;
  opacity:.55;
}
.page-polish::after{
  content:'';
  position:fixed; inset:0;
  pointer-events:none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32), inset 0 -1px 0 rgba(120,140,152,.08);
  opacity:.8;
}

.container{width:min(var(--container), calc(100% - 48px)); margin:0 auto}

.site-header{
  position:sticky; top:0; z-index:50;
  border-bottom:1px solid rgba(159,176,187,.45);
  background:rgba(221,230,235,.82);
  backdrop-filter:blur(12px);
}
.site-header::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:rgba(255,255,255,.4);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; padding:16px 0;
}
.logo{height:36px; width:auto; object-fit:contain}
.nav-links{display:none; align-items:center; gap:48px}
.nav-links a{
  position:relative;
  font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.16em;
  color:#4f6573; transition:color .3s ease;
}
.nav-links a:hover{color:var(--text)}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:-4px; height:1px; width:0;
  background:var(--accent); transition:width .3s ease;
}
.nav-links a:hover::after{width:100%}

.cta{
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:.22em; transition:all .3s ease; white-space:nowrap;
}
.header-cta{padding:10px 20px; font-size:10px}
.cta-outline{
  border:1px solid var(--accent); color:var(--text);
}
.cta-outline:hover{background:var(--accent); color:#fff}
.cta-solid{
  padding:12px 24px; border:1px solid var(--accent);
  background:var(--accent); color:#fff;
}
.cta-solid:hover{background:var(--accent-dark); border-color:var(--accent-dark)}
.cta-secondary{
  padding:12px 24px;
  border:1px solid #aab9c3; background:rgba(255,255,255,.4); color:var(--text);
}
.cta-secondary:hover{border-color:#7d94a3; background:rgba(255,255,255,.65)}

.hero{position:relative; overflow:hidden}
.hero-bg{
  position:absolute; inset:0;
  background:
    radial-gradient(circle at top left, rgba(255,255,255,.85), transparent 32%),
    linear-gradient(180deg, #e7eef2 0%, #dde6eb 42%, #d6e0e6 100%);
}
.hero-noise{
  pointer-events:none; position:absolute; inset:0; opacity:.045; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='200' height='200' filter='url(%23n)' opacity='0.6'/></svg>");
  background-size:220px 220px;
}
.hero-grid{
  position:relative;
  display:grid; gap:56px;
  min-height:82vh; align-items:start;
  padding-top:112px; padding-bottom:128px;
}
.hero-copy{max-width:48rem; padding-top:16px}
.eyebrow{
  margin:0; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.28em;
  color:#6d8798;
}
.hero-eyebrow{margin-bottom:32px; color:var(--brand)}
.hero h1{
  margin:0;
  max-width:900px;
  font-size:clamp(3rem, 6vw, 5.25rem);
  line-height:.95; letter-spacing:-.045em; font-weight:500;
}
.hero-text{
  margin:40px 0 0;
  max-width:40rem;
  font-size:18px; line-height:2; color:#405965;
}
.hero-actions{margin-top:56px; display:flex; flex-wrap:wrap; gap:16px}

.hero-side{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:28px;
}
.hero-rule{
  position:absolute;
  left:-40px;
  top:20px;
  height:110px;
  width:2px;
  background:#3e6f86;
  opacity:.35;
}
.portrait-card{
  margin-left:auto;
  width:min(100%, 360px);
}

.portrait-frame{
  position:relative;
  width:100%;
  height:460px;
  overflow:hidden;
}

.portrait-image{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center bottom;
}

.founder-copy{max-width:350px}
.founder-label{
  margin:0 0 10px 0;
  font-size:11px;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.32em;
  color:#7f98a6;
}
.founder-copy{
  margin-left:auto;
  width:min(100%,360px);
  margin-top:18px;
}

.section{padding:96px 0 128px}
.section-head{max-width:900px; margin-bottom:56px}
.section-head h2{
  margin:24px 0 0;
  font-size:clamp(2.5rem, 5vw, 3.75rem);
  line-height:1.02; letter-spacing:-.04em; font-weight:600;
}
.section-intro{
  margin:28px 0 0; max-width:760px; font-size:18px; line-height:1.9; color:var(--text-soft);
}

.services-panel{
  border-radius:30px; border:1px solid rgba(170,185,195,.55); background:rgba(255,255,255,.55);
  padding:0 24px; box-shadow:var(--shadow-lg);
  transition:all .3s ease;
}
.services-panel:hover{
  border-color:#94a7b3; background:rgba(255,255,255,.62); box-shadow:0 26px 66px rgba(111,136,152,.10);
}
.service-row{
  display:grid; gap:32px; padding:48px 0; border-bottom:1px solid rgba(191,208,217,.45);
}
.service-row:last-child{border-bottom:none}
.service-number{
  margin:0; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.24em; color:#6d8798;
}
.service-row h3{
  margin:12px 0 0; font-size:clamp(1.75rem, 3vw, 2rem); line-height:1.1;
  font-weight:600; letter-spacing:-.02em;
}
.service-body{
  margin:0; max-width:42rem; font-size:17px; line-height:1.9; color:var(--text-soft);
}

.card-grid{display:grid; gap:24px}
.info-card, .audience-card{
  border-radius:28px; border:1px solid rgba(175,190,199,.5); background:rgba(255,255,255,.55);
  box-shadow:var(--shadow); ring:1px solid rgba(255,255,255,.35);
  padding:32px;
  transition:all .3s ease;
}
.info-card{background:rgba(238,244,247,.75)}
.info-card:hover, .audience-card:hover{
  border-color:#99acb8; background:rgba(255,255,255,.80); box-shadow:0 24px 60px rgba(111,136,152,.10);
}
.info-card h3, .audience-card h3{
  margin:0; font-size:24px; line-height:1.35; letter-spacing:-.02em; font-weight:600;
}
.info-card p, .audience-card p{
  margin:16px 0 0; font-size:15px; line-height:1.85; color:var(--text-soft);
}
.founder-panel{
  margin-top:48px; border-radius:26px; border:1px solid rgba(175,190,199,.45); background:rgba(255,255,255,.45);
  padding:28px 32px;
}
.founder-panel p{margin:0; max-width:900px; font-size:18px; line-height:1.8; color:#304754}

.audience-card{
  border-color:rgba(175,190,199,.45); background:rgba(255,255,255,.40);
  box-shadow:none;
}
.audience-card:hover{
  background:rgba(255,255,255,.58); box-shadow:0 20px 50px rgba(111,136,152,.08)
}
.accent-bar{width:48px; height:3px; border-radius:999px; background:var(--brand)}
.audience-card h3{margin-top:20px; font-size:28px}
.closing-line{margin:48px 0 0; max-width:860px; font-size:18px; line-height:1.8; color:#304754}

.contact-inline{margin-top:40px}
.contact-label{
  margin:0; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.22em; color:var(--text-muted);
}
.contact-email{
  margin:12px 0 0; font-size:1.25rem; font-weight:600; letter-spacing:-.02em;
}

.site-footer{
  border-top:1px solid rgba(175,190,199,.45);
  padding:48px 0;
}
.footer-top{display:flex; flex-direction:column; gap:32px}
.footer-title{
  margin:0; font-size:14px; font-weight:600; text-transform:uppercase; letter-spacing:.24em;
}
.footer-location{margin:8px 0 0; font-size:15px; color:var(--text-muted)}
.footer-tagline{margin:0; max-width:430px; font-size:14px; line-height:1.9; color:var(--text-muted)}
.footer-bottom{
  margin-top:16px; padding-top:16px; border-top:1px solid rgba(198,211,219,.4);
  font-size:13px; color:var(--text-faint);
}

@media (min-width: 768px){
  .nav-links{display:flex}
  .hero-grid{grid-template-columns:1.12fr .88fr}
  .service-row{grid-template-columns:200px 1fr; gap:56px}
  .card-grid.two-up{grid-template-columns:repeat(2, minmax(0,1fr))}
  .card-grid.three-up{grid-template-columns:repeat(3, minmax(0,1fr))}
  .footer-top{flex-direction:row; align-items:flex-end; justify-content:space-between}
  .footer-tagline{text-align:right}
}

@media (min-width: 1024px){
  .hero-rule{display:block}
}

@media (max-width: 767px){
  .header-inner{flex-wrap:wrap}
  .header-cta{display:none}
  .container{width:min(var(--container), calc(100% - 32px))}
  .section{padding:80px 0 104px}
  .hero-grid{padding-top:96px; padding-bottom:104px}
  .portrait-frame{height:360px; max-width:100%}
}