/*
 * Boundlearn Outcomes — tablet editorial composition.
 * Ownership: 761–1180px viewports taller than short phone landscape.
 * Phone, standard desktop and high-resolution layouts remain independent.
 */

@media (min-width:761px) and (max-width:1180px) and (min-height:501px) {
  :root {
    --bl-ott-navy:#0B1221;
    --bl-ott-ink:#111B2E;
    --bl-ott-paper:#FBF8F2;
    --bl-ott-cream:#F5F2EC;
    --bl-ott-coral:#CF765E;
    --bl-ott-teal:#4F8E7F;
    --bl-ott-lilac:#9A86BC;
    --bl-ott-gold:#D4AF37;
    --bl-ott-gutter:clamp(44px,6.5vw,76px);
  }

  .bl-outcomes-page {
    margin:0;
    overflow-x:clip;
    background:var(--bl-ott-paper)!important;
    color:var(--bl-ott-ink);
    font-family:'Manrope',system-ui,sans-serif;
    -webkit-font-smoothing:antialiased;
  }

  .bl-outcomes-page *,
  .bl-outcomes-page *:before,
  .bl-outcomes-page *:after { box-sizing:border-box; }

  .bl-outcomes-editorial {
    display:block;
    overflow:clip;
    background:var(--bl-ott-paper);
  }

  .bl-outcomes-legacy { display:none!important; }
  .bl-outcomes-editorial a { text-decoration:none; }
  .bl-outcomes-editorial a:focus-visible { outline:3px solid var(--bl-ott-gold); outline-offset:5px; }

  .bl-ot-kicker {
    display:inline-flex;
    align-items:center;
    gap:11px;
    color:var(--bl-ott-coral);
    font-size:11px;
    line-height:1.2;
    font-weight:850;
    letter-spacing:.19em;
    text-transform:uppercase;
  }

  .bl-ot-kicker:before {
    content:"";
    width:42px;
    height:2px;
    flex:0 0 auto;
    background:currentColor;
    clip-path:polygon(0 22%,100% 0,95% 78%,4% 100%);
  }

  .bl-ot-hero {
    position:relative;
    isolation:isolate;
    min-height:calc(100svh - 76px);
    display:flex;
    align-items:center;
    overflow:hidden;
    padding:74px var(--bl-ott-gutter) 82px;
    color:var(--bl-ott-paper);
    background:var(--bl-ott-navy);
  }

  .bl-ot-hero:before {
    content:"";
    position:absolute;
    inset:-2.5%;
    z-index:-2;
    background:url('/assets/media/boundlearn/boundlearn-outcomes-canvas-landscape-v1.png') center/cover no-repeat;
    transform:scale(1.03);
  }

  .bl-ot-hero:after {
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:
      linear-gradient(90deg,rgba(5,14,28,.16),rgba(5,14,28,.04) 52%,rgba(5,14,28,.26)),
      radial-gradient(circle at 31% 48%,rgba(11,18,33,.05),rgba(11,18,33,.65) 86%);
  }

  .bl-ot-hero-inner { width:min(690px,87vw); max-width:690px; }
  .bl-ot-hero .bl-ot-kicker { color:#F2A28D; }

  .bl-ot-hero h1 {
    display:flex;
    flex-direction:column;
    margin:25px 0 0;
    color:var(--bl-ott-paper);
    font-size:clamp(66px,8.2vw,84px);
    line-height:.9;
    font-weight:790;
    letter-spacing:-.065em;
  }

  .bl-ot-hero h1 em {
    position:relative;
    width:max-content;
    margin-top:8px;
    color:#F2A28D;
    font-style:normal;
  }

  .bl-ot-hero h1 em:after {
    content:"";
    position:absolute;
    right:-24px;
    bottom:-8px;
    left:5px;
    height:8px;
    background:var(--bl-ott-coral);
    clip-path:polygon(0 30%,99% 0,95% 68%,4% 100%);
    opacity:.85;
  }

  .bl-ot-hero p {
    max-width:53ch;
    margin:32px 0 0;
    color:rgba(245,242,236,.84);
    font-size:16px;
    line-height:1.68;
    text-wrap:pretty;
  }

  .bl-ot-hero-link {
    display:inline-flex;
    align-items:center;
    gap:15px;
    margin-top:32px;
    color:var(--bl-ott-paper)!important;
    font-size:11px;
    line-height:1.2;
    font-weight:850;
    letter-spacing:.14em;
    text-transform:uppercase;
  }

  .bl-ot-hero-link:before { content:""; width:54px; height:1px; flex:0 0 auto; background:#F2A28D; }
  .bl-ot-hero-marker {
    position:absolute;
    right:var(--bl-ott-gutter);
    bottom:30px;
    display:flex;
    align-items:center;
    gap:10px;
    color:rgba(245,242,236,.54);
    font-size:10px;
    line-height:1;
    font-weight:800;
    letter-spacing:.13em;
  }
  .bl-ot-hero-marker i { width:68px; height:1px; background:linear-gradient(90deg,var(--bl-ott-coral),var(--bl-ott-gold),var(--bl-ott-teal),var(--bl-ott-lilac)); }

  .bl-ot-intro,
  .bl-ot-numbers,
  .bl-ot-universities { position:relative; isolation:isolate; overflow:hidden; }

  .bl-ot-intro {
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(290px,.78fr);
    gap:clamp(44px,7vw,84px);
    align-items:end;
    padding:104px var(--bl-ott-gutter) 116px;
    background:
      linear-gradient(rgba(251,248,242,.72),rgba(251,248,242,.82)),
      url('/assets/media/boundlearn/boundlearn-about-mobile-story-landscape-v1.png') center/cover no-repeat,
      var(--bl-ott-paper);
  }

  .bl-ot-intro:after {
    content:"";
    position:absolute;
    right:-24px;
    bottom:-42px;
    z-index:-1;
    width:145px;
    height:145px;
    border:1px solid rgba(11,18,33,.17);
    border-radius:50%;
    box-shadow:0 0 0 38px rgba(11,18,33,.024),0 0 0 74px rgba(11,18,33,.017);
  }

  .bl-ot-intro h2,
  .bl-ot-journeys h2,
  .bl-ot-numbers h2,
  .bl-ot-universities h2,
  .bl-ot-cta h2 {
    margin:22px 0 0;
    font-size:clamp(50px,6.4vw,68px);
    line-height:.98;
    font-weight:770;
    letter-spacing:-.058em;
    text-wrap:balance;
  }

  .bl-ot-intro h2 { max-width:12ch; color:var(--bl-ott-ink); }
  .bl-ot-intro-copy p { max-width:46ch; margin:0; color:#435064; font-size:15px; line-height:1.72; text-wrap:pretty; }
  .bl-ot-intro-copy p + p { margin-top:20px; }

  .bl-ot-journeys {
    position:relative;
    isolation:isolate;
    display:grid;
    grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);
    gap:clamp(38px,5vw,64px);
    min-height:820px;
    overflow:hidden;
    padding:94px var(--bl-ott-gutter) 100px;
    color:var(--bl-ott-paper);
    background:var(--bl-ott-navy);
  }

  .bl-ot-journeys:before {
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    background:url('/assets/media/boundlearn/boundlearn-outcomes-canvas-landscape-v1.png') center/cover no-repeat;
    opacity:.34;
    transform:scale(1.07) rotate(180deg);
  }
  .bl-ot-journeys:after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(11,18,33,.91),rgba(11,18,33,.7) 52%,rgba(11,18,33,.52)); }
  .bl-ot-journeys .bl-ot-kicker { color:#F2A28D; }
  .bl-ot-journeys h2 { max-width:11ch; color:var(--bl-ott-paper); }
  .bl-ot-journeys-lede { max-width:48ch; margin:24px 0 0; color:rgba(245,242,236,.73); font-size:15px; line-height:1.68; text-wrap:pretty; }

  .bl-ot-outcome-list { margin-top:42px; border-top:1px solid rgba(245,242,236,.18); }
  .bl-ot-outcome-list article { display:grid; grid-template-columns:40px minmax(0,1fr); gap:14px; padding:21px 0 23px; border-bottom:1px solid rgba(245,242,236,.18); }
  .bl-ot-outcome-list article > span { padding-top:3px; color:#F2A28D; font-size:10px; font-weight:850; letter-spacing:.17em; }
  .bl-ot-outcome-list h3 { margin:0; color:var(--bl-ott-paper); font-size:20px; line-height:1.16; font-weight:720; letter-spacing:-.035em; }
  .bl-ot-outcome-list p { margin:8px 0 0; color:rgba(245,242,236,.67); font-size:12.5px; line-height:1.56; text-wrap:pretty; }

  .bl-ot-portrait-stage { position:relative; align-self:center; width:100%; height:590px; }
  .bl-ot-orbit {
    position:absolute;
    top:76px;
    left:50%;
    width:min(430px,44vw);
    aspect-ratio:1;
    border:1px solid rgba(245,242,236,.21);
    border-radius:50%;
    box-shadow:0 0 0 52px rgba(245,242,236,.024),0 0 0 98px rgba(245,242,236,.015);
    transform:translateX(-50%);
  }
  .bl-ot-dots { position:absolute; top:24px; left:0; width:108px; height:88px; opacity:.52; background-image:radial-gradient(circle,#F2A28D 1.4px,transparent 1.8px); background-size:13px 13px; }
  .bl-ot-portrait { position:absolute; z-index:2; margin:0; overflow:hidden; background:#05080E; box-shadow:18px 25px 46px rgba(0,0,0,.34); }
  .bl-ot-portrait img { width:100%; height:100%; display:block; object-fit:cover; }
  .bl-ot-portrait--jay { top:20px; right:0; width:min(265px,28vw); height:310px; clip-path:polygon(2% 0,98% 3%,100% 94%,5% 100%,0 18%); transform:rotate(2.2deg); }
  .bl-ot-portrait--hala { bottom:24px; left:0; width:min(292px,31vw); height:330px; clip-path:polygon(3% 2%,97% 0,100% 92%,3% 100%,0 17%); transform:rotate(-2.5deg); }
  .bl-ot-portrait--ariya { right:0; bottom:1px; z-index:4; width:min(224px,24vw); height:255px; clip-path:polygon(3% 0,100% 4%,96% 100%,0 94%); transform:rotate(1.5deg); }
  .bl-ot-hand-note { position:absolute; top:47%; right:12%; z-index:6; padding:11px 18px; color:var(--bl-ott-navy); background:#F2A28D; clip-path:polygon(2% 8%,98% 0,100% 86%,4% 100%); font-family:'Cinzel',serif; font-size:12px; font-weight:700; letter-spacing:.04em; transform:rotate(-3deg); }

  .bl-ot-numbers {
    padding:104px var(--bl-ott-gutter) 116px;
    background:
      linear-gradient(rgba(251,248,242,.72),rgba(251,248,242,.88)),
      url('/assets/media/boundlearn/boundlearn-family-canvas-landscape-v1.png') center/cover no-repeat,
      var(--bl-ott-paper);
  }
  .bl-ot-numbers-heading { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(290px,.78fr); gap:clamp(44px,7vw,84px); align-items:end; }
  .bl-ot-numbers h2 { max-width:13ch; color:var(--bl-ott-ink); }
  .bl-ot-numbers-heading > p { margin:0 0 4px; color:#435064; font-size:15px; line-height:1.72; text-wrap:pretty; }
  .bl-ot-number-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 34px; margin-top:58px; border-top:1px solid rgba(11,18,33,.17); }
  .bl-ot-number-grid article { min-height:250px; display:flex; flex-direction:column; padding:31px 3px 30px; border-bottom:1px solid rgba(11,18,33,.17); transform:none!important; }
  .bl-ot-number-grid strong { display:block; color:var(--bl-ott-coral); font-size:clamp(58px,7vw,70px); line-height:.92; font-weight:790; letter-spacing:-.06em; font-variant-numeric:tabular-nums; }
  .bl-ot-number-grid article:nth-child(2) strong,
  .bl-ot-number-grid article:nth-child(5) strong { color:var(--bl-ott-teal); }
  .bl-ot-number-grid article:nth-child(3) strong,
  .bl-ot-number-grid article:nth-child(6) strong { color:var(--bl-ott-lilac); }
  .bl-ot-number-grid span { max-width:32ch; margin-top:18px; color:#364458; font-size:13.5px; line-height:1.6; text-wrap:pretty; }
  .bl-ot-number-grid small { margin-top:auto; padding-top:20px; color:#7A8493; font-size:9px; line-height:1.25; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }
  .bl-ot-number-note { max-width:76ch; margin:38px 0 0; color:#6C7787; font-size:10px; line-height:1.64; }

  .bl-ot-universities {
    padding:104px var(--bl-ott-gutter) 124px;
    background:
      linear-gradient(rgba(251,248,242,.7),rgba(251,248,242,.86)),
      url('/assets/media/boundlearn/boundlearn-about-five-ways-watercolor-v2.png') center/cover no-repeat,
      var(--bl-ott-paper);
  }
  .bl-ot-universities-heading { max-width:820px; margin-inline:auto; text-align:center; }
  .bl-ot-universities-heading .bl-ot-kicker { justify-content:center; }
  .bl-ot-universities h2 { margin-inline:auto; color:var(--bl-ott-ink); }
  .bl-ot-universities-heading > p { max-width:59ch; margin:25px auto 0; color:#435064; font-size:15px; line-height:1.7; text-wrap:pretty; }
  .bl-ot-logo-wall { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 18px; margin:62px auto 0; padding:12px 0 24px; }
  .bl-ot-logo-wall figure { --logo-accent:var(--bl-ott-coral); position:relative; min-height:132px; display:grid; place-items:center; margin:0; padding:24px 22px; background:rgba(255,255,255,.81); clip-path:polygon(2% 4%,97% 0,100% 91%,4% 100%,0 21%); filter:drop-shadow(9px 11px 15px rgba(11,18,33,.1)); }
  .bl-ot-logo-wall figure:before { content:""; position:absolute; top:0; right:11%; left:7%; height:6px; background:var(--logo-accent); clip-path:polygon(0 30%,100% 0,95% 76%,3% 100%); opacity:.72; }
  .bl-ot-logo-wall figure:nth-child(4n + 1) { --logo-accent:#A94B5D; transform:translateY(5px) rotate(-1.1deg); }
  .bl-ot-logo-wall figure:nth-child(4n + 2) { --logo-accent:#CF765E; transform:translateY(-5px) rotate(.9deg); }
  .bl-ot-logo-wall figure:nth-child(4n + 3) { --logo-accent:#D4AF37; transform:translateY(4px) rotate(-.5deg); }
  .bl-ot-logo-wall figure:nth-child(4n) { --logo-accent:#4F8E7F; transform:translateY(-3px) rotate(1.1deg); }
  .bl-ot-logo-wall img { width:100%; max-width:150px; max-height:64px; display:block; object-fit:contain; filter:saturate(.82) contrast(1.02); }

  .bl-ot-cta {
    position:relative;
    isolation:isolate;
    min-height:610px;
    display:grid;
    place-items:center;
    overflow:hidden;
    padding:96px var(--bl-ott-gutter) 104px;
    text-align:center;
    background:var(--bl-ott-paper);
  }
  .bl-ot-cta:before { content:""; position:absolute; inset:-3%; z-index:-2; background:url('/assets/media/boundlearn/boundlearn-contact-canvas-landscape-v1.png') center/cover no-repeat; opacity:.9; }
  .bl-ot-cta:after { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(circle at center,rgba(251,248,242,.87) 0 27%,rgba(251,248,242,.49) 58%,transparent 83%); }
  .bl-ot-cta > div { width:min(720px,86vw); }
  .bl-ot-cta .bl-ot-kicker { justify-content:center; }
  .bl-ot-cta h2 { max-width:12ch; margin-inline:auto; color:var(--bl-ott-ink); }
  .bl-ot-cta p { max-width:54ch; margin:24px auto 0; color:#455267; font-size:15px; line-height:1.67; text-wrap:pretty; }
  .bl-ot-cta-actions { display:flex; justify-content:center; align-items:center; gap:22px; margin-top:31px; }
  .bl-ot-cta-actions a { min-width:184px; min-height:50px; display:inline-flex; align-items:center; justify-content:center; padding:15px 24px; font-size:10px; line-height:1.2; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }
  .bl-ot-cta-actions a:first-child { color:var(--bl-ott-paper)!important; background:var(--bl-ott-coral); clip-path:polygon(2% 4%,98% 0,100% 90%,4% 100%,0 22%); }
  .bl-ot-cta-actions a:last-child { color:var(--bl-ott-teal)!important; background:rgba(251,248,242,.44); border-bottom:1px solid currentColor; }
}

@media (min-width:761px) and (max-width:900px) and (min-height:901px) and (orientation:portrait) {
  :root { --bl-ott-gutter:clamp(46px,7vw,58px); }
  .bl-ot-hero:before { background-image:url('/assets/media/boundlearn/boundlearn-outcomes-canvas-portrait-v1.png'); background-position:center; }
  .bl-ot-hero-inner { width:100%; }
  .bl-ot-hero h1 { font-size:clamp(66px,9.3vw,78px); }

  .bl-ot-intro {
    display:block;
    min-height:680px;
    padding-top:112px;
    padding-bottom:124px;
    text-align:center;
    background:
      linear-gradient(rgba(251,248,242,.7),rgba(251,248,242,.82)),
      url('/assets/media/boundlearn/boundlearn-about-mobile-story-portrait-v1.png') center/cover no-repeat,
      var(--bl-ott-paper);
  }
  .bl-ot-intro .bl-ot-kicker { justify-content:center; }
  .bl-ot-intro h2 { margin-inline:auto; font-size:clamp(57px,7.8vw,66px); }
  .bl-ot-intro-copy { max-width:48ch; margin:34px auto 0; }
  .bl-ot-intro-copy p { max-width:none; font-size:16px; }

  .bl-ot-journeys {
    display:block;
    min-height:0;
    padding-top:106px;
    padding-bottom:88px;
  }
  .bl-ot-journeys-copy { max-width:650px; }
  .bl-ot-journeys h2 { font-size:clamp(58px,7.9vw,68px); }
  .bl-ot-journeys-lede { max-width:55ch; font-size:16px; }
  .bl-ot-outcome-list { max-width:660px; }
  .bl-ot-outcome-list article { grid-template-columns:48px 1fr; gap:18px; padding:24px 0 26px; }
  .bl-ot-outcome-list h3 { font-size:22px; }
  .bl-ot-outcome-list p { font-size:13.5px; }

  .bl-ot-portrait-stage { height:690px; margin-top:58px; }
  .bl-ot-orbit { top:96px; width:510px; }
  .bl-ot-dots { width:120px; height:100px; }
  .bl-ot-portrait--jay { width:330px; height:386px; }
  .bl-ot-portrait--hala { width:356px; height:404px; }
  .bl-ot-portrait--ariya { width:272px; height:310px; }
  .bl-ot-hand-note { right:16%; font-size:13px; }

  .bl-ot-numbers-heading { display:block; text-align:center; }
  .bl-ot-numbers {
    background:
      linear-gradient(rgba(251,248,242,.68),rgba(251,248,242,.88)),
      url('/assets/media/boundlearn/boundlearn-family-canvas-portrait-v1.png') center/cover no-repeat,
      var(--bl-ott-paper);
  }
  .bl-ot-numbers-heading .bl-ot-kicker { justify-content:center; }
  .bl-ot-numbers h2 { margin-inline:auto; font-size:clamp(58px,7.8vw,68px); }
  .bl-ot-numbers-heading > p { max-width:51ch; margin:30px auto 0; font-size:16px; }
  .bl-ot-number-grid { margin-top:62px; }
  .bl-ot-number-grid article { min-height:270px; }

  .bl-ot-universities h2 { font-size:clamp(58px,7.8vw,68px); }
  .bl-ot-universities {
    background:
      linear-gradient(180deg,rgba(251,248,242,.7),rgba(251,248,242,.9) 34%,rgba(251,248,242,.88) 70%,rgba(251,248,242,.7)),
      url('/assets/media/boundlearn/boundlearn-about-five-ways-watercolor-v2.png') top center/100% auto no-repeat,
      url('/assets/media/boundlearn/boundlearn-about-mobile-story-portrait-v1.png') bottom center/100% auto no-repeat,
      var(--bl-ott-paper);
  }
  .bl-ot-logo-wall { gap:22px 18px; }
  .bl-ot-logo-wall figure { min-height:142px; }
  .bl-ot-cta:before { background-image:url('/assets/media/boundlearn/boundlearn-contact-canvas-portrait-v1.png'); }
  .bl-ot-cta h2 { font-size:clamp(58px,7.8vw,68px); }
}

@media (min-width:901px) and (max-width:1180px) and (min-height:501px) and (orientation:landscape) {
  .bl-ot-hero { padding-top:68px; padding-bottom:74px; }
  .bl-ot-hero-inner { width:min(660px,65vw); }
  .bl-ot-hero h1 { font-size:clamp(68px,7vw,82px); }
  .bl-ot-intro { min-height:510px; padding-top:92px; padding-bottom:102px; }
  .bl-ot-journeys { min-height:690px; padding-top:78px; padding-bottom:82px; }
  .bl-ot-journeys h2 { font-size:clamp(52px,5.4vw,64px); }
  .bl-ot-portrait-stage { height:520px; }
  .bl-ot-orbit { top:58px; width:400px; }
  .bl-ot-portrait--jay { width:250px; height:292px; }
  .bl-ot-portrait--hala { width:274px; height:310px; }
  .bl-ot-portrait--ariya { width:210px; height:238px; }
  .bl-ot-numbers { padding-top:92px; padding-bottom:102px; }
  .bl-ot-numbers h2 { font-size:clamp(52px,5.4vw,64px); }
  .bl-ot-number-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 28px; }
  .bl-ot-number-grid article { min-height:270px; }
  .bl-ot-universities { padding-top:92px; padding-bottom:112px; }
  .bl-ot-universities h2 { font-size:clamp(52px,5.4vw,64px); }
  .bl-ot-logo-wall { grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px 16px; }
  .bl-ot-logo-wall figure { min-height:124px; }
  .bl-ot-cta { min-height:560px; padding-top:84px; padding-bottom:92px; }
  .bl-ot-cta h2 { font-size:clamp(52px,5.4vw,64px); }
}

@media (prefers-reduced-motion:reduce) {
  .bl-outcomes-editorial * { animation:none!important; transition:none!important; }
}