/* DVS Familiar pathway styles.
   Embedded @font-face/base64 data removed; uses the theme's Proxima Nova files. */

/* =========================================================
     DVS Mid-Career Pathway
     ========================================================= */
  *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
  :root{
    --ink:#111;
    --ink-2:#444;
    --line:#333;
    --line-soft:#bbb;
    --paper:#ffffff;
    --paper-2:#f6f5f1;
    --grid:#ececec;
    --note:#ffe66b;
    --note-edge:#d9b800;
    --cork:#c69a6b;
    --cork-2:#a87a4d;
    --pin-red:#c0392b;
    --pin-blue:#2c5e8f;
    --pin-yel:#e6b800;
    /* DVS brand palette (mirrors the mid-career-pathway CSS) */
    --dvs-purple:#B85CB8;
    --dvs-teal:#3DBFB8;
    --dvs-amber:#E8A825;
    --dvs-navy:#1B3A6B;
    --dvs-coral:#C04A2A;
    --dvs-green:#3A7D3A;
    --pn:'Proxima Nova','Helvetica Neue',Arial,sans-serif;
    --mono:'Courier New','SF Mono',ui-monospace,monospace;
    --serif:Georgia,'Times New Roman',serif;
    --sans:'Proxima Nova','Helvetica Neue',Arial,sans-serif;
  }
  html,body{background:var(--paper);color:var(--ink);font-family:var(--sans);scroll-behavior:smooth}

  /* Section progress rail (sticky) */
  .progress-rail{
    position:fixed;left:24px;top:50%;transform:translateY(-50%);
    z-index:900;display:flex;flex-direction:column;gap:14px
  }
  .progress-dot{
    width:10px;height:10px;border:1.5px solid var(--dvs-teal);background:transparent;
    border-radius:50%;display:block;transition:background .2s,border-color .25s;
    position:relative;text-decoration:none
  }
  .progress-dot.active{background:var(--dvs-teal)}
  .progress-dot::after{
    content:attr(data-label);position:absolute;left:22px;top:-6px;
    font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
    white-space:nowrap;opacity:0;transition:opacity .2s;color:var(--dvs-teal);background:var(--paper);padding:4px 6px
  }
  .progress-dot:hover::after{opacity:1}
  /* Per-section colour modes */
  .progress-rail.mode-coral  .progress-dot{border-color:var(--dvs-coral)}
  .progress-rail.mode-coral  .progress-dot.active{background:var(--dvs-coral)}
  .progress-rail.mode-coral  .progress-dot::after{color:var(--dvs-coral)}
  .progress-rail.mode-green  .progress-dot{border-color:var(--dvs-green)}
  .progress-rail.mode-green  .progress-dot.active{background:var(--dvs-green)}
  .progress-rail.mode-green  .progress-dot::after{color:var(--dvs-green)}
  .progress-rail.mode-purple .progress-dot{border-color:var(--dvs-purple)}
  .progress-rail.mode-purple .progress-dot.active{background:var(--dvs-purple)}
  .progress-rail.mode-purple .progress-dot::after{color:var(--dvs-purple)}

  /* =====================================================
     COVER / HERO — full viewport
     ===================================================== */
  .cover{
    min-height:100vh;position:relative;
    width:100vw;left:50%;margin-left:-50vw;
    padding:48px max(100px,8vw);display:grid;grid-template-rows:auto 1fr auto;
    background:
      linear-gradient(var(--grid) 1px,transparent 1px) 0 0/40px 40px,
      linear-gradient(90deg,var(--grid) 1px,transparent 1px) 0 0/40px 40px,
      var(--paper);
  }
  .cover-meta{
    display:flex;justify-content:space-between;align-items:center;
    font-family:var(--mono);font-size:13px !important;letter-spacing:.12em;
    text-transform:uppercase;color:var(--ink-2)
  }
  #dvs-mid-root .cover-meta,
  #dvs-mid-root .cover-meta span{
    font-size:13px !important;
  }
  .cover-meta .crest{
    width:36px;height:36px;border:2px solid var(--ink);
    display:flex;align-items:center;justify-content:center;
    font-family:var(--serif);font-weight:700;font-size:14px
  }
  .cover-body{
    display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;
    margin-top:32px;min-width:0
  }
  .cover-text{min-width:0}
  .cover-text h1{
    font-family:var(--pn);
    font-size:clamp(44px,6.4vw,96px);
    line-height:.95;
    letter-spacing:-.01em;
    font-weight:700;
    text-transform:uppercase;
    color:var(--dvs-navy);
    margin-bottom:24px;
  }
  .cover-text h1 .word{display:block;overflow:hidden;padding:0 .04em}
  .cover-text h1 .word span{
    display:inline-block;
    transform:translateY(110%);
    animation:rise .8s cubic-bezier(.2,.7,.2,1) forwards;
  }
  .cover-text h1 .word:nth-child(1) span{animation-delay:.1s}
  .cover-text h1 .word:nth-child(2) span{animation-delay:.25s}
  .cover-text h1 .word:nth-child(3) span{animation-delay:.4s}
  .cover-text h1 .word:nth-child(4) span{animation-delay:.55s}
  @keyframes rise{to{transform:translateY(0)}}

  .cover-text .subhead{
    font-family:var(--pn);font-weight:600;font-size:18px;
    color:var(--dvs-teal);max-width:520px;line-height:1.4;margin-bottom:24px;
    letter-spacing:.01em;text-transform:uppercase
  }
  .cover-text .deck{
    font-family:var(--pn);font-size:15px;color:var(--ink-2);
    max-width:520px;line-height:1.7;border-top:1px solid var(--ink);
    padding-top:16px;margin-top:8px;font-weight:400
  }

  /* HERO FIGURE — pathway graphic (SVG) on the right of the cover */
  .hero-figure{
    position:relative;
    display:flex;align-items:center;justify-content:center
  }
  .hero-img{width:100%;height:auto;display:block}

  .cover-foot{
    display:flex;justify-content:space-between;align-items:flex-end;
    font-family:var(--mono);font-size:13px;letter-spacing:.1em;
    text-transform:uppercase;color:var(--ink-2)
  }
  .scroll-cue{display:flex;align-items:center;gap:10px}
  .scroll-cue .arrow{
    width:18px;height:34px;border:1.5px solid var(--ink);border-radius:10px;
    position:relative
  }
  .scroll-cue .arrow::before{
    content:'';position:absolute;left:50%;top:6px;width:2px;height:8px;
    background:var(--ink);transform:translateX(-50%);
    animation:scroll 1.4s ease-in-out infinite
  }
  @keyframes scroll{0%,100%{transform:translateX(-50%) translateY(0);opacity:1}50%{transform:translateX(-50%) translateY(8px);opacity:.3}}

  /* =====================================================
     SECTION SHELL
     ===================================================== */
  .section{
    padding:96px 64px 64px;position:relative
  }
  #dvs-mid-root .section{padding:0px 64px 64px !important}
  .section:last-of-type{padding-bottom:48px}
  #dvs-mid-root .section:last-of-type{padding-bottom:48px !important}
  .section-banner{
    display:block;width:100%;height:auto;margin-bottom:24px
  }
  .section.journalism .section-banner{
    border:1.5px solid var(--dvs-coral);box-shadow:4px 4px 0 var(--dvs-coral)
  }
  .section-num{
    font-family:var(--pn);font-weight:600;font-size:12px;letter-spacing:.18em;
    text-transform:uppercase;color:var(--ink-2);margin-bottom:24px;
    display:flex;align-items:center;gap:12px
  }
  .section-num::before{content:'';width:40px;height:2px;background:var(--ink)}
  .section.journalism .section-num::before{background:var(--dvs-coral)}
  .section.bi         .section-num::before{background:var(--dvs-teal)}
  .section.spatial    .section-num::before{background:var(--dvs-green)}
  .section.cc         .section-num::before{background:var(--dvs-purple)}

  /* Wireframe content placeholders */
  .wf-block{border:1.5px dashed var(--line-soft);background:rgba(0,0,0,.02);
    padding:18px;margin-bottom:14px;font-family:var(--mono);font-size:11px;
    letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
  .wf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-bottom:14px}
  .wf-card{border:1.5px dashed var(--line-soft);background:rgba(0,0,0,.02);
    padding:14px;min-height:100px;display:flex;flex-direction:column;gap:6px}
  .wf-card .wf-tag{font-family:var(--mono);font-size:9px;letter-spacing:.1em;
    text-transform:uppercase;color:var(--ink-2)}
  .wf-card .wf-bar{height:10px;background:#d8d4ca;border-radius:2px;width:80%}
  .wf-card .wf-bar.short{width:60%}
  .wf-card .wf-bar.tiny{width:40%;height:6px}
  .sub-label{font-family:var(--pn);font-weight:600;font-size:12px;letter-spacing:.14em;
    text-transform:uppercase;color:var(--ink-2);margin:36px 0 12px}
  .section.journalism .sub-label{color:var(--dvs-coral)}
  .section.bi         .sub-label{color:var(--dvs-teal)}
  .section.spatial    .sub-label{color:var(--dvs-green)}
  .section.cc         .sub-label{color:var(--dvs-purple)}

  /* Toggle stub (showing the dropdown affordance) */
  .toggle-stub{
    border-top:1px solid var(--line);padding:18px 0;
    display:flex;justify-content:space-between;align-items:center;
    font-family:var(--mono);font-size:11px;letter-spacing:.1em;
    text-transform:uppercase;color:var(--ink-2)
  }

  /* =====================================================
     SECTION 1 — DATA & VISUAL JOURNALISM (Pinboard letters)
     Real cork board + mixed typefaces + restrained palette
     ===================================================== */
  .section.journalism{background:var(--paper)}
  .pinboard{
    /* fine-grained cork: many tiny stippled speckles over a warm cream base */
    background-color:#d9b98a;
    background-image:
      radial-gradient(circle at 11% 22%,#a9805280 0 1.2px,transparent 1.8px),
      radial-gradient(circle at 63% 77%,#7a573080 0 1px,  transparent 1.6px),
      radial-gradient(circle at 82% 14%,#b9936080 0 .9px, transparent 1.4px),
      radial-gradient(circle at 24% 65%,#c8a47380 0 1.1px,transparent 1.7px),
      radial-gradient(circle at 47% 48%,#8e663880 0 .8px, transparent 1.3px),
      radial-gradient(circle at 91% 58%,#d8b784a0 0 1.4px,transparent 2px),
      radial-gradient(circle at 33% 92%,#6f4e2c80 0 .7px, transparent 1.2px),
      radial-gradient(circle at 7% 85%, #c09d6c80 0 1px,  transparent 1.6px),
      radial-gradient(circle at 58% 30%,#a88355a0 0 1px,  transparent 1.5px),
      linear-gradient(145deg,#e4c79b,#cda873 60%,#b78f58);
    background-size:
      9px 9px, 7px 7px, 11px 11px, 8px 8px, 6px 6px,
      10px 10px, 5px 5px, 7px 7px, 8px 8px, 100% 100%;
    background-position:
      0 0, 3px 3px, 6px 2px, 2px 5px, 4px 0,
      1px 6px, 3px 1px, 5px 4px, 0 3px, 0 0;
    padding:52px 36px 56px;border-radius:6px;
    box-shadow:
      inset 0 0 90px rgba(110,70,30,.35),
      inset 0 0 18px rgba(60,30,0,.25),
      0 4px 0 rgba(0,0,0,.15),
      0 12px 28px rgba(0,0,0,.2);
    display:flex;flex-direction:column;align-items:center;gap:10px;
    margin-bottom:24px;position:relative
  }
  /* subtle cork grain overlay */
  .pinboard::after{
    content:'';position:absolute;inset:0;pointer-events:none;border-radius:6px;
    background:
      repeating-linear-gradient(37deg,rgba(90,55,20,.06) 0 1px,transparent 1px 3px),
      repeating-linear-gradient(-52deg,rgba(200,170,120,.08) 0 1px,transparent 1px 4px);
    mix-blend-mode:multiply
  }

  .pin-letter{
    font-weight:700;
    font-size:clamp(34px,5.5vw,64px);
    line-height:1;
    letter-spacing:-.01em;
    padding:14px 18px;
    display:inline-flex;align-items:center;justify-content:center;
    min-width:72px;min-height:84px;
    color:#111;background:#f6efe0;
    box-shadow:2px 4px 10px rgba(0,0,0,.35);
    position:relative;z-index:1
  }
  /* RESTRAINED paper palette — cream default, dark, and coral accent */
  .pin-letter.c-cream {background:#f6efe0; color:#111}
  .pin-letter.c-white {background:#fdfbf5; color:#111}
  .pin-letter.c-dark  {background:#1f1f22; color:#fff}
  .pin-letter.c-coral {background:var(--dvs-coral); color:#fff}

  /* MIXED typefaces — each letter gets its own character */
  .pin-letter.f-sans    {font-family:'Helvetica Neue',Arial,sans-serif;font-weight:800}
  .pin-letter.f-serif   {font-family:Georgia,'Times New Roman',serif;font-weight:700}
  .pin-letter.f-slab    {font-family:'Rockwell','Courier New',Georgia,serif;font-weight:800}
  .pin-letter.f-italic  {font-family:Georgia,serif;font-weight:700;font-style:italic}
  .pin-letter.f-mono    {font-family:'Courier New',monospace;font-weight:700}
  .pin-letter.f-cond    {font-family:'Impact','Helvetica Neue Condensed','Arial Narrow',sans-serif;font-weight:400;letter-spacing:.04em}
  .pin-letter.f-script  {font-family:'Brush Script MT','Lucida Handwriting',cursive;font-weight:700}
  .pin-letter.f-times   {font-family:'Times New Roman',serif;font-weight:900;font-style:italic}
  .pin-letter.f-pal     {font-family:Palatino,'Palatino Linotype',serif;font-weight:700}
  .pin-letter.f-verd    {font-family:Verdana,Geneva,sans-serif;font-weight:900}
  .pin-letter.f-gara    {font-family:'Garamond','Times New Roman',serif;font-weight:700}
  .pin-letter.f-tahoma  {font-family:Tahoma,'Helvetica Neue',sans-serif;font-weight:900;font-style:italic}

  /* thumbtack */
  .pin-letter::before{
    content:'';position:absolute;top:6px;left:50%;transform:translateX(-50%);
    width:10px;height:10px;border-radius:50%;background:#222;
    box-shadow:0 1px 2px rgba(0,0,0,.4),inset -2px -2px 2px rgba(0,0,0,.3),inset 2px 2px 2px rgba(255,255,255,.35)
  }
  .pin-letter.space{background:transparent;box-shadow:none;min-width:20px;min-height:0;padding:0}
  .pin-letter.space::before{display:none}
  .pin-row{display:flex;justify-content:center;align-items:flex-end;gap:10px;flex-wrap:wrap;width:100%;position:relative;z-index:1}

  /* =====================================================
     SECTION 2 — BUSINESS INTELLIGENCE (typewriter / spreadsheet)
     ===================================================== */
  .section.bi{background:var(--paper)}
  .bi-title-stage{
    border:1.5px solid var(--dvs-teal);padding:0;background:#fff;
    box-shadow:4px 4px 0 var(--dvs-teal);margin-bottom:24px;
    overflow:hidden
  }
  .bi-cell-bar{
    display:flex;align-items:center;gap:10px;
    padding:8px 14px;background:#ededed;border-bottom:1px solid var(--ink);
    font-family:var(--mono);font-size:11px;color:var(--ink-2)
  }
  .bi-cell-bar .cell-ref{
    background:#fff;border:1px solid var(--line-soft);padding:3px 8px;min-width:60px
  }
  .bi-cell-bar .fx{font-style:italic;color:var(--ink-2)}
  .bi-title-row{
    display:grid;grid-template-columns:60px 1fr;border-bottom:1px solid var(--line-soft)
  }
  .bi-row-num{
    background:#ededed;border-right:1px solid var(--line-soft);
    display:flex;align-items:center;justify-content:center;
    font-family:var(--mono);font-size:12px;color:var(--ink-2)
  }
  .bi-typed{
    padding:20px 18px;font-family:var(--mono);font-weight:700;
    font-size:clamp(20px,3vw,44px);line-height:1.05;letter-spacing:-.01em;
    color:var(--ink);min-height:1.2em;
    display:flex;align-items:center;overflow:hidden
  }
  .bi-typed .typing{
    display:inline-block;overflow:hidden;white-space:nowrap;
    border-right:3px solid var(--dvs-teal);color:var(--dvs-navy);
    animation:type 3.2s steps(20,end) 1 forwards,blink .7s step-end infinite;
    width:0
  }
  @keyframes type{from{width:0}to{width:100%}}
  @keyframes blink{50%{border-color:transparent}}
  .bi-grid-preview{
    display:grid;grid-template-columns:60px repeat(4,1fr);
  }
  .bi-grid-preview > div{
    border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);
    padding:10px 12px;font-family:var(--mono);font-size:11px;color:var(--ink-2);
    background:#fff;height:36px
  }
  .bi-grid-preview > div.head{background:#ededed;font-weight:700;color:var(--ink)}
  .bi-grid-preview > div.rownum{background:#ededed;text-align:center}

  /* =====================================================
     SECTION 3 — SPATIAL MAPPING (map labels + contour lines)
     ===================================================== */
  .section.spatial{background:var(--paper)}
  .map-stage{
    position:relative;width:100%;
    border:1.5px solid var(--dvs-green);
    background:var(--paper-2);overflow:hidden;margin-bottom:24px;
    box-shadow:4px 4px 0 var(--dvs-green)
  }
  /* SVG drives the height — scales naturally with its 1200:340 viewBox */
  .map-stage svg{display:block;width:100%;height:auto;position:relative}
  .map-coords{
    position:absolute;font-family:var(--mono);font-size:10px;color:var(--ink-2);
    letter-spacing:.04em
  }
  .map-coords.tl{top:8px;left:10px}
  .map-coords.tr{top:8px;right:10px}
  .map-coords.bl{bottom:8px;left:10px}
  .map-coords.br{bottom:8px;right:10px}
  .map-title{
    position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);
    font-family:var(--pn);font-weight:700;
    font-size:clamp(20px,3vw,44px);letter-spacing:.08em;
    color:var(--dvs-navy);text-transform:uppercase;
    text-shadow:0 0 2px var(--paper-2),0 0 8px var(--paper-2);
    text-align:center;line-height:1
  }
  .map-title small{
    display:block;font-family:var(--pn);font-weight:600;font-size:11px;letter-spacing:.3em;
    color:var(--dvs-green);margin-top:8px
  }
  .map-pin{
    position:absolute;font-family:var(--mono);font-size:10px;text-transform:uppercase;
    letter-spacing:.1em;color:var(--ink);background:var(--paper);padding:2px 6px;
    border:1px solid var(--ink)
  }
  .map-pin::before{
    content:'';position:absolute;left:-6px;top:50%;width:5px;height:5px;
    background:var(--ink);border-radius:50%;transform:translateY(-50%)
  }

  /* =====================================================
     SECTION 4 — CREATIVE CODING (glitch/scramble on white)
     White background, mono title, DVS purple + teal ghosts
     ===================================================== */
  .section.cc{background:var(--paper);color:var(--ink)}
  .cc-stage{
    position:relative;background:#fafafa;
    border:1.5px solid var(--dvs-purple);
    box-shadow:4px 4px 0 var(--dvs-purple);
    padding:40px 24px;overflow:hidden;margin-bottom:24px;min-height:240px;
    display:flex;align-items:center;justify-content:center
  }
  .cc-stage::before{
    content:'';position:absolute;inset:0;
    background:
      linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px) 0 0/24px 24px,
      linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px) 0 0/24px 24px;
    pointer-events:none
  }
  .cc-title{
    font-family:var(--mono);font-weight:700;
    font-size:clamp(34px,5.5vw,72px);line-height:1.05;letter-spacing:-.01em;
    color:var(--ink);text-align:center;position:relative;z-index:2;
    display:inline-block
  }
  .cc-title-line{position:relative;display:block}
  .cc-title .scramble{
    display:inline-block;color:var(--ink);position:relative;z-index:3
  }
  .cc-title .ghost{
    position:absolute;left:0;top:0;
    color:var(--dvs-teal);mix-blend-mode:multiply;opacity:.75;
    animation:glitch 3s infinite;pointer-events:none;z-index:1
  }
  .cc-title .ghost.b{color:var(--dvs-purple);animation-delay:.4s;z-index:2}
  @keyframes glitch{
    0%,100%{transform:translate(0,0)}
    20%{transform:translate(4px,0)}
    40%{transform:translate(-3px,1px)}
    60%{transform:translate(0,-2px)}
  }
  .cc-meta{
    display:flex;justify-content:space-between;
    font-family:var(--mono);font-size:10px;color:var(--ink-2);
    border-top:1px solid var(--line-soft);padding-top:8px;margin-bottom:24px
  }

  /* =====================================================
     RESOURCE CONTENT (inside each expandable section toggle)
     Imported / adapted from the pasted pathway HTML so the real
     tables, cards, team grids, conference lists and contribute
     boxes render correctly. Typography bumped for readability.
     Subsection titles coloured per section (coral/teal/green/purple).
     ===================================================== */
  :root{
    --gray-dk:#444;--gray-md:#767676;--gray-lt:#aaa;
    --gray-border:#d8d8d8;--gray-line:#e0e0e0;
    --lbl-amber:#C8960C;--conf-orange:#D4620A;--award-pink:#AD1457
  }
  /* Intro paragraph under each section banner (always visible) */
  .section-intro{
    font-family:var(--pn);font-size:16px;font-weight:400;
    color:var(--gray-dk);line-height:1.75;margin:24px 0 40px;
    max-width:820px
  }

  /* Per-sub-section accordion toggle */
  .subtoggle{
    border-top:1px solid var(--gray-line)
  }
  .subtoggle:last-of-type{border-bottom:1px solid var(--gray-line)}
  .subtoggle summary{
    list-style:none;cursor:pointer;
    padding:18px 0;
    display:flex;justify-content:space-between;align-items:center;gap:12px;
    user-select:none
  }
  .subtoggle summary::-webkit-details-marker{display:none}
  .subtoggle .st-label{
    font-family:var(--pn);font-size:14px;font-weight:700;
    letter-spacing:.05em;text-transform:uppercase;line-height:1.3
  }
  .section.journalism .subtoggle .st-label{color:var(--dvs-coral)}
  .section.bi         .subtoggle .st-label{color:var(--dvs-teal)}
  .section.spatial    .subtoggle .st-label{color:var(--dvs-green)}
  .section.cc         .subtoggle .st-label{color:var(--dvs-purple)}
  .subtoggle .st-caret{
    font-family:var(--pn);font-size:18px;color:var(--gray-md);
    transition:transform .25s ease;flex-shrink:0
  }
  .subtoggle[open] .st-caret{transform:rotate(180deg)}
  .subtoggle .st-body{
    padding:4px 0 32px;
    font-family:var(--pn);font-size:16px;line-height:1.6
  }

  /* Tables */
  .data-table{width:100%;border-collapse:collapse;font-family:var(--pn);font-size:16px}
  .data-table th{
    font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
    color:var(--gray-md);padding:0 1rem .75rem 0;border-bottom:1px solid var(--gray-line);
    text-align:left
  }
  .data-table td{
    padding:.9rem 1rem .9rem 0;border-bottom:1px solid var(--gray-line);
    color:var(--gray-dk);vertical-align:top;line-height:1.55
  }
  .data-table td:first-child{font-weight:500;color:var(--ink);padding-right:1.5rem}
  .data-table tr:last-child td{border-bottom:none}
  .data-table tr:hover td{background:#f9f9f9}
  .tbl-link{text-decoration:none;font-weight:500}
  .tbl-link:hover{text-decoration:underline}

  /* Resource cards */
  .resource-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
  .resource-grid.two-col{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}
  .rcard{
    background:#fff;border:1px solid var(--gray-border);border-radius:6px;
    padding:1rem 1.15rem;display:flex;flex-direction:column;gap:6px;
    transition:border-color .15s
  }
  .rcard:hover{border-color:var(--dvs-teal)}
  .rcard-guide:hover{border-color:var(--lbl-amber)}
  .rcard-news:hover{border-color:var(--dvs-coral)}
  .rcard-pitch:hover{border-color:var(--dvs-green)}
  .rcard-label{
    font-family:var(--pn);font-size:12px;font-weight:600;letter-spacing:.08em;
    text-transform:uppercase;margin-bottom:2px
  }
  .rcard-name{font-family:var(--pn);font-size:16px;font-weight:600;color:var(--ink);line-height:1.35}
  .rcard-note{font-family:var(--pn);font-size:14px;color:var(--gray-md);line-height:1.5;flex:1}
  .rcard-link{
    font-family:var(--pn);font-size:13px;color:var(--dvs-teal);text-decoration:none;
    font-weight:500;margin-top:6px;display:inline-block
  }
  .rcard-link:hover{text-decoration:underline}
  .lbl-tool{color:var(--dvs-teal)}
  .lbl-guide{color:var(--lbl-amber)}
  .lbl-lib{color:var(--dvs-navy)}
  .lbl-comm{color:var(--gray-md)}
  .lbl-news{color:var(--dvs-coral)}
  .lbl-freelance{color:var(--dvs-green)}

  /* Team cards */
  .team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
  .team-card{
    border:1px solid var(--gray-border);border-radius:6px;padding:.85rem 1rem;
    display:block;text-decoration:none;color:inherit;
    transition:background .15s,border-color .15s
  }
  .team-card:hover{background:#e1f5f4;border-color:var(--dvs-teal)}
  .team-card-name{font-family:var(--pn);font-size:15px;font-weight:600;color:var(--ink);display:block}
  .team-card-note{font-size:13px;color:var(--gray-md);margin-top:3px}

  /* Conference & award list */
  .conf-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;list-style:none;padding:0}
  .conf-list li{
    border-radius:6px;font-size:14px;line-height:1.4;overflow:hidden;
    transition:background .15s,border-color .15s;
    border:1px solid var(--gray-border);background:transparent;color:var(--ink)
  }
  .conf-list li.conf-item:hover{background:#FDF0E8;border-color:#F0C4A0}
  .conf-list li.award-item:hover{background:#FDF0F5;border-color:#F5C6DA}
  .conf-list li a{display:flex;align-items:flex-start;gap:10px;padding:.7rem 1rem;width:100%;text-decoration:none;color:inherit}
  .conf-list li .conf-tag{
    font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    padding:3px 8px;border-radius:10px;white-space:nowrap;margin-top:2px;flex-shrink:0
  }
  .conf-list li.conf-item .conf-tag{background:#FDEBD8;color:var(--conf-orange)}
  .conf-list li.award-item .conf-tag{background:#FCE4EE;color:var(--award-pink)}
  .conf-list li span:last-child{font-weight:500;font-size:15px}

  /* Contribute box */
  .contribute-box{
    background:#f7fcfe;border:1px solid #c8e8ef;border-radius:6px;
    padding:1.6rem 1.9rem;margin-top:3rem
  }
  .contribute-box h4{
    font-family:var(--pn);font-size:13px;font-weight:700;letter-spacing:.12em;
    text-transform:uppercase;color:var(--dvs-teal);margin-bottom:1rem
  }
  .contribute-links{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0}
  .contribute-links li a{
    font-family:var(--pn);font-size:14px;color:var(--gray-dk);text-decoration:none;
    padding:6px 14px;border:1px solid var(--dvs-teal);border-radius:20px;
    display:inline-block;transition:background .15s;font-weight:500
  }
  .contribute-links li a:hover{background:#e1f5f4}

  /* Contribute box — colour per section */
  .section.journalism .contribute-box{background:#fff8f6;border-color:#f0c4a0}
  .section.journalism .contribute-box h4{color:var(--dvs-coral)}
  .section.journalism .contribute-links li a{border-color:var(--dvs-coral)}
  .section.journalism .contribute-links li a:hover{background:#fdf0e8}

  .section.bi .contribute-box{background:#f7fcfe;border-color:#c8e8ef}
  .section.bi .contribute-box h4{color:var(--dvs-teal)}
  .section.bi .contribute-links li a{border-color:var(--dvs-teal)}
  .section.bi .contribute-links li a:hover{background:#e1f5f4}

  .section.spatial .contribute-box{background:#f6fbf6;border-color:#b4ddb4}
  .section.spatial .contribute-box h4{color:var(--dvs-green)}
  .section.spatial .contribute-links li a{border-color:var(--dvs-green)}
  .section.spatial .contribute-links li a:hover{background:#e8f5e8}

  .section.cc .contribute-box{background:#fdf6ff;border-color:#e0b8e8}
  .section.cc .contribute-box h4{color:var(--dvs-purple)}
  .section.cc .contribute-links li a{border-color:var(--dvs-purple)}
  .section.cc .contribute-links li a:hover{background:#f5e8ff}

  /* All link accents stay DVS teal across every section */
  .tbl-link,
  .rcard-link{color:var(--dvs-teal) !important}

  /* Mobile collapse */
  @media (max-width:780px){
    .cover{padding:32px 24px}
    .cover-body{grid-template-columns:1fr;gap:24px}
/*     .hero-figure{height:280px} */
    .section{padding:64px 0px 96px}
    .progress-rail{display:none}
    }


  /* INTRO TEXT */
  .page-intro{
    padding:48px 64px 0;
  }
  .page-intro-text{
    font-family:var(--sans);font-size:16px;color:var(--ink-2);
    line-height:1.75;margin-bottom:20px;
    text-align:justify;hyphens:auto;-webkit-hyphens:auto;
  }
  .page-intro-text:last-child{margin-bottom:0}

  /* =========================================================
     WordPress isolation — prevents theme styles bleeding in
     ========================================================= */
  #dvs-mid-root { all: initial; display: block; font-family: var(--sans); background: #ffffff !important; color: var(--ink); width: 100%; box-sizing: border-box; }
  #dvs-mid-root * { box-sizing: border-box; }
  #dvs-mid-root a[target="_blank"]::after, #dvs-mid-root a::after, #dvs-mid-root a::before { display: none !important; content: none !important; background: none !important; width: 0 !important; height: 0 !important; }

/* Hide the default WordPress/theme header on pathway pages */
body.page-id-7375 .section-title {
  display: none !important;
}

/* =========================================================
   FAMILIAR HERO — Gutenberg-safe layout
   ========================================================= */

/* Full-width cover */
#dvs-mid-root .cover {
  position: relative;
}

/* Gutenberg inserts an inner container inside cover-meta.
   Make that inner container control the alignment. */
#dvs-mid-root .cover-meta {
  display: block !important;
  width: 100% !important;
}

#dvs-mid-root .cover-meta > .wp-block-group__inner-container {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* The original HTML included an empty first span.
   Hide it so only 2026 Edition remains. */
#dvs-mid-root .cover-meta span:first-child:empty,
#dvs-mid-root .cover-meta span:first-child {
  display: none;
}

#dvs-mid-root .cover-meta span:last-child {
  display: block;
  margin-left: auto;
  font-family: var(--mono);
  font-size: 13px !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-2);
}

/* The outer Gutenberg Group contains only the inner wrapper,
   so the outer element should not be the grid. */
#dvs-mid-root .cover-body:has(> .wp-block-group__inner-container) {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
}

/* Put the actual two-column grid on the element that directly
   contains .cover-text and .hero-figure. */
#dvs-mid-root .cover-body > .wp-block-group__inner-container {
  display: grid !important;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) !important;
  grid-template-areas: "text image" !important;
  column-gap: 48px !important;
  row-gap: 0 !important;
  align-items: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Fallback for markup without an inner wrapper */
#dvs-mid-root .cover-body:not(:has(> .wp-block-group__inner-container)) {
  display: grid !important;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) !important;
  grid-template-areas: "text image" !important;
  column-gap: 48px !important;
  align-items: center !important;
}

#dvs-mid-root .cover-text {
  grid-area: text !important;
  min-width: 0;
}

#dvs-mid-root .hero-figure {
  grid-area: image !important;
  min-width: 0;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  align-self: center !important;
}

/* Gutenberg puts hero-img on the figure, not directly on the img */
#dvs-mid-root figure.hero-img {
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
}

#dvs-mid-root figure.hero-img img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}

/* Keep the footer metadata aligned */
#dvs-mid-root .cover-foot > .wp-block-group__inner-container {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Tablet/mobile */
@media (max-width: 900px) {
  #dvs-mid-root .cover {
    padding: 64px 3.5rem 40px !important;
  }

  #dvs-mid-root .cover-body > .wp-block-group__inner-container,
  #dvs-mid-root .cover-body:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "text"
      "image" !important;
    row-gap: 32px !important;
  }

  #dvs-mid-root .hero-figure {
    max-width: 600px !important;
  }
}

@media (max-width: 600px) {
  #dvs-mid-root .cover {
    padding: 56px 1.5rem 32px !important;
  }
}

/* =========================================================
   FAMILIAR PAGE TABLES — Gutenberg/theme override
   Keep this at the end of dvs-familiar.css.
   ========================================================= */

/* Gutenberg wraps each table in a figure. */
#dvs-mid-root figure.wp-block-table,
#dvs-mid-root figure.wp-block-table.data-table {
  display: block;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: auto;
  border: 0 !important;
  background: transparent !important;
}

#dvs-mid-root figure.wp-block-table thead {
  border: 0 !important;
  background: transparent !important;
}

/* Restore the original table structure. */
#dvs-mid-root figure.wp-block-table table,
#dvs-mid-root table.data-table {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto;
  background: transparent !important;
  font-family: var(--pn);
  font-size: 16px;
}

/* Remove borders and backgrounds added by the WordPress theme. */
#dvs-mid-root figure.wp-block-table thead,
#dvs-mid-root figure.wp-block-table tbody,
#dvs-mid-root figure.wp-block-table tr,
#dvs-mid-root figure.wp-block-table th,
#dvs-mid-root figure.wp-block-table td,
#dvs-mid-root table.data-table thead,
#dvs-mid-root table.data-table tbody,
#dvs-mid-root table.data-table tr,
#dvs-mid-root table.data-table th,
#dvs-mid-root table.data-table td {
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
  background: transparent;
}

/* Header row */
#dvs-mid-root figure.wp-block-table th,
#dvs-mid-root table.data-table th {
  padding: 0 1rem 0.75rem 0 !important;
  border-bottom: 1px solid var(--gray-line) !important;
  color: var(--gray-md) !important;
  font-family: var(--pn);
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-align: left !important;
  text-transform: uppercase;
  vertical-align: bottom;
}

/* Body cells */
#dvs-mid-root figure.wp-block-table td,
#dvs-mid-root table.data-table td {
  padding: 0.9rem 1rem 0.9rem 0 !important;
  border-bottom: 1px solid var(--gray-line) !important;
  color: var(--gray-dk) !important;
  font-family: var(--pn);
  font-size: 16px !important;
  font-weight: 400;
  line-height: 1.55;
  text-align: left !important;
  vertical-align: top;
}

/* First column */
#dvs-mid-root figure.wp-block-table td:first-child,
#dvs-mid-root table.data-table td:first-child {
  width: 32%;
  padding-right: 1.5rem !important;
  color: var(--ink) !important;
  font-weight: 500;
}

/* Do not draw a line under the final row. */
#dvs-mid-root figure.wp-block-table tbody tr:last-child td,
#dvs-mid-root table.data-table tbody tr:last-child td {
  border-bottom: 0 !important;
}

/* Subtle row hover from the original design. */
#dvs-mid-root figure.wp-block-table tbody tr:hover td,
#dvs-mid-root table.data-table tbody tr:hover td {
  background-color: #f9f9f9 !important;
}

/* Table links */
#dvs-mid-root figure.wp-block-table a.tbl-link,
#dvs-mid-root table.data-table a.tbl-link {
  color: var(--dvs-teal) !important;
  font-weight: 500;
  text-decoration: none !important;
}

#dvs-mid-root figure.wp-block-table a.tbl-link:hover,
#dvs-mid-root table.data-table a.tbl-link:hover {
  text-decoration: underline !important;
}

