/* Explore — the map (4 Sep 2026). Drawn by novamira-sandbox/explore-map.php. */
.soma-xm{--xm-head:var(--soma-header-bottom,var(--soma-header-h,80px));--xm-max:1180px;background:var(--soma-base)}
.soma-xm h1,.soma-xm h2{text-wrap:balance}
.soma-xm p{margin:0}
.soma-xm a.soma-xm-ghost{background:transparent;color:var(--soma-white);box-shadow:inset 0 0 0 1.5px var(--soma-line-inverse)}
.soma-xm a.soma-xm-ghost:hover{background:var(--soma-white-12)}

/* hero */
.soma-xm-hero{background:var(--soma-primary);color:var(--soma-white);position:relative;overflow:hidden;padding:clamp(3rem,2rem + 4vw,6rem) var(--soma-gutter) clamp(2.5rem,1.5rem + 3vw,4.5rem)}
.soma-xm-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(70% 90% at 15% 20%,rgba(13,124,104,.35) 0%,rgba(13,124,104,0) 60%),radial-gradient(50% 70% at 95% 100%,rgba(204,213,255,.18) 0%,rgba(204,213,255,0) 60%);pointer-events:none}
.soma-xm-hero__in{position:relative;max-width:var(--xm-max);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(2rem,1rem + 5vw,6rem);align-items:end}
.soma-xm-hero .soma-eyebrow{color:var(--soma-periwinkle)}
.soma-xm-hero h1{color:var(--soma-white);font-size:clamp(2.5rem,1.2rem + 4.6vw,4.6rem);letter-spacing:-.01em;margin:18px 0 22px}
.soma-xm-lead{color:var(--soma-white-70);font-size:clamp(1.125rem,1.05rem + .35vw,1.375rem);line-height:1.6;max-width:34em}
.soma-xm-tally{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.soma-xm-tally div{background:var(--soma-white-12);border-radius:var(--soma-r-md);padding:18px 20px}
.soma-xm-tally dt{font-family:var(--soma-font-display);font-weight:600;font-size:clamp(2rem,1.5rem + 1.6vw,3rem);line-height:1;color:var(--soma-white);font-variant-numeric:tabular-nums}
.soma-xm-tally dd{margin:6px 0 0;font-size:.875rem;color:var(--soma-white-70)}

/* sticky field strip */
.soma-xm-strip{position:sticky;top:var(--xm-head);z-index:15;background:rgba(242,240,239,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--soma-line)}
.soma-xm-strip__in{max-width:var(--xm-max);margin:0 auto;display:flex;gap:6px;padding:10px var(--soma-gutter);overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.soma-xm-strip__in::-webkit-scrollbar{display:none}
.soma-xm .soma-xm-strip a{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--soma-r-pill);font-size:.875rem;font-weight:600;color:var(--soma-primary);text-decoration:none;white-space:nowrap;box-shadow:inset 0 0 0 1px var(--soma-line);transition:background var(--soma-dur-btn)}
.soma-xm-strip a i{width:9px;height:9px;border-radius:50%;background:var(--c)}
.soma-xm .soma-xm-strip a:hover{background:var(--soma-white)}
.soma-xm .soma-xm-strip a.on{background:var(--soma-primary);color:var(--soma-white);box-shadow:none}

/* fields */
.soma-xm-field{padding:clamp(3rem,2rem + 3vw,5rem) var(--soma-gutter);border-bottom:1px solid var(--soma-line)}
.soma-xm-field--alt{background:var(--soma-white)}
.soma-xm-field__in{max-width:var(--xm-max);margin:0 auto;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,1rem + 4vw,5rem);align-items:start}
.soma-xm .soma-xm-field__art{display:block;border-radius:var(--soma-r-lg);overflow:hidden;background:var(--soma-primary-deep);border-left:6px solid var(--c);position:sticky;top:calc(var(--xm-head) + 72px)}
.soma-xm-field__art img{width:100%;height:auto;aspect-ratio:16/11;object-fit:cover;display:block;transition:transform var(--soma-dur-slow) var(--soma-ease)}
.soma-xm .soma-xm-field__art:hover img{transform:scale(1.03)}
.soma-xm-field__kicker{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--c)}
.soma-xm-field h2{font-size:clamp(2rem,1.3rem + 2.6vw,3.4rem);margin:10px 0 12px;letter-spacing:-.01em}
.soma-xm .soma-xm-field h2 a{color:var(--soma-primary);text-decoration:none}
.soma-xm-field__q{font-family:var(--soma-font-display);font-size:clamp(1.35rem,1.1rem + .9vw,1.75rem);line-height:1.3;color:var(--c);margin-bottom:10px}
.soma-xm-field__d{color:var(--soma-text);font-size:var(--soma-t-lead);line-height:1.6;max-width:36em}
.soma-xm-ladder{margin:26px 0 0;border-top:1px solid var(--soma-line)}
.soma-xm-ladder > div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px 22px;padding:14px 0;border-bottom:1px solid var(--soma-line)}
.soma-xm-ladder dt{font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--soma-primary);padding-top:3px}
.soma-xm-ladder dt span{display:block;margin-top:3px;font-size:.8125rem;letter-spacing:0;text-transform:none;font-weight:500;color:var(--soma-secondary)}
.soma-xm-ladder dd{margin:0;display:flex;flex-direction:column;gap:6px}
.soma-xm .soma-xm-ladder dd a{color:var(--soma-primary);text-decoration:none;font-size:1.0625rem;line-height:1.4;font-weight:500}
.soma-xm .soma-xm-ladder dd a:hover{color:var(--soma-secondary)}
.soma-xm .soma-xm-ladder dd a.soma-xm-ladder__more{color:var(--soma-secondary);font-size:.9375rem;font-weight:600}
.soma-xm-ladder__soon{color:var(--soma-text);font-size:1rem}
.soma-xm .soma-xm-field__btn{margin-top:24px}

