:root{
    --purple:    #69539b;
    --lavender:  #877dba;
    --forest:    #3e6549;
    --sage:      #659257;
    --olive:     #829d64;
    --charcoal:  #333333;
    --gray:      #666666;
    --pale:      #dddddd;
    --white:     #ffffff;
    --lavender-tint: #f4f2f8;
    --sage-tint:      #f3f6f0;
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html,body{ background:var(--white); font-family:'Karla', sans-serif; width:100%; overflow-x:hidden; }

  /* subtle diagonal hairline texture, matches the fine-line pattern behind
     white sections on the rest of the site */
  .texture{
    background-image: repeating-linear-gradient(-45deg, rgba(51,51,51,0.035) 0, rgba(51,51,51,0.035) 1px, transparent 1px, transparent 14px);
  }

  /* ============ TOP BANNER + NAV ============ */
  .banner{
    position:relative;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.72) 100%),
      linear-gradient(120deg, #c9a7c2 0%, #b7a7c9 30%, #cbb896 65%, #d8c7a9 100%);
    padding-bottom:1.6rem;
  }

  nav{ display:flex; align-items:center; justify-content:space-between; padding:2.1rem 6vw 0 6vw; }
  .brand{ display:flex; align-items:center; gap:0.65rem; }
  .brand-icon{ width:38px; height:auto; flex:0 0 auto; }
  .brand .name{
    font-family:'Source Serif 4', serif; font-weight:400; font-size:1.32rem;
    letter-spacing:0.01em; color:var(--charcoal); line-height:1;
  }
  .brand .name span{ color:var(--sage); }

  .nav-links{ display:flex; flex-wrap:wrap; font-size:0.78rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--charcoal); }
  .nav-links a{ color:inherit; text-decoration:none; padding-bottom:2px; margin-left:2.2rem; border-bottom:1px solid transparent; transition:color 0.15s ease, border-color 0.15s ease; }
  .nav-links a:hover{ color:var(--purple); border-color:var(--purple); }
  @media (max-width:600px){ .nav-links{ display:none; } }

  /* ============ HERO CONTENT ============ */
  .hero-content{
    padding:4vh 6vw 6vh 6vw; max-width:1160px; margin:0 auto;
  }

  .hero-grid{ display:flex; flex-wrap:wrap; align-items:center; gap:3.2rem; text-align:left; }
  .hero-text{ flex:1 1 420px; }
  .hero-photo-wrap{ flex:1 1 260px; max-width:340px; }

  h1{
    font-family:'Source Serif 4', serif; font-weight:500;
    font-size:clamp(2.5rem, 4.6vw, 3.6rem); line-height:1.15; letter-spacing:-0.01em; color:var(--charcoal);
  }
  h1 em{ font-style:italic; color:var(--purple); }

  .sub{ margin-top:1.7rem; max-width:520px; font-size:1.05rem; line-height:1.7; color:var(--gray); }
  .sub b{ color:var(--charcoal); font-weight:700; }

  .cta-row{ margin-top:2.4rem; display:flex; gap:1.4rem; align-items:center; flex-wrap:wrap; justify-content:flex-start; }
  .btn-primary{
    background:var(--purple); color:#fff; font-weight:700; font-size:0.86rem; letter-spacing:0.03em;
    padding:0.95rem 2rem; border-radius:4px; text-decoration:none; display:inline-block;
    transition:background 0.15s ease, transform 0.15s ease;
  }
  .btn-primary:hover{ background:var(--lavender); transform:translateY(-1px); }
  .btn-primary:focus-visible{ outline:3px solid var(--sage); outline-offset:3px; }
  .btn-secondary{ color:var(--gray); font-size:0.9rem; text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(102,102,102,0.4); }
  .btn-secondary:hover{ color:var(--purple); }
  .btn-secondary:focus-visible{ outline:2px solid var(--sage); outline-offset:3px; }

  .disclaimer{ margin-top:2.2rem; font-size:0.76rem; color:#999; max-width:480px; line-height:1.55; }

  /* Hero photo */
  .hero-photo-wrap{ position:relative; display:flex; justify-content:center; }
  .hero-photo-wrap::before{
    content:""; position:absolute; width:82%; height:92%;
    background:linear-gradient(135deg, var(--lavender) 0%, var(--sage) 100%);
    opacity:0.22; border-radius:200px 200px 24px 24px;
    transform:rotate(-6deg) translate(14px, 10px); z-index:0;
  }
  .hero-photo-frame{
    position:relative; z-index:1; width:320px; height:400px; max-width:100%;
    border-radius:200px 200px 24px 24px; overflow:hidden;
    box-shadow:0 22px 40px -18px rgba(51,41,74,0.38), 0 0 0 6px #fff;
  }
  .hero-photo-frame img{ position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; object-fit:cover; object-position:50% 18%; display:block; }
  .hero-photo-badge{
    position:absolute; z-index:2; left:50%; bottom:-16px; transform:translateX(-50%);
    width:46px; height:46px; background:#fff; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 16px -4px rgba(51,41,74,0.3);
  }
  .hero-photo-badge svg{ width:26px; height:auto; }

  @media (max-width:820px){
    .hero-grid{ flex-direction:column; text-align:center; gap:2.4rem; }
    .sub{ margin-left:auto; margin-right:auto; }
    .cta-row{ justify-content:center; }
    .disclaimer{ margin-left:auto; margin-right:auto; }
    .hero-photo-wrap{ width:auto; }
    .hero-photo-frame{ width:260px; height:325px; }
  }
  @media (max-width:340px){
    .hero-photo-frame{ width:220px; height:275px; }
  }

  /* ============ SHARED BLOCK STYLES ============ */
  .eyebrow{ font-size:0.78rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--purple); font-weight:700; margin-bottom:1.5rem; }
  .block{ padding:8vh 6vw; }
  .block-inner{ max-width:1040px; margin:0 auto; }
  h2{ font-family:'Source Serif 4', serif; font-weight:500; font-size:clamp(1.5rem, 3vw, 2.15rem); line-height:1.3; color:var(--charcoal); }
  h2 em{ font-style:italic; color:var(--purple); }
  h2.center{ text-align:center; max-width:720px; margin:0.5rem auto 0; }

  /* Recognition */
  .block.recognition{ background:var(--white); }
  .chip-grid{ margin-top:3rem; display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem; }
  @media (max-width:820px){ .chip-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:560px){ .chip-grid{ grid-template-columns:1fr; } }
  .chip{
    border:1px solid var(--pale); border-radius:4px; padding:1.4rem 1.3rem;
    font-size:0.94rem; color:var(--gray); line-height:1.5; background:var(--white);
    display:flex; align-items:flex-start; gap:0.6rem;
  }
  .chip svg{ flex:0 0 auto; margin-top:0.15rem; margin-right:0.65rem; }

  /* Story */
  .block.story{ background:var(--lavender-tint); }
  .two-col{ display:grid; grid-template-columns:0.8fr 1.2fr; gap:4rem; align-items:start; }
  @media (max-width:760px){ .two-col{ grid-template-columns:1fr; gap:1.6rem; } }
  .col-label .eyebrow{ color:var(--sage); margin-bottom:0.6rem; }
  .col-label h2{ margin-top:0.2rem; }
  .col-copy p{ color:var(--gray); font-size:1.01rem; line-height:1.75; margin-bottom:1.1rem; max-width:560px; }
  .col-copy b{ color:var(--charcoal); }
  .link-arrow{ color:var(--sage); text-decoration:none; font-weight:700; font-size:0.9rem; display:inline-block; margin-top:0.4rem; }
  .link-arrow:hover{ color:var(--forest); }
  .link-arrow:focus-visible{ outline:2px solid var(--purple); outline-offset:3px; }

  /* Credentials */
  .block.credentials{ background:var(--sage-tint); padding:5.5vh 6vw; }
  .cred-label{
    text-align:center; font-size:0.74rem; letter-spacing:0.16em; text-transform:uppercase;
    color:var(--forest); font-weight:700; margin-bottom:2.4rem;
  }
  .badge-row{ display:flex; justify-content:center; align-items:flex-start; gap:3rem; flex-wrap:wrap; }
  .badge-slot{ display:flex; flex-direction:column; align-items:center; text-align:center; max-width:150px; }
  .badge-icon{ width:52px; height:52px; margin-bottom:0.7rem; }
  .badge-icon svg{ width:100%; height:100%; }
  .badge-name{ font-family:'Source Serif 4', serif; font-size:0.98rem; color:var(--charcoal); margin-bottom:0.2rem; }
  .badge-sub{ font-size:0.72rem; color:var(--gray); line-height:1.4; }

  /* Process */
  .block.process{ background:var(--white); }
  .block.process .eyebrow{ color:var(--olive); }
  .steps{ margin-top:3.2rem; display:grid; grid-template-columns:repeat(3, 1fr); gap:1.6rem; }
  @media (max-width:820px){ .steps{ grid-template-columns:1fr; gap:1.4rem; } }
  .step{ border:1px solid var(--pale); border-radius:4px; padding:1.8rem 1.6rem; background:var(--white); }
  .step-num{
    width:34px; height:34px; border-radius:50%; border:1.5px solid var(--forest); color:var(--forest);
    font-family:'Source Serif 4', serif; font-style:italic; font-size:1rem;
    display:flex; align-items:center; justify-content:center; margin-bottom:1rem;
  }
  .step h3{ font-family:'Karla', sans-serif; font-weight:700; font-size:1.02rem; color:var(--charcoal); margin-bottom:0.5rem; }
  .step p{ color:var(--gray); font-size:0.94rem; line-height:1.6; }

  /* Closing */
  .block.closing{
    background:radial-gradient(ellipse 800px 460px at 50% 0%, rgba(105,83,155,0.10), transparent 65%), var(--lavender-tint);
    position:relative; overflow:visible;
  }
  .block.closing .eyebrow{ color:var(--forest); }
  .closing-sub{ color:var(--gray); max-width:480px; margin:1.1rem auto 2.2rem; line-height:1.65; }
  .closing-inner{ position:relative; z-index:2; text-align:center; }

  /* ============ FOOTER ============ */
  footer{
    position:relative; overflow:visible;
    background:var(--sage-tint); padding:2.2rem 6vw; display:flex; align-items:center;
    justify-content:space-between; flex-wrap:wrap; gap:1.2rem;
  }
  .footer-copy{ font-size:0.78rem; color:var(--gray); }
  .footer-links{ display:flex; gap:1.6rem; font-size:0.8rem; }
  .footer-links a{ color:var(--gray); text-decoration:none; }
  .footer-links a:hover{ color:var(--purple); }

  /* Bloom — rooted in the footer, growing up across the seam into the CTA */
  .bloom{
    position:absolute; left:50%; bottom:38%; transform:translateX(-50%);
    width:100px; opacity:0.95; pointer-events:none; z-index:3;
  }