/* Prevent Gutenberg captions from affecting layout if one is added later. */
#dvs-mid-root figure.wp-block-table figcaption {
  margin-top: 0.5rem;
  color: var(--gray-md);
  font-size: 13px;
  text-align: left;
}

/* Smaller screens: retain horizontal scrolling instead of crushing columns. */
@media (max-width: 700px) {
  #dvs-mid-root figure.wp-block-table table,
  #dvs-mid-root table.data-table {
    min-width: 680px;
  }
}

/* =========================================================
   FAMILIAR GUIDE CARDS — Gutenberg-safe
   ========================================================= */

/* When Gutenberg adds an inner wrapper, the outer block
   should stay full width and not become the grid itself. */
#dvs-mid-root .resource-grid:has(> .wp-block-group__inner-container) {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
}

/* Put the actual card grid on the element that directly
   contains the individual cards. */
#dvs-mid-root .resource-grid > .wp-block-group__inner-container {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Fallback for markup without a Gutenberg inner wrapper. */
#dvs-mid-root .resource-grid:not(:has(> .wp-block-group__inner-container)) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
}

/* Restore each card’s full layout. */
#dvs-mid-root .resource-grid .rcard {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100%;
  margin: 0 !important;
  padding: 1rem 1.1rem !important;
  background: #fff !important;
  border: 1px solid var(--gray-border) !important;
  border-radius: 6px !important;
}

