:root {
  --teal:        #3a8fa3;
  --teal-dark:   #2a6e80;
  --teal-deeper: #1f5263;
  --teal-light:  #8ec8d8;
  --teal-pale:   #e8f4f7;
  --warm-white:  #ffffff;
  --text-dark:   #1a3a42;
  --text-mid:    #3a6070;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Nunito Sans', sans-serif; background: var(--warm-white); color: var(--text-dark); line-height: 1.7; }

/* NAV */
nav { position: fixed; top: 0; width: 100%; z-index: 100; background: rgba(31,82,99,0.97); backdrop-filter: blur(8px); padding: 0.6rem 2.5rem; display: flex; justify-content: space-between; align-items: center; }
.nav-logo-link { display: flex; align-items: center; text-decoration: none; }
.nav-logo-img { height: 76px; width: auto; }
.nav-links a { color: var(--teal-light); text-decoration: none; margin-left: 2rem; font-family: 'Nunito', sans-serif; font-size: 0.9rem; font-weight: 600; letter-spacing: 0.04em; transition: color 0.2s; }
.nav-links a:hover { color: #fff; }
.nav-toggle { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--teal-light); }
@media (max-width: 680px) {
  .nav-links { display: none; }
  .nav-toggle { display: flex; }
  .nav-links.open { display: flex; flex-direction: column; position: absolute; top: 100%; left: 0; width: 100%; background: rgba(31,82,99,0.98); padding: 1.2rem 2.5rem 1.5rem; gap: 1rem; }
  .nav-links.open a { margin-left: 0; font-size: 1rem; }
}

/* HERO */
.hero { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 7rem 2rem 5rem; overflow: hidden; }
.hero-photo-bg { position: absolute; inset: 0; z-index: 0; }
.hero-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(155deg, rgba(31,82,99,0.82) 0%, rgba(42,110,128,0.75) 50%, rgba(58,143,163,0.65) 100%); }
.hero-inner { position: relative; z-index: 2; max-width: 820px; }
.hero-logo-large { height: 200px; width: auto; margin-bottom: 2rem; filter: brightness(0) invert(1); opacity: 0.97; }
.hero-eyebrow { font-family: 'Nunito', sans-serif; font-size: 0.78rem; letter-spacing: 0.28em; color: var(--teal-light); text-transform: uppercase; margin-bottom: 1rem; font-weight: 600; }
.hero-tagline { font-family: 'Nunito', sans-serif; font-size: clamp(1.1rem, 2.5vw, 1.35rem); color: #fff; font-style: italic; margin-bottom: 2rem; font-weight: 300; }
.hero-sub { font-size: 1.05rem; color: #c8e8f0; max-width: 600px; margin: 0 auto 2.8rem; font-family: 'Nunito Sans', sans-serif; font-weight: 300; line-height: 1.9; }
.btn { display: inline-block; padding: 0.85rem 2.4rem; background: transparent; border: 2px solid var(--teal-light); color: #fff; font-family: 'Nunito', sans-serif; font-size: 0.88rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; text-decoration: none; transition: all 0.25s; }
.btn:hover { background: var(--teal-light); color: var(--teal-deeper); }
.btn-solid { background: var(--teal); border-color: var(--teal); color: #fff; }
.btn-solid:hover { background: var(--teal-deeper); border-color: var(--teal-deeper); }

/* SECTIONS */
section { padding: 5.5rem 2rem; }
.container { max-width: 1020px; margin: 0 auto; }
.section-label { font-family: 'Nunito', sans-serif; font-size: 0.73rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--teal); margin-bottom: 0.7rem; font-weight: 700; }
h2 { font-family: 'Nunito', sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); color: var(--teal-deeper); margin-bottom: 1.2rem; line-height: 1.15; font-weight: 700; }
.lead { font-size: 1.05rem; color: var(--text-mid); max-width: 700px; line-height: 1.9; font-family: 'Nunito Sans', sans-serif; font-weight: 400; margin-bottom: 1.5rem; }
.divider { width: 48px; height: 2px; background: var(--teal); margin: 1.4rem 0; }

/* ABOUT */
#about { background: var(--teal-pale); }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
@media (max-width: 700px) { .about-grid { grid-template-columns: 1fr; } }
.about-photo-wrap { min-height: 420px; overflow: hidden; }

/* STATS STRIP */
.stats-strip { background: var(--teal-deeper); padding: 2.5rem 2rem; display: flex; justify-content: center; flex-wrap: wrap; gap: 0; }
.stat-item { text-align: center; padding: 1rem 3rem; border-right: 1px solid rgba(142,200,216,0.25); }
.stat-item:last-child { border-right: none; }
.stat-item .num { font-family: 'Nunito', sans-serif; font-size: 2.4rem; font-weight: 700; color: var(--teal-light); line-height: 1; }
.stat-item .label { font-family: 'Nunito', sans-serif; font-size: 0.75rem; color: rgba(200,232,240,0.7); margin-top: 0.4rem; letter-spacing: 0.04em; }
@media (max-width: 700px) { .stat-item { border-right: none; padding: 1rem 1.5rem; } }

/* FOUNDER */
#founder { background: var(--warm-white); }
.founder-grid { display: grid; grid-template-columns: 320px 1fr; gap: 4rem; align-items: start; }
@media (max-width: 780px) { .founder-grid { grid-template-columns: 1fr; } }
.headshot-wrap { position: relative; }
.headshot-img { width: 100%; aspect-ratio: 4/5; object-fit: cover; display: block; }
.headshot-placeholder { width: 100%; aspect-ratio: 4/5; background: linear-gradient(160deg, var(--teal-pale) 0%, #c8e8f0 100%); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; }
.headshot-placeholder svg { width: 80px; height: 80px; opacity: 0.4; }
.headshot-placeholder p { font-family: 'Nunito', sans-serif; font-size: 0.78rem; letter-spacing: 0.15em; text-transform: uppercase; font-weight: 700; opacity: 0.5; text-align: center; padding: 0 1rem; }
.headshot-accent { position: absolute; bottom: -12px; left: -12px; width: 60%; height: 60%; border: 3px solid var(--teal-light); z-index: -1; }
.founder-bio h3 { font-family: 'Nunito', sans-serif; font-size: 1.7rem; font-weight: 700; color: var(--teal-deeper); margin-bottom: 0.8rem; }
.founder-bio .section-label { margin-bottom: 0.3rem; }
.founder-bio p { font-size: 1.02rem; color: var(--text-mid); font-family: 'Nunito Sans', sans-serif; line-height: 1.85; margin-bottom: 1.1rem; }
.founder-tags { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 1.5rem; }
.founder-tag { background: var(--teal-pale); border: 1px solid var(--teal-light); color: var(--teal-dark); padding: 0.35rem 0.9rem; font-family: 'Nunito', sans-serif; font-size: 0.8rem; font-weight: 600; }

/* PHILOSOPHY STRIP */
.philosophy-strip { position: relative; padding: 6rem 2rem; text-align: center; overflow: hidden; }
.philosophy-photo-bg { position: absolute; inset: 0; z-index: 0; }
.philosophy-overlay { position: absolute; inset: 0; z-index: 1; background: rgba(31,82,99,0.82); }
.philosophy-content { position: relative; z-index: 2; max-width: 760px; margin: 0 auto; }
.philosophy-content blockquote { font-family: 'Nunito', sans-serif; font-size: clamp(1.1rem, 2.5vw, 1.45rem); color: #fff; font-style: italic; line-height: 1.75; font-weight: 300; }
.philosophy-content cite { display: block; margin-top: 1rem; font-family: 'Nunito', sans-serif; font-size: 0.78rem; letter-spacing: 0.18em; color: var(--teal-light); font-style: normal; text-transform: uppercase; font-weight: 600; }

/* SERVICES */
#services { background: var(--teal-pale); }
.services-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; margin-bottom: 2rem; }
@media (max-width: 700px) { .services-intro { grid-template-columns: 1fr; } }
.services-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; margin-top: 1rem; }
@media (max-width: 700px) { .services-grid { grid-template-columns: 1fr; } }
.service-block { background: var(--warm-white); padding: 2.2rem 2.5rem; border-left: 4px solid var(--teal); }
.service-block h3 { font-family: 'Nunito', sans-serif; font-size: 1.2rem; color: var(--teal-deeper); margin-bottom: 0.4rem; font-weight: 700; }
.service-block .service-sub { font-family: 'Nunito', sans-serif; font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--teal); margin-bottom: 0.85rem; font-weight: 700; }
.service-block p { font-size: 0.92rem; color: var(--text-mid); font-family: 'Nunito Sans', sans-serif; line-height: 1.75; }
.service-block ul { margin-top: 0.85rem; padding-left: 1.1rem; }
.service-block ul li { font-size: 0.87rem; color: var(--text-mid); font-family: 'Nunito Sans', sans-serif; line-height: 1.7; margin-bottom: 0.2rem; }

/* PHOTO BREAK */
.photo-break { width: 100%; height: 320px; overflow: hidden; }

/* CLIENTS */
#clients { background: var(--teal-deeper); }
#clients .section-label { color: var(--teal-light); }
#clients h2 { color: #fff; }
#clients .lead { color: #c8e8f0; }
.client-tags { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 1.5rem; }
.tag { background: rgba(255,255,255,0.08); border: 1px solid rgba(142,200,216,0.4); color: var(--teal-light); padding: 0.45rem 1.1rem; font-family: 'Nunito', sans-serif; font-size: 0.83rem; font-weight: 600; }

/* CONTACT */
#contact { background: var(--teal-pale); }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: start; }
@media (max-width: 700px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-detail { font-family: 'Nunito Sans', sans-serif; font-size: 0.93rem; color: var(--text-mid); margin-bottom: 0.65rem; }
.contact-detail a { color: var(--teal); text-decoration: none; }
.contact-detail a:hover { text-decoration: underline; }
form { display: flex; flex-direction: column; gap: 1rem; }
input, textarea { padding: 0.8rem 1rem; border: 1px solid var(--teal-light); background: #fff; font-family: 'Nunito Sans', sans-serif; font-size: 0.9rem; color: var(--text-dark); outline: none; transition: border 0.2s; }
input:focus, textarea:focus { border-color: var(--teal); }
textarea { height: 130px; resize: vertical; }

/* FOOTER */
footer { background: var(--teal-deeper); padding: 2rem; }
.footer-inner { display: flex; flex-direction: column; align-items: center; gap: 0.8rem; }
.footer-logo { height: 48px; width: auto; filter: brightness(0) invert(1); opacity: 0.7; }
footer p { color: var(--teal-light); font-family: 'Nunito', sans-serif; font-size: 0.78rem; letter-spacing: 0.06em; font-weight: 600; text-align: center; }

/* ANIMATIONS */
.fade-in { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }
