
:root{
 --teal:#0F3D40;--sage:#A8B79A;--gold:#D4A24A;--lav:#D6D1E6;
 --cream:#F7F3EC;--ink:#173B46;--white:#fff;--max:1160px;--r:24px;
 --shadow:0 12px 32px rgba(15,61,64,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Lato,Arial,sans-serif;line-height:1.6}
h1,h2,h3,.nav,.button,.eyebrow,.stat strong{font-family:Montserrat,Arial,sans-serif}
h1,h2,h3{color:var(--teal);line-height:1.08;margin:0 0 18px}
h1{font-size:clamp(2.7rem,5.7vw,5.25rem);letter-spacing:-.035em}
h2{font-size:clamp(2rem,3.8vw,3.35rem);letter-spacing:-.025em}
h3{font-size:1.2rem}
p{margin:0 0 18px}.lead{font-size:1.14rem;max-width:720px}
.wrap{width:min(calc(100% - 44px),var(--max));margin:auto}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:700;color:var(--gold);margin-bottom:16px}
.site-header{background:var(--cream);border-bottom:1px solid rgba(15,61,64,.10);position:sticky;top:0;z-index:20}
.header-inner{height:92px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{width:205px;display:block}
.nav{display:flex;gap:30px;align-items:center;font-size:.88rem;font-weight:600}
.nav a{text-decoration:none;color:var(--teal)}
.nav a.active{border-bottom:2px solid var(--gold);padding-bottom:5px}
.button{display:inline-block;background:var(--teal);color:white!important;text-decoration:none;border:0;border-radius:999px;padding:14px 24px;font-family:Montserrat,Arial,sans-serif;font-weight:700;font-size:.86rem}
section{padding:78px 0}
.hero{padding:72px 0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
.image-card{border-radius:var(--r);overflow:hidden;background:var(--lav);box-shadow:var(--shadow)}
.image-card img{width:100%;height:100%;min-height:390px;object-fit:cover;display:block}
.soft{background:rgba(214,209,230,.48)}
.white{background:rgba(255,255,255,.62)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.card{background:white;border-radius:var(--r);padding:30px;border-top:4px solid var(--gold);box-shadow:var(--shadow)}
.img-wide{margin-top:30px}.img-wide img{width:100%;height:400px;object-fit:cover;border-radius:var(--r);display:block}
.img-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:26px}
.img-grid img{width:100%;height:320px;object-fit:cover;border-radius:var(--r);display:block}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px}
.stat{background:#fff;border-radius:18px;padding:26px;text-align:center}
.stat strong{display:block;font-size:2rem;color:var(--teal)}
.cta-band{background:var(--lav);padding:56px 0}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:34px}
.cta-mark{width:120px;height:120px;object-fit:contain}
.site-footer{background:var(--teal);color:white;padding:20px 0;font-size:.82rem}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.form-card{background:#fff;border-radius:var(--r);padding:36px;box-shadow:var(--shadow)}
label{display:block;font-family:Montserrat,Arial,sans-serif;font-size:.78rem;font-weight:700;color:var(--teal);margin:0 0 7px}
input,textarea{width:100%;border:1px solid rgba(15,61,64,.22);border-radius:10px;padding:13px;margin-bottom:16px;background:white;font:inherit}
.note-box{background:var(--teal);color:#fff;border-radius:var(--r);padding:28px;margin-top:24px}
.note-box h3{color:#fff}
.hamburger{display:none;background:none;border:0;font-size:1.7rem;color:var(--teal)}
@media(max-width:800px){
 .wrap{width:min(calc(100% - 30px),var(--max))}
 .header-inner{height:76px}
 .logo{width:165px}
 .nav{display:none}
 .hamburger{display:block}
 section,.hero{padding:52px 0}
 .grid2,.cards,.img-grid{grid-template-columns:1fr}
 .hero .grid2{gap:30px}
 h1{font-size:clamp(2.4rem,12vw,4rem)}
 h2{font-size:clamp(1.8rem,9vw,2.7rem)}
 .lead{font-size:1.05rem}
 .image-card img,.img-wide img,.img-grid img{height:auto;min-height:0;max-height:460px}
 .cards{gap:16px}
 .cta-inner{flex-direction:column;align-items:flex-start}
 .cta-mark{width:96px;height:96px}
 .footer-inner{flex-direction:column;align-items:flex-start}
 .button{padding:14px 20px}
}


/* ===== MOBILE HOME V1 / RESPONSIVE SYSTEM ===== */
.mobile-menu{
  display:none;
}
@media(max-width:800px){
  body{overflow-x:hidden}
  .site-header{
    position:sticky;
    top:0;
    z-index:50;
    background:var(--cream);
  }
  .header-inner{
    height:78px;
    padding:0;
  }
  .logo{
    width:168px;
    max-height:56px;
    object-fit:contain;
    object-position:left center;
  }
  .hamburger{
    display:flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    font-size:0;
    cursor:pointer;
    border-radius:12px;
  }
  .hamburger::before{
    content:"☰";
    font-size:2rem;
    line-height:1;
  }
  .mobile-menu{
    display:none;
    position:absolute;
    top:78px;
    left:0;
    right:0;
    background:var(--cream);
    border-top:1px solid rgba(15,61,64,.10);
    border-bottom:1px solid rgba(15,61,64,.12);
    box-shadow:0 12px 24px rgba(15,61,64,.10);
    padding:12px 15px 18px;
  }
  .mobile-menu.open{display:block}
  .mobile-menu a{
    display:block;
    text-decoration:none;
    color:var(--teal);
    font-family:Montserrat,Arial,sans-serif;
    font-weight:700;
    font-size:1rem;
    padding:14px 10px;
    border-bottom:1px solid rgba(15,61,64,.08);
  }
  .mobile-menu a:last-child{
    border-bottom:0;
    margin-top:8px;
    background:var(--teal);
    color:#fff;
    border-radius:999px;
    text-align:center;
  }

  /* Mobile Home */
  .home-page .hero{
    padding:34px 0 42px;
  }
  .home-page .hero .grid2{
    display:flex;
    flex-direction:column;
    gap:26px;
  }
  .home-page .hero .eyebrow{
    font-size:.72rem;
    letter-spacing:.15em;
    margin-bottom:12px;
  }
  .home-page .hero h1{
    font-size:clamp(2.45rem,11vw,3.45rem);
    line-height:1.02;
    letter-spacing:-.035em;
    margin-bottom:18px;
  }
  .home-page .hero .lead{
    font-size:1.02rem;
    line-height:1.58;
    margin-bottom:22px;
  }
  .home-page .hero .button{
    width:100%;
    text-align:center;
    padding:15px 18px;
    font-size:.92rem;
  }
  .home-page .hero .image-card{
    order:2;
    border-radius:20px;
    min-height:0;
    box-shadow:none;
  }
  .home-page .hero .image-card img{
    width:100%;
    height:auto;
    aspect-ratio:4/3;
    object-fit:cover;
    object-position:center center;
    min-height:0;
  }
  .home-page section{
    padding:46px 0;
  }
  .home-page .soft h2,
  .home-page .white h2,
  .home-page section h2{
    font-size:2rem;
    line-height:1.08;
  }
  .home-page .lead{
    font-size:1rem;
  }
  .home-page .cards{
    margin-top:24px;
  }
  .home-page .card{
    padding:24px;
    border-radius:18px;
  }
  .home-page .img-wide img,
  .home-page .img-grid img{
    border-radius:18px;
  }
  .home-page .img-wide img{
    height:auto;
    aspect-ratio:4/3;
    object-fit:cover;
  }
  .home-page .img-grid{
    grid-template-columns:1fr 1fr;
    gap:12px;
  }
  .home-page .img-grid img{
    height:auto;
    aspect-ratio:1/1;
    object-fit:cover;
  }
  .home-page .stats{
    grid-template-columns:1fr 1fr;
    gap:12px;
  }
  .home-page .stat{
    padding:20px 14px;
  }
  .home-page .stat strong{
    font-size:1.65rem;
  }

  .cta-band{
    padding:42px 0;
  }
  .cta-inner{
    gap:22px;
  }
  .cta-inner h2{
    font-size:2rem;
  }
  .cta-inner .button{
    width:100%;
    text-align:center;
  }
  .cta-mark{
    width:88px;
    height:88px;
  }
  .site-footer{
    padding:18px 0;
  }
}


/* ===== v3.2 targeted corrections only ===== */

/* Home hero now uses the clean original source image. */
.home-page .hero .image-card img{
  object-position:center center;
}

/* Our Approach: crop further into the existing generated image
   to remove the stray flattened-mockup content along the left edge. */
.approach-hero-crop{
  transform:scale(1.08);
  transform-origin:center center;
  object-position:58% center !important;
}

/* About founder treatment restored to a compact circular portrait block. */
.founder-block{
  display:flex;
  align-items:center;
  gap:24px;
  padding:26px 0;
}
.founder-portrait{
  width:150px;
  height:150px;
  border-radius:50%;
  object-fit:cover;
  object-position:center center;
  border:2px solid var(--gold);
  padding:4px;
  background:var(--cream);
  flex:0 0 auto;
}
.founder-copy h3{
  margin:0 0 8px;
  font-size:1.5rem;
}
.founder-title{
  font-family:Montserrat,Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:700;
  color:var(--gold);
  font-size:.82rem;
  margin-bottom:12px;
}
.founder-credentials{
  font-family:Montserrat,Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--ink);
  font-size:.76rem;
  line-height:1.55;
}

@media(max-width:800px){
  .home-page .hero .image-card img{
    aspect-ratio:4/3;
    object-fit:cover;
    object-position:center 42%;
  }

  .approach-hero-crop{
    transform:scale(1.12);
    transform-origin:center center;
    object-position:60% center !important;
  }

  .founder-block{
    align-items:center;
    gap:18px;
    padding:20px 0 10px;
  }
  .founder-portrait{
    width:112px;
    height:112px;
  }
  .founder-copy h3{
    font-size:1.28rem;
    margin-bottom:6px;
  }
  .founder-title{
    font-size:.72rem;
    margin-bottom:9px;
  }
  .founder-credentials{
    font-size:.66rem;
  }
}


/* ===== v3.4 controlled visual-polish pass =====
   Locked layout/copy preserved. Adds only:
   approved Home hero art, desktop About photo correction,
   and restrained First Melody brand motifs. */

/* Home hero: preserve approved 4:3 artwork without incidental crop. */
.home-page .hero .image-card{
  aspect-ratio:4/3;
}
.home-page .hero .image-card img{
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
  object-position:center center;
}

/* About desktop photo correction:
   show each full photograph rather than forcing a vertical crop. */
.about-page .img-grid{
  align-items:start;
}
.about-page .img-grid img{
  height:auto;
  aspect-ratio:auto;
  object-fit:contain;
  background:rgba(255,255,255,.72);
}

/* Restrained brand texture system. These sit behind content and do not alter layout. */
.decor-waves,
.decor-dots{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.decor-waves > .wrap,
.decor-dots > .wrap{
  position:relative;
  z-index:1;
}
.decor-waves::after{
  content:"";
  position:absolute;
  width:260px;
  height:120px;
  right:-34px;
  bottom:18px;
  background:url("assets/brand-waves.svg") center/contain no-repeat;
  opacity:.56;
  pointer-events:none;
  z-index:0;
}
.decor-dots::before{
  content:"";
  position:absolute;
  width:190px;
  height:150px;
  left:-30px;
  top:18px;
  background:url("assets/brand-dots-arc.svg") center/contain no-repeat;
  opacity:.46;
  pointer-events:none;
  z-index:0;
}

/* Keep texture especially quiet around forms/cards and smaller screens. */
.demo-page .white.decor-waves::after{
  right:-70px;
  bottom:40px;
  opacity:.34;
}
.about-page .soft.decor-dots::before{
  top:24px;
  opacity:.38;
}
.approach-page .soft.decor-waves::after{
  opacity:.44;
}

@media(max-width:800px){
  .home-page .hero .image-card{
    aspect-ratio:4/3;
  }
  .home-page .hero .image-card img{
    height:100%;
    aspect-ratio:auto;
    object-fit:cover;
    object-position:center center;
  }

  /* The About photos were already working on mobile. Preserve natural full-image display. */
  .about-page .img-grid img{
    width:100%;
    height:auto;
    max-height:none;
    object-fit:contain;
  }

  .decor-waves::after{
    width:180px;
    height:84px;
    right:-58px;
    bottom:10px;
    opacity:.34;
  }
  .decor-dots::before{
    width:132px;
    height:104px;
    left:-45px;
    top:10px;
    opacity:.28;
  }
}


/* ===== v3.5 brand texture refinement =====
   Slightly richer than v3.4, still restrained and editorial.
   No layout, copy, navigation, CTA, typography, or content changes. */

/* Slightly stronger existing motifs */
.decor-waves::after{
  width:300px;
  height:138px;
  right:-28px;
  bottom:14px;
  opacity:.66;
}
.decor-dots::before{
  width:220px;
  height:174px;
  left:-24px;
  top:12px;
  opacity:.56;
}

/* Add a second, very soft organic accent to selected sections */
.decor-waves::before{
  content:"";
  position:absolute;
  width:220px;
  height:150px;
  left:-95px;
  top:-35px;
  border-radius:48% 52% 58% 42% / 58% 42% 58% 42%;
  background:
    radial-gradient(circle at 35% 35%, rgba(214,209,230,.52), rgba(214,209,230,.22) 58%, rgba(214,209,230,0) 72%);
  transform:rotate(-12deg);
  pointer-events:none;
  z-index:0;
}
.decor-dots::after{
  content:"";
  position:absolute;
  width:190px;
  height:120px;
  right:-48px;
  bottom:-24px;
  border-radius:50%;
  background:
    radial-gradient(circle at 45% 45%, rgba(168,183,154,.42), rgba(168,183,154,.18) 60%, rgba(168,183,154,0) 73%);
  transform:rotate(9deg);
  pointer-events:none;
  z-index:0;
}

/* A few subtle painted corner washes, inspired by the approved brand board */
.home-page .hero{
  background:
    radial-gradient(circle at 95% 6%, rgba(214,209,230,.20), transparent 18%),
    radial-gradient(circle at 3% 92%, rgba(212,162,74,.12), transparent 18%);
}
.approach-page .hero{
  background:
    radial-gradient(circle at 5% 8%, rgba(168,183,154,.16), transparent 18%),
    radial-gradient(circle at 96% 88%, rgba(214,209,230,.18), transparent 16%);
}
.about-page .hero{
  background:
    radial-gradient(circle at 96% 8%, rgba(168,183,154,.16), transparent 18%),
    radial-gradient(circle at 5% 92%, rgba(212,162,74,.10), transparent 16%);
}
.demo-page .hero{
  background:
    radial-gradient(circle at 5% 8%, rgba(214,209,230,.16), transparent 17%),
    radial-gradient(circle at 96% 88%, rgba(168,183,154,.13), transparent 18%);
}

/* Keep forms and dense content highly readable */
.demo-page .white.decor-waves::after{
  right:-54px;
  bottom:34px;
  opacity:.44;
}
.about-page .soft.decor-dots::before{
  opacity:.46;
}
.approach-page .soft.decor-waves::after{
  opacity:.54;
}

@media(max-width:800px){
  .decor-waves::after{
    width:205px;
    height:94px;
    right:-52px;
    opacity:.42;
  }
  .decor-dots::before{
    width:150px;
    height:118px;
    left:-42px;
    opacity:.36;
  }
  .decor-waves::before{
    width:150px;
    height:105px;
    left:-72px;
    top:-24px;
    opacity:.72;
  }
  .decor-dots::after{
    width:130px;
    height:88px;
    right:-56px;
    bottom:-18px;
    opacity:.72;
  }
}


/* ===== v3.6 visibly branded texture pass =====
   Corrects v3.5, whose accents were too subtle to read on the live site.
   These are explicit decorative layers, still behind content and non-interactive. */

.decor-visible{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.decor-visible > .wrap{
  position:relative;
  z-index:3;
}

.brand-orb,
.brand-sprinkles,
.brand-arc{
  position:absolute;
  display:block;
  pointer-events:none;
  z-index:1;
}

/* Soft watercolor-like organic washes */
.brand-orb{
  width:260px;
  height:190px;
  left:-105px;
  top:-65px;
  border-radius:48% 52% 62% 38% / 58% 42% 58% 42%;
  filter:blur(.2px);
  transform:rotate(-12deg);
}
.orb-lavender{
  background:
    radial-gradient(ellipse at 48% 48%,
      rgba(214,209,230,.58) 0%,
      rgba(214,209,230,.40) 44%,
      rgba(214,209,230,.17) 67%,
      rgba(214,209,230,0) 78%);
}
.orb-sage{
  background:
    radial-gradient(ellipse at 48% 48%,
      rgba(168,183,154,.52) 0%,
      rgba(168,183,154,.34) 45%,
      rgba(168,183,154,.14) 67%,
      rgba(168,183,154,0) 79%);
}
.orb-bottom{
  left:auto;
  top:auto;
  right:-105px;
  bottom:-78px;
  transform:rotate(17deg);
}

/* Small hand-painted dot clusters */
.brand-sprinkles{
  width:108px;
  height:102px;
  left:28px;
  bottom:22px;
  opacity:.75;
  background-image:
    radial-gradient(circle, rgba(212,162,74,.78) 0 4px, transparent 5px),
    radial-gradient(circle, rgba(212,162,74,.58) 0 3px, transparent 4px),
    radial-gradient(circle, rgba(212,162,74,.70) 0 3.5px, transparent 4.5px);
  background-size:28px 28px, 34px 34px, 39px 39px;
  background-position:0 0, 14px 8px, 8px 19px;
}
.sprinkles-lavender{
  background-image:
    radial-gradient(circle, rgba(214,209,230,.85) 0 4px, transparent 5px),
    radial-gradient(circle, rgba(214,209,230,.62) 0 3px, transparent 4px),
    radial-gradient(circle, rgba(214,209,230,.72) 0 3.5px, transparent 4.5px);
}
.sprinkles-right{
  left:auto;
  right:32px;
  bottom:28px;
}

/* Simple three-line rhythm arc from the brand-board language */
.brand-arc{
  width:150px;
  height:110px;
  right:34px;
  top:34px;
  border-top:3px solid rgba(168,183,154,.60);
  border-radius:50%;
  transform:rotate(20deg);
  opacity:.82;
}
.brand-arc::before,
.brand-arc::after{
  content:"";
  position:absolute;
  border-top:3px solid rgba(212,162,74,.55);
  border-radius:50%;
}
.brand-arc::before{
  width:126px;
  height:88px;
  left:12px;
  top:14px;
}
.brand-arc::after{
  width:102px;
  height:67px;
  left:24px;
  top:28px;
  border-top-color:rgba(214,209,230,.72);
}
.brand-arc-right{
  right:-12px;
  top:52px;
}

/* Make the earlier SVG motifs clearly visible too, but still background-level. */
.decor-visible.decor-waves::after{
  opacity:.72 !important;
}
.decor-visible.decor-dots::before{
  opacity:.64 !important;
}

/* Do not let decorative layers compete with cards/forms */
.card,
.note-box,
.form-card,
.image-card,
.stat,
.footer,
.cta-band{
  position:relative;
  z-index:2;
}

@media(max-width:800px){
  .brand-orb{
    width:180px;
    height:132px;
    left:-88px;
    top:-44px;
    opacity:.82;
  }
  .orb-bottom{
    left:auto;
    top:auto;
    right:-88px;
    bottom:-54px;
  }
  .brand-sprinkles{
    width:82px;
    height:78px;
    left:16px;
    bottom:12px;
    opacity:.60;
    transform:scale(.86);
  }
  .sprinkles-right{
    left:auto;
    right:14px;
  }
  .brand-arc{
    width:112px;
    height:82px;
    right:10px;
    top:24px;
    opacity:.64;
  }
  .brand-arc::before{
    width:94px;
    height:66px;
    left:9px;
    top:11px;
  }
  .brand-arc::after{
    width:76px;
    height:50px;
    left:18px;
    top:21px;
  }
}

/* v3.7 controlled image-balance revision */
.about-page .img-grid{width:min(720px,62%);margin:30px auto 0;gap:22px;align-items:stretch}
.about-page .img-grid img{width:100%;aspect-ratio:4/3;height:auto;object-fit:contain;object-position:center;padding:6px;box-sizing:border-box;background:#F7F3EC;border:1.5px solid rgba(168,183,154,.78);border-radius:18px;box-shadow:0 5px 16px rgba(15,61,64,.07)}
.about-page .founder-photo{width:clamp(132px,11vw,168px);height:clamp(132px,11vw,168px);flex:0 0 auto}
@media(max-width:800px){
 .about-page .img-grid{width:min(88%,520px);margin:24px auto 0;gap:18px}
 .about-page .img-grid img{aspect-ratio:4/3;object-fit:contain;padding:5px;border-radius:16px}
 .about-page .founder-photo{width:132px;height:132px}
}


/* ===== v3.7 FINAL REVIEW: approved founder portrait sizing ===== */
.founder-block{
  gap:20px !important;
}
.founder-portrait{
  width:265px !important;
  height:265px !important;
  min-width:265px !important;
  min-height:265px !important;
  max-width:265px !important;
  max-height:265px !important;
  flex:0 0 265px !important;
}
@media(max-width:800px){
  .founder-block{
    gap:14px !important;
    align-items:center !important;
  }
  .founder-portrait{
    width:190px !important;
    height:190px !important;
    min-width:190px !important;
    min-height:190px !important;
    max-width:190px !important;
    max-height:190px !important;
    flex:0 0 190px !important;
  }
}


/* v3.8 final-draft additions */
.benefit-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 28px;margin-top:24px}
.benefit-list p{margin:0}
.footer-contact-links{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;margin:10px auto 0;font-size:.9rem}
.footer-contact-links a{color:inherit;text-decoration:none}
@media(max-width:800px){
 .benefit-list{grid-template-columns:1fr}
 /* Mobile-only: move mission gold texture clear of copy */
 .mission .dot-cluster,.mission .dots,.mission-section .dot-cluster,.mission-section .dots{transform:translate(-18px,54px)!important}
}

/* v3.8.1 targeted corrections only */
@media(max-width:800px){
  .about-page .soft.decor-dots > .brand-sprinkles.sprinkles-gold{
    display:none !important;
  }
}

/* v3.8.2 targeted About-page typography correction only.
   Match the new school-experience copy to the established About body rhythm. */
.school-experience p{
  font-size:1.05rem;
  line-height:1.75;
  margin:0 0 1.55rem;
}
.school-experience p:last-child{
  margin-bottom:0;
}
.school-experience p strong{
  display:inline-block;
  margin-bottom:.35rem;
}
@media(max-width:800px){
  .school-experience p{
    font-size:1.05rem;
    line-height:1.75;
    margin-bottom:1.55rem;
  }
}

/* v3.8.3: exact About-page body typography match for school experience section */
.about-page .school-experience p{
  font-size:1.25rem !important;
  line-height:1.8 !important;
  font-weight:400 !important;
  letter-spacing:normal !important;
  margin-top:0 !important;
  margin-bottom:1.55rem !important;
}
.about-page .school-experience p:last-child{
  margin-bottom:0 !important;
}
.about-page .school-experience p strong{
  font-size:inherit !important;
  line-height:inherit !important;
  font-weight:700 !important;
  letter-spacing:normal !important;
  display:inline-block;
  margin-bottom:.35rem;
}
@media(max-width:800px){
  .about-page .school-experience p{
    font-size:1.25rem !important;
    line-height:1.8 !important;
  }
}

/* v3.8.4: targeted mobile margin fix for Classroom Experience only */
@media(max-width:800px){
  .about-page .school-experience .container{
    width:auto !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:28px !important;
    padding-right:28px !important;
    box-sizing:border-box !important;
  }
}

/* Launch QA targeted alignment corrections, 2026-09-18.
   Desktop only: restore the standard site content container for the two
   sections that use .container rather than .wrap. */
@media(min-width:801px){
  .about-page .school-experience .container,
  .demo-page .school-easy .container{
    width:min(calc(100% - 44px),var(--max)) !important;
    max-width:var(--max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }
}

/* Mobile About only: align Classroom Experience with the site's standard
   15px mobile content inset. No other mobile section is changed. */
@media(max-width:800px){
  .about-page .school-experience .container{
    width:min(calc(100% - 30px),var(--max)) !important;
    max-width:var(--max) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }
}