/* Guide label */
#dvs-mid-root .resource-grid .rcard-label {
  display: block !important;
  margin: 0 0 0.45rem !important;
  color: var(--lbl-amber) !important;
  font-family: var(--pn);
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Card title */
#dvs-mid-root .resource-grid .rcard-name {
  display: block !important;
  margin: 0 0 0.5rem !important;
  color: var(--ink) !important;
  font-family: var(--pn);
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.4;
}

/* Preserve lighter inline text inside titles. */
#dvs-mid-root .resource-grid .rcard-name span {
  font-weight: 400 !important;
}

/* Links within cards */
#dvs-mid-root .resource-grid .rcard-link {
  display: block !important;
  width: fit-content;
  margin-top: 4px !important;
  color: var(--dvs-teal) !important;
  font-family: var(--pn);
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.45;
  text-decoration: none !important;
}

#dvs-mid-root .resource-grid .rcard-link:hover {
  text-decoration: underline !important;
}

/* Preserve internal link stacks generated from nested Groups. */
#dvs-mid-root .resource-grid .rcard > .wp-block-group__inner-container,
#dvs-mid-root .resource-grid .rcard .wp-block-group__inner-container {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  max-width: none;
  margin: 0;
}

/* Match the original hover border colour. */
#dvs-mid-root .resource-grid .rcard-guide:hover {
  border-color: var(--lbl-amber) !important;
}