/* ending */
.soma-xm-end{background:var(--soma-primary);color:var(--soma-white);padding:clamp(3.5rem,2rem + 5vw,7rem) var(--soma-gutter)}
.soma-xm-end__in{max-width:var(--xm-max);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(2rem,1rem + 4vw,5rem);align-items:center}
.soma-xm-end .soma-eyebrow{color:var(--soma-periwinkle)}
.soma-xm-end h2{color:var(--soma-white);font-size:clamp(2rem,1.3rem + 3vw,3.6rem);margin:14px 0 14px}
.soma-xm-end p{color:var(--soma-white-70);max-width:36em;font-size:1.0625rem}
.soma-xm-end__acts{display:flex;flex-direction:column;gap:10px;min-width:260px}
.soma-xm-end__acts .soma-btn{justify-content:center}

/* tablet */
@media (max-width:1100px){
  .soma-xm-hero__in{grid-template-columns:1fr;align-items:start}
  .soma-xm-tally{max-width:560px}
  .soma-xm-field__in{grid-template-columns:1fr;gap:1.5rem}
  .soma-xm .soma-xm-field__art{position:static}.soma-xm-field__art img{aspect-ratio:16/8}
  .soma-xm-end__in{grid-template-columns:1fr}
  .soma-xm-end__acts{flex-direction:row;flex-wrap:wrap}
}
/* phone */
@media (max-width:640px){
  .soma-xm-hero h1{font-size:clamp(2.25rem,8.6vw,2.9rem)}
  .soma-xm-tally{grid-template-columns:1fr 1fr;gap:10px}
  .soma-xm-tally div{padding:14px 14px}
  .soma-xm .soma-xm-field__art{border-radius:16px;border-left-width:5px}.soma-xm-field__art img{aspect-ratio:16/9}
  .soma-xm-ladder > div{grid-template-columns:1fr;gap:6px}
  .soma-xm .soma-xm-field__btn{width:100%;justify-content:center}
  .soma-xm-end__acts{flex-direction:column}
}


