main > section.tutor-examples { padding:clamp(2rem,5vw,4rem) 0; background:var(--lm-green-dark,#00875f); color:white; }
.tutor-examples .wrap { max-width:72rem; }
.tutor-examples h2 { margin:0 0 1rem; color:white; font-size:clamp(1.6rem,3vw,2.4rem); line-height:1.5; scroll-margin-top:8rem; }
.tutor-flow-intro p { max-width:48rem; line-height:1.9; }
.tutor-flow-viewport { overflow-x:auto; overflow-y:hidden; padding:.5rem max(1rem,calc((100vw - 72rem)/2)) 1.5rem; width:100%; touch-action:pan-x pan-y; scrollbar-width:none; -ms-overflow-style:none; }
.tutor-flow-track { display:flex; width:max-content; }
.tutor-flow-group { display:flex; gap:1.5rem; padding-right:1.5rem; }
.tutor-flow-card { width:min(27rem,calc(100vw - 3rem)); flex-shrink:0; padding:clamp(1.2rem,2vw,1.8rem); border:1px solid var(--lm-green,#0e9066); border-radius:1.3rem; background:white; color:var(--column-ink,#123b31); min-width:0; overflow-wrap:anywhere; text-decoration:none; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.tutor-flow-card:hover { border-color:var(--lm-green-dark,#00875f); box-shadow:0 .8rem 2rem rgba(0,135,95,.14); transform:translateY(-.15rem); }
.tutor-flow-card:focus-visible { outline:.2rem solid var(--lm-coral,#f0644f); outline-offset:.2rem; }
.tutor-flow-link { display:inline-flex; align-items:center; min-height:44px; margin-top:.25rem; color:var(--lm-green-dark,#00875f); font-weight:800; }
.tutor-flow-link::after { content:'›'; margin-left:.4rem; font-size:1.25em; }
@media (prefers-reduced-motion:reduce) { .tutor-flow-card { transition:none; } .tutor-flow-card:hover { transform:none; } }
.tutor-flow-heading { display:grid; grid-template-columns:6rem minmax(0,1fr); align-items:center; gap:1rem; }
.tutor-flow-heading > div { min-width:0; }
.tutor-flow-heading h3 { margin:0 0 .5rem; color:var(--lm-green-dark,#00875f); font-size:clamp(1.4rem,2vw,1.8rem); line-height:1.4; }
.tutor-flow-heading p { margin:0; line-height:1.7; font-size:1rem; }
.tutor-flow-portrait { width:6rem; aspect-ratio:1; border-radius:50%; background-size:cover; background-position:center; background-color:var(--lm-mint,#eafaf3); }
.tutor-flow-portrait-haruto { background-size:700% auto; background-position:52% 13%; }
.tutor-flow-portrait-tomoya { background-size:280% auto; background-position:61% 24%; }
.tutor-flow-card dl { margin:1.4rem 0 0; padding-top:1rem; border-top:1px solid var(--lm-green,#0e9066); }
.tutor-flow-card dt { color:var(--lm-green-dark,#00875f); font-size:.85rem; font-weight:700; }
.tutor-flow-card dd { margin:.2rem 0 .7rem; line-height:1.75; font-size:1rem; }
.tutor-examples :is(a,.tutor-flow-viewport):focus-visible { outline:3px solid var(--lm-green-dark,#00875f); outline-offset:4px; }

.tutor-examples :is(.tutor-flow-viewport):focus-visible { outline-color:white; }

.tutor-examples .tutor-flow-intro p { color:white; }

/* Keep the adjoining homepage tutor sections on one green surface. */
.lumera-home main > section.university-section { background:var(--lm-green-dark,#00875f); }

.tutor-flow-card dd { display:flex; flex-wrap:wrap; gap:.4rem; }
.tutor-fact-tag { display:inline-block; padding:.3rem .65rem; border-radius:.35rem; background:#e6f4f1; color:#116a60; font-size:.95rem; line-height:1.6; }
.tutor-flow-card dt:first-of-type + dd .tutor-fact-tag { background:#fff2df; color:#935510; }
.tutor-flow-card dt:nth-of-type(2) + dd .tutor-fact-tag { background:#edf1fb; color:#435b84; }

.tutor-flow-portrait-co-creation { background-size:200% auto; background-position:46% 21%; }
.tutor-flow-year { white-space:nowrap; }

/* Compact tutor cards on mobile, while keeping photos and details legible. */
@media (max-width: 640px) {
  .tutor-flow-viewport {
    padding: .4rem 1rem 1rem;
    scroll-padding-inline: 1rem;
  }
  .tutor-flow-group { gap: .9rem; padding-right: .9rem; }
  .tutor-flow-card {
    width: min(20rem, calc(100vw - 4rem));
    padding: .95rem;
    border-radius: 1rem;
  }
  .tutor-flow-heading {
    grid-template-columns: 4.5rem minmax(0, 1fr);
    gap: .75rem;
  }
  .tutor-flow-portrait { width: 4.5rem; }
  .tutor-flow-heading h3 {
    margin-bottom: .2rem;
    font-size: 1.125rem;
    line-height: 1.3;
  }
  .tutor-flow-heading p { font-size: .85rem; line-height: 1.45; }
  .tutor-flow-card dl { margin-top: .85rem; padding-top: .7rem; }
  .tutor-flow-card dt { font-size: .78rem; line-height: 1.45; }
  .tutor-flow-card dd {
    gap: .35rem;
    margin: .1rem 0 .6rem;
    font-size: .875rem;
    line-height: 1.4;
  }
  .tutor-fact-tag {
    padding: .2rem .5rem;
    font-size: .8rem;
    line-height: 1.35;
  }
  .tutor-flow-link { min-height: 44px; margin-top: 0; font-size: .88rem; }
}

/* Keep touch, wheel and keyboard scrolling without showing the native rail. */
.tutor-flow-viewport::-webkit-scrollbar { display:none; width:0; height:0; }