/* Tablet and mobile */
@media (max-width: 760px) {
  #dvs-mid-root .resource-grid > .wp-block-group__inner-container,
  #dvs-mid-root .resource-grid:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================
   FAMILIAR TEAM GRIDS — final Gutenberg styling
   Keep at the very end of dvs-familiar.css.
   ========================================================= */

/* When Gutenberg adds an inner wrapper, keep the outer Group
   full width and apply the grid only to the direct card container. */
#dvs-mid-root .team-grid:has(> .wp-block-group__inner-container) {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
}

#dvs-mid-root .team-grid > .wp-block-group__inner-container {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Fallback when Gutenberg does not insert an inner wrapper. */
#dvs-mid-root .team-grid:not(:has(> .wp-block-group__inner-container)) {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
}

/* Card container */
#dvs-mid-root .team-grid .team-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0.85rem 1rem !important;

  color: var(--ink) !important;
  background: #ffffff !important;
  border: 1px solid var(--gray-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;

  transition:
    background-color 0.15s ease,
    border-color 0.15s ease;
}

/* Gutenberg may insert another inner wrapper in each card. */
#dvs-mid-root .team-grid .team-card > .wp-block-group__inner-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 3px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Remove WordPress block margins. */
#dvs-mid-root .team-grid .team-card p {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

