:root{--blue:#0E5AA7;--green:#11998E;--ink:#0b1220;--muted:#5b6573;--bg:#ffffff;--surface:#f5f8fb;--accent:linear-gradient(135deg,var(--blue),var(--green));--radius:12px;--shadow:0 6px 20px rgba(6,24,44,.12)}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans",sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
a{color:var(--blue)}a:focus{outline:3px solid rgba(17,153,142,.35);outline-offset:2px}
img{max-width:100%;display:block;height:auto}.round-shadow{border-radius:50%;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.container{width:min(1100px,92vw);margin-inline:auto}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:1rem;top:1rem;padding:.5rem .75rem;background:#fff;border-radius:6px;box-shadow:var(--shadow)}
.site-header{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid #e7eef7}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;padding:1rem .25rem}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);font-weight:700}.brand-text{font-size:1.125rem}
.site-nav ul{display:flex;gap:1rem;list-style:none;margin:0;padding:0}.site-nav a{display:block;padding:.5rem .75rem;border-radius:8px;text-decoration:none;color:var(--ink)}.site-nav a:hover{background:var(--surface)}
.nav-toggle{display:none;background:none;border:0;font-size:1.5rem}

/* Header CTA buttons */
.header-cta{ display:flex; gap:.5rem; margin-left:1rem }
.icon-btn{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid #e7eef7; border-radius:10px; background:#fff; box-shadow: var(--shadow); text-decoration:none }
.icon-btn:hover,.icon-btn:focus{ background:var(--surface) }
.icon-btn img{ width:22px; height:22px }

.hero{background:var(--accent);color:#fff}
.hero-inner{display:grid;grid-template-columns:1fr 1.2fr;gap:2rem;align-items:center;padding:4rem 0}
.hero-video{ width:220px; height:auto; border-radius:50%; box-shadow:0 6px 18px rgba(0,0,0,.25) }
@media (max-width:700px){.hero-inner{grid-template-columns:1fr}.hero-video{ width:160px }}

.hero-copy h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:.25rem 0 1rem}.hero-copy .lede{opacity:.95}
.btn{display:inline-block;padding:.75rem 1rem;border-radius:10px;border:2px solid transparent;text-decoration:none;font-weight:600}
.btn-primary{background:#fff;color:var(--ink);border-color:transparent}
.btn-outline{background:transparent;border-color:#fff;color:#fff}
.btn-outline-dark{background:transparent;border:2px solid var(--blue);color:var(--blue)}
.btn-outline-dark:hover,.btn-outline-dark:focus{background:var(--blue);color:#fff}

.services-teaser{padding:3rem 0;background:var(--surface)}.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;margin-top:1rem}
.card{background:#fff;border-radius:var(--radius);padding:1rem;border:1px solid #e5eef5;box-shadow:var(--shadow)}.card p{color:var(--muted)}
.page-header{padding:1rem 0;background:var(--surface);border-bottom:1px solid #e7eef7}.page-header .lede{color:var(--muted);margin-bottom:.25rem}
.two-col-inner{display:grid;grid-template-columns:2fr 1fr;gap:2rem;padding:2rem 0}.profile-card{background:#fff;border:1px solid #e7eef7;border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow)}
.profile-img{width:220px;height:auto}
.values{padding-left:1rem}.values li{margin:.5rem 0}
.service-sections{padding:2rem 0}.service-block{padding:1.25rem;border-bottom:1px solid #e7eef7}.service-block:last-child{border-bottom:0}

.page-visual-talk{ padding: 0 0 1rem }
.page-visual-talk figure{ margin:0 }
.page-visual-talk img{ width:100%; height:auto; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.12) }

.contact-grid{display:grid;grid-template-columns:2fr 1fr;gap:2rem;padding:.25rem 0}.contact-form{display:grid;gap:.5rem}
.contact-form input,.contact-form textarea{width:100%;padding:.75rem;border:1px solid #dbe6f2;border-radius:10px;background:#fff}
.contact-form button{justify-self:flex-start}

.cta-band{background:var(--accent);color:#fff;padding:2.25rem 0;margin:2rem 0 0}.cta-white{background:#fff;color:var(--ink);border-top:1px solid #e7eef7;border-bottom:1px solid #e7eef7}
.cta-inner{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}

.site-footer{background:#071a2b;color:#e8f1fa;margin-top:3rem;padding:2rem 0 1rem}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
.site-footer a{color:#11998E}.site-footer a:hover,.site-footer a:focus{color:#ffffff;text-decoration:underline}
.footer-nav,.contact-list{list-style:none;margin:0;padding:0}.footer-nav li,.contact-list li{margin:.3rem 0}
.smallprint{border-top:1px solid rgba(255,255,255,.1);padding-top:1rem;margin-top:1rem;color:#b9c8d6;font-size:.9rem}

@media (max-width:900px){.card-grid{grid-template-columns:repeat(2,1fr)}.two-col-inner,.contact-grid,.hero-inner{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}}
@media (max-width:700px){.site-nav{display:none;position:absolute;right:1rem;top:64px;background:#fff;border:1px solid #e7eef7;border-radius:10px;box-shadow:var(--shadow)}.site-nav ul{flex-direction:column;padding:.5rem}.site-nav a{padding:.5rem 1rem}.nav-toggle{display:block}}

/* v9-15 updates */
/* Restore hero image sizing */
.hero-photo img{ width:220px; max-width:100%; height:auto }
@media (max-width:700px){ .hero-photo img{ width:160px } }

/* Coaching two-column layout */
.coaching-grid{ display:grid; grid-template-columns: 1.2fr 1fr; gap:1rem; align-items:start; margin-top:.75rem }
.coaching-image img{ width:100%; height:auto; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.12) }
@media (max-width:900px){ .coaching-grid{ grid-template-columns:1fr; } .coaching-image{ order:2 } }

/* Contact intro spacing */
.contact-intro{ padding:.5rem 0 0.5rem; }
.contact-intro .lede{ color:var(--muted); margin:.25rem 0 0; }

/* v9-20 updates */
/* DIGS framework grid */
.digs-framework{padding:3rem 0;background:#fff}
.digs-framework h2{text-align:center;margin-bottom:1.5rem}
.digs-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.digs-grid .card{background:#f5f8fb;border:1px solid #e5eef5;border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow)}
@media(max-width:900px){.digs-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.digs-grid{grid-template-columns:1fr}}

/* Core Values + Credentials */
.core-values,.credentials{padding:2rem 0}
.core-values h2,.credentials h2{margin-bottom:.75rem}
.core-values ul,.credentials ul{padding-left:1rem}

/* v9-21: color DIGS headings to brand */
.digs-grid .card h3{ color: var(--blue); }
.digs-grid .card h3 a{ color: var(--blue); } /* in case headings are links */

/* v9-23b: white background for Get in touch header */
.page-header.page-header--white{ background:#ffffff; border-bottom:1px solid #e7eef7; }

/* v9-23c: Contact and About adjustments */
/* Remove border from Get in touch header */
.page-header.page-header--white{ background:#ffffff; border-bottom:none; }
/* Subheading style for credentials */
.subheading{ font-size:1.1rem; font-weight:600; margin-top:1rem; margin-bottom:.5rem; color:var(--ink); }

/* v9-23d fixes */
/* Contact: (no CSS changes needed for duplicate removal) */

/* About: make credentials look like part of the same block as values */
.two-col .subheading{ font-size:1.05rem; font-weight:600; margin-top:.75rem; margin-bottom:.25rem; color:var(--ink) }
ul.values.credentials-list{ padding-left:1rem; margin-top:.25rem }
ul.values.credentials-list li{ margin:.5rem 0 }

/* v9-24: Phoenix video placement */
/* Hero background video */
.hero{position:relative;overflow:hidden}
.hero-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-inner{position:relative;z-index:1}
.hero::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.35);z-index:0}

/* About video strip */
.phoenix-video{padding:2rem 0;background:#000;text-align:center}
.phoenix-video video{max-width:100%;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.3)}

/* v9-24a adjustments */
/* Hero: keep gradient background, no video */
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--blue),var(--green));color:#fff}
.hero-inner{position:relative;z-index:1}
.hero::after{content:none}

/* About video strip resized */
.phoenix-video{padding:2rem 0;background:#000;text-align:center}
.about-video{width:60%;max-width:720px;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.3)}
@media(max-width:800px){.about-video{width:90%}}

/* v9-24b: About video styling & theme integration */
.phoenix-video{padding:1.5rem 0;background:var(--surface);border-top:1px solid #e7eef7;border-bottom:1px solid #e7eef7;text-align:center}
.video-play{display:none;margin-top:.5rem;border:1px solid #e7eef7;background:#fff;border-radius:10px;padding:.5rem .75rem;box-shadow:var(--shadow);cursor:pointer}
.video-play:focus{outline:3px solid rgba(17,153,142,.4);outline-offset:2px}


.phoenix-video{padding:1.5rem 0;background:var(--surface);border-top:1px solid #e7eef7;border-bottom:1px solid #e7eef7;text-align:center}
.phoenix-video .about-video{width:60%;max-width:720px;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.3)}
@media(max-width:800px){.phoenix-video .about-video{width:90%}}
.phoenix-video{position:relative}
.phoenix-video .video-cta-removed{
  position:relative;
  display:inline-block;
  margin-top:.5rem;
  border:1px solid #e7eef7;
  background:#fff;
  border-radius:10px;
  padding:.6rem 1rem;
  font-weight:600;
  box-shadow:var(--shadow);
  cursor:pointer;
}
.phoenix-video .video-cta-removed:focus{outline:3px solid rgba(17,153,142,.4);outline-offset:2px}

/* v9-25 adjustments */
@media(max-width:800px){
  .phoenix-video video.about-video{ margin-left:0; margin-right:auto; display:block }
}
.values-heading{ font-size:1.25rem; font-weight:700; margin-top:1rem; margin-bottom:.5rem; color:var(--ink) }
@media(min-width:901px){
  .cta-desktop-only{ margin-top:1rem }
}
@media(max-width:900px){
  .cta-desktop-only{ display:none }
}
@media(min-width:901px){
  .service-block{ padding:1rem 0 }
}

/* v9-25a tweaks */

/* About: gradient divider under Values */
.brand-divider{
  height:1px; border:0; margin:.75rem 0 1rem;
  background: linear-gradient(90deg, var(--blue), var(--green));
}

/* Services: ensure "How I Can..." header left-aligned on all devices */
.page-header.page-header--services h1{ text-align:left; }

/* Services: tighten vertical spacing on desktop further */
@media(min-width:901px){
  .service-sections{ padding:1rem 0; }
  .service-block{ padding:.6rem 0; }
  .service-block p{ margin:.4rem 0 .2rem; }
}

/* v9-25b updates */

/* About: divider above "Values I work by" already uses .brand-divider */

/* Services: mobile header alignment parity with sub-sections */
@media (max-width: 800px){
  .page-header.page-header--services .container{ padding-left:1rem; padding-right:1rem; }
  .page-header.page-header--services h1{ margin-left:0; }
}

/* Services: tighten last block vertical alignment on desktop */
@media (min-width: 901px){
  .service-block--succeed{ margin-top:-0.5rem; }
  .service-block--succeed h3, .service-block--succeed h2{ margin-top:0; }
}

/* Contact: tighten reassurance note spacing under form */
.form-note.small{ margin-top:.4rem; line-height:1.35; color: var(--ink); opacity: .85; }

/* v9-25c updates */

/* About: caption under phoenix video */
.phoenix-caption{
  margin-top:.5rem;
  font-size:0.95rem;
  color: var(--muted);
}

/* Contact: show gradient divider before Direct Contact on mobile only */
.mobile-only{ display:none; }
@media (max-width:800px){
  .mobile-only{ display:block; }
}
.brand-divider{
  height:1px; border:0; margin:.75rem 0 1rem;
  background: linear-gradient(90deg, var(--blue), var(--green));
}

/* v9-25d: caption alignment responsive */
.phoenix-caption{ text-align:center; }
@media (max-width:800px){
  .phoenix-caption{ text-align:left; }
}


/* Contact page image styling */
.contact-image {
  text-align: center;
  margin-top: 1.5rem;
}
.contact-image img {
  max-width: 480px;
  width: 100%;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* Direct contact with side image (updated layout) */
.direct-contact-with-image{
  display: grid;
  grid-template-columns: 1fr minmax(300px, 440px);
  gap: 2rem;
  align-items: start;
  margin-top: 1rem;
}
.contact-side-image{
  justify-self: end;
}
.contact-side-image img{
  width: 100%;
  height: auto;
  max-width: 440px;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
@media (max-width: 760px){
  .direct-contact-with-image{
    grid-template-columns: 1fr;
  }
  .contact-side-image{
    justify-self: center;
    margin-top: 1rem;
  }
}

/* --- Direct contact right-side image (tighter placement) --- */
.contact-side-image-right{ float:right; margin:4px 0 8px 16px; }
.contact-side-image-right img{ max-width: 360px; width:100%; height:auto; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,0.15); }
.direct-contact h2{ margin-bottom: 0.4rem; }
.direct-contact p:first-of-type{ margin-top: 0.3rem; }
@media (max-width: 760px){
  .contact-side-image-right{ float:none; text-align:center; margin:12px auto 0; }
}


/* Ensure right-side image aligns with text */
.contact-side-image-right{ float:right; margin:4px 0 8px 8px; }
.contact-side-image-right img{ max-width: 340px; width:100%; height:auto; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,0.15); }


/* Align contact image with text labels under Direct contact */
.contact-side-image-right{ float:right; margin:4px 0 8px 0; }
.contact-side-image-right img{ max-width: 340px; width:100%; height:auto; display:block;
  border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,0.15);
}
.direct-contact p, .direct-contact a, .direct-contact strong{ display:block; }


/* Fine-tune vertical alignment: top of image aligned with Email label */
.contact-side-image-right{
  float:right;
  margin: -0.3rem 0 8px 0; /* negative top margin to raise image closer to Email line */
}
.contact-side-image-right img{
  max-width:340px;
  width:100%;
  height:auto;
  display:block;
  border-radius:6px;
  box-shadow:0 2px 6px rgba(0,0,0,0.15);
}