/* soma: green closing band */
/* The band and the footer were the same navy, so the page's last call to action
   dissolved into the footer. Green separates them. */
.soma-xm-end{background:var(--soma-secondary)}
.soma-xm-end .soma-eyebrow{color:rgba(255,255,255,.72)}
.soma-xm-end p{color:rgba(255,255,255,.82)}
.soma-xm-end__acts .soma-btn:not(.soma-xm-ghost){background:var(--soma-white);color:var(--soma-secondary);border-color:var(--soma-white)}
/* templates.css turns every .soma-page link navy on hover, which blacks out
   links on a coloured surface. Hold white here. */
section.soma-xm-end a:hover,section.soma-xm-end a:focus-visible{color:var(--soma-white)}
section.soma-xm-end .soma-xm-end__acts a.soma-btn:not(.soma-xm-ghost):hover,
section.soma-xm-end .soma-xm-end__acts a.soma-btn:not(.soma-xm-ghost):focus-visible{color:var(--soma-secondary)}


/* soma: ladder rows are click targets */

/* Each line is one destination, so the whole line should be the target, not the
   exact words. Padding gives the row height; the tint reads on both the white
   and the base sections these ladders sit in. */
.soma-xm .soma-xm-ladder dd{gap:1px}
.soma-xm .soma-xm-ladder dd a{display:block;padding:8px 12px;margin-left:-12px;margin-right:-12px;border-radius:10px;transition:background-color .16s ease,color .16s ease}
.soma-xm .soma-xm-ladder dd a:hover,.soma-xm .soma-xm-ladder dd a:focus-visible{background:rgba(19,21,39,.055);color:var(--soma-secondary)}
.soma-xm .soma-xm-ladder dd a:focus-visible{outline:2px solid var(--soma-secondary);outline-offset:1px}
.soma-xm .soma-xm-ladder dt{padding-top:11px}


/* soma: ladder rows lead to the collection */
/* A row now stands for the whole shelf behind it -- the field's Journal, its
   Foundations course, all its Deep Dives -- so the row is one target and the
   titles under it are a sample, not separate links. */
.soma-xm .soma-xm-lrow{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:6px 22px;align-items:start;padding:14px 12px;margin:0 -12px;border-bottom:1px solid var(--soma-line);border-radius:10px;text-decoration:none;color:var(--soma-primary);transition:background-color .16s ease}
.soma-xm a.soma-xm-lrow:hover,.soma-xm a.soma-xm-lrow:focus-visible{background:rgba(19,21,39,.055);color:var(--soma-primary);text-decoration:none}
.soma-xm a.soma-xm-lrow:focus-visible{outline:2px solid var(--soma-secondary);outline-offset:1px}
.soma-xm-lrow__k{font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--soma-primary);padding-top:3px}
.soma-xm-lrow__k i{display:block;margin-top:3px;font-size:.8125rem;letter-spacing:0;text-transform:none;font-style:normal;font-weight:500;color:var(--soma-secondary)}
.soma-xm-lrow__b{display:flex;flex-direction:column;gap:5px;font-size:1.0625rem;line-height:1.4;font-weight:500}
.soma-xm-lrow__go{color:var(--soma-secondary);font-size:.9375rem;font-weight:600;white-space:nowrap;padding-top:2px}
.soma-xm a.soma-xm-lrow:hover .soma-xm-lrow__go{text-decoration:underline;text-underline-offset:3px}
.soma-xm-lrow--off{color:var(--soma-text)}
.soma-xm-lrow--off .soma-xm-lrow__b{font-weight:400;font-size:1rem;color:var(--soma-text)}
@media (max-width:900px){
  .soma-xm .soma-xm-lrow{grid-template-columns:1fr;gap:6px}
  .soma-xm-lrow__k{padding-top:0}
  .soma-xm-lrow__k i{display:inline;margin:0 0 0 8px}
}