/* Organization title */
#dvs-mid-root .team-grid .team-card-name {
  display: block !important;
  color: var(--ink) !important;
  font-family: var(--pn);
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

/* Override theme link styling. */
#dvs-mid-root .team-grid .team-card-name a,
#dvs-mid-root .team-grid .team-card-name a:link,
#dvs-mid-root .team-grid .team-card-name a:visited {
  display: block !important;
  color: var(--ink) !important;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-decoration: none !important;
  text-decoration-line: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Description */
#dvs-mid-root .team-grid .team-card-note {
  display: block !important;
  margin-top: 3px !important;
  color: var(--gray-md) !important;
  font-family: var(--pn);
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

/* Card hover should match the original page. */
#dvs-mid-root .team-grid .team-card:hover {
  background-color: #e1f5f4 !important;
  border-color: var(--dvs-teal) !important;
}

#dvs-mid-root .team-grid .team-card:hover .team-card-name a {
  color: var(--ink) !important;
  text-decoration: none !important;
}

/* Remove external-link icons injected by the theme. */
#dvs-mid-root .team-grid .team-card a::before,
#dvs-mid-root .team-grid .team-card a::after {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  content: none !important;
  background: none !important;
}

/* Large tablet: three columns */
@media (max-width: 1000px) {
  #dvs-mid-root .team-grid > .wp-block-group__inner-container,
  #dvs-mid-root .team-grid:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Tablet: two columns */
@media (max-width: 760px) {
  #dvs-mid-root .team-grid > .wp-block-group__inner-container,
  #dvs-mid-root .team-grid:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile: one column */
@media (max-width: 520px) {
  #dvs-mid-root .team-grid > .wp-block-group__inner-container,
  #dvs-mid-root .team-grid:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================
   FAMILIAR NEWSLETTER CARDS — final styling
   Keep at the end of dvs-familiar.css
   ========================================================= */

/* Apply the grid only to the element that directly contains cards. */
#dvs-mid-root .resource-grid:has(> .wp-block-group__inner-container) {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
}

#dvs-mid-root .resource-grid > .wp-block-group__inner-container {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Fallback when Gutenberg does not add an inner wrapper. */
#dvs-mid-root .resource-grid:not(:has(> .wp-block-group__inner-container)) {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
}

/* Newsletter card container */
#dvs-mid-root .resource-grid .rcard-news {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 166px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 1rem 1.1rem !important;

  background: #fff !important;
  border: 1px solid var(--gray-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;

  transition:
    border-color 0.15s ease,
    background-color 0.15s ease;
}

/* Gutenberg may add an inner wrapper inside the card. */
#dvs-mid-root .resource-grid .rcard-news > .wp-block-group__inner-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Remove default block spacing. */
#dvs-mid-root .resource-grid .rcard-news p {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

/* Newsletter label */
#dvs-mid-root .resource-grid .rcard-news .rcard-label,
#dvs-mid-root .resource-grid .rcard-news .lbl-news {
  display: block !important;
  margin: 0 0 0.5rem !important;
  color: var(--dvs-coral) !important;
  font-family: var(--pn);
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Title */
#dvs-mid-root .resource-grid .rcard-news .rcard-name {
  display: block !important;
  margin: 0 0 0.45rem !important;
  color: var(--ink) !important;
  font-family: var(--pn);
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

/* Description */
#dvs-mid-root .resource-grid .rcard-news .rcard-note {
  display: block !important;
  margin: 0 0 0.75rem !important;
  color: var(--gray-md) !important;
  font-family: var(--pn);
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  flex-grow: 1;
}

