:root{
    --navy:var(--wp--preset--color--navy,#143167);
    --navy-deep:var(--wp--preset--color--navy-deep,#0d2148);
    --pink:var(--wp--preset--color--pink,#e7458b);
    --orange:var(--wp--preset--color--orange,#ffc23c);
    /* the mockup names the same swatch --yellow; keep both aliases so rules
       copied across from it resolve. */
    --yellow:var(--wp--preset--color--orange,#ffc23c);
    --yellow-deep:#eda911;
    --cream:var(--wp--preset--color--cream,#faf6ee);
    --cream-deep:var(--wp--preset--color--cream-deep,#f2ead9);
    --paper:var(--wp--preset--color--paper,#fffdf9);
    --ink:var(--wp--preset--color--ink,#2b2a28);
    --ink-soft:var(--wp--preset--color--ink-soft,#5b5750);
    --line:var(--wp--preset--color--line,#e7ddc9);
    --good:#3f8f5f;
    --butter:var(--wp--preset--color--butter,#f9eec3);
    --mw-display:var(--wp--preset--font-family--display,"Comfortaa","Open Sans",Helvetica,sans-serif);
    --mw-body:var(--wp--preset--font-family--body,"Open Sans",Helvetica,Arial,sans-serif);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  section[id], div[id]{scroll-margin-top:104px;}
  body{
    margin:0;background:var(--cream);color:var(--ink);
    font-family:var(--mw-body);font-size:16px;line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4{font-family:var(--mw-display);font-weight:700;color:var(--navy);text-wrap:balance;margin:0;letter-spacing:-.018em;}
  p{margin:0;}
  a{color:inherit;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1180px;margin:0 auto;padding-inline:24px;}
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:12.5px;
    letter-spacing:.11em;text-transform:uppercase;color:var(--pink);
  }
  .eyebrow::before{content:"";width:18px;height:2px;background:var(--pink);border-radius:2px;}
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:15.5px;
    padding:14px 26px;border-radius:999px;border:2px solid transparent;cursor:pointer;
    text-decoration:none;line-height:1;white-space:nowrap;
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  }
  .btn:active{transform:translateY(1px);}
  /* WordPress's Button block puts the .btn classes on the wrapping <div> and
     gives the inner <a> its own wp-block-button__link class; keep that link
     visually identical to the old plain <a class="btn"> markup. */
  .wp-block-button__link{color:inherit;text-decoration:none;}
  .btn-primary{background:var(--pink);color:#fff;box-shadow:0 8px 20px -8px rgba(231,69,139,.62);}
  .btn-primary:hover{background:#cf3679;}
  .btn-ghost{background:transparent;color:#fdf9f2;border-color:rgba(255,255,255,.45);}
  .btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1);}
  .btn-block{width:100%;}
  :focus-visible{outline:3px solid var(--pink);outline-offset:2px;}

  /* header */
  .ribbon{background:#1c1c1c;color:#f4f1ea;font-size:12.5px;text-align:center;padding:8px 16px;}
  .ribbon strong{color:var(--orange);}
  .strip{background:var(--navy-deep);color:#c9d5ef;font-size:12.5px;letter-spacing:.04em;}

  .strip-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:10px;flex-wrap:wrap;}
  .strip-trust{margin:0;color:#fff;font-weight:700;font-size:13.5px;letter-spacing:.05em;}
  .strip-actions{display:flex;align-items:center;gap:22px;}
  .strip-trust .strip-short{display:none;}
  /* The menu follows you down the page.

     WordPress wraps the header in a template part of its own, and a sticky
     bar can only stick for as long as the box around it is on screen. That
     box is only as tall as the header, so the menu used to let go after a
     hundred pixels or so and scroll away with everything else. Sticking the
     wrapper itself is what keeps it there all the way down. */
  header.wp-block-template-part{position:sticky;top:0;z-index:50;}
  header.site{position:relative;z-index:1;background:var(--navy);box-shadow:0 8px 20px -14px rgba(0,0,0,.7);}

  /* Once the page has moved, the thin bar folds away and the logo draws in,
     so the menu takes a third of the room it does at the top. */
  .strip{overflow:hidden;max-height:200px;transition:max-height .25s ease;}
  .mw-scrolled .strip{max-height:0;}
  .mw-scrolled .site-inner{padding-block:8px;}
  .mw-scrolled .logo-img{height:50px;}
  .site-inner,
  .logo-img{transition:padding .25s ease, height .25s ease;}

  @media (prefers-reduced-motion:reduce){
    .strip,
    .site-inner,
    .logo-img{transition:none;}
  }
  .site-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-block:12px;}
  /* The logo keeps its shape. In a row with the phone button, the Book a
     Tour button and the menu button, flexbox will happily squeeze a picture
     narrower without making it shorter, which is what was flattening the
     elephant on a phone. Refusing to shrink, and containing rather than
     stretching, means it is either full size or smaller, never squashed. */
  .logo{display:flex;align-items:center;text-decoration:none;flex:0 0 auto;min-width:0;}
  .logo-img{
    display:block;height:66px;width:auto;max-width:100%;
    object-fit:contain;object-position:left center;
  }
  .header-actions{flex:0 0 auto;}
  nav.primary{display:flex;align-items:center;gap:24px;}
  nav.primary a{color:#eef1fa;text-decoration:none;font-weight:600;font-size:15px;white-space:nowrap;}
  nav.primary a:hover{text-decoration:underline;text-underline-offset:4px;}
  /* The section you are reading. */
  nav.primary a.is-here{
    text-decoration:underline;text-underline-offset:7px;
    text-decoration-thickness:2px;text-decoration-color:var(--pink);
  }
  .mobile-nav a.is-here{color:#fff;font-weight:700;}
  .header-actions{display:flex;align-items:center;gap:16px;}
  .socials{display:flex;align-items:center;gap:8px;}
  .socials a{
    width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,.12);color:#fff;transition:background .15s ease;
  }
  .socials a:hover{background:var(--pink);}
  .socials svg{width:13px;height:13px;fill:currentColor;}
  .header-phone{color:#dbe2f3;font-weight:700;font-size:13.5px;text-decoration:none;display:flex;align-items:center;gap:7px;}
  .header-phone svg{width:13px;height:13px;fill:#dbe2f3;}
  .header-phone:hover{color:var(--butter);}
  .header-phone:hover svg{fill:var(--butter);}


  .nav-toggle{
    display:none;width:44px;height:44px;border:0;border-radius:12px;background:rgba(255,255,255,.12);
    cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;
  }
  .nav-toggle span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:transform .2s ease,opacity .2s ease;}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .mobile-nav{background:var(--navy);border-top:1px solid rgba(255,255,255,.14);padding-block:8px 84px;max-height:calc(100vh - 90px);overflow-y:auto;}
  .mobile-nav .wrap{display:flex;flex-direction:column;gap:2px;}
  .mobile-nav a{
    color:#eef1fa;text-decoration:none;font-weight:600;font-size:17px;padding:14px 4px;
    border-bottom:1px solid rgba(255,255,255,.09);
  }
  .mobile-nav a:last-of-type{border-bottom:0;}
  .mobile-nav .call-row{color:#fff;font-weight:700;border-bottom:0;}
  .mobile-nav .btn{margin-top:10px;font-size:16px;padding:16px 26px;}
  .mobile-nav .socials-row{display:flex;gap:18px;margin-top:16px;}
  .mobile-nav .socials-row a{font-size:13.5px;color:#b9c6e4;border-bottom:0;padding:0;}

  /* hero */
  .hero{padding-block:60px 52px;}
  .hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
  .hero h1{font-size:clamp(40px,5.4vw,66px);line-height:1.0;}
  .hero h1 .accent{color:var(--pink);}
  .hero .lede{margin-top:18px;font-size:18.5px;color:var(--ink-soft);max-width:46ch;}
  .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:30px;max-width:520px;}
  /* labelled pillars (no emoji): sits on the dark navy strip, so light text. */
  .pillar{display:block;font-size:13.5px;line-height:1.55;font-weight:600;color:#c4d2ee;border-top:3px solid var(--pink);padding-top:14px;}
  .pillar b{
    display:block;font-family:var(--mw-display);font-weight:700;
    font-size:17px;color:#ffffff;margin-bottom:7px;letter-spacing:-.01em;
  }
  .pillar .ico{flex:none;width:30px;height:30px;border-radius:50%;background:var(--cream-deep);display:flex;align-items:center;justify-content:center;font-size:15px;}
  .hero-ctas{display:flex;gap:16px;margin-top:32px;flex-wrap:wrap;align-items:center;}
  .hero-phone{font-weight:700;color:var(--navy);font-size:16px;text-decoration:none;}
  .hero-phone:hover{color:var(--pink);}
  .hero-phone small{display:block;font-weight:600;color:var(--ink-soft);font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;}
  .hero-art{position:relative;max-width:410px;margin-left:auto;}
  .blob-photo{
    position:relative;border-radius:44% 56% 62% 38% / 46% 40% 60% 54%;aspect-ratio:4/4.5;overflow:hidden;
    box-shadow:0 30px 60px -24px rgba(20,49,103,.35);background:var(--cream-deep);
  }
  .blob-photo img{width:100%;height:100%;object-fit:cover;}
  .badge-float{
    position:absolute;top:-16px;right:6px;background:var(--paper);border:1px solid var(--line);
    border-radius:16px;padding:10px 16px;box-shadow:0 14px 30px -16px rgba(20,49,103,.4);
    display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;color:var(--navy);
  }
  .badge-float .stars{color:var(--orange);letter-spacing:1px;font-size:12px;}


  /* 2026 selling layer */
  .avail-chip{
    display:inline-flex;align-items:center;gap:10px;background:#e9f5ee;color:#2f7d52;
    border:1px solid #bfe3cd;padding:8px 16px;border-radius:999px;font-size:13.5px;font-weight:700;
    margin-bottom:22px;
  }
  .avail-chip .pulse{width:9px;height:9px;border-radius:50%;background:#3f9f68;box-shadow:0 0 0 4px rgba(63,159,104,.18);}
  .btn-lg{font-size:17px;padding:18px 34px;}
  .btn-quiet{background:transparent;color:var(--navy);border-color:var(--line);}
  .btn-quiet:hover{border-color:var(--navy);}
  .hero-reassure{margin-top:14px;font-size:13.5px;color:var(--ink-soft);}
  .hero-ctas{margin-top:30px;}
  .hero-stats{display:flex;gap:34px;flex-wrap:wrap;margin-top:28px;padding-top:22px;border-top:1px solid rgba(255,255,255,.22);}
  .hstat{display:flex;flex-direction:column;}
  .hstat b{
    font-family:var(--mw-display);font-weight:700;color:#fff;
    font-size:clamp(22px,2.4vw,28px);line-height:1;
  }
  .hstat span{color:#c3cee8;font-size:12.5px;font-weight:600;margin-top:6px;max-width:17ch;line-height:1.3;}
  .hstat-ofsted{flex-direction:row;align-items:center;gap:12px;}
  .ofsted-plate{line-height:0;flex:none;}
  .ofsted-plate img{height:44px;width:auto;display:block;border-radius:6px;}
  .hstat-ofsted .hstat-text{display:flex;flex-direction:column;}

  /* Government funding: the same plate shape as the Ofsted badge, on a line
     of its own under the two credentials, so the wording underneath reads as
     one sentence instead of a narrow column. */
  .hstat-fund{
    flex:1 1 186px;flex-direction:row;align-items:center;gap:10px;
    /* This one sits furthest right, where the photograph is brightest, so
       its wording is lifted and given a soft shadow to keep it readable. */
    text-shadow:0 1px 3px rgba(11,28,62,.7);
  }
  /* Three things in the row rather than two, so they are drawn in a little
     to keep them on one level. */
  .hero-stats:has(.hstat-fund){gap:22px;}
  .fund-plate{
    flex:none;width:46px;height:46px;border-radius:9px;
    background:linear-gradient(180deg,#ffd166,#ffbc23);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 10px 22px -12px rgba(0,0,0,.8);
  }
  .fund-plate svg{display:block;}
  .fund-plate .fund-word{
    font-family:var(--mw-display);font-weight:700;font-size:16px;line-height:1;
    color:var(--navy);max-width:none;margin:0;
  }
  .hstat-fund .hstat-text{display:flex;flex-direction:column;max-width:none;}
  .hstat-fund .hstat-text b{font-size:clamp(15px,1.5vw,17px);line-height:1.22;}
  .hstat-fund .hstat-text > span{max-width:21ch;margin-top:6px;color:#dfe7f7;}

  .availability{background:var(--paper);padding-block:60px;border-bottom:1px solid var(--line);}
  .avail-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:30px;}
  .avail-head h2{font-size:clamp(24px,2.8vw,32px);margin-top:10px;}
  .avail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
  .av{background:var(--cream);border:1px solid var(--line);border-radius:18px;padding:24px;}
  .av h3{font-size:18px;margin-top:12px;}
  .av-age{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);margin-top:4px;}
  .av-state{margin-top:12px;font-size:15px;color:var(--ink-soft);}
  .dot-live{
    display:inline-block;width:11px;height:11px;border-radius:50%;background:#3f9f68;
    box-shadow:0 0 0 5px rgba(63,159,104,.16);
  }
  .avail-note{margin-top:22px;font-size:14px;color:var(--ink-soft);}
  @media (max-width:900px){ .avail-grid{grid-template-columns:1fr;} }

  /* trust */
  .trust{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .trust .wrap{display:flex;align-items:center;justify-content:center;gap:40px;padding-block:20px;flex-wrap:wrap;text-align:center;}
  .trust-item{font-size:14px;color:var(--ink-soft);}
  .trust-item strong{color:var(--navy);font-size:15.5px;}
  .ofsted-chip{
    display:inline-flex;align-items:center;gap:8px;background:#e9f5ee;color:var(--good);
    border:1px solid #bfe3cd;padding:7px 14px;border-radius:999px;font-weight:700;font-size:13.5px;
  }

  /* statement */
  .statement{background:var(--navy);color:#fdf9f2;padding-block:44px;position:relative;overflow:hidden;}
  .statement::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(60% 120% at 85% 0%,rgba(231,69,139,.25),transparent 60%),
               radial-gradient(50% 100% at 5% 100%,rgba(255,123,64,.18),transparent 60%);
  }
  .statement .wrap{position:relative;max-width:820px;text-align:center;}
  .statement .eyebrow{color:#ffb9d6;}
  .statement h2{color:#fff;font-size:clamp(30px,4.4vw,48px);line-height:1.14;margin-top:14px;}
  .statement h2 span{color:var(--orange);}

  /* narrative */
  .narrative{padding-block:50px;}
  .narrative .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
  .narrative.reverse .wrap{direction:rtl;}
  .narrative.reverse .wrap > *{direction:ltr;}
  .narrative h2{font-size:clamp(26px,3vw,34px);margin-top:12px;}
  .narrative .body{margin-top:18px;color:var(--ink-soft);font-size:16.5px;max-width:52ch;}
  .narrative .body p + p{margin-top:14px;}
  .pull{margin-top:20px;font-family:var(--mw-display);font-weight:700;color:var(--pink);font-size:17px;}
  .photo-frame{
    position:relative;border-radius:28px;aspect-ratio:5/4;overflow:hidden;
    box-shadow:0 24px 50px -26px rgba(20,49,103,.4);background:var(--cream-deep);
  }
  .photo-frame img{width:100%;height:100%;object-fit:cover;}


  .play-link{
    display:inline-flex;align-items:center;gap:12px;margin-top:22px;text-decoration:none;
    font-weight:700;color:var(--navy);font-size:15.5px;
  }
  .play-link .pl-icon{
    width:42px;height:42px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;
    transition:background .15s ease;
  }
  .play-link .pl-icon svg{width:15px;height:15px;fill:#fff;margin-left:2px;}
  .play-link:hover .pl-icon{background:var(--pink);}
  .play-link:hover{color:var(--pink);}

  /* video */
  .video-band{background:var(--cream-deep);padding-block:48px;}
  .video-band .wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:52px;align-items:center;}
  .video-card{
    position:relative;display:block;border-radius:22px;overflow:hidden;aspect-ratio:16/9;
    box-shadow:0 26px 54px -28px rgba(0,0,0,.6);color:#fff;text-decoration:none;background:#0d2148;
  }
  .video-card img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
  .video-card:hover img{transform:scale(1.03);}
  .video-card .scrim{
    position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
    background:linear-gradient(180deg,rgba(13,33,72,.1) 0%,rgba(13,33,72,.55) 70%,rgba(13,33,72,.8) 100%);
    text-align:center;padding:24px;
  }
  .play{
    width:64px;height:64px;border-radius:50%;background:#ff0033;display:flex;align-items:center;justify-content:center;
    box-shadow:0 8px 22px -8px rgba(0,0,0,.7);
  }
  .play svg{width:24px;height:24px;fill:#fff;margin-left:3px;}
  .video-card .cap{font-size:13.5px;font-weight:600;opacity:.92;max-width:34ch;}


  .video-card{cursor:pointer;}
  .video-card iframe{width:100%;height:100%;border:0;display:block;}
  .yt-blocked{
    position:absolute;inset:auto 14px 14px 14px;background:rgba(13,33,72,.92);color:#fff;
    padding:12px 16px;border-radius:14px;font-size:13px;line-height:1.5;
  }
  .yt-blocked a{color:var(--butter);font-weight:700;}


  .film{margin:0;}
  .film .video-card{aspect-ratio:16/9;border-radius:20px;}
  .film.community .video-card{aspect-ratio:16/8;}
  .film figcaption{margin-top:14px;}
  .film figcaption strong{display:block;font-family:var(--mw-display);font-size:17px;color:var(--navy);}
  .film figcaption span{display:block;margin-top:5px;font-size:14.5px;color:var(--ink-soft);}
  .video-card .scrim{background:linear-gradient(180deg,rgba(13,33,72,.12),rgba(13,33,72,.42));justify-content:center;}
  .video-card.no-thumb{
    background:linear-gradient(150deg,#16336b 0%,#1e4488 55%,#122a58 100%);
  }
  .video-card.no-thumb .scrim{background:none;}


  .fallback-name{display:none;}
  .video-card.no-thumb .fallback-name{
    display:block;margin-top:16px;color:#fff;font-family:var(--mw-display);font-weight:700;
    font-size:16px;text-align:center;max-width:30ch;padding-inline:20px;
  }
  .video-card.no-thumb .scrim::after{
    content:"Film still loads from YouTube on the live site";
    position:absolute;bottom:14px;left:0;right:0;text-align:center;
    color:#9fb3d8;font-family:var(--mw-body);font-size:11.5px;
  }


  .film{margin:0;}
  .film .video-card{aspect-ratio:16/9;border-radius:20px;position:relative;}
  .film.community .video-card{aspect-ratio:16/8;}
  .film figcaption{margin-top:14px;}
  .film figcaption strong{display:block;font-family:var(--mw-display);font-size:17px;color:var(--navy);}
  .film figcaption span{display:block;margin-top:5px;font-size:14.5px;color:var(--ink-soft);}
  .video-card{cursor:pointer;transition:transform .2s ease, box-shadow .2s ease;}
  .video-card:hover{transform:translateY(-3px);box-shadow:0 26px 46px -26px rgba(0,0,0,.6);}
  .video-card .scrim{
    background:linear-gradient(180deg,rgba(13,33,72,.10),rgba(13,33,72,.46));
    justify-content:center;gap:16px;
  }
  .play{
    width:84px;height:84px;background:#ff0033;box-shadow:0 10px 26px -8px rgba(0,0,0,.65), 0 0 0 0 rgba(255,0,51,.45);
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .play svg{width:32px;height:32px;margin-left:5px;}
  .video-card:hover .play{transform:scale(1.08);box-shadow:0 12px 30px -8px rgba(0,0,0,.7), 0 0 0 14px rgba(255,0,51,.16);}
  .watch-chip{
    background:#fff;color:var(--navy);font-family:var(--mw-body);font-weight:700;font-size:13px;
    padding:9px 18px;border-radius:999px;letter-spacing:.02em;box-shadow:0 8px 20px -10px rgba(0,0,0,.6);
  }
  .film-row{display:grid;grid-template-columns:1.25fr .75fr;gap:38px;align-items:center;margin-top:40px;}
  .film-note h3{font-family:var(--mw-display);color:var(--navy);}
  @media (max-width:900px){ .film-row{grid-template-columns:1fr;} }


  .video-embed{position:relative;aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:#0f2550;box-shadow:0 24px 48px -28px rgba(0,0,0,.6);}
  .film.community .video-embed{aspect-ratio:16/8;}
  .video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
  .embed-fallback{
    position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;
    padding:26px;text-align:center;color:#dfe6f5;font-size:13.5px;line-height:1.6;z-index:0;
  }
  .embed-fallback a{color:var(--butter);font-weight:700;}

  /* journey */
  .journey{padding-block:52px;}
  .section-head{max-width:640px;margin-bottom:42px;}
  .section-head h2{font-size:clamp(32px,4.2vw,52px);line-height:1.04;margin-top:12px;}
  .section-head .body{margin-top:14px;color:var(--ink-soft);font-size:16.5px;}
  .stages{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .stage{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:26px 24px 28px;display:flex;flex-direction:column;gap:12px;}
  .stage .num{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mw-display);font-weight:700;color:#fff;font-size:15px;}
  .stage:nth-child(1) .num{background:#5aa66f;}
  .stage:nth-child(2) .num{background:var(--pink);}
  .stage:nth-child(3) .num{background:var(--pink);}
  .stage h3{font-size:19px;}
  .stage .age{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);}
  .stage p{color:var(--ink-soft);font-size:15px;}
  .yearround{margin-top:34px;display:flex;align-items:center;justify-content:center;gap:12px;font-family:var(--mw-display);font-weight:700;color:var(--navy);font-size:17px;flex-wrap:wrap;text-align:center;}
  .yearround .dot{width:6px;height:6px;border-radius:50%;background:var(--pink);}

  /* fees + calculator */
  .fees{background:var(--navy);color:#e9eefb;padding-block:52px;position:relative;overflow:hidden;}
  .fees::before{content:"";position:absolute;inset:0;background:radial-gradient(55% 110% at 90% 10%,rgba(231,69,139,.2),transparent 60%);}
  .fees .wrap{position:relative;}
  .fees .section-head h2{color:#fff;}
  .fees .section-head .body{color:#c3cee8;}
  .fees .eyebrow{color:#ffb9d6;}
  .calc{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:start;}
  .calc-panel{background:var(--paper);border-radius:22px;padding:26px;color:var(--ink);}
  .calc-panel h3{font-size:18px;}
  .calc-panel .hint{font-size:13px;color:var(--ink-soft);margin-top:4px;}
  .day-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:12px;border-bottom:1px solid var(--line);}
  .day-row:last-of-type{border-bottom:0;}
  .day-name{font-weight:700;color:var(--navy);font-size:15px;min-width:96px;}
  .seg{display:flex;background:var(--cream-deep);border-radius:999px;padding:3px;gap:3px;}
  .seg button{
    border:0;background:transparent;font-family:inherit;font-size:13px;font-weight:700;color:var(--ink-soft);
    padding:8px 13px;border-radius:999px;cursor:pointer;white-space:nowrap;transition:background .15s ease,color .15s ease;
  }
  .seg button[aria-pressed="true"]{background:var(--navy);color:#fff;}
  .funding{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .funding label{font-size:14px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:8px;}
  .funding select{
    font-family:inherit;font-size:14px;padding:8px 10px;border-radius:10px;border:1.5px solid var(--line);background:#fff;color:var(--ink);
  }
  .rates{margin-top:16px;font-size:12.5px;color:var(--ink-soft);line-height:1.6;}
  .result{
    background:var(--paper);border-radius:22px;padding:26px;color:var(--ink);
    box-shadow:0 26px 60px -30px rgba(0,0,0,.7);position:sticky;top:96px;
  }
  .result h3{font-size:17px;}
  .rline{display:flex;justify-content:space-between;gap:12px;padding-block:9px;border-bottom:1px dashed var(--line);font-size:14.5px;}
  .rline span:last-child{font-weight:700;color:var(--navy);font-variant-numeric:tabular-nums;}
  .rline.discount span:last-child{color:var(--good);}
  .rtotal{margin-top:14px;background:var(--cream-deep);border-radius:14px;padding:16px 18px;}
  .rtotal .lbl{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);}
  .rtotal .amt{font-family:var(--mw-display);font-weight:700;font-size:32px;color:var(--navy);font-variant-numeric:tabular-nums;line-height:1.2;}
  .rtotal .was{font-size:13px;color:var(--ink-soft);text-decoration:line-through;}
  .result .fine{font-size:11.5px;color:var(--ink-soft);margin-top:12px;line-height:1.55;}
  .result .btn{margin-top:16px;}


  .fee-terms{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:40px;padding-top:30px;border-top:1px solid rgba(255,255,255,.16);}
  .ft h4{font-family:var(--mw-display);color:#fff;font-size:15.5px;}
  .ft p{margin-top:8px;font-size:13.5px;color:#bcc8e4;line-height:1.6;}
  @media (max-width:900px){ .fee-terms{grid-template-columns:1fr 1fr;} }
  @media (max-width:560px){ .fee-terms{grid-template-columns:1fr;} }

  /* The fee documents, quietly at the foot of the page. On navy, so these
     are their own colours rather than the cream box's. */
  .fee-docs{margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,255,255,.16);}
  .fee-docs-name{
    margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.08em;
    text-transform:uppercase;color:#98a7cc;
  }
  /* Two across, so they pick up the rhythm of the notes above rather than
     sitting in a narrow column with the page empty beside them. */
  .fee-docs ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 44px;}
  @media (max-width:700px){ .fee-docs ul{grid-template-columns:1fr;gap:0;} }
  .fee-docs .dl{
    display:grid;grid-template-columns:1fr auto;
    grid-template-areas:"name badge" "when badge";
    align-items:center;column-gap:12px;row-gap:1px;
    padding:13px 0;border-bottom:1px solid rgba(255,255,255,.12);
    text-decoration:none;color:#fff;font-weight:600;font-size:14.5px;
  }
  .fee-docs li:last-child .dl{border-bottom:0;}
  .fee-docs .dl:hover{color:var(--pink);}
  .fee-docs .dl > span:first-child{grid-area:name;min-width:0;}
  .fee-docs .dl .dl-when{grid-area:when;margin:0;color:#98a7cc;}
  .fee-docs .dl .tag{
    grid-area:badge;align-self:center;font-size:11px;font-weight:700;
    color:#cfd9f2;background:rgba(255,255,255,.1);padding:4px 9px;border-radius:6px;
  }
  .fee-docs [data-mw-nolink]{color:#bcc8e4;}


  .compare{padding-block:52px;background:var(--cream-deep);}
  .cmp-table{margin-top:34px;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--paper);}
  .cmp-row{display:grid;grid-template-columns:1fr 1.25fr;gap:24px;padding:20px 26px;border-bottom:1px solid var(--line);align-items:start;}
  .cmp-row:last-child{border-bottom:0;}
  .cmp-row span{color:var(--ink-soft);font-size:15.5px;}
  .cmp-row strong{color:var(--navy);font-size:15.5px;font-weight:700;}
  .cmp-head{background:var(--navy);}
  .cmp-head span{color:#c3cee8;font-size:12.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;}
  .cmp-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:26px;}
  .cmp-cta p{font-family:var(--mw-display);font-weight:700;color:var(--navy);font-size:17px;}
  @media (max-width:760px){
    .cmp-row{grid-template-columns:1fr;gap:8px;}
    .cmp-head{display:none;}
  }

  /* testimonials */
  .testimonials{padding-block:52px;}
  .t-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:34px;}
  /* The score reads as the same badge as the one on the hero photograph. */
  .t-score{margin:0;}
  .score-badge{
    display:inline-flex;align-items:center;gap:11px;background:var(--paper);
    border:1px solid var(--line);border-radius:999px;padding:11px 20px;
    box-shadow:0 14px 30px -18px rgba(20,49,103,.45);
    font-size:14px;font-weight:700;color:var(--navy);line-height:1.4;
  }
  .score-badge .stars{color:var(--orange);letter-spacing:1px;font-size:12.5px;flex:0 0 auto;}
  .score-badge a{
    color:var(--navy);text-decoration:underline;text-underline-offset:3px;
    text-decoration-thickness:1px;text-decoration-color:rgba(20,49,103,.35);
  }
  .score-badge a:hover{color:var(--pink);text-decoration-color:var(--pink);}
  @media (max-width:560px){
    /* Narrow enough that the line wraps: square it off a little and hang the
       stars at the top, so a wrapped badge still looks deliberate. */
    .score-badge{align-items:flex-start;border-radius:20px;padding:12px 18px;font-size:13.5px;}
    .score-badge .stars{margin-top:2px;}
  }
  .t-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 24px;}
  .t-item{margin:0;}
  .t-bubble{
    position:relative;margin:0;background:var(--paper);border:1px solid var(--line);
    border-radius:22px;padding:24px 26px;
  }
  .t-bubble::before,
  .t-bubble::after{content:"";position:absolute;left:36px;bottom:-13px;width:24px;height:24px;transform:rotate(45deg);}
  .t-bubble::before{background:var(--line);}
  .t-bubble::after{background:var(--paper);bottom:-11px;}
  .t-bubble .stars{display:block;color:var(--orange);letter-spacing:2px;font-size:14px;margin-bottom:10px;}
  .t-bubble p{font-size:15.5px;color:var(--ink);}
  .t-item .who{
    margin:24px 0 0 40px;font-size:13.5px;color:var(--ink-soft);display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;
  }
  .t-item .who strong{color:var(--navy);}
  .t-item .who .when{font-size:12.5px;opacity:.85;}
  .t-item.featured{grid-column:1 / -1;margin-top:6px;}
  .t-item.featured .t-bubble{
    background:var(--butter);border-color:#e9d9a5;padding:34px 38px;text-align:center;
  }
  .t-item.featured .t-bubble::before{background:#e9d9a5;}
  .t-item.featured .t-bubble::after{background:var(--butter);}
  .t-item.featured .t-bubble p{
    font-family:var(--mw-display);font-weight:700;color:var(--navy);
    font-size:clamp(19px,2.4vw,26px);line-height:1.4;
  }
  .t-item.featured .who{justify-content:center;margin-left:0;}
  .t-foot{margin-top:24px;text-align:center;font-size:14.5px;}
  .t-foot a{color:var(--navy);font-weight:700;text-underline-offset:3px;}

  /* gallery */
  .gallery{background:var(--navy);padding-block:48px;}
  .gallery .section-head h2{color:#fff;}
  .gallery .eyebrow{color:#ffb9d6;}
  .gallery .section-head .body{color:#c3cee8;}
  .mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:170px;gap:14px;}
  .mosaic .m{position:relative;overflow:hidden;border-radius:18px;background:#0f2550;}
  .mosaic .m img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
  .mosaic .m:hover img{transform:scale(1.04);}
  .mosaic .m span{
    position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;
    color:#fff;font-size:12px;font-weight:700;
    background:linear-gradient(180deg,rgba(9,22,48,0),rgba(9,22,48,.8));
  }
  .mosaic .big{grid-column:span 2;grid-row:span 2;}
  .mosaic .tall{grid-row:span 2;}
  .mosaic .wide{grid-column:span 2;}
  .mosaic .quote{
    background:var(--butter);color:var(--navy);display:flex;align-items:center;justify-content:center;
    text-align:center;padding:22px;font-family:var(--mw-display);font-weight:700;font-size:15px;line-height:1.45;
  }
  @media (max-width:900px){
    .mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;}
    .mosaic .big{grid-column:span 2;grid-row:span 2;}
  }

  /* next steps + CTA */
  .steps{padding-block:50px;}
  .step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:36px;}
  .step{display:flex;gap:14px;align-items:flex-start;}
  .step .n{
    flex:none;width:40px;height:40px;border-radius:12px;background:var(--navy);color:#fff;
    display:flex;align-items:center;justify-content:center;font-family:var(--mw-display);font-weight:700;
  }
  .step h4{font-size:16.5px;}
  .step p{font-size:14.5px;color:var(--ink-soft);margin-top:5px;}

  .cta-band{position:relative;background:var(--navy);color:#fdf9f2;padding-block:50px;overflow:hidden;}
  .cta-band::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(70% 140% at 100% 100%,rgba(255,123,64,.24),transparent 60%),
               radial-gradient(60% 120% at 0% 0%,rgba(231,69,139,.22),transparent 60%);
  }
  .cta-band .wrap{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;}
  .cta-band h2{color:#fff;font-size:clamp(26px,3.4vw,36px);}
  .cta-band .lede{margin-top:14px;color:#dbe3f4;max-width:44ch;font-size:16px;}
  .cta-band .tagline{margin-top:20px;font-family:var(--mw-display);font-weight:700;color:var(--orange);font-size:16px;}
  .cta-actions{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap;}
  .places{
    margin-top:22px;display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.25);padding:10px 16px;border-radius:999px;font-size:13.5px;font-weight:600;
  }
  .places .pulse{width:9px;height:9px;border-radius:50%;background:#6fe39a;box-shadow:0 0 0 4px rgba(111,227,154,.25);}
  .enquire-card{background:var(--paper);border-radius:22px;padding:26px;color:var(--ink);box-shadow:0 30px 60px -20px rgba(0,0,0,.45);}
  .enquire-card h3{font-size:17px;}
  .enquire-card .fine{font-size:12.5px;color:var(--ink-soft);margin-top:4px;}
  .field{margin-top:14px;display:flex;flex-direction:column;gap:6px;}
  .field label{font-size:12.5px;font-weight:700;color:var(--navy);}
  .field input{border:1.5px solid var(--line);border-radius:10px;padding:11px 12px;font-size:15px;font-family:inherit;background:#fff;color:var(--ink);}
  .enquire-card .btn{margin-top:18px;}
  .thankyou{display:none;text-align:center;padding:18px 6px;}
  .thankyou .tick{width:44px;height:44px;border-radius:50%;background:#e9f5ee;color:var(--good);display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:20px;font-weight:700;}
  .thankyou p{margin-top:8px;font-size:14px;color:var(--ink-soft);}

  /* footer */
  footer.site{background:var(--navy-deep);color:#cdd6ea;padding-block:54px 26px;}
  .footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;}
  footer.site h4{color:#fff;font-family:var(--mw-body);font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px;}
  .logo-plate{display:inline-block;}
  .logo-plate img{height:56px;width:auto;max-width:none;}
  footer.site p.small{font-size:14px;color:#b7c2df;margin-top:14px;max-width:34ch;}
  footer.site ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
  footer.site a{text-decoration:none;color:#cdd6ea;font-size:14px;}
  footer.site a:hover{color:#fff;text-decoration:underline;}
  .foot-badges{
    display:flex;gap:24px;flex-wrap:wrap;align-items:center;margin-top:42px;padding-top:30px;
    border-top:1px solid rgba(255,255,255,.12);
  }
  .logo-badge{display:block;line-height:0;transition:transform .15s ease;}
  .logo-badge:hover{transform:translateY(-2px);}
  .logo-badge img{height:74px;width:auto;}
  /* A wide wordmark rather than a squarish logo, so it is left at the size
     its maker drew it. Stretched to match the others it would be three
     times their width and would run the row. */
  .logo-badge.is-wide img{height:64px;}
  @media (max-width:560px){
    .logo-badge img{height:60px;}
    .logo-badge.is-wide img{height:52px;}
  }
  .foot-bottom{margin-top:42px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:12.5px;color:#93a1c4;}
  .foot-bottom .legal{display:flex;gap:18px;flex-wrap:wrap;}
  .foot-bottom .legal a{color:#93a1c4;font-size:12.5px;}



  .btn-outline{background:transparent;color:var(--navy);border-color:var(--navy);}
  .btn-outline:hover{background:var(--navy);color:#fff;}
  .film-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;}
  .video-card.small{aspect-ratio:4/3;}
  .video-card .scrim strong{display:block;}


  /* garden */
  .garden{background:var(--navy);color:#e9eefb;padding-block:52px 56px;}
  .garden .eyebrow{color:#ffb9d6;}

  /* The words and the slideshow share one line, with the four points
     underneath, so the whole section is two bands rather than four. */
  .g-main{
    display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
    gap:46px;align-items:center;
  }
  .g-main.is-alone{grid-template-columns:1fr;}
  .garden h2{
    color:#fff;font-size:clamp(27px,2.9vw,38px);line-height:1.12;
    margin-top:11px;max-width:18ch;
  }
  .garden .g-lede{font-size:16.5px;line-height:1.6;color:#dce4f6;margin-top:15px;}
  .garden .g-lede .hl-yellow{color:var(--butter);}
  /* What a parent said, in a speech bubble with its tail on the left. */
  .g-bubble{
    position:relative;margin:26px 0 6px;max-width:30ch;
    background:var(--butter);color:var(--navy);border-radius:18px 18px 18px 5px;
    padding:17px 20px 15px;box-shadow:0 10px 26px rgba(4,13,34,.28);
  }
  .g-bubble::after{
    content:"";position:absolute;left:0;bottom:-11px;width:0;height:0;
    border-top:12px solid var(--butter);border-right:15px solid transparent;
  }
  .g-bubble blockquote{
    margin:0;font-family:var(--mw-display);font-weight:700;line-height:1.3;
    font-size:clamp(17px,1.7vw,20px);color:var(--navy);
  }
  .g-bubble figcaption{
    margin-top:9px;font-size:12.5px;font-weight:700;color:#5a6b8d;
  }

  /* One big photograph at a time, with its wording across the bottom. */
  .g-slider{position:relative;border-radius:22px;overflow:hidden;background:rgba(255,255,255,.05);}
  .g-slides{display:grid;}
  .g-slide{
    grid-area:1 / 1;margin:0;position:relative;
    opacity:0;visibility:hidden;transition:opacity .55s ease;
  }
  .g-slide.is-on{opacity:1;visibility:visible;}
  .garden .g-slider .g-slide img{
    width:100%;aspect-ratio:4/3;object-fit:cover;display:block;margin:0;border-radius:0;
  }
  .g-slide::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:62%;
    background:linear-gradient(to top,rgba(6,17,42,.95),rgba(6,17,42,.66) 38%,rgba(6,17,42,0));
    pointer-events:none;
  }
  .g-slide figcaption{
    position:absolute;left:26px;right:26px;bottom:24px;z-index:2;margin:0;
    font-size:16px;line-height:1.45;color:#e4eafb;
    text-shadow:0 1px 14px rgba(5,15,38,.55);
  }
  .g-slide figcaption b{
    font-family:var(--mw-display);font-weight:700;font-size:27px;color:#fff;
    margin-right:4px;
  }

  /* Back and on, one either side, and the dots along the foot. */
  .g-arrow{
    position:absolute;top:50%;z-index:3;width:40px;height:40px;margin-top:-20px;
    border:0;border-radius:50%;background:rgba(10,26,58,.5);cursor:pointer;
    backdrop-filter:blur(4px);transition:background .18s ease;
  }
  .g-arrow:hover{background:rgba(10,26,58,.85);}
  .g-arrow:focus-visible{outline:2px solid var(--pink);outline-offset:3px;}
  .g-arrow::before{
    content:"";position:absolute;top:50%;left:50%;width:9px;height:9px;
    border-top:2px solid #fff;border-right:2px solid #fff;
  }
  .g-arrow.back{left:14px;}
  .g-arrow.back::before{transform:translate(-30%,-50%) rotate(-135deg);}
  .g-arrow.on{right:14px;}
  .g-arrow.on::before{transform:translate(-70%,-50%) rotate(45deg);}
  /* On a pale photograph the dots would disappear, so they sit on a
     small tinted pill. */
  .g-dots{
    position:absolute;right:14px;top:14px;z-index:3;display:flex;gap:7px;
    align-items:center;padding:7px 10px;border-radius:999px;
    background:rgba(8,21,50,.42);backdrop-filter:blur(5px);
  }
  .g-dot{
    width:8px;height:8px;border-radius:50%;border:0;padding:0;cursor:pointer;
    background:rgba(255,255,255,.5);transition:background .18s ease, transform .18s ease;
  }
  .g-dot.is-on{background:#fff;transform:scale(1.3);}
  .g-dot:focus-visible{outline:2px solid var(--pink);outline-offset:3px;}

  .g-list{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:36px;}
  .g-item{font-size:15px;color:#c8d3ea;line-height:1.55;border-top:3px solid var(--pink);padding-top:16px;}
  /* Two lines held, so every column's wording starts on the same line. */
  .g-item b{display:block;color:#fff;font-family:var(--mw-display);font-size:19.5px;line-height:1.25;margin-bottom:8px;min-height:2.5em;}

  /* A photograph above the heading, when one has been added. The pink line
     stays on top of the column so the four still read as a set. */
  .g-item-shot{display:block;margin:0 0 14px;border-radius:14px;overflow:hidden;}
  .g-item-shot img{
    width:100%;aspect-ratio:4/3;object-fit:cover;display:block;margin:0;border-radius:0;
  }
  /* With a picture above it there is no need to hold the headings level,
     and forcing two lines would leave a gap under the short ones. */
  .g-item.has-photo b{min-height:0;}

  @media (prefers-reduced-motion:reduce){
    .g-slide{transition:none;}
  }
  @media (max-width:980px){
    .g-main{grid-template-columns:1fr;gap:28px;}
    .garden h2{max-width:22ch;}
    .garden .g-slider .g-slide img{aspect-ratio:16/9;}
    .g-list{grid-template-columns:1fr 1fr;gap:18px;}
  }
  @media (max-width:560px){
    .garden .g-slider .g-slide img{aspect-ratio:4/3;}
    .g-slide figcaption{left:18px;right:18px;bottom:20px;font-size:15px;}
    .g-slide figcaption b{font-size:22px;}
    .g-dots{right:14px;top:14px;}
    .g-arrow{width:34px;height:34px;margin-top:-17px;}
    .g-list{grid-template-columns:1fr;}
    .g-item b{min-height:0;}
  }

  /* eyfs */
  .eyfs{padding-block:50px;background:var(--paper);}
  .area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:34px;}
  .area{
    display:flex;align-items:center;gap:10px;border-radius:14px;padding:16px 18px;
    font-weight:700;font-size:14.5px;color:#fff;line-height:1.35;
  }
  .area::before{content:"\2713";font-size:15px;opacity:.85;}
  .a1{background:#d6317f;}
  .a2{background:#ef6a3c;}
  .a3{background:#e0b81f;}
  .a4{background:#8dbf47;}
  .a5{background:#c22a71;}
  .a6{background:#e8552c;}
  .a7{background:#f0c419;}
  .area.a3, .area.a7{color:#3a2f06;}

  @media (max-width:980px){
    .eyfs-cards{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width:900px){
    .film-grid{grid-template-columns:1fr;}
    .video-card.small{aspect-ratio:16/9;}
  }
  @media (max-width:560px){
    .eyfs-cards{grid-template-columns:1fr;}
  }


  .stage{padding:0 0 26px;overflow:hidden;}
  .stage-photo{aspect-ratio:4/3;overflow:hidden;border-radius:20px 20px 0 0;}
  .stage-photo img{width:100%;height:100%;object-fit:cover;}
  .stage .num{margin:-19px 0 0 24px;box-shadow:0 4px 10px -4px rgba(0,0,0,.4);}
  .stage .age, .stage h3, .stage p{padding-inline:24px;}
  .eyfs-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:34px;}
  .ec{margin:0;}
  .ec img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:16px;}
  .ec figcaption{display:flex;align-items:center;gap:9px;margin-top:11px;font-weight:700;color:var(--navy);font-size:14.5px;flex-wrap:wrap;}
  .ec figcaption em{flex-basis:100%;margin-left:20px;font-style:normal;font-weight:600;font-size:12.5px;color:var(--ink-soft);}
  .ec .dot{width:11px;height:11px;border-radius:50%;display:inline-block;flex:none;}
  .d1{background:#d6317f;} .d2{background:#ef6a3c;} .d3{background:#e0b81f;} .d4{background:#8dbf47;}
  .d5{background:#c22a71;} .d6{background:#e8552c;} .d7{background:#f0c419;}
  .ec.note{background:var(--cream-deep);border-radius:16px;padding:22px;display:flex;flex-direction:column;justify-content:center;}
  .ec.note strong{font-family:var(--mw-display);color:var(--navy);font-size:16px;}
  .ec.note p{margin-top:8px;font-size:14px;color:var(--ink-soft);}
  .eyfs .area-grid{margin-top:18px;}
  .team-photo{margin-top:30px;border-radius:22px;overflow:hidden;aspect-ratio:16/7;}
  .team-photo img{width:100%;height:100%;object-fit:cover;}
  @media (max-width:900px){ .eyfs-cards{grid-template-columns:1fr;} }

  /* team teaser */
  .team{background:var(--cream-deep);padding-block:50px;}
  .team-grid{display:grid;grid-template-columns:repeat(var(--team-cols,5),1fr);gap:18px;margin-top:36px;}
  .team-card{
    background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:22px;
    display:flex;flex-direction:column;
  }
  /* Two lines held for the job title, so every name starts on the same
     line whether the title runs to one line or two. */
  .team-card .role{
    display:block;font-size:12px;font-weight:700;text-transform:uppercase;
    letter-spacing:.08em;color:var(--pink);line-height:1.4;min-height:4.2em;
  }
  .team-card h4{font-size:17px;margin-top:6px;}
  /* Every write up is given the same depth, twelve lines, so the cards are
     the same height and nothing is left floating in white space. A longer
     one scrolls inside its own card rather than stretching the whole row. */
  .t-bio{position:relative;flex:0 0 auto;height:18.6em;margin-top:10px;}
  .team-card .t-bio p{
    margin:0;height:100%;overflow-y:auto;overscroll-behavior:contain;
    font-size:14px;line-height:1.55;color:var(--ink-soft);padding-right:10px;
    scrollbar-width:thin;scrollbar-color:rgba(20,49,103,.3) transparent;
  }
  .team-card .t-bio p::-webkit-scrollbar{width:5px;}
  .team-card .t-bio p::-webkit-scrollbar-track{background:transparent;}
  .team-card .t-bio p::-webkit-scrollbar-thumb{background:rgba(20,49,103,.26);border-radius:999px;}
  .team-card .t-bio p:hover::-webkit-scrollbar-thumb{background:rgba(20,49,103,.42);}
  /* A soft fade at the foot, but only while there is more to read. */
  .t-bio::after{
    content:"";position:absolute;left:0;right:10px;bottom:0;height:40px;
    background:linear-gradient(to top,var(--paper),rgba(255,253,249,0));
    opacity:0;transition:opacity .18s ease;pointer-events:none;
  }
  .t-bio.can-scroll:not(.at-end)::after{opacity:1;}
  /* Pushed to the foot of the card, so the navy line sits on one level. */
  /* The drop down is the last thing in the card, so it is what sits on
     the bottom line across the row. */
  .team-card .t-quals-box{margin-top:auto;}

  /* Qualifications and training, folded away at the foot of the card so
     the cards stay the same sort of height whoever is on them. */
  .t-quals-box{margin-top:16px;padding-top:13px;border-top:1px solid var(--line);}
  .t-quals-box > summary{
    list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:8px;
    font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
    line-height:1.45;color:var(--pink);
  }
  .t-quals-box > summary::-webkit-details-marker{display:none;}
  .t-quals-box > summary::after{
    content:"";width:6px;height:6px;flex:none;margin:3px 0 0 auto;
    border-right:1.8px solid var(--pink);border-bottom:1.8px solid var(--pink);
    transform:rotate(45deg) translate(-2px,-2px);transition:transform .18s ease;
  }
  .t-quals-box[open] > summary::after{transform:rotate(-135deg);}
  .t-quals-box > summary:focus-visible{outline:2px solid var(--pink);outline-offset:3px;border-radius:4px;}
  .t-quals-box > .t-quals{margin-top:10px;}

  .t-quals-wrap{margin-top:16px;padding-top:13px;border-top:1px solid var(--line);}
  .t-quals-wrap > b{
    display:block;font-size:10.5px;font-weight:700;text-transform:uppercase;
    letter-spacing:.09em;color:var(--pink);margin-bottom:8px;
  }
  .t-quals{list-style:none;margin:0;padding:0;}
  .t-quals li{
    position:relative;padding-left:15px;font-size:12.5px;line-height:1.45;
    color:var(--ink-soft);
  }
  .t-quals li + li{margin-top:4px;}
  .t-quals li::before{
    content:"";position:absolute;left:3px;top:.52em;width:5px;height:5px;
    border-radius:50%;background:var(--pink);opacity:.5;
  }
  .team-mini-panel .t-quals-wrap{max-width:72ch;}


  .faces{display:flex;align-items:center;gap:0;margin-top:28px;flex-wrap:wrap;}
  .face{
    width:74px;height:74px;border-radius:50%;overflow:hidden;border:3px solid var(--paper);
    margin-right:-14px;background:var(--cream);flex:none;
  }
  .face img{width:100%;height:100%;object-fit:cover;}
  .face.more{
    display:flex;align-items:center;justify-content:center;background:var(--navy);color:#fff;
    font-family:var(--mw-display);font-weight:700;font-size:15px;
  }
  .faces-note{margin-left:30px;font-size:14.5px;color:var(--ink-soft);max-width:34ch;}

  /* The rest of the team, folded away until somebody asks for it. */
  .faces.is-openable{cursor:pointer;border-radius:60px;}
  .faces.is-openable:focus-visible{outline:2px solid var(--pink);outline-offset:6px;}
  .faces.is-openable:hover .face.more{background:var(--pink);}
  .team-more{margin:26px 0 0;}
  .team-more-btn{font-size:14.5px;padding:11px 22px;}
  .team-more-btn[aria-expanded="true"]{background:var(--navy);color:#fff;border-color:var(--navy);}
  .team-all{margin-top:22px;}
  .team-all-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px 16px;
    /* Dense, so opening somebody's few lines does not leave a hole in the
       row they were standing in. */
    grid-auto-flow:row dense;
  }
  .team-mini{margin:0;text-align:center;}
  .team-mini-photo{
    display:block;width:96px;height:96px;margin:0 auto 10px;border-radius:50%;
    overflow:hidden;background:var(--cream-deep);border:3px solid var(--paper);
    box-shadow:0 10px 22px -14px rgba(20,49,103,.55);
  }
  .team-mini-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  .team-mini-initial{
    display:flex;align-items:center;justify-content:center;width:100%;height:100%;
    font-family:var(--mw-display);font-weight:700;font-size:32px;color:var(--navy);
  }
  /* Waiting on a photograph: our own elephant stands in, rather than an
     initial that reads like a missing picture. He steps aside the moment a
     photograph is added. */
  .team-mini-photo.is-initial{background:var(--paper);}
  .team-mini-photo.is-initial .team-mini-initial{
    width:100%;height:100%;font-size:0;
    background:url(../img/millwood-mark.png) center center / 74% auto no-repeat;
  }
  .team-mini-cap{display:flex;flex-direction:column;gap:3px;}
  /* Scoped to the caption: left loose, it also caught the letter inside
     the circle and shrank it to caption size. */
  .team-mini-cap b{display:block;font-size:14.5px;color:var(--navy);}
  .team-mini-cap span{display:block;font-size:12.5px;color:var(--ink-soft);line-height:1.35;}

  /* A tile with something to say. Pressing it opens their few lines
     underneath the row, so nobody loses their place in the grid. */
  .team-mini-btn{
    display:block;width:100%;padding:8px 6px 10px;background:none;border:0;cursor:pointer;
    font:inherit;text-align:center;border-radius:16px;
    transition:background .15s ease, transform .15s ease;
  }
  .team-mini-btn:hover{background:rgba(255,255,255,.55);transform:translateY(-2px);}
  .team-mini-btn:focus-visible{outline:3px solid var(--pink);outline-offset:2px;}
  .team-mini-more{
    display:block;width:20px;height:20px;margin:8px auto 0;border-radius:50%;
    background:var(--navy);position:relative;
    transition:background .15s ease, transform .2s ease;
  }
  .team-mini-more::before,
  .team-mini-more::after{
    content:"";position:absolute;top:50%;left:50%;width:9px;height:2px;border-radius:2px;
    background:#fff;transform:translate(-50%,-50%);
  }
  .team-mini-more::after{transform:translate(-50%,-50%) rotate(90deg);transition:opacity .2s ease;}
  .team-mini-btn:hover .team-mini-more{background:var(--pink);}
  .team-mini-btn[aria-expanded="true"] .team-mini-more{background:var(--pink);}
  .team-mini-btn[aria-expanded="true"] .team-mini-more::after{opacity:0;}
  .team-mini-btn[aria-expanded="true"] .team-mini-photo{box-shadow:0 0 0 3px var(--pink);}

  .team-mini-panel{
    grid-column:1 / -1;background:var(--paper);border:1px solid var(--line);
    border-radius:18px;padding:22px 26px;margin:2px 0 6px;
  }
  .team-mini-panel h4{font-size:18px;color:var(--navy);}
  .team-mini-panel .team-mini-role{
    margin-top:2px;font-size:12px;font-weight:700;text-transform:uppercase;
    letter-spacing:.08em;color:var(--pink);
  }
  .team-mini-panel p{margin-top:10px;font-size:15px;color:var(--ink-soft);line-height:1.6;max-width:72ch;}

  @media (max-width:1080px){
    .team-grid{grid-template-columns:repeat(min(var(--team-cols,3),3),1fr);}
    .t-bio{height:auto;}
    .team-card .t-bio p{height:auto;overflow:visible;padding-right:0;}
    .t-bio::after{display:none;}
  }
  @media (max-width:700px){ .faces-note{margin:16px 0 0 14px;} }


  .team-photo{margin:30px 0 0;}
  .team-photo figcaption{margin-top:10px;font-size:13px;color:var(--ink-soft);font-weight:600;}

  /* faqs */
  .faqs{padding-block:44px;}
  .faq-list{margin-top:32px;display:grid;gap:12px;}
  details.faq{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:0 20px;}
  details.faq summary{
    list-style:none;cursor:pointer;padding:18px 0;font-weight:700;color:var(--navy);font-size:16px;
    display:flex;justify-content:space-between;gap:16px;align-items:center;
  }
  details.faq summary::-webkit-details-marker{display:none;}
  details.faq summary::after{content:"+";font-family:var(--mw-display);font-size:22px;color:var(--pink);line-height:1;}
  details.faq[open] summary::after{content:"\2013";}
  details.faq p{padding:0 0 20px;color:var(--ink-soft);font-size:15.5px;max-width:70ch;}
  .ratio-list{list-style:none;margin:0;padding:0 0 20px;display:grid;gap:8px;max-width:46ch;}
  .ratio-list li{
    display:flex;justify-content:space-between;gap:16px;font-size:15.5px;color:var(--ink-soft);
    border-bottom:1px dashed var(--line);padding-bottom:8px;
  }
  .ratio-list li:last-child{border-bottom:0;}
  .ratio-list b{color:var(--navy);}
  .faq-foot{margin-top:24px;font-size:15px;color:var(--ink-soft);}
  .faq-foot a{color:var(--navy);font-weight:700;}

  /* Heading on the left, every question on show in a box on the right, the
     same shape as the policies section underneath it. */
  .faq-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:44px;align-items:start;}
  .faq-intro h2{font-size:clamp(26px,3vw,34px);margin-top:10px;}
  .faq-intro .body{margin-top:14px;color:var(--ink-soft);font-size:16.5px;max-width:48ch;}
  .faq-box{background:var(--cream-deep);border-radius:20px;padding:14px 22px;}
  .faq-box-name{font-size:16px;margin:0;}
  .faq-box .faq-list{margin-top:0;display:block;}
  .faq-box-name + .faq-list{margin-top:12px;}
  /* Rows rather than cards: nine cards stacked inside a box is a lot of
     boxes, and the dividers match the policy list below. */
  .faq-box details.faq{
    background:transparent;border:0;border-radius:0;padding:0;
    border-bottom:1px solid rgba(20,49,103,.12);
  }
  .faq-box details.faq:last-child{border-bottom:0;}
  .faq-box details.faq summary{padding:11px 0;font-size:15px;gap:14px;line-height:1.35;}
  .faq-box details.faq summary::after{font-size:20px;}
  .faq-box details.faq p{padding:0 0 13px;font-size:14.5px;line-height:1.55;max-width:none;}
  .faq-box .ratio-list{padding:0 0 14px;max-width:none;gap:7px;}
  .faq-box .ratio-list li{font-size:14.5px;}
  @media (max-width:900px){
    .faq-grid{grid-template-columns:1fr;gap:26px;}
    .faq-intro .body{max-width:none;}
  }

  /* On the FAQs page the questions are the page, so they keep the full
     width and the links sit under them rather than above. */
  .faq-wide{display:flex;flex-direction:column;}
  .faq-wide .faq-plain{order:1;}
  .faq-wide .faq-intro{order:2;}


  .video-card.community{aspect-ratio:16/7;margin-bottom:24px;}
  .video-card.community .scrim{background:linear-gradient(180deg,rgba(13,33,72,.25) 0%,rgba(13,33,72,.72) 100%);}
  @media (max-width:700px){ .video-card.community{aspect-ratio:4/3;} }

  /* testimonial videos */
  .vids{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px;}
  .vid-card{
    position:relative;display:block;border-radius:18px;overflow:hidden;aspect-ratio:4/5;text-decoration:none;
    background:#0d2148;box-shadow:0 20px 44px -26px rgba(0,0,0,.6);
  }
  .vid-card img{width:100%;height:100%;object-fit:cover;opacity:.92;transition:transform .4s ease;}
  .vid-card:hover img{transform:scale(1.04);}
  .vid-card .scrim{
    position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding:20px;
    background:linear-gradient(180deg,rgba(13,33,72,0) 35%,rgba(13,33,72,.85) 100%);color:#fff;
  }
  .vid-card .play-sm{
    position:absolute;top:16px;left:16px;width:42px;height:42px;border-radius:50%;
    background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;
  }
  .vid-card .play-sm svg{width:16px;height:16px;fill:var(--navy);margin-left:2px;}
  .vid-card strong{font-family:var(--mw-display);font-size:15.5px;}
  .vid-card span.sub{font-size:12.5px;opacity:.9;}

  /* pull quote */
  .bigquote{background:var(--navy);color:#fff;padding-block:64px;text-align:center;}
  .bigquote .wrap{max-width:820px;}
  .bigquote p{font-family:var(--mw-display);font-size:clamp(22px,2.8vw,30px);line-height:1.4;}
  .bigquote .who{margin-top:18px;font-size:13.5px;color:#b9c6e4;font-family:var(--mw-body);letter-spacing:.04em;}

  /* location */
  .location{padding-block:52px;}
  .loc-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;}
  .map-card{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:16px;box-shadow:0 20px 48px -30px rgba(20,49,103,.5);}
  .map-card svg{width:100%;height:auto;display:block;border-radius:14px;}
  .addr{font-size:16.5px;color:var(--ink-soft);margin-top:16px;}
  .addr strong{color:var(--navy);}
  .loc-points{margin-top:20px;display:grid;gap:10px;}
  .loc-point{display:block;font-size:15px;color:var(--ink-soft);}
  .loc-point b{margin-right:4px;}
  .loc-point b{color:var(--navy);}


  .refer{padding-block:20px 60px;}
  .refer-card{
    background:var(--butter);border-radius:22px;padding:34px;
    display:flex;gap:32px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  }
  .refer-card .eyebrow{color:#a8437a;}


  .dist-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
  .dist{
    background:var(--cream-deep);border-radius:999px;padding:7px 14px;font-size:12.5px;color:var(--ink-soft);
  }
  .dist b{color:var(--navy);}


  .policies{padding-block:50px;background:var(--paper);}
  .pol-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:start;}
  .downloads{background:var(--cream-deep);border-radius:20px;padding:24px;}
  .dl{
    display:flex;justify-content:space-between;align-items:center;gap:14px;
    padding:14px 0;border-bottom:1px solid rgba(20,49,103,.12);text-decoration:none;
    color:var(--navy);font-weight:600;font-size:15px;
  }
  .dl:last-child{border-bottom:0;}
  .dl:hover{color:var(--pink);}
  .dl .tag{font-size:11px;font-weight:700;color:var(--ink-soft);background:var(--paper);padding:4px 9px;border-radius:6px;}
  @media (max-width:900px){ .pol-grid{grid-template-columns:1fr;} }

  /* newsletters */
  .news{background:var(--cream-deep);padding-block:46px;}
  /* The same tile as the archive page, drawn wider because there are four
     of them across rather than six. */
  /* The same tile as the archive page, drawn wider because there are four
     of them across rather than six. Both class names are on the same
     element, so these carry the extra weight to win outright rather than
     relying on which rule happens to come last. */
  .nl-grid.news-grid{
    list-style:none;margin:30px 0 0;padding:0;
    display:grid;grid-template-columns:repeat(4,1fr);gap:22px 20px;
  }
  .nl-grid.news-grid .nl-cover{aspect-ratio:1 / 1.32;}
  .nl-grid.news-grid .nl-when b{font-size:19px;}
  .nl-grid.news-grid .nl-when i{font-size:14.5px;}

  @media (max-width:900px){
    .team-grid{grid-template-columns:repeat(min(var(--team-cols,2),2),1fr);}
    .vids{grid-template-columns:1fr;}
    .loc-grid{grid-template-columns:1fr;}
    .nl-grid.news-grid{grid-template-columns:1fr 1fr;}
  }


  .book-bar{
    position:fixed;left:0;right:0;bottom:0;z-index:55;background:var(--navy);
    box-shadow:0 -10px 30px -16px rgba(0,0,0,.6);padding-block:12px;
  }
  .book-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;}
  .bb-text{color:#dbe3f4;font-size:14.5px;}
  .bb-text strong{color:#fff;}
  .bb-actions{display:flex;gap:12px;align-items:center;}
  .btn-quiet-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.4);}
  .btn-quiet-light:hover{border-color:#fff;}
  @media (max-width:900px){ .book-bar{display:none;} }

  .mobile-cta{display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--navy);padding:10px 14px;gap:10px;box-shadow:0 -8px 20px -10px rgba(0,0,0,.4);}
  .mobile-cta a{flex:1;text-align:center;}

  @media (max-width:980px){
    .calc{grid-template-columns:1fr;}
    .result{position:static;}
  }
  @media (max-width:1080px){
    nav.primary{display:none;}
    .nav-toggle{display:flex;}
    .strip-actions{display:none;}
  }
  @media (max-width:900px){
    .hero .wrap{grid-template-columns:1fr;}
    .hero-art{order:-1;max-width:320px;margin:0 auto;}
    .narrative .wrap,.narrative.reverse .wrap{grid-template-columns:1fr;direction:ltr;}
    .narrative .photo-frame{order:-1;max-width:440px;margin:0 auto;width:100%;}
    .video-band .wrap{grid-template-columns:1fr;}
    .stages,.step-grid{grid-template-columns:1fr;}
    .t-grid{grid-template-columns:1fr;}
    .g-grid{grid-template-columns:repeat(3,1fr);}
    .cta-band .wrap{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr 1fr;}
  
  .book-bar{
    position:fixed;left:0;right:0;bottom:0;z-index:55;background:var(--navy);
    box-shadow:0 -10px 30px -16px rgba(0,0,0,.6);padding-block:12px;
  }
  .book-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;}
  .bb-text{color:#dbe3f4;font-size:14.5px;}
  .bb-text strong{color:#fff;}
  .bb-actions{display:flex;gap:12px;align-items:center;}
  .btn-quiet-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.4);}
  .btn-quiet-light:hover{border-color:#fff;}
  @media (max-width:900px){ .book-bar{display:none;} }

  .mobile-cta{display:flex;}
    body{padding-bottom:64px;}
  }
  @media (max-width:760px){
    .logo-img{height:48px;}
    /* Scrolling should never make it larger than it starts. */
    .mw-scrolled .logo-img{height:44px;}
    .header-phone span{display:none;}
    .header-actions .btn-primary{padding:13px 18px;font-size:14.5px;}
  }
  @media (max-width:560px){
    /* The bar pinned to the bottom of the screen already offers this, and
       the room is better spent on the logo. */
    .header-actions .btn-primary{display:none;}
  }
  @media (max-width:380px){
    .logo-img{height:42px;}
    .mw-scrolled .logo-img{height:40px;}
  }
  @media (max-width:560px){
    .pillars{grid-template-columns:1fr;}
    .badge-float{display:none;}
    .day-row{flex-direction:column;align-items:flex-start;gap:8px;}
    .seg{width:100%;}
    .seg button{flex:1;padding:10px 6px;}
  }

  /* ================= clarity layer: overlays, markers, wayfinding ================= */
  .mark{background-image:linear-gradient(180deg,transparent 34%,rgba(255,201,112,.62) 34%);padding:0 .14em;border-radius:3px;box-decoration-break:clone;-webkit-box-decoration-break:clone;}
  .mark-warm{background-image:linear-gradient(180deg,transparent 54%,rgba(231,69,139,.20) 54%);}
  .mark-dark{background-image:linear-gradient(180deg,transparent 34%,rgba(255,123,64,.55) 34%);box-decoration-break:clone;-webkit-box-decoration-break:clone;}

  .ph-chip{
    position:absolute;left:16px;bottom:16px;z-index:3;display:inline-flex;align-items:center;gap:9px;
    background:rgba(255,253,249,.95);color:var(--navy);font-size:12.5px;font-weight:700;line-height:1.3;
    padding:9px 15px;border-radius:999px;box-shadow:0 12px 26px -14px rgba(20,49,103,.85);
    max-width:calc(100% - 32px);text-align:left;
  }
  .ph-chip::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--pink);}

  .sticker{
    position:absolute;z-index:5;width:110px;height:110px;border-radius:50%;
    display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px;
    font-family:var(--mw-display);font-weight:700;font-size:12.5px;line-height:1.25;
    background:var(--butter);color:var(--navy);border:3px solid var(--paper);
    box-shadow:0 16px 34px -18px rgba(20,49,103,.8);transform:rotate(-9deg);
  }
  .sticker b{display:block;font-size:23px;line-height:1;margin-bottom:4px;}
  .sticker.pink{background:var(--pink);color:#fff;border-color:rgba(255,255,255,.9);}
  .sticker.orange{background:var(--yellow);color:var(--navy-deep);border-color:rgba(255,255,255,.9);}
  .sticker.sm{width:94px;height:94px;font-size:11.5px;}
  .sticker.sm b{font-size:19px;}

  .corner-flag{
    position:absolute;z-index:4;top:20px;right:0;transform:translateX(9px);
    background:var(--pink);color:#fff;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
    padding:8px 14px;border-radius:6px 0 0 6px;box-shadow:0 10px 22px -12px rgba(0,0,0,.7);
  }
  .corner-flag::after{content:"";position:absolute;right:0;bottom:-7px;border:4px solid transparent;border-top-color:#8e1e51;border-right-color:#8e1e51;}

  /* hero overlays */
  .hero-art .sticker{left:-34px;bottom:14px;}
  .hero-art .ph-chip{left:auto;right:-6px;bottom:6px;}

  /* room colour coding, carried from availability through to the rooms */
  .av{position:relative;overflow:hidden;padding-left:30px;}
  .av::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--line);}
  .av.r1::before{background:#5aa66f;}
  .av.r2::before{background:var(--pink);}
  .av.r3::before{background:var(--pink);}
  .av h3{margin-top:4px;}

  /* the three steps read as one sequence */
  .step{position:relative;}
  @media (min-width:901px){
    .step-grid .step:not(:last-child)::after{
      content:"\2192";position:absolute;top:5px;left:calc(100% + 1px);width:20px;text-align:center;
      color:rgba(20,49,103,.32);font-size:20px;font-weight:700;line-height:1.5;
    }
  }

  .calc-panel{position:relative;}
  .enquire-card{position:relative;}
  .enquire-card .sticker{top:auto;bottom:-30px;left:-30px;transform:rotate(-11deg);}
  .refer-card{position:relative;}

  /* quiet reveal on scroll, only when scripting is on */
  .js-reveal .reveal{opacity:0;transform:translateY(18px);}
  .js-reveal .reveal.in{opacity:1;transform:none;transition:opacity .55s ease,transform .55s cubic-bezier(.22,.8,.3,1);}
  @media (prefers-reduced-motion:reduce){
    .js-reveal .reveal,.js-reveal .reveal.in{opacity:1;transform:none;transition:none;}
  }

  /* where am I on the page */
  .rail{position:fixed;right:16px;top:50%;transform:translateY(-50%);z-index:45;display:none;flex-direction:column;gap:13px;}
  @media (min-width:1320px){.rail{display:flex;}}
  .rail a{position:relative;width:11px;height:11px;border-radius:50%;background:rgba(20,49,103,.22);text-decoration:none;transition:background .2s ease,transform .2s ease;}
  .rail a:hover,.rail a.on{background:var(--pink);}
  .rail a:hover{transform:scale(1.3);}
  .rail a span{
    position:absolute;right:22px;top:50%;transform:translateY(-50%);white-space:nowrap;
    background:var(--navy);color:#fff;font-size:11.5px;font-weight:700;padding:5px 11px;border-radius:8px;
    opacity:0;pointer-events:none;transition:opacity .18s ease;
  }
  .rail a:hover span,.rail a:focus-visible span{opacity:1;}

  @media (max-width:1080px){
    .hero-art .sticker,.enquire-card .sticker{display:none;}
  }

  
  /* ================= bolder hero: full bleed photograph ================= */
  .hero{
    position:relative;min-height:clamp(560px,58vw,880px);padding:0;overflow:hidden;
    display:flex;align-items:center;background:var(--navy-deep);isolation:isolate;
  }
  .hero-media{position:absolute;inset:0;z-index:0;}
  .hero-media img{width:100%;height:100%;object-fit:cover;object-position:44% 8%;}
  .hero-media::after{
    content:"";position:absolute;inset:0;
    background:
      linear-gradient(90deg,rgba(11,28,62,.94) 0%,rgba(11,28,62,.88) 24%,rgba(11,28,62,.58) 38%,rgba(11,28,62,.20) 52%,rgba(11,28,62,.04) 68%,rgba(11,28,62,0) 82%),
      linear-gradient(180deg,rgba(11,28,62,.5) 0%,rgba(11,28,62,0) 26%,rgba(11,28,62,0) 62%,rgba(11,28,62,.55) 100%);
  }
  .hero-inner{position:relative;z-index:2;width:100%;padding-block:52px;}
  .hero-copy{max-width:640px;}
  .hero h1{color:#fff;font-size:clamp(46px,6.8vw,88px);line-height:.96;letter-spacing:-.028em;margin-top:18px;}
  .hero h1 .accent{color:#ff7ab0;}
  .hero .lede{color:#dde4f4;font-size:clamp(18px,1.7vw,23px);font-weight:500;max-width:50ch;margin-top:20px;}
  .hero .lede .mark{
    background:var(--pink);color:#fff;font-weight:700;
    padding:2px 10px;border-radius:8px;box-decoration-break:clone;-webkit-box-decoration-break:clone;
  }
  .hero .avail-chip{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.3);color:#eaf7ef;}
  .hero .hero-ctas{margin-top:34px;}
  .hero .btn-quiet{background:transparent;color:#fff;border-color:rgba(255,255,255,.55);}
  .hero .btn-quiet:hover{border-color:#fff;background:rgba(255,255,255,.12);}
  .hero .hero-reassure{color:#c4d0e8;margin-top:12px;}
  .hero-marks{
    /* Inside the photograph, not hanging off the bottom edge of it, so the
       review score is part of the hero rather than straddling the join. */
    position:absolute;right:24px;bottom:34px;z-index:3;
    display:flex;flex-direction:column;align-items:flex-end;gap:10px;
  }
  .hero-marks .badge-float{position:static;}
  .hero-marks .ph-chip{position:static;background:rgba(255,253,249,.92);white-space:nowrap;max-width:none;}

  .pillar-strip{background:var(--navy-deep);border-bottom:1px solid rgba(255,255,255,.08);}
  .pillar-strip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;padding-block:22px;align-items:start;}
  .pillar-strip .ico{background:rgba(255,255,255,.14);}

  @media (max-width:1080px){
    .hero{min-height:auto;}
    .hero-media img{object-position:54% 8%;}
    .hero-media::after{
      background:linear-gradient(180deg,rgba(11,28,62,.1) 0%,rgba(11,28,62,.18) 22%,rgba(11,28,62,.62) 42%,rgba(11,28,62,.9) 62%,rgba(11,28,62,.96) 100%);
    }
    .hero-inner{padding-block:190px 44px;}
    .hero-copy{max-width:none;}
    .hero-marks{position:static;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;margin-top:26px;}
  }
  @media (max-width:640px){
    .hero-inner{padding-block:150px 36px;}
  }
  /* pillar-strip columns now break at 860/520, see the component block below. */
  @media (max-width:860px){ .pillar-strip .wrap{grid-template-columns:1fr 1fr;gap:20px;} }
  @media (max-width:520px){ .pillar-strip .wrap{grid-template-columns:1fr;} }

    .trust .wrap{justify-content:center;}
  
  /* ================= two room model ================= */
  .avail-grid-2{grid-template-columns:1fr 1.4fr;}
  .av-wide{display:flex;flex-direction:column;position:relative;}
  .new-flag{
    position:absolute;top:20px;right:20px;background:var(--pink);color:#fff;
    font-family:var(--mw-display);font-weight:700;font-size:11px;
    letter-spacing:.06em;text-transform:uppercase;padding:5px 12px;border-radius:999px;
  }
  @media (min-width:901px){
    .stages{grid-template-columns:1fr 1.4fr;}
    /* The second column is 1.4 times the width of the first, so to finish
       level with it its photograph has to be 1.4 times as wide for the same
       height: four by three times 1.4 is twenty eight by fifteen. Change the
       column ratio above and this has to change with it. */
    .stage:nth-child(2) .stage-photo{aspect-ratio:28/15;}
  }
  @media (max-width:900px){
    .avail-grid-2{grid-template-columns:1fr;}
  }

  
  /* ================= events and gallery page ================= */
  .events-hero{background:var(--navy);position:relative;overflow:hidden;padding-block:64px 54px;}
  .events-hero::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(60% 120% at 90% 0%,rgba(255,123,64,.24),transparent 60%),
               radial-gradient(55% 110% at 5% 100%,rgba(231,69,139,.22),transparent 60%);
  }
  .events-hero .wrap{position:relative;max-width:760px;}
  .events-hero h1{color:#fff;font-size:clamp(32px,4.4vw,48px);margin-top:12px;}
  .events-hero .lede{color:#dbe2f3;font-size:17.5px;margin-top:18px;max-width:64ch;}

  .events-page{background:var(--cream);}
  .ev-block{
    display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;
    padding-block:56px;border-bottom:1px solid var(--line);
  }
  .ev-block:last-of-type{border-bottom:0;}
  .ev-block.reverse{grid-template-columns:1fr 1.1fr;}
  .ev-block.reverse .ev-shots{order:2;}
  .ev-block.reverse .ev-copy{order:1;}
  /* Everything an event has to show, in one column beside the wording.
     One thing fills the frame. Two sit side by side, the wide one keeping
     its shape and the other matching its height. Three put the film across
     the top with the photographs underneath, which is the arrangement when
     there is a film and photographs worth seeing in their own right. */
  .ev-shots{display:grid;gap:16px;}
  .ev-shot{
    border-radius:22px;overflow:hidden;background:var(--cream-deep);
    box-shadow:0 26px 54px -28px rgba(20,49,103,.45);
  }
  .ev-shot img{width:100%;height:100%;object-fit:cover;display:block;}
  .ev-shot .video-embed{width:100%;height:100%;position:relative;border-radius:0;box-shadow:none;}
  .ev-shot .video-embed iframe{width:100%;height:100%;position:absolute;inset:0;border:0;}

  .ev-shots-1 .ev-shot{aspect-ratio:4/3;}

  .ev-shots-2{display:flex;align-items:stretch;}
  .ev-shots-2 .is-lead{flex:1.45 1 0;aspect-ratio:4/3;align-self:flex-start;}
  .ev-shots-2 .ev-shot:not(.is-lead){flex:1 1 0;position:relative;}
  .ev-shots-2 .ev-shot:not(.is-lead) img{position:absolute;inset:0;}

  .ev-shots-3{grid-template-columns:1fr 1fr;}
  .ev-shots-3 .is-lead{grid-column:1 / -1;aspect-ratio:16/9;}
  .ev-shots-3 .ev-shot:not(.is-lead){aspect-ratio:4/3;border-radius:16px;box-shadow:0 18px 38px -22px rgba(20,49,103,.4);}

  /* Enough photographs to be a gallery: one big picture and a row of
     thumbnails, any of which opens the viewer. */
  .ev-shots-many{grid-template-columns:repeat(5,1fr);gap:12px;}
  .ev-shots-many .is-lead{grid-column:1 / -1;aspect-ratio:16/9;margin-bottom:4px;}
  .ev-shots-many .ev-shot:not(.is-lead){
    aspect-ratio:1/1;border-radius:12px;box-shadow:0 10px 22px -16px rgba(20,49,103,.45);
  }
  /* Still in the viewer, just not drawn on the page. */
  .ev-shots-many .is-tucked{display:none;}
  /* A button is a button: it must not look like one. */
  button.ev-shot{
    padding:0;border:0;background:var(--cream-deep);font:inherit;color:inherit;
    cursor:pointer;display:block;position:relative;
  }
  button.ev-shot:focus-visible{outline:3px solid var(--pink);outline-offset:3px;}
  button.ev-shot img{transition:transform .35s ease;}
  button.ev-shot:hover img{transform:scale(1.04);}
  /* The shade and the number are one element rather than a pseudo element,
     because a button computes ::after and then never paints it. */
  .ev-more-count{
    position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    background:rgba(10,26,56,.66);
    color:#fff;font-family:var(--mw-display);font-size:clamp(17px,1.6vw,22px);font-weight:700;
    letter-spacing:.01em;z-index:2;transition:background .2s;
  }
  .ev-shot.has-more:hover .ev-more-count{background:rgba(10,26,56,.76);}
  /* The five thumbnails stay five across at every width rather than
     wrapping one onto a row of its own, and the last of them is the one
     carrying the "+N", so none of them can be hidden. */
  @media (max-width:560px){ .ev-shots-many{gap:8px;} }

  .ev-media-placeholder{
    display:flex;align-items:center;justify-content:center;text-align:center;
    border:2px dashed var(--line);background:var(--panel,var(--paper));
  }
  .ev-media-placeholder span{color:var(--ink-soft);font-size:14.5px;padding:24px;font-weight:600;}
  /* The films from the YouTube channel, at the foot of the Events page.
     Each one is a picture and a play button until somebody presses it. */
  .ev-films{margin-top:54px;padding-top:40px;border-top:1px solid var(--line);}
  .ev-films .section-head{margin-bottom:26px;}
  .ev-films .section-head h2{font-size:clamp(24px,2.6vw,30px);margin-top:10px;}
  .ev-films .section-head .body{margin-top:12px;color:var(--ink-soft);font-size:16px;max-width:54ch;}
  .ev-film-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 24px;}
  .ev-film .video-embed{aspect-ratio:16/9;border-radius:16px;box-shadow:0 18px 36px -24px rgba(0,0,0,.5);}
  .ev-film-name{
    margin:12px 0 0;font-weight:700;color:var(--navy);font-size:15px;line-height:1.4;
  }
  .ev-film-when{margin:3px 0 0;color:var(--ink-soft);font-size:13px;}
  @media (max-width:900px){ .ev-film-grid{grid-template-columns:1fr 1fr;gap:24px 20px;} }
  @media (max-width:560px){
    .ev-films{margin-top:38px;padding-top:30px;}
    .ev-film-grid{grid-template-columns:1fr;}
  }

  .ev-more{text-align:center;padding-block:44px 8px;color:var(--ink-soft);font-size:15px;}
  .ev-more a{color:var(--navy);font-weight:700;}

  .m.link{
    background:var(--navy);border-radius:14px;display:flex;align-items:center;justify-content:center;
  }
  .m.link a{
    color:#fff;text-decoration:none;font-family:var(--mw-display);font-weight:700;
    font-size:15px;text-align:center;padding:20px;display:flex;flex-direction:column;gap:8px;
  }
  .m.link span{color:#ffc6dd;font-weight:600;font-size:13.5px;}

  @media (max-width:860px){
    .ev-block, .ev-block.reverse{grid-template-columns:1fr;gap:22px;}
    .ev-block.reverse .ev-shots, .ev-block.reverse .ev-copy{order:0;}
  }

  
  @media (max-width:640px){
    .g-cta{flex-direction:column;align-items:flex-start;}
    .g-cta .btn{width:100%;text-align:center;}
    .hero-stats{gap:24px;}
    .hstat-fund{flex:1 1 100%;}
  }

  
  /* ================= standalone page intro bands ================= */
  .page-hero{background:var(--navy);position:relative;overflow:hidden;padding-block:64px 54px;}
  .page-hero::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(60% 120% at 90% 0%,rgba(255,123,64,.24),transparent 60%),
               radial-gradient(55% 110% at 5% 100%,rgba(231,69,139,.22),transparent 60%);
  }
  .page-hero .wrap{position:relative;max-width:760px;}
  .page-hero h1{color:#fff;font-size:clamp(32px,4.4vw,48px);margin-top:12px;}
  .page-hero .lede{color:#dbe2f3;font-size:17.5px;margin-top:18px;max-width:64ch;}

  

  /* ---------- WordPress block compatibility ---------- */
  :where(.wp-block-group, .wp-block-image, .wp-block-list, .wp-block-template-part){margin:0;}
  .wp-block-image img{display:block;}
  .blob-photo > figure, .photo-frame > figure, .stage-photo > figure,
  .g-hero > figure, .team-photo > figure, .map-card > figure{width:100%;height:100%;margin:0;}
  :where(.wp-site-blocks) > *{margin-block:0;}
  .editor-styles-wrapper .wp-block-group{max-width:none;}

  /* ---------- inner pages ---------- */
  .page-body{padding-block:56px 72px;}
  .page-body .wrap{max-width:820px;}
  .page-body h1{font-weight:800;font-size:clamp(34px,4.2vw,54px);margin-bottom:10px;}
  .page-body h2{font-size:26px;margin-top:34px;}
  .page-body h3{font-size:20px;margin-top:26px;}
  .page-body p{margin-top:14px;color:var(--ink-soft);font-size:16.5px;}
  .page-body ul,.page-body ol{margin-top:14px;color:var(--ink-soft);padding-left:22px;}
  .page-body li{margin-top:6px;}
  .page-body a{color:var(--navy);font-weight:700;}
  .page-body img{border-radius:18px;margin-top:22px;}
  .wp-block-post-template{list-style:none;padding:0;}
  .post-list{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px;}
  .post-list > li{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:24px;}
  .post-list h2{font-size:20px;}
  .post-list h2 a{text-decoration:none;}
  .post-list .date{font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-weight:700;margin-top:8px;}
  .post-list p{margin-top:10px;color:var(--ink-soft);font-size:15px;}
  .wp-block-query-pagination{margin-top:28px;display:flex;gap:14px;font-weight:700;color:var(--navy);}
  @media (max-width:900px){.post-list{grid-template-columns:1fr;}}

  /* ---------- enquiry form ---------- */
  .mw-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;}
  #mw-enquiry-error{color:#c0392b;font-weight:700;}

  /* =====================================================================
     COMPONENTS PORTED FROM THE SIGNED-OFF MOCKUP (final5.html)
     Rules below are copied from the mockup's <style> block, with its
     literal font stacks swapped for the theme's --mw-display/--mw-body
     custom properties. Anything that corrected an existing rule was
     edited in place further up the file instead of being repeated here.
     ===================================================================== */

  /* --- seven areas of learning: carousel with overlaid headings --- */
  .eyfs-carousel{position:relative;margin-top:36px;}
  .eyfs-track{
    display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
    padding:4px 2px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .eyfs-track::-webkit-scrollbar{display:none;}
  .eyfs-track:focus-visible{outline:3px solid var(--pink);outline-offset:4px;border-radius:22px;}
  .ecs{
    position:relative;margin:0;flex:0 0 clamp(236px,25vw,310px);scroll-snap-align:start;
    border-radius:22px;overflow:hidden;background:var(--navy);
    box-shadow:0 22px 44px -28px rgba(13,33,72,.6);
  }
  .ecs img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;}
  .ecs figcaption{
    position:absolute;left:0;right:0;bottom:0;padding:34px 18px 18px;
    background:linear-gradient(180deg,rgba(13,33,72,0),rgba(13,33,72,.55) 42%,rgba(13,33,72,.94));
    color:#fff;font-family:var(--mw-display);font-weight:700;
    font-size:19px;line-height:1.16;letter-spacing:-.01em;
  }
  .ecs figcaption .n{
    display:block;font-family:var(--mw-body);font-weight:700;font-size:11px;
    letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:8px;
  }
  .ecs.note{
    display:flex;flex-direction:column;justify-content:center;padding:26px;
    background:var(--pink);color:#fff;
  }
  .ecs.note strong{
    font-family:var(--mw-display);font-size:19px;display:block;margin-bottom:10px;
  }
  .ecs.note p{font-size:13.5px;line-height:1.6;color:#ffe4f0;margin:0;}
  .eyfs-nav{
    position:absolute;top:50%;transform:translateY(-50%);z-index:3;
    width:48px;height:48px;border-radius:50%;border:none;cursor:pointer;
    background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;
    box-shadow:0 10px 24px -10px rgba(13,33,72,.8);transition:background .18s ease,transform .18s ease;
  }
  .eyfs-nav svg{width:22px;height:22px;fill:currentColor;}
  .eyfs-nav:hover{background:var(--pink);}
  .eyfs-nav:disabled{opacity:.28;cursor:default;background:var(--navy);}
  .eyfs-nav.prev{left:-14px;}
  .eyfs-nav.next{right:-14px;}
  @media (max-width:860px){
    .eyfs-nav{display:none;}
    .ecs{flex-basis:78vw;}
  }

  /* footer columns collapse properly on a phone (fixes sideways scroll) */
  @media (max-width:560px){
    .footer-grid{grid-template-columns:1fr;gap:26px;}
  }

  /* hero lede accent (replaces the highlighter block) */
  .hero .lede-accent{color:var(--yellow);font-weight:700;}

  /* mission statement */
  .statement-sig{
    margin-top:22px;font-size:14.5px;font-weight:600;color:#c9d5ef;letter-spacing:.02em;
  }

  /* founder's signature */
  .founder-sign{
    margin-top:22px;font-family:var(--mw-display);font-weight:700;
    font-size:18px;color:var(--navy);line-height:1.3;
  }
  .founder-sign span{
    display:block;font-family:var(--mw-body);font-weight:600;font-size:13px;
    color:var(--ink-soft);margin-top:4px;letter-spacing:.02em;
  }

  /* testimonials carousel */
  .t-carousel{position:relative;}
  .t-track{
    display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
    padding:4px 2px 12px;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .t-track::-webkit-scrollbar{display:none;}
  .t-track:focus-visible{outline:3px solid var(--pink);outline-offset:4px;border-radius:22px;}
  .t-track .t-item{flex:0 0 clamp(280px,32vw,400px);scroll-snap-align:start;}
  .t-track .t-bubble{height:100%;}
  .t-nav{
    position:absolute;top:38%;transform:translateY(-50%);z-index:3;
    width:48px;height:48px;border-radius:50%;border:none;cursor:pointer;
    background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;
    box-shadow:0 10px 24px -10px rgba(13,33,72,.8);transition:background .18s ease;
  }
  .t-nav svg{width:22px;height:22px;fill:currentColor;}
  .t-nav:hover{background:var(--pink);}
  .t-nav:disabled{opacity:.28;cursor:default;background:var(--navy);}
  .t-nav.prev{left:-14px;}
  .t-nav.next{right:-14px;}
  @media (max-width:860px){
    .t-nav{display:none;}
    .t-track .t-item{flex-basis:80vw;}
  }

  /* accreditation row */
  .accred{background:var(--cream-deep);padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .accred-row{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;}
  .accred-item{display:flex;align-items:center;gap:14px;}
  .accred-item img{height:54px;width:auto;}
  .accred-item span{display:flex;flex-direction:column;font-size:13px;color:var(--ink-soft);line-height:1.35;}
  .accred-item span strong{font-family:var(--mw-display);font-size:15px;color:var(--navy);}
  .accred-item.score strong{
    font-family:var(--mw-display);font-weight:700;font-size:34px;color:var(--navy);line-height:1;
    /* The figure and the bit joined on to it stay together: split across two
       lines they read as two separate numbers. */
    white-space:nowrap;flex:none;
  }
  /* A live figure arrives wrapped in its own span, and the row styles every
     span as a small stacked caption, which is what shrank the number and
     dropped the /10 beneath it. */
  .accred-item.score strong span{
    display:inline;font:inherit;color:inherit;line-height:inherit;max-width:none;
  }
  .accred-item.score strong em{font-style:normal;font-size:16px;color:var(--ink-soft);}
  .accred-item.score span{font-size:13px;}

  /* A review badge in this row: the same pill as the hero and the reviews
     section. These rules only undo the row's own defaults for spans. */
  .accred-item.is-badge{gap:0;}
  .accred-item .score-badge{
    display:inline-flex;flex-direction:row;align-items:center;
    font-size:14px;color:var(--navy);line-height:1.4;
  }
  .accred-item .score-badge span{
    display:inline;flex-direction:row;font-size:inherit;color:inherit;line-height:inherit;
  }
  .accred-item .score-badge .stars{color:var(--orange);font-size:12.5px;flex:0 0 auto;}
  @media (max-width:700px){
    .accred-row{gap:20px;}
    .accred-item{flex:1 1 44%;}
  }

  /* films: a poster that opens the film, rather than a heavy embed on first paint */
  .vfacade{position:absolute;inset:0;display:block;text-decoration:none;background:var(--navy-deep);}
  .vfacade img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
  .vfacade::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,33,72,.12),rgba(13,33,72,.5));}
  .vfacade:hover img{transform:scale(1.03);}
  .vplay{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;
    width:74px;height:74px;border-radius:50%;background:rgba(255,255,255,.95);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 14px 32px -12px rgba(0,0,0,.7);transition:transform .18s ease,background .18s ease;
  }
  .vplay svg{width:28px;height:28px;fill:var(--navy);margin-left:4px;}
  .vfacade:hover .vplay{background:var(--yellow);transform:translate(-50%,-50%) scale(1.06);}
  .vchip{
    position:absolute;left:16px;bottom:16px;z-index:2;background:var(--pink);color:#fff;
    font-family:var(--mw-body);font-weight:700;font-size:12.5px;letter-spacing:.04em;
    padding:7px 14px;border-radius:999px;
  }

  /* highlighter blocks retired: emphasis is now coloured text */
  .mark,.mark-dark,.mark-warm{background-image:none;padding:0;}
  .hl-pink{color:var(--pink);font-weight:700;}
  .hl-yellow{color:var(--yellow);font-weight:700;}

  /* a card still waiting on its copy */
  .team-card.todo p em{color:var(--ink-soft);opacity:.85;}
  .team-card.todo{border-style:dashed;}


  /* always-visible call button in the header */
  .btn-call{
    background:#fff;color:var(--navy);display:inline-flex;align-items:center;gap:9px;
    font-weight:700;white-space:nowrap;
  }
  .btn-call svg{width:16px;height:16px;fill:var(--pink);flex:none;}
  .btn-call:hover{background:var(--butter);color:var(--navy);}
  @media (max-width:760px){
    .btn-call .call-num{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
    .btn-call{padding-inline:14px;}
  }


  /* questions worth asking: click to open, same behaviour as the FAQs */
  .cmp-accordion{margin-top:28px;border-top:1px solid var(--line);}
  .cmp-hint{font-size:13.5px;color:var(--ink-soft);font-weight:600;margin:14px 0 4px;}
  .cmp-item{border-bottom:1px solid var(--line);padding:16px 0;}
  .cmp-item summary{
    display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;
    list-style:none;font-family:var(--mw-display,var(--mw-display));
    font-weight:700;font-size:16.5px;color:var(--navy);
  }
  .cmp-item summary::-webkit-details-marker{display:none;}
  .cmp-item summary::after{content:"+";font-size:22px;color:var(--pink);line-height:1;flex:none;}
  .cmp-item[open] summary::after{content:"\2212";}
  .cmp-item p{margin:12px 0 0;font-size:15.5px;line-height:1.65;color:var(--ink-soft);}


  /* ---- compact layout: fewer tall stacked bands ---------------------- */
  /* the garden photo sits beside its features instead of above them */
  /* A row of the children actually out there, under the list. */
  .g-scenes{
    display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;
  }
  .g-scene{margin:0;}
  .g-scene img{
    width:100%;aspect-ratio:4/3;object-fit:cover;display:block;
    border-radius:18px;background:rgba(255,255,255,.06);
  }
  .g-scene figcaption{
    margin-top:10px;font-size:14px;color:#c3cee8;line-height:1.45;
  }
  @media (max-width:760px){
    .g-scenes{grid-template-columns:1fr 1fr;gap:14px;}
    .g-scene:nth-child(n+3){display:none;}
  }
  @media (max-width:430px){
    .g-scenes{grid-template-columns:1fr;}
    .g-scene:nth-child(n+3){display:block;}
  }


  /* the two question lists run in two columns on a desktop screen */
  @media (min-width:1000px){
    .faq-list,.cmp-accordion{
      column-count:2;column-gap:48px;
    }
    .faq-list .faq,.cmp-accordion .cmp-item{
      break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;
    }
    /* Except the homepage box, which is already one column of the layout. */
    .faq-box .faq-list{column-count:1;column-gap:0;}
    /* On the FAQs page the list really does run in two columns. It needs
       saying here because the list is a grid, and column rules have no
       effect on a grid, so the two columns above never actually happened. */
    .faq-plain .faq-list{display:block;column-count:2;column-gap:28px;}
    .faq-plain .faq-list .faq{margin-bottom:12px;}
    .cmp-hint{column-span:all;}
  }


  /* ages line in the navy pillar band */
  .pillar-ages{
    grid-column:1 / -1;margin:0 0 6px;color:#c4d2ee;font-size:14px;
    padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.16);
  }
  .pillar-ages strong{color:#fff;font-family:var(--mw-display);font-size:16px;}

  /* the FAQs sit behind a single toggle so they do not fill the page */
  .faq-reveal{margin-top:22px;}
  .faq-reveal > summary{
    display:inline-flex;align-items:center;gap:10px;cursor:pointer;list-style:none;
    background:var(--navy);color:#fff;border-radius:999px;padding:14px 26px;
    font-family:var(--mw-display);font-weight:700;font-size:15.5px;
  }
  .faq-reveal > summary::-webkit-details-marker{display:none;}
  .faq-reveal > summary::after{content:"+";font-size:20px;line-height:1;color:var(--pink);}
  .faq-reveal[open] > summary::after{content:"\2212";}
  .faq-reveal > summary:hover{background:var(--pink);}
  .faq-reveal[open] > summary{margin-bottom:8px;}


  /* ---------------------------------------------------------------------
     Block markup nests <a class="wp-element-button"> inside the styled
     wrapper, and WordPress paints that link like a button too, which shows
     up as a button-inside-a-button. Neutralise the inner link so only the
     wrapper's pill is drawn.
     ------------------------------------------------------------------- */
  .btn > .wp-block-button__link,
  .btn > .wp-element-button,
  .wp-block-button.btn > a{
    background:none !important;background-color:transparent !important;
    color:inherit !important;border:0 !important;box-shadow:none !important;
    padding:0 !important;margin:0 !important;border-radius:inherit !important;
    font:inherit !important;line-height:inherit !important;text-decoration:none !important;
    min-height:0 !important;
  }
  .wp-block-button.btn{display:inline-flex;}


  /* ---------------------------------------------------------------------
     elementor-flex-fix
     Flex items default to min-width:auto, so a column containing a wide
     image or a long word refuses to shrink and drops onto its own line,
     which turns every side-by-side row into a tall stack. Let them shrink.
     ------------------------------------------------------------------- */
  .elementor .e-con > .e-con-inner > .e-con,
  .elementor .e-con > .e-con-inner > .elementor-widget,
  .elementor .e-con > .e-con,
  .elementor .e-con > .elementor-widget{min-width:0;}
  /* Only stop overflow here. Setting height:auto as well outranked every
     sized image on the page (badges, posters, room photos) because this
     selector is more specific than the rules that size them. */
  .elementor .e-con img{max-width:100%;}
  /* Elementor spaces every widget apart; our own sections set their own
     rhythm, so stand that default down inside them. */
  .elementor .e-con .elementor-widget:not(:last-child){margin-block-end:0;}


  /* ---------------------------------------------------------------------
     elementor-hero-scrim
     In the Elementor build the hero photo is a container background, so
     there is no .hero-media element and none of the gradient above it ever
     applied. That left white text sitting on a bright photograph. Paint the
     same scrim on the container itself and lift its children above it.
     ------------------------------------------------------------------- */
  .elementor .hero{position:relative;isolation:isolate;}
  .elementor .hero::after{
    content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
    background:
      linear-gradient(90deg,rgba(11,28,62,.94) 0%,rgba(11,28,62,.88) 24%,rgba(11,28,62,.58) 38%,rgba(11,28,62,.20) 52%,rgba(11,28,62,.04) 68%,rgba(11,28,62,0) 82%),
      linear-gradient(180deg,rgba(11,28,62,.45) 0%,rgba(11,28,62,0) 26%,rgba(11,28,62,0) 62%,rgba(11,28,62,.5) 100%);
  }
  .elementor .hero > *{position:relative;z-index:1;}

  /* =====================================================================
     BLOCKS THE NURSERY BUILDS FOR ITSELF
     A small library of layouts, drawn with the same palette, spacing and
     type as the rest of the design so anything added later still looks
     like part of it. Prefixed .mwb- so they can never collide with the
     approved sections above.
     ================================================================== */
  .mwb{padding-block:58px;background:var(--cream);}
  .mwb.on-paper{background:var(--paper);}
  .mwb.on-cream-deep{background:var(--cream-deep);}
  .mwb.on-navy{background:var(--navy);color:#e9eefb;}
  .mwb.on-navy h2,.mwb.on-navy h3{color:#fff;}
  .mwb.on-navy .eyebrow{color:#ffb9d6;}
  .mwb.on-navy p{color:#c3cee8;}
  .mwb.tight{padding-block:38px;}
  .mwb.roomy{padding-block:80px;}
  .mwb h2{font-size:clamp(26px,3vw,34px);margin-top:12px;}
  .mwb h3{font-size:17px;}
  .mwb-lede{margin-top:14px;font-size:17px;color:var(--ink-soft);max-width:60ch;}
  .mwb.on-navy .mwb-lede{color:#c3cee8;}
  .mwb-body{margin-top:14px;max-width:62ch;}
  .mwb-body p{margin:0 0 12px;color:var(--ink-soft);font-size:16px;}
  .mwb.on-navy .mwb-body p{color:#c3cee8;}
  .mwb-body p:last-child{margin-bottom:0;}
  .mwb-actions{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap;}

  /* text beside a photograph */
  .mwb-split{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;}
  .mwb-split.flip .mwb-split-copy{order:2;}
  .mwb-figure img{width:100%;display:block;border-radius:22px;object-fit:cover;aspect-ratio:4/3;}
  .mwb-figure figcaption{margin-top:10px;font-size:13.5px;color:var(--ink-soft);}
  .mwb.on-navy .mwb-figure figcaption{color:#c3cee8;}

  /* a row of cards */
  .mwb-cards{margin-top:30px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  .mwb-cards.of-2{grid-template-columns:repeat(2,1fr);}
  .mwb-cards.of-4{grid-template-columns:repeat(4,1fr);}
  .mwb-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:22px;}
  .mwb.on-paper .mwb-card{background:var(--cream);}
  .mwb.on-navy .mwb-card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);}
  .mwb-card img{width:100%;display:block;border-radius:12px;object-fit:cover;aspect-ratio:16/10;margin-bottom:14px;}
  .mwb-card h3{margin:0;color:var(--navy);}
  .mwb.on-navy .mwb-card h3{color:#fff;}
  .mwb-card p{margin:8px 0 0;font-size:14.5px;color:var(--ink-soft);line-height:1.55;}
  .mwb.on-navy .mwb-card p{color:#c3cee8;}

  /* a quote */
  .mwb-quote{margin:0;text-align:center;}
  .mwb-quote p{font-family:var(--mw-display);font-weight:700;font-size:clamp(21px,2.8vw,30px);
    line-height:1.35;color:var(--navy);max-width:24ch;margin:0 auto;}
  .mwb.on-navy .mwb-quote p{color:var(--butter);}
  .mwb-quote cite{display:block;margin-top:16px;font-style:normal;font-weight:700;
    font-size:13px;letter-spacing:.04em;color:var(--ink-soft);}
  .mwb.on-navy .mwb-quote cite{color:#c3cee8;}

  /* a call to action */
  .mwb-cta{display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
    background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:26px 30px;}
  .mwb.on-navy .mwb-cta{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);}
  .mwb-cta-copy{max-width:58ch;}
  .mwb-cta-copy h2{margin-top:0;font-size:clamp(22px,2.4vw,28px);}
  .mwb-cta .mwb-actions{margin-top:0;flex:none;}

  /* a strip of photographs */
  .mwb-strip{margin-top:28px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .mwb-strip figure{margin:0;}
  .mwb-strip img{width:100%;display:block;border-radius:14px;object-fit:cover;aspect-ratio:1/1;}
  .mwb-strip figcaption{margin-top:8px;font-size:13px;color:var(--ink-soft);}
  .mwb.on-navy .mwb-strip figcaption{color:#c3cee8;}

  /* questions and answers */
  .mwb-faqs{margin-top:26px;display:grid;gap:10px;max-width:80ch;}
  .mwb-faq{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:0 18px;}
  .mwb.on-navy .mwb-faq{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);}
  .mwb-faq summary{cursor:pointer;list-style:none;padding:15px 0;font-weight:700;
    color:var(--navy);font-size:15.5px;display:flex;justify-content:space-between;gap:16px;align-items:center;}
  .mwb.on-navy .mwb-faq summary{color:#fff;}
  .mwb-faq summary::-webkit-details-marker{display:none;}
  .mwb-faq summary::after{content:"+";font-family:var(--mw-display);font-size:22px;color:var(--pink);line-height:1;}
  .mwb-faq[open] summary::after{content:"\2212";}
  .mwb-faq p{margin:0;padding:0 0 16px;color:var(--ink-soft);font-size:15px;line-height:1.6;}
  .mwb.on-navy .mwb-faq p{color:#c3cee8;}

  /* a film */
  .mwb-film{margin:26px auto 0;max-width:780px;}
  .mwb-film .video-embed{border-radius:20px;overflow:hidden;}
  .mwb-film figcaption{margin-top:12px;text-align:center;font-size:14px;color:var(--ink-soft);}
  .mwb.on-navy .mwb-film figcaption{color:#c3cee8;}

  /* a row of figures */
  .mwb-stats{margin-top:30px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
  .mwb-stat b{display:block;font-family:var(--mw-display);font-weight:700;color:var(--navy);
    font-size:clamp(28px,3.2vw,38px);line-height:1;}
  .mwb.on-navy .mwb-stat b{color:#fff;}
  .mwb-stat span{display:block;margin-top:8px;font-size:14px;color:var(--ink-soft);line-height:1.5;}
  .mwb.on-navy .mwb-stat span{color:#c3cee8;}
  .mwb-stat{border-top:3px solid var(--pink);padding-top:14px;}

  @media (max-width:980px){
    .mwb-split{grid-template-columns:1fr;gap:28px;}
    .mwb-split.flip .mwb-split-copy{order:0;}
    .mwb-cards,.mwb-cards.of-4{grid-template-columns:repeat(2,1fr);}
    .mwb-strip{grid-template-columns:repeat(3,1fr);}
    .mwb-stats{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width:620px){
    .mwb{padding-block:42px;}
    .mwb-cards,.mwb-cards.of-2,.mwb-cards.of-4{grid-template-columns:1fr;}
    .mwb-strip{grid-template-columns:repeat(2,1fr);}
    .mwb-stats{grid-template-columns:1fr;}
    .mwb-cta{padding:22px;}
  }

  /* a photograph that runs to the edge of the screen, beside the words */
  .mwb.has-bleed{padding-block:0;}
  .mwb.has-bleed .mwb-split{gap:0;align-items:stretch;}
  .mwb.has-bleed .mwb-split-copy{padding:58px 44px;display:flex;flex-direction:column;justify-content:center;}
  .mwb.has-bleed .mwb-figure{margin:0;}
  .mwb.has-bleed .mwb-figure img{border-radius:0;aspect-ratio:auto;height:100%;min-height:420px;}
  .mwb.has-bleed .mwb-figure figcaption{padding:10px 16px;}
  .mwb-figure.square img{border-radius:0;}

  /* a full width photograph, with the words over it */
  .mwb-banner{position:relative;isolation:isolate;display:flex;align-items:flex-end;
    min-height:clamp(300px,44vw,540px);overflow:hidden;}
  .mwb-banner > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;}
  .mwb-banner::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:linear-gradient(180deg,rgba(11,28,62,0) 30%,rgba(11,28,62,.55) 66%,rgba(11,28,62,.92) 100%);}
  .mwb-banner.centre{align-items:center;text-align:center;}
  .mwb-banner-copy{position:relative;width:100%;padding:44px 0 40px;color:#fff;}
  .mwb-banner-copy h2{color:#fff;max-width:22ch;font-size:clamp(28px,4vw,46px);}
  .mwb-banner.centre .mwb-banner-copy h2{margin-inline:auto;}
  .mwb-banner-copy .eyebrow{color:#ffb9d6;}
  .mwb-banner-copy p{color:#e3e9f7;max-width:52ch;margin-top:12px;font-size:17px;}
  .mwb-banner.centre .mwb-banner-copy p{margin-inline:auto;}
  .mwb-banner .mwb-actions{margin-top:22px;}
  .mwb-banner.centre .mwb-actions{justify-content:center;}

  @media (max-width:980px){
    .mwb.has-bleed{padding-block:0;}
    .mwb.has-bleed .mwb-split-copy{padding:38px 20px;}
    .mwb.has-bleed .mwb-figure img{min-height:280px;}
  }

  /* =====================================================================
     GALLERY
     Photographs and films in one grid. Press anything to open it large.
     ================================================================== */
  .mwg{margin-top:30px;}

  .mwg-grid{display:grid;gap:14px;}
  .mwg-grid.mosaic{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
    grid-auto-rows:185px;grid-auto-flow:dense;}
  .mwg-grid.even{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));}
  .mwg-grid.strip{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
  .mwg-grid.strip .mwg-item{flex:0 0 300px;scroll-snap-align:start;}

  .mwg-item{position:relative;margin:0;min-width:0;}
  .mwg-grid.mosaic .mwg-item.wide{grid-column:span 2;}
  .mwg-grid.mosaic .mwg-item.tall{grid-row:span 2;}
  .mwg-grid.mosaic .mwg-item.big{grid-column:span 2;grid-row:span 2;}

  .mwg-open{display:block;width:100%;height:100%;padding:0;border:0;background:var(--navy-deep);
    border-radius:16px;overflow:hidden;cursor:pointer;position:relative;
    transition:transform .18s ease, box-shadow .18s ease;}
  .mwg-open:hover,.mwg-open:focus-visible{transform:translateY(-3px);
    box-shadow:0 16px 30px -18px rgba(13,33,72,.6);}
  .mwg-open:focus-visible{outline:3px solid var(--pink);outline-offset:3px;}
  .mwg-open img{width:100%;height:100%;display:block;object-fit:cover;}
  .mwg-grid.even .mwg-open img,.mwg-grid.strip .mwg-open img{aspect-ratio:4/3;}
  .mwg-grid.mosaic .mwg-open{height:100%;}

  /* the darkening and the play mark on a film */
  .mwg-open::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(13,33,72,0) 55%,rgba(13,33,72,.6));
    opacity:0;transition:opacity .18s ease;}
  .mwg-open:hover::after,.mwg-open:focus-visible::after{opacity:1;}
  .mwg-item.is-film .mwg-open::after{opacity:1;}
  .mwg-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.94);
    display:flex;align-items:center;justify-content:center;pointer-events:none;
    box-shadow:0 10px 24px -10px rgba(13,33,72,.7);}
  .mwg-play svg{width:26px;height:26px;fill:var(--navy);margin-left:3px;}
  .mwg-tag{position:absolute;left:12px;top:12px;z-index:2;background:var(--pink);color:#fff;
    font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase;
    padding:4px 10px;border-radius:999px;pointer-events:none;}
  .mwg-item figcaption{margin-top:8px;font-size:13.5px;color:var(--ink-soft);line-height:1.45;}
  .mwb.on-navy .mwg-item figcaption{color:#c3cee8;}
  .mwg-grid.mosaic .mwg-item figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;
    padding:26px 14px 12px;color:#fff;font-weight:600;pointer-events:none;
    background:linear-gradient(180deg,rgba(13,33,72,0),rgba(13,33,72,.88));
    border-radius:0 0 16px 16px;}

  /* the large view */
  .mwg-box{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;
    background:rgba(9,22,50,.95);padding:56px 20px;}
  .mwg-box.is-open{display:flex;}
  body.mwg-locked{overflow:hidden;}
  .mwg-stage{max-width:1100px;width:100%;max-height:100%;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:14px;}
  .mwg-stage img,.mwg-stage video{max-width:100%;max-height:74vh;border-radius:14px;display:block;}
  .mwg-frame{width:100%;aspect-ratio:16/9;max-height:74vh;border:0;border-radius:14px;background:#000;}
  .mwg-cap{color:#dbe3f6;font-size:14.5px;text-align:center;max-width:70ch;}
  .mwg-count{color:#8fa4cf;font-size:12.5px;letter-spacing:.06em;}
  .mwg-btn{position:absolute;border:0;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;
    width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    transition:background .15s ease;}
  .mwg-btn:hover,.mwg-btn:focus-visible{background:var(--pink);}
  .mwg-btn:focus-visible{outline:3px solid #fff;outline-offset:2px;}
  .mwg-btn svg{width:22px;height:22px;fill:#fff;}
  .mwg-close{top:14px;right:16px;}
  .mwg-prev{left:16px;top:50%;transform:translateY(-50%);}
  .mwg-next{right:16px;top:50%;transform:translateY(-50%);}
  .mwg-btn[hidden]{display:none;}

  @media (max-width:980px){
    .mwg-grid.mosaic{grid-auto-rows:160px;}
    .mwg-grid.mosaic .mwg-item.big{grid-row:span 2;}
  }
  @media (max-width:620px){
    .mwg-grid.mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:135px;gap:10px;}
    .mwg-grid.mosaic .mwg-item.wide,.mwg-grid.mosaic .mwg-item.big{grid-column:span 2;}
    .mwg-grid.even{grid-template-columns:repeat(2,1fr);gap:10px;}
    .mwg-play{width:46px;height:46px;}
    .mwg-play svg{width:20px;height:20px;}
    .mwg-box{padding:64px 12px;}
    .mwg-btn{width:40px;height:40px;}
  }
  @media (prefers-reduced-motion:reduce){
    .mwg-open,.mwg-open::after{transition:none;}
    .mwg-open:hover,.mwg-open:focus-visible{transform:none;}
  }

  /* ---------- the thin bar, on a small screen ---------- */
  /* It used to disappear below 900px, taking its wording with it. Now it
     stays and shortens: the social buttons are in the menu and the footer
     on a phone, so only the wording is needed up here. */
  @media (max-width:1080px){
    .strip-inner{justify-content:center;}
  }
  @media (max-width:900px){
    .strip-trust{font-size:12px;letter-spacing:.03em;text-align:center;}
    .strip-inner{padding-block:8px;}
  }
  @media (max-width:620px){
    .strip-trust.has-short .strip-long{display:none;}
    .strip-trust.has-short .strip-short{display:inline;}
    .strip-trust{font-size:11.5px;}
    .strip-inner{padding-block:7px;}
  }

  /* ---------- parent films, side by side ---------- */
  .t-films{position:relative;margin-top:26px;}
  .t-films-track{display:flex;align-items:flex-start;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;
    padding-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .t-films-track::-webkit-scrollbar{display:none;}
  .t-films-track.is-one{overflow:visible;}
  .t-film{flex:0 0 min(560px,82vw);margin:0;scroll-snap-align:start;}
  .t-films-track.is-one .t-film{flex:1 1 auto;max-width:100%;}
  .t-film .mwg-open{width:100%;height:auto;border-radius:20px;}
  .t-film .mwg-open img{aspect-ratio:16/9;}
  .t-film .mwg-open::after{opacity:1;}
  .t-film figcaption{margin-top:12px;}
  .t-film figcaption strong{display:block;font-family:var(--mw-display);font-size:17px;color:var(--navy);}
  .t-film figcaption span{display:block;margin-top:4px;font-size:14.5px;color:var(--ink-soft);}

  .t-films-nav{
    position:absolute;top:calc(50% - 44px);transform:translateY(-50%);z-index:3;
    width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;
    background:var(--navy);display:flex;align-items:center;justify-content:center;
    box-shadow:0 10px 24px -12px rgba(13,33,72,.8);transition:background .15s ease,opacity .15s ease;
  }
  .t-films-nav svg{width:22px;height:22px;fill:#fff;}
  .t-films-nav:hover:not(:disabled){background:var(--pink);}
  .t-films-nav:focus-visible{outline:3px solid var(--pink);outline-offset:3px;}
  .t-films-nav:disabled{opacity:.25;cursor:default;}
  .t-films-nav.prev{left:-18px;}
  .t-films-nav.next{right:-18px;}

  @media (max-width:1240px){
    .t-films-nav.prev{left:6px;}
    .t-films-nav.next{right:6px;}
  }
  @media (max-width:620px){
    .t-films{margin-top:20px;}
    .t-film{flex:0 0 86vw;}
    .t-films-nav{display:none;}
  }

  /* ---------- the Parenta enquiry form, inside our card ---------- */
  /* No border and the card's own background, because Parenta cannot tell the
     page how tall their form is. Set the height a touch generously and the
     spare space at the bottom reads as padding rather than a gap. */
  .parenta-frame{
    margin-top:14px;border:1px solid var(--line);border-radius:14px;overflow:hidden;
    background:var(--paper);
  }
  .parenta-frame iframe{display:block;width:100%;height:100%;border:0;}
  .parenta-frame[hidden]{display:none;}
  .enquire-card .parenta-frame{margin-inline:-4px;}

  /* the closed state: a line and a button, nothing more, so the band keeps
     the height it was designed at until somebody wants the form */
  .parenta-start{margin-top:18px;}
  .parenta-start[hidden]{display:none;}
  .parenta-start .fine{margin:0 0 12px;text-align:center;}
  .parenta-start .btn{margin-top:0;}

  @media (max-width:620px){
    .parenta-frame{border-radius:12px;}
  }

  /* ---------- the footer address, as a link to the map ---------- */
  footer.site .addr-link a{
    display:block;color:#c3cee8;text-decoration:none;line-height:1.7;
    border-radius:10px;margin-left:-8px;padding:6px 8px;
    transition:background .15s ease,color .15s ease;
  }
  footer.site .addr-link a:hover,footer.site .addr-link a:focus-visible{
    background:rgba(255,255,255,.07);color:#fff;
  }
  footer.site .addr-link a:focus-visible{outline:2px solid var(--pink);outline-offset:2px;}
  .addr-pin{
    display:inline-flex;align-items:center;gap:5px;margin-top:6px;
    font-size:12.5px;font-weight:700;color:var(--pink);letter-spacing:.02em;
  }
  .addr-pin svg{width:13px;height:13px;fill:currentColor;flex:none;}
  footer.site .addr-link a:hover .addr-pin{color:#ffb9d6;}

  /* ---------- the hero, fading between photographs ---------- */
  /* With one photograph nothing here applies and the hero is unchanged. */
  .hero-media.has-slides img{
    position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease-in-out;
  }
  .hero-media.has-slides img.is-on{opacity:1;}
  @media (prefers-reduced-motion:reduce){
    /* Somebody who has asked for less movement gets the first photograph
       and nothing else. */
    .hero-media.has-slides img{transition:none;}
    .hero-media.has-slides img:not(.is-on){display:none;}
  }

  /* ---------- the thank you, after the short enquiry form ---------- */
  .thankyou .thanks-note{
    margin-top:10px;font-size:13px;color:var(--ink-soft);line-height:1.55;
  }

  /* ---------- the enquiry form, in a window over the page ---------- */
  .mw-form-box{
    position:fixed;inset:0;z-index:9998;display:none;align-items:center;justify-content:center;
    background:rgba(9,22,50,.93);padding:24px 16px;
  }
  .mw-form-box.is-open{display:flex;}
  .mw-form-panel{
    width:min(720px,100%);height:min(860px,92vh);display:flex;flex-direction:column;
    background:var(--paper);border-radius:20px;overflow:hidden;
    box-shadow:0 40px 90px -30px rgba(0,0,0,.7);
  }
  .mw-form-bar{
    flex:none;display:flex;align-items:center;justify-content:space-between;gap:14px;
    padding:14px 18px;background:var(--navy);color:#fff;
  }
  .mw-form-title{font-family:var(--mw-display);font-weight:700;font-size:16px;}
  .mw-form-close{
    flex:none;width:34px;height:34px;border:0;border-radius:50%;cursor:pointer;
    background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;
    transition:background .15s ease;
  }
  .mw-form-close svg{width:18px;height:18px;fill:#fff;}
  .mw-form-close:hover{background:var(--pink);}
  .mw-form-close:focus-visible{outline:3px solid var(--pink);outline-offset:2px;}
  /* The form scrolls here, exactly as a page does. Nothing is cropped, so
     nothing can end up out of reach. */
  .mw-form-body{flex:1 1 auto;min-height:0;}
  .mw-form-body iframe{display:block;width:100%;height:100%;border:0;}

  @media (max-width:620px){
    .mw-form-box{padding:0;}
    .mw-form-panel{width:100%;height:100%;border-radius:0;}
  }

  /* ================= a second copy of one of the designs ================= */
  /* A copy starts blank, so anything still empty simply takes no room
     instead of leaving a gap where a heading would have been. */
  .mw-copy h1:empty,
  .mw-copy h2:empty,
  .mw-copy h3:empty,
  .mw-copy h4:empty,
  .mw-copy p:empty,
  .mw-copy figcaption:empty,
  .mw-copy .eyebrow:empty,
  .mw-copy .lede:empty{display:none;}

  /* ================= meals and the week's menu ================= */
  .screen-reader-text{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap;border:0;
  }

  .meals{background:var(--paper);padding-block:60px;}
  .meals-head{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:start;}
  .meals h2{font-size:clamp(26px,3vw,34px);margin-top:12px;}
  .meals-body{margin-top:16px;color:var(--ink-soft);font-size:16.5px;max-width:56ch;}
  .meals-points{margin-top:20px;}

  /* The inspected rating, given the weight it deserves. */
  .hygiene{
    display:flex;align-items:center;gap:14px;background:var(--cream);
    border:1px solid var(--line);border-radius:18px;padding:20px 22px;
  }
  .hygiene-plate{
    flex:none;width:60px;height:60px;border-radius:12px;
    background:linear-gradient(180deg,#2f9e63,#1f7c4b);color:#fff;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    box-shadow:0 12px 24px -14px rgba(20,60,40,.9);
  }
  .hygiene-plate b{font-family:var(--mw-display);font-weight:700;font-size:26px;line-height:1;}
  .hygiene-plate span{
    font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-top:3px;
  }
  .hygiene-text{display:flex;flex-direction:column;gap:5px;}
  .hygiene-text b{font-family:var(--mw-display);font-size:16.5px;color:var(--navy);line-height:1.25;}
  .hygiene-text span{font-size:13.5px;color:var(--ink-soft);line-height:1.4;}

  /* The week on a plate. */
  .menu-block{margin-top:44px;}
  .menu-head h3{font-size:clamp(20px,2.2vw,25px);}
  .menu-head p{margin-top:8px;color:var(--ink-soft);font-size:15px;}
  .menu-scroll{margin-top:20px;overflow-x:auto;-webkit-overflow-scrolling:touch;}

  /* Two weeks, one table at a time. Radio buttons rather than script, so
     the tabs work whatever else the page is doing. */
  .menu-weeks{margin-top:18px;}
  .menu-week-pick{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none;}
  .menu-tabs{
    display:inline-flex;gap:4px;padding:4px;background:var(--cream-deep);
    border:1px solid var(--line);border-radius:999px;
  }
  .menu-tabs label{
    display:inline-block;padding:8px 20px;border-radius:999px;cursor:pointer;
    font-family:var(--mw-display);font-weight:700;font-size:14px;color:var(--ink-soft);
    transition:background .15s ease, color .15s ease;white-space:nowrap;
  }
  .menu-tabs label:hover{color:var(--navy);}
  /* One square, both menus in it, so the block is as tall as the taller of
     the two and nothing below it moves when you switch. */
  .menu-stack{display:grid;}
  .menu-stack > .menu-week{grid-area:1 / 1;visibility:hidden;}
  .menu-weeks > .menu-week-pick:nth-of-type(1):checked ~ .menu-stack > .menu-week[data-week="1"],
  .menu-weeks > .menu-week-pick:nth-of-type(2):checked ~ .menu-stack > .menu-week[data-week="2"]{visibility:visible;}
  .menu-weeks > .menu-week-pick:nth-of-type(1):checked ~ .menu-tabs label:nth-of-type(1),
  .menu-weeks > .menu-week-pick:nth-of-type(2):checked ~ .menu-tabs label:nth-of-type(2){
    background:var(--navy);color:#fff;
  }
  .menu-week-pick:focus-visible ~ .menu-tabs{outline:3px solid var(--pink);outline-offset:3px;}
  .menu-block.has-weeks .menu-scroll{margin-top:16px;}
  .menu-table{
    /* Fixed, so both menus share one set of column widths and the table
       does not jump about when you switch between them. */
    table-layout:fixed;
    width:100%;border-collapse:separate;border-spacing:0;min-width:860px;
    background:var(--cream);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  }
  .menu-table thead th:first-child{width:128px;}
  .menu-table th,
  .menu-table td{
    text-align:left;vertical-align:top;padding:14px 16px;
    border-bottom:1px solid var(--line);border-right:1px solid var(--line);
  }
  .menu-table thead th{
    background:var(--navy);color:#fff;font-family:var(--mw-display);font-weight:700;
    font-size:14.5px;letter-spacing:.02em;border-bottom:0;
  }
  .menu-table tbody tr:last-child th,
  .menu-table tbody tr:last-child td{border-bottom:0;}
  .menu-table th:last-child,
  .menu-table td:last-child{border-right:0;}
  .menu-table tbody th{
    background:var(--cream-deep);vertical-align:middle;
  }
  .menu-table tbody th b{
    display:block;font-family:var(--mw-display);font-size:15.5px;color:var(--navy);line-height:1.3;
  }
  .menu-table tbody th span{
    display:block;margin-top:5px;font-size:11.5px;color:var(--ink-soft);
    font-weight:600;line-height:1.35;
  }
  /* A quiet stripe so the eye keeps its place across five days. */
  .menu-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.5);}
  .menu-dish{display:block;font-size:14px;color:var(--ink);line-height:1.4;}
  .menu-dish + .menu-dish{margin-top:3px;}
  /* Present, findable, but standing back so the food reads first. */
  .menu-allergens{
    display:block;margin-top:9px;font-size:11px;font-weight:600;letter-spacing:.07em;
    color:#8a857c;text-transform:uppercase;
  }
  .menu-all{background:rgba(255,255,255,.55);}
  .menu-foot{margin-top:14px;font-size:13.5px;color:var(--ink-soft);}
  .menu-foot b{color:var(--navy);}

  .meals-days{
    margin-top:38px;background:var(--butter);border:1px solid #e9d9a5;
    border-radius:18px;padding:24px 26px;
  }
  .meals-days h3{font-size:19px;color:var(--navy);}
  .meals-days p{margin-top:8px;font-size:15.5px;color:var(--ink);max-width:76ch;line-height:1.6;}
  .meals-foot{margin-top:22px;}

  @media (max-width:900px){
    .meals-head{grid-template-columns:1fr;gap:26px;}
    .hygiene{max-width:420px;}
  }
  @media (max-width:560px){
    .menu-table{min-width:700px;}
    .menu-table thead th:first-child{width:104px;}
    .menu-table th,
    .menu-table td{padding:12px 13px;}
  }

  .dl-more{margin-top:16px;font-size:14.5px;}
  .dl-more a{color:var(--navy);font-weight:700;text-underline-offset:3px;}

  /* Said out loud when there is genuinely nothing to list, so the box is
     never just an empty shape on the page. */
  .pol-none{margin:0;color:var(--ink-soft);font-size:15.5px;line-height:1.55;max-width:46ch;}
  .pol-none-call{margin-top:14px;}
  .pol-none-call a{color:var(--navy);font-weight:700;text-underline-offset:3px;}
  .pol-archive .pol-none{font-size:16.5px;max-width:56ch;margin-top:26px;}
  .pol-archive .pol-none-call a{text-decoration:none;}

  /* ================= the policy archive ================= */
  .pol-archive{background:var(--cream);padding-block:56px 64px;}
  .pol-group{margin-top:34px;}
  .pol-group-name{
    display:flex;align-items:center;gap:10px;font-size:18px;color:var(--navy);
    padding-bottom:10px;border-bottom:2px solid var(--line);
  }
  .pol-group-name span{
    font-family:var(--mw-body);font-size:12px;font-weight:700;color:var(--ink-soft);
    background:var(--cream-deep);border-radius:999px;padding:3px 9px;
  }
  .pol-list{list-style:none;margin:0;padding:0;}
  .pol-list li{border-bottom:1px solid var(--line);}

  /* Read like a contents page rather than one long column. Eighty two
     policies down a single list is a very long scroll for somebody who
     only wants the one about allergies. */
  .pol-cols{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
    column-gap:30px;
  }
  /* In two columns there is not the width to put the review date beside
     the name as well, so it drops underneath and the name gets the lot. */
  .pol-cols .pol-row{
    grid-template-columns:1fr;padding:11px 10px;gap:3px;
  }
  .pol-cols .pol-name{font-size:14.5px;}
  .pol-cols .pol-meta{
    grid-column:1;grid-row:auto;justify-content:flex-start;gap:8px;
  }
  .pol-cols .pol-pdf{font-size:10px;padding:2px 6px;}
  .pol-cols .pol-when{font-size:12px;}

  /* The search box */
  /* The homepage box: headings that fold open. */
  .pol-box .pol-find-sm{margin:0 0 14px;max-width:none;}
  .pol-box .pol-find-sm input{font-size:15px;padding:11px 14px;}
  .pol-fold{border-bottom:1px solid rgba(20,49,103,.12);}
  .pol-fold:last-of-type{border-bottom:0;}
  .pol-fold > summary{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:14px 0;cursor:pointer;list-style:none;font-weight:700;
    font-size:15px;color:var(--navy);
  }
  .pol-fold > summary::-webkit-details-marker{display:none;}
  .pol-fold-name{display:flex;align-items:center;gap:9px;}
  .pol-fold-name::before{
    content:"";width:8px;height:8px;flex:0 0 8px;border-right:2px solid var(--pink);
    border-bottom:2px solid var(--pink);transform:rotate(-45deg);
    transition:transform .2s ease;
  }
  .pol-fold[open] > summary .pol-fold-name::before{transform:rotate(45deg);}
  .pol-fold-count{
    font-size:11.5px;font-weight:700;color:var(--ink-soft);
    background:var(--paper);border-radius:999px;padding:3px 9px;
  }
  .pol-fold > summary:hover .pol-fold-name{color:var(--pink);}
  .pol-fold-list{list-style:none;margin:0 0 12px;padding:0 0 0 17px;}
  .pol-fold-list .dl{padding:10px 0;font-size:14px;}
  .pol-fold-list li[hidden]{display:none;}
  .pol-fold[hidden]{display:none;}
  .pol-loose[hidden]{display:none;}
  .pol-loose > div[hidden]{display:none;}
  .pol-loose > div:first-child .dl{border-top:1px solid rgba(20,49,103,.12);}
  .screen-reader-text{
    position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
    white-space:nowrap;
  }

  .pol-find{margin-top:30px;max-width:560px;}
  .pol-find label{
    display:block;font-size:12px;font-weight:700;text-transform:uppercase;
    letter-spacing:.09em;color:var(--ink-soft);margin-bottom:8px;
  }
  .pol-find input{
    width:100%;font:inherit;font-size:16px;padding:13px 16px;border-radius:12px;
    border:2px solid var(--line);background:#fff;color:var(--ink);
  }
  .pol-find input:focus{outline:none;border-color:var(--pink);}
  .pol-found{margin:9px 0 0;font-size:13.5px;color:var(--ink-soft);min-height:1.2em;}
  .pol-group[hidden]{display:none;}
  .pol-list li[hidden]{display:none;}
  .pol-row{
    display:grid;grid-template-columns:1fr auto;gap:4px 18px;align-items:center;
    padding:15px 14px;text-decoration:none;border-radius:12px;
    transition:background .15s ease;
  }
  a.pol-row:hover{background:var(--paper);}
  .pol-name{font-weight:700;font-size:15.5px;color:var(--navy);}
  a.pol-row:hover .pol-name{text-decoration:underline;text-underline-offset:3px;}
  .pol-what{grid-column:1;font-size:13.5px;color:var(--ink-soft);line-height:1.45;}
  .pol-meta{
    grid-column:2;grid-row:1 / span 2;display:flex;align-items:center;gap:10px;
    flex-wrap:wrap;justify-content:flex-end;
  }
  .pol-when{font-size:12.5px;color:var(--ink-soft);white-space:nowrap;}
  .pol-pdf{
    font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--navy);
    background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:3px 8px;
  }
  span.pol-row{cursor:default;}
  span.pol-row .pol-name{color:var(--ink);}

  .pol-ask{
    margin-top:40px;background:var(--navy);color:#fff;border-radius:20px;padding:28px 30px;
  }
  .pol-ask h3{color:#fff;font-size:20px;}
  .pol-ask p{margin-top:8px;color:#dbe3f4;font-size:15.5px;max-width:62ch;}
  .pol-ask-call{margin-top:16px;}

  @media (max-width:560px){
    .pol-row{grid-template-columns:1fr;}
    .pol-meta{grid-column:1;grid-row:auto;justify-content:flex-start;margin-top:6px;}
  }

  /* ================= the newsletter archive ================= */
  .news-archive{background:var(--paper);padding-block:56px 64px;}
  .nl-year{margin-top:24px;border-top:2px solid var(--line);}
  .nl-year summary{
    display:flex;align-items:center;gap:14px;padding:16px 4px;cursor:pointer;
    list-style:none;user-select:none;
  }
  .nl-year summary::-webkit-details-marker{display:none;}
  .nl-year summary:focus-visible{outline:2px solid var(--pink);outline-offset:2px;border-radius:8px;}
  .nl-year-name{font-family:var(--mw-display);font-weight:700;font-size:24px;color:var(--navy);}
  .nl-year-mark{
    margin-left:auto;width:11px;height:11px;flex:none;
    border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);
    transform:rotate(45deg);transition:transform .18s ease;
  }
  .nl-year[open] .nl-year-mark{transform:rotate(-135deg);}

  .nl-grid{
    list-style:none;margin:6px 0 30px;padding:0;
    display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:26px 22px;
  }
  /* Giving the direct child of a details its own display stops the browser
     folding it away, so a closed year is hidden here instead. */
  .nl-year:not([open]) .nl-grid{display:none;}
  .nl-card{display:block;text-decoration:none;}
  .nl-cover{
    display:block;aspect-ratio:1 / 1.414;border-radius:12px;overflow:hidden;
    background:var(--cream-deep);border:1px solid var(--line);
    box-shadow:0 16px 30px -22px rgba(20,49,103,.85);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  /* The crop is taken around whatever was marked in the back end, so a face
     is never the thing that gets cut off. */
  .nl-cover img{
    width:100%;height:100%;object-fit:cover;display:block;
    object-position:var(--nl-spot,50% 30%);
  }
  a.nl-card:hover .nl-cover{transform:translateY(-4px);box-shadow:0 22px 38px -20px rgba(20,49,103,.75);}
  .nl-cover-plain{
    display:flex;align-items:flex-end;padding:16px;
    background:linear-gradient(160deg,var(--cream),var(--cream-deep));
  }

  /* The shading behind the writing, fading in from the foot so the top of
     the photograph is left alone. Which colour is chosen on the admin. */
  .nl-shade{
    position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(to top,
      rgba(13,33,72,.88) 0%, rgba(13,33,72,.62) 34%, rgba(13,33,72,.12) 62%, rgba(13,33,72,0) 84%);
  }
  [data-shade="black"] .nl-shade{
    background:linear-gradient(to top,
      rgba(0,0,0,.86) 0%, rgba(0,0,0,.58) 34%, rgba(0,0,0,.12) 62%, rgba(0,0,0,0) 84%);
  }
  [data-shade="white"] .nl-shade{
    background:linear-gradient(to top,
      rgba(255,253,249,.96) 0%, rgba(255,253,249,.78) 34%, rgba(255,253,249,.2) 62%, rgba(255,253,249,0) 84%);
  }
  [data-shade="none"] .nl-shade{display:none;}

  /* The month above the year, over the picture. */
  .nl-cover{position:relative;}
  .nl-when{
    position:absolute;left:0;right:0;bottom:0;z-index:2;
    display:flex;flex-direction:column;gap:1px;padding:14px 15px 15px;
    font-family:var(--mw-display);color:#fff;
    text-shadow:0 1px 10px rgba(13,33,72,.5);
  }
  .nl-when b{font-weight:700;font-size:17.5px;line-height:1.15;letter-spacing:-.01em;}
  .nl-when i{font-style:normal;font-weight:600;font-size:14px;opacity:.88;}
  [data-shade="white"] .nl-when{color:var(--navy);text-shadow:none;}
  /* Underneath the picture, when there is no shading to sit on. */
  .nl-text .nl-when{
    position:static;padding:0;color:var(--navy);text-shadow:none;
  }
  .nl-text .nl-when b{font-size:15.5px;}
  .nl-text .nl-when i{opacity:1;color:var(--ink-soft);font-size:13px;}
  /* The card without a photograph keeps the writing in navy on cream. */
  .nl-cover-plain .nl-when{color:var(--navy);text-shadow:none;}

  .nl-text{display:flex;flex-direction:column;gap:2px;margin-top:9px;}
  .nl-kind{font-size:12.5px;color:var(--ink-soft);}
  a.nl-card:hover .nl-when b{text-decoration:underline;text-underline-offset:3px;}

  .nl-foot{
    margin-top:14px;background:var(--butter);border:1px solid #e9d9a5;
    border-radius:20px;padding:26px 28px;
  }
  .nl-foot h3{font-size:20px;color:var(--navy);}
  .nl-foot p{margin-top:8px;font-size:15.5px;color:var(--ink);max-width:64ch;}

  @media (max-width:560px){
    .nl-grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:20px 16px;}
    .nl-year-name{font-size:20px;}
  }

/* The vegetarian choice, shown as an alternative to the dish above it
   rather than as another course. */
.menu-veg{color:var(--ink-soft);}
.menu-veg::before{
  content:"or ";font-weight:700;color:var(--pink);
}
.menu-veg::after{
  content:"\00a0(v)";font-size:11px;font-weight:700;letter-spacing:.04em;
  color:var(--pink);text-transform:uppercase;
}

/* The daynurseries.co.uk review carousel sits in our page rather than in a
   frame, so its boxes can be softened to match the rest of the section.
   The script above does the work; this catches the plain cases without
   waiting for it, so there is no red flash while the page settles. */
.t-live-reviews [style*="border"],
.t-live-reviews [class*="review"],
.t-live-reviews [class*="Review"]{
  border-color:var(--line) !important;
}
.t-live-reviews [class*="review"]{border-radius:12px;}

  /* A section standing in as the page's main heading. Written as an h1 but
     set exactly like the h2 it replaces, so nothing moves on the page. */
  .section-head h1,
  .page-body .section-head h1{
    font-family:var(--mw-display);font-weight:700;letter-spacing:-.018em;
    font-size:clamp(32px,4.2vw,52px);line-height:1.04;
    margin:12px 0 0;color:var(--navy);text-wrap:balance;
  }
  .fees .section-head h1,
  .gallery .section-head h1{color:#fff;}

  /* --- Social feed ---------------------------------------------------
     The slideshow itself is the garden's, so only what is different
     about this section is set here. */
  .social{background:var(--cream-deep);padding-block:54px 58px;}
  .social .section-head{max-width:620px;margin-bottom:30px;}
  .social .section-head .body{margin-top:12px;}
  .soc-slider{box-shadow:0 18px 44px rgba(12,28,62,.14);}
  /* The garden's own rule carries its name, so the picture inside this one
     needs telling to fill its frame as well, or it sits at whatever size it
     came out of Facebook and leaves a gap beside it. */
  .social .g-slider .g-slide img{
    width:100%;aspect-ratio:16/9;object-fit:cover;display:block;margin:0;border-radius:0;
  }

  /* --- The rail -------------------------------------------------------
     One large post with the next one coming in at the edge, so it reads as
     a row of posts you are part way along rather than a box with a gap in
     it. The posts out of frame are dimmed down. */
  .soc-rail{position:relative;}
  .soc-window{overflow:hidden;border-radius:22px;}
  .soc-track{
    display:flex;gap:18px;
    transition:transform .55s cubic-bezier(.4,0,.2,1);will-change:transform;
  }
  /* Every post keeps its own shape. The height is the same all the way
     along, so the row sits steady, and the width follows whatever came off
     the camera: a portrait one is narrow, a landscape one is wide, and
     nobody loses the top of their head to a crop. The shape itself is
     written onto each one as it is drawn. */
  .soc-cell{
    flex:0 0 auto;margin:0;position:relative;overflow:hidden;border-radius:22px;
    height:clamp(340px,44vw,560px);max-width:min(92%,980px);aspect-ratio:4/3;
    background:var(--navy);opacity:.45;transition:opacity .45s ease;
  }
  .soc-cell.is-on{opacity:1;}
  .soc-cell img{
    width:100%;height:100%;object-fit:cover;display:block;margin:0;border-radius:0;
  }
  .soc-cell::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:62%;
    background:linear-gradient(to top,rgba(6,17,42,.95),rgba(6,17,42,.66) 38%,rgba(6,17,42,0));
    pointer-events:none;
  }
  .soc-cell figcaption{
    position:absolute;left:28px;right:28px;bottom:26px;z-index:2;margin:0;
    font-size:16.5px;line-height:1.5;color:#eef2fc;max-width:52ch;
    text-shadow:0 1px 14px rgba(5,15,38,.55);
  }
  .social[data-shade="black"] .soc-cell::after{
    background:linear-gradient(to top,rgba(0,0,0,.94),rgba(0,0,0,.62) 38%,rgba(0,0,0,0));
  }
  .social[data-shade="none"] .soc-cell::after{display:none;}
  .social[data-shade="none"] .soc-cell figcaption{
    position:static;margin-top:14px;max-width:none;color:var(--ink-soft);text-shadow:none;
  }
  .social[data-shade="none"] .soc-cell{background:transparent;}
  /* Underneath rather than over the picture, since the wording is already
     along the bottom of it. */
  .soc-rail .g-dots{
    position:static;margin:16px auto 0;width:max-content;
    background:rgba(12,28,62,.07);backdrop-filter:none;
  }
  .soc-rail .g-dot{background:rgba(12,28,62,.28);}
  .soc-rail .g-dot.is-on{background:var(--pink);}
  .soc-rail .g-arrow{top:40%;}

  @media (prefers-reduced-motion:reduce){
    .soc-track{transition:none;}
    .soc-cell{opacity:1;}
  }
  .soc-open{display:block;text-decoration:none;color:inherit;}
  .soc-open:focus-visible{outline:3px solid var(--pink);outline-offset:-3px;}
  .social .g-slide figcaption{
    left:30px;right:30px;bottom:26px;font-size:16.5px;line-height:1.5;
    max-width:62ch;color:#eef2fc;
  }
  .soc-when{
    display:block;margin-bottom:7px;font-size:11.5px;font-weight:700;
    text-transform:uppercase;letter-spacing:.09em;color:#ffb9d6;
  }

  /* Black shading, and none at all, as chosen on the content screen. */
  .social[data-shade="black"] .g-slide::after{
    background:linear-gradient(to top,rgba(0,0,0,.94),rgba(0,0,0,.62) 38%,rgba(0,0,0,0));
  }
  .social[data-shade="none"] .g-slide::after{display:none;}
  .social[data-shade="none"] .g-slide figcaption{
    position:static;margin-top:14px;max-width:none;color:var(--ink-soft);
    text-shadow:none;
  }
  .social[data-shade="none"] .soc-when{color:var(--pink);}
  .social[data-shade="none"] .g-slide{background:transparent;}

  .soc-follow{
    display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px;
  }

  /* Instagram squares. Four across, with the wording coming up over the
     navy wash when somebody hovers over one or tabs to it. */
  .soc-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
    list-style:none;margin:0;padding:0;
  }
  .soc-tile{
    position:relative;margin:0;overflow:hidden;border-radius:16px;
    background:var(--navy);box-shadow:0 10px 26px rgba(12,28,62,.1);
  }
  .soc-tile img{
    width:100%;aspect-ratio:1/1;object-fit:cover;display:block;margin:0;
    border-radius:0;transition:transform .5s ease;
  }
  .soc-tile::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:58%;z-index:1;
    background:linear-gradient(to top,rgba(6,17,42,.92),rgba(6,17,42,.5) 45%,rgba(6,17,42,0));
    pointer-events:none;opacity:.86;transition:opacity .3s ease;
  }
  .soc-tile figcaption{
    position:absolute;left:14px;right:14px;bottom:13px;z-index:2;margin:0;
    font-size:14px;line-height:1.45;color:#eef2fc;
    text-shadow:0 1px 12px rgba(5,15,38,.6);
  }
  /* Two lines to begin with, the rest of it when somebody hovers over the
     square or tabs to it. */
  .soc-tile figcaption > span:not(.soc-when){
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
    overflow:hidden;
  }
  .soc-tile:hover::after,
  .soc-tile:focus-within::after{opacity:1;}
  .soc-tile:hover img,
  .soc-tile:focus-within img{transform:scale(1.04);}
  .soc-tile:hover figcaption > span:not(.soc-when),
  .soc-tile:focus-within figcaption > span:not(.soc-when){-webkit-line-clamp:7;}

  /* The same three choices as the slideshow. In a grid, no shading means a
     plain wall of photographs with no wording on them. */
  .social[data-shade="black"] .soc-tile::after{
    background:linear-gradient(to top,rgba(0,0,0,.94),rgba(0,0,0,.6) 45%,rgba(0,0,0,0));
  }
  .social[data-shade="none"] .soc-tile::after{display:none;}
  .social[data-shade="none"] .soc-tile figcaption{display:none;}

  @media (prefers-reduced-motion:reduce){
    .soc-tile img{transition:none;}
    .soc-tile:hover img,
    .soc-tile:focus-within img{transform:none;}
  }

  @media (max-width:980px){
    .soc-grid{grid-template-columns:repeat(3,1fr);}
  }

  @media (max-width:760px){
    .social .g-slider .g-slide img{aspect-ratio:4/3;}
    .social .g-slide figcaption{left:18px;right:18px;bottom:20px;font-size:15px;}
    .soc-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
    .soc-tile figcaption{left:11px;right:11px;bottom:10px;font-size:13px;}
    .soc-track{gap:12px;}
    .soc-cell{height:clamp(330px,96vw,460px);max-width:88vw;border-radius:16px;}
    .soc-cell figcaption{left:18px;right:18px;bottom:18px;font-size:15px;}
  }

  /* --- The pop up -----------------------------------------------------
     One card over the page, in the site's own navy, with the date in pink
     because that is the thing somebody takes away. It is hidden until the
     script decides it is time, and it comes in gently rather than snapping
     into place. */
  .promo[hidden]{display:none;}
  .promo{
    position:fixed;inset:0;z-index:9000;display:grid;place-items:center;
    padding:22px;
  }
  .promo-back{
    position:absolute;inset:0;background:rgba(6,17,42,.62);
    backdrop-filter:blur(3px);opacity:0;transition:opacity .35s ease;
  }
  .promo.is-in .promo-back{opacity:1;}
  .promo-card{
    position:relative;z-index:1;display:grid;grid-template-columns:238px 1fr;
    width:min(760px,100%);max-height:calc(100vh - 44px);overflow:auto;
    background:var(--navy);border-radius:26px;
    box-shadow:0 30px 80px -24px rgba(5,15,38,.7);
    opacity:0;transform:translateY(16px) scale(.98);
    transition:opacity .4s ease, transform .4s cubic-bezier(.2,.8,.3,1);
  }
  .promo.is-in .promo-card{opacity:1;transform:none;}
  .promo-card:focus{outline:none;}
  .promo-photo{position:relative;overflow:hidden;}
  .promo-photo img{
    width:100%;height:100%;object-fit:cover;display:block;margin:0;border-radius:0;
  }
  /* The photograph meets the writing with a soft edge rather than a line. */
  .promo-photo::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(to right,rgba(20,49,103,0) 60%,rgba(20,49,103,.9));
  }
  .promo-words{padding:38px 40px 34px;}
  .promo-eyebrow{
    margin:0 0 12px;font-size:11.5px;font-weight:700;text-transform:uppercase;
    letter-spacing:.14em;color:#ffb9d6;
  }
  .promo-head{margin:0;font-family:var(--mw-display);font-weight:700;color:#fff;}
  .promo-l1{
    display:block;font-size:clamp(23px,2.5vw,30px);line-height:1.18;
    letter-spacing:-.015em;text-wrap:balance;
  }
  .promo-l2{
    display:block;margin-top:7px;font-size:clamp(15px,1.5vw,17.5px);
    font-weight:500;line-height:1.35;color:#d7e0f3;
  }
  .promo-when{
    margin:20px 0 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.18);
  }
  .promo-l3{
    display:block;font-family:var(--mw-display);font-weight:700;color:var(--pink);
    font-size:clamp(21px,2.3vw,27px);line-height:1.15;letter-spacing:-.015em;
  }
  .promo-l4{
    display:block;margin-top:8px;font-size:16px;font-weight:600;color:#fff;
  }
  .promo-foot{margin:12px 0 0;font-size:13.5px;color:#aebbd6;}
  .promo-ctas{display:flex;flex-wrap:wrap;gap:11px;margin:26px 0 0;}
  .promo-ctas .btn-quiet{color:#fdf9f2;border-color:rgba(255,255,255,.45);}
  .promo-ctas .btn-quiet:hover{border-color:#fff;background:rgba(255,255,255,.1);}

  /* The cross, which has to be easy to hit and easy to find. */
  .promo-shut{
    position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;
    border:0;border-radius:50%;cursor:pointer;background:rgba(255,255,255,.14);
    transition:background .18s ease;
  }
  .promo-shut:hover{background:rgba(255,255,255,.3);}
  .promo-shut:focus-visible{outline:2px solid var(--pink);outline-offset:3px;}
  .promo-shut span,
  .promo-shut span::before{
    position:absolute;top:50%;left:50%;width:15px;height:2px;border-radius:2px;
    background:#fff;content:"";
  }
  .promo-shut span{transform:translate(-50%,-50%) rotate(45deg);}
  .promo-shut span::before{top:0;left:0;transform:rotate(-90deg);}

  @media (max-width:720px){
    /* No room for the photograph beside the words on a phone, and a thin
       strip of it above them is worse than none. */
    .promo-card{grid-template-columns:1fr;}
    .promo-photo{display:none;}
    .promo-words{padding:34px 24px 28px;}
    .promo-ctas .btn{width:100%;}
  }

  @media (prefers-reduced-motion:reduce){
    .promo-back,
    .promo-card{transition:none;}
    .promo-card{transform:none;}
  }

  /* One name over the numbered sections */
  /* Shown as it is typed rather than forced into capitals, so the wording
     in the back end is the wording on the page. */
  .pol-lib-name{
    margin:18px 0 4px;font-family:var(--mw-display);font-weight:700;
    font-size:14.5px;letter-spacing:.01em;color:var(--ink-soft);
  }
  .pol-lib-big{
    margin:34px 0 0;font-size:17px;color:var(--navy);
  }

  /* The review date inside the homepage box */
  .dl-when{
    font-size:11.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap;
  }
  /* Laid out rather than left to wrap. The badge holds its own column on
     the right of the name whatever the name's length, and the review date
     sits under the name instead of competing with it for the same line. */
  .pol-fold-list .dl, .pol-loose .dl{
    display:grid;grid-template-columns:1fr auto;
    grid-template-areas:"name badge" "when badge";
    align-items:center;column-gap:12px;row-gap:1px;
  }
  .pol-fold-list .dl > span:first-child, .pol-loose .dl > span:first-child{grid-area:name;min-width:0;}
  .pol-fold-list .dl .dl-when, .pol-loose .dl .dl-when{grid-area:when;margin:0;}
  .pol-fold-list .dl .tag, .pol-loose .dl .tag{grid-area:badge;align-self:center;}