/* Link block */
#dvs-mid-root .resource-grid .rcard-news .rcard-link {
  display: block !important;
  width: auto !important;
  margin-top: auto !important;
  color: var(--dvs-teal) !important;
  font-family: var(--pn);
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

/* Actual link */
#dvs-mid-root .resource-grid .rcard-news .rcard-link a,
#dvs-mid-root .resource-grid .rcard-news .rcard-link a:link,
#dvs-mid-root .resource-grid .rcard-news .rcard-link a:visited {
  color: var(--dvs-teal) !important;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

#dvs-mid-root .resource-grid .rcard-news .rcard-link a:hover {
  text-decoration: underline !important;
}

/* Restore the external-arrow treatment without theme icons. */
#dvs-mid-root .resource-grid .rcard-news .rcard-link a::after {
  display: inline-block !important;
  content: "↗" !important;
  width: auto !important;
  height: auto !important;
  margin-left: 3px;
  background: none !important;
  color: currentColor;
  font-size: 12px;
  line-height: 1;
}

/* Hover treatment */
#dvs-mid-root .resource-grid .rcard-news:hover {
  border-color: var(--dvs-coral) !important;
  background: #fff !important;
}

/* Tablet */
@media (max-width: 850px) {
  #dvs-mid-root .resource-grid > .wp-block-group__inner-container,
  #dvs-mid-root .resource-grid:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 560px) {
  #dvs-mid-root .resource-grid > .wp-block-group__inner-container,
  #dvs-mid-root .resource-grid:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: 1fr !important;
  }
}

/* Base pill */
#dvs-mid-root .conf-list {
	margin: 0;
}

#dvs-mid-root .conf-list li .conf-tag {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  margin-top: 1px !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* First 11 are conferences */
#dvs-mid-root .conf-list li:nth-child(-n+11) .conf-tag {
  color: #d4620a !important;
  background-color: #fcebd9 !important;
}

/* Item 12 onward are awards */
#dvs-mid-root .conf-list li:nth-child(n+12) .conf-tag {
  color: #ad1457 !important;
  background-color: #fde5f0 !important;
}

/* Conference hover */
#dvs-mid-root .conf-list li:nth-child(-n+11):hover {
  background-color: #fdf0e8 !important;
  border-color: #f0c4a0 !important;
}

/* Award hover */
#dvs-mid-root .conf-list li:nth-child(n+12):hover {
  background-color: #fdf0f5 !important;
  border-color: #f5c6da !important;
}

/* =========================================================
   BUSINESS INTELLIGENCE HEADER — Gutenberg-safe
   Keep at the very end of dvs-familiar.css
   ========================================================= */

#dvs-mid-root .bi-title-stage {
  display: block !important;
/*   width: 100% !important; */
  max-width: none !important;
  margin: 0px 64px 24px 64px !important;
  padding: 0 !important;
  overflow: hidden !important;

  background: #fff !important;
  border: 1.5px solid var(--dvs-teal) !important;
  box-shadow: 4px 4px 0 var(--dvs-teal) !important;
}

/* Remove constrained Gutenberg widths from all BI header groups. */
#dvs-mid-root .bi-title-stage .wp-block-group__inner-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* ── Formula bar ── */

#dvs-mid-root .bi-cell-bar:has(> .wp-block-group__inner-container) {
  display: block !important;
}

#dvs-mid-root .bi-cell-bar > .wp-block-group__inner-container,
#dvs-mid-root .bi-cell-bar:not(:has(> .wp-block-group__inner-container)) {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 8px 14px !important;

  background: #ededed !important;
  border-bottom: 1px solid var(--ink) !important;

  color: var(--ink-2) !important;
  font-family: var(--mono) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

#dvs-mid-root .bi-cell-bar p,
#dvs-mid-root .bi-cell-bar span {
  margin: 0 !important;
}

#dvs-mid-root .bi-cell-bar .cell-ref {
  display: block !important;
  flex: 0 0 60px !important;
  min-width: 60px !important;
  padding: 3px 8px !important;

  background: #fff !important;
  border: 1px solid var(--line-soft) !important;
}

#dvs-mid-root .bi-cell-bar .fx {
  flex: 0 0 auto;
  color: var(--ink-2) !important;
  font-style: italic !important;
}

/* ── Main title row ── */

#dvs-mid-root .bi-title-row:has(> .wp-block-group__inner-container) {
  display: block !important;
}

#dvs-mid-root .bi-title-row > .wp-block-group__inner-container,
#dvs-mid-root .bi-title-row:not(:has(> .wp-block-group__inner-container)) {
  display: grid !important;
  grid-template-columns: 60px minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: none !important;

  border-bottom: 1px solid var(--line-soft) !important;
}

#dvs-mid-root .bi-row-num {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;

  background: #ededed !important;
  border-right: 1px solid var(--line-soft) !important;

  color: var(--ink-2) !important;
  font-family: var(--mono) !important;
  font-size: 12px !important;
}

#dvs-mid-root .bi-typed {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 86px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 20px 18px !important;
  overflow: hidden !important;

  color: var(--ink) !important;
  font-family: var(--mono) !important;
  font-size: clamp(20px, 3vw, 44px) !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.01em !important;
}

#dvs-mid-root .bi-typed p {
  margin: 0 !important;
}

/* The typing class may be on a Paragraph rather than a nested span. */
#dvs-mid-root .bi-typed .typing,
#dvs-mid-root .bi-typed p.typing {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
  white-space: nowrap !important;

  color: var(--dvs-navy) !important;
  border-right: 3px solid var(--dvs-teal) !important;
}

/*
 * Disable the original width:0 animation in Gutenberg.
 * The animation relies on the exact original span markup and
 * is what is currently clipping the title.
 */
#dvs-mid-root .bi-typed .typing {
  animation: none !important;
}

/* Optional blinking cursor without hiding the title. */
#dvs-mid-root .bi-typed .typing {
  animation: bi-cursor-blink 0.7s step-end infinite !important;
}

@keyframes bi-cursor-blink {
  50% {
    border-color: transparent;
  }
}

/* ── Spreadsheet preview ── */

#dvs-mid-root .bi-grid-preview:has(> .wp-block-group__inner-container) {
  display: block !important;
}

#dvs-mid-root .bi-grid-preview > .wp-block-group__inner-container,
#dvs-mid-root .bi-grid-preview:not(:has(> .wp-block-group__inner-container)) {
  display: grid !important;
  grid-template-columns: 60px repeat(4, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Gutenberg may convert each original cell into a Paragraph. */
#dvs-mid-root .bi-grid-preview > .wp-block-group__inner-container > *,
#dvs-mid-root .bi-grid-preview:not(:has(> .wp-block-group__inner-container)) > * {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 10px 12px !important;

  background: #fff !important;
  border-right: 1px solid var(--line-soft) !important;
  border-bottom: 1px solid var(--line-soft) !important;

  color: var(--ink-2) !important;
  font-family: var(--mono) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

/* Header cells */
#dvs-mid-root .bi-grid-preview .head {
  background: #ededed !important;
  color: var(--ink) !important;
  font-weight: 700 !important;
}

/* Spreadsheet row numbers */
#dvs-mid-root .bi-grid-preview .rownum {
  background: #ededed !important;
  text-align: center !important;
}

/* Mobile */
@media (max-width: 700px) {
  #dvs-mid-root .bi-title-row > .wp-block-group__inner-container,
  #dvs-mid-root .bi-title-row:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: 42px minmax(0, 1fr) !important;
  }

  #dvs-mid-root .bi-grid-preview > .wp-block-group__inner-container,
  #dvs-mid-root .bi-grid-preview:not(:has(> .wp-block-group__inner-container)) {
    grid-template-columns: 42px repeat(4, minmax(110px, 1fr)) !important;
    min-width: 620px !important;
  }

  #dvs-mid-root .bi-title-stage {
    overflow-x: auto !important;
  }

  #dvs-mid-root .bi-typed {
    min-height: 70px !important;
    font-size: clamp(20px, 8vw, 34px) !important;
  }
}

/* =========================================================
   BUSINESS INTELLIGENCE HEADER — final alignment corrections
   Must be placed after every previous BI header rule
   ========================================================= */

/* Match the width of the paragraph and accordion content below. */
#dvs-mid-root .section.bi .bi-title-stage-blocks {
  display: block !important;

  width: 100% !important;
  max-width: 990px !important;
  min-width: 0 !important;

  margin: 0 auto 24px !important;
  padding: 0 !important;

  left: auto !important;
  right: auto !important;
  transform: none !important;

  overflow: hidden !important;
}

/* Prevent an alignfull class or Gutenberg layout rule from breaking it out. */
#dvs-mid-root .bi-title-stage-blocks.alignfull,
#dvs-mid-root .bi-title-stage-blocks.alignwide {
  width: 100% !important;
  max-width: 990px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Gutenberg may add an inner wrapper to the outer Group. */
#dvs-mid-root
  .bi-title-stage-blocks
  > .wp-block-group__inner-container {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ──────────────────────────────────────────────────────────
   FORMULA BAR
   ────────────────────────────────────────────────────────── */

#dvs-mid-root .bi-title-stage-blocks .bi-cell-bar {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;

  width: 100% !important;
  max-width: none !important;
  min-height: 40px !important;

  margin: 0 !important;
  padding: 8px 14px !important;
}

#dvs-mid-root
  .bi-title-stage-blocks
  .bi-cell-bar
  > .wp-block-group__inner-container {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 10px !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* ──────────────────────────────────────────────────────────
   TITLE ROW
   ────────────────────────────────────────────────────────── */

#dvs-mid-root .bi-title-stage-blocks .bi-title-row {
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) !important;
  grid-template-rows: 86px !important;
  column-gap: 0 !important;
  row-gap: 0 !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 86px !important;

  margin: 0 !important;
  padding: 0 !important;
}

/*
 * Override flex-basis and intrinsic widths added by the
 * Gutenberg Columns block.
 */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-title-row
  > .wp-block-column {
  display: flex !important;
  flex-basis: auto !important;

  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 86px !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* Row number cell */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-title-row
  > .bi-row-num-column {
  grid-column: 1 !important;

  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;

  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;

  background: #ededed !important;
  border-right: 1px solid var(--line-soft) !important;
}

#dvs-mid-root .bi-title-stage-blocks .bi-row-num {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  min-height: 86px !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* Full-width title cell */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-title-row
  > .bi-title-column {
  grid-column: 2 !important;

  display: flex !important;
  align-items: center !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 86px !important;
}

/*
 * The previous width: fit-content caused the large blank area.
 * The heading must fill the entire second grid column.
 */
#dvs-mid-root .bi-title-stage-blocks h3.bi-typed {
  display: flex !important;
  align-items: center !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 86px !important;

  margin: 0 !important;
  padding: 20px 18px !important;

  overflow: hidden !important;
  white-space: nowrap !important;

  border-right: 0 !important;
}

/*
 * Put the cursor directly after the words instead of on the
 * far edge of the full-width title cell.
 */
#dvs-mid-root .bi-title-stage-blocks h3.bi-typed::after {
  display: inline-block !important;
  flex: 0 0 3px !important;

  width: 3px !important;
  height: 1.08em !important;
  margin-left: 8px !important;

  content: "" !important;
  background: var(--dvs-teal) !important;

  animation: bi-final-cursor 0.7s step-end infinite !important;
}

@keyframes bi-final-cursor {
  50% {
    opacity: 0;
  }
}

/* ──────────────────────────────────────────────────────────
   SPREADSHEET ROWS 2–4
   ────────────────────────────────────────────────────────── */

#dvs-mid-root .bi-title-stage-blocks figure.bi-grid-preview,
#dvs-mid-root .bi-title-stage-blocks .wp-block-table.bi-grid-preview {
  display: block !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;
}

/*
 * `display: table` and a definite width are important.
 * Gutenberg or the theme may otherwise size the table only
 * wide enough for its text.
 */
#dvs-mid-root
  .bi-title-stage-blocks
  figure.bi-grid-preview
  > table,
#dvs-mid-root
  .bi-title-stage-blocks
  .wp-block-table.bi-grid-preview
  > table {
  display: table !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  table-layout: fixed !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
}

/* Explicitly preserve all three rows. */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  tbody {
  display: table-row-group !important;
  width: 100% !important;
}

#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  tr {
  display: table-row !important;
  width: 100% !important;
  height: 38px !important;
}

/* Base cell sizing */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  td {
  display: table-cell !important;

  height: 38px !important;
  min-height: 38px !important;

  margin: 0 !important;
  padding: 10px 12px !important;

  overflow: hidden !important;
  vertical-align: middle !important;
}

/* Row-number column */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  td:first-child {
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;

  padding-left: 0 !important;
  padding-right: 0 !important;

  text-align: center !important;
}

/* Four equal spreadsheet data columns */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  td:nth-child(2),
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  td:nth-child(3),
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  td:nth-child(4),
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  td:nth-child(5) {
  width: calc((100% - 64px) / 4) !important;
  min-width: 0 !important;
  max-width: none !important;
}

/*
 * Empty cells sometimes collapse visually because the theme
 * removes their line-height. This preserves their row height.
 */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  td:empty::after {
  display: inline-block !important;
  content: "\00a0" !important;
}

/* Match the original header-row background. */
#dvs-mid-root
  .bi-title-stage-blocks
  .bi-grid-preview
  tr:first-child
  td {
  background: #ededed !important;
}

/* ──────────────────────────────────────────────────────────
   EDITOR OVERRIDES
   ────────────────────────────────────────────────────────── */

.editor-styles-wrapper
  #dvs-mid-root
  .bi-title-stage-blocks
  .wp-block-columns {
  display: grid !important;
}

.editor-styles-wrapper
  #dvs-mid-root
  .bi-title-stage-blocks
  .wp-block-table
  table {
  width: 100% !important;
  table-layout: fixed !important;
}

/* ──────────────────────────────────────────────────────────
   RESPONSIVE
   ────────────────────────────────────────────────────────── */

@media (max-width: 700px) {
  #dvs-mid-root .section.bi .bi-title-stage-blocks {
    max-width: 100% !important;
  }

  #dvs-mid-root .bi-title-stage-blocks .bi-title-row {
    grid-template-columns: 44px minmax(0, 1fr) !important;
  }

  #dvs-mid-root
    .bi-title-stage-blocks
    .bi-title-row
    > .bi-row-num-column,
  #dvs-mid-root
    .bi-title-stage-blocks
    .bi-grid-preview
    td:first-child {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
  }

  #dvs-mid-root .bi-title-stage-blocks h3.bi-typed {
    font-size: clamp(19px, 6.8vw, 32px) !important;
    padding: 16px 14px !important;
  }
}

/* =========================================================
   FAMILIAR HERO — FULL-VIEWPORT BREAKOUT FIX
   Prevent the WordPress content container from clipping the hero.
   ========================================================= */

/*
 * The cover intentionally extends beyond the normal site container.
 * These ancestors must allow that overflow to remain visible.
 */
body.page-id-7375 #site-content,
body.page-id-7375 #site-content > .section,
body.page-id-7375 #site-content > .section > .container,
body.page-id-7375 #site-content article#page-7375,
body.page-id-7375 #site-content article#page-7375.flow,
body.page-id-7375 #dvs-mid-root {
  overflow: visible !important;
}

/*
 * Prevent a horizontal scrollbar while allowing the cover
 * to reach both edges of the browser viewport.
 */
body.page-id-7375 {
  overflow-x: hidden;
  overflow-x: clip;
}

/*
 * Replace the left: 50% / margin-left: -50vw breakout with
 * the more reliable calc-based full-viewport breakout.
 */
body.page-id-7375 #dvs-mid-root .cover {
  position: relative !important;

  left: auto !important;
  right: auto !important;
  transform: none !important;

  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 0 !important;

  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;

  box-sizing: border-box !important;
}

/*
 * Remove any width constraint that the theme places on the
 * Gutenberg Group wrapper immediately inside the cover.
 */
body.page-id-7375
#dvs-mid-root
.cover > .wp-block-group__inner-container {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;
}

/*
 * Restore the intended desktop text/image proportions.
 * This overrides the 1fr / 1fr rule from the previous patch.
 */
@media (min-width: 901px) {
  body.page-id-7375
  #dvs-mid-root
  .cover-body > .wp-block-group__inner-container {
    grid-template-columns:
      minmax(0, 1.3fr)
      minmax(0, 1fr) !important;

    grid-template-areas: "text image" !important;
    column-gap: 48px !important;

    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  /*
   * Restore the original heading scale and reveal animation.
   * The title now has the full viewport space available.
   */
  body.page-id-7375 #dvs-mid-root .cover-text h1 {
    font-size: clamp(44px, 6.4vw, 96px) !important;
    text-align: left !important;
    text-indent: 0 !important;
  }

  body.page-id-7375 #dvs-mid-root .cover-text h1 .word {
    display: block !important;
    overflow: hidden !important;
    padding: 0 0.04em !important;
  }
}

/* Preserve the existing stacked mobile layout. */
@media (max-width: 900px) {
  body.page-id-7375
  #dvs-mid-root
  .cover-body > .wp-block-group__inner-container {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "text"
      "image" !important;
  }
}