/* ============================================================
   Momenthesis v2 — base.css
   Self-hosted fonts + shims that adapt the mockup design system
   to Gutenberg Query Loop / block markup.
   The full page design system lives in pg-*.css (one per view).
   ============================================================ */

/* ---------- Self-hosted webfonts (GDPR-safe, no Google CDN) ---------- */
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/bebas-neue-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/outfit-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/outfit-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/outfit-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/outfit-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Lora';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/lora-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Lora';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/lora-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Lora';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/lora-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Lora';font-style:italic;font-weight:600;font-display:swap;src:url(../fonts/lora-latin-600-italic.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/dm-sans-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/dm-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/dm-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/dm-mono-latin-500-normal.woff2) format('woff2')}

/* ---------- Query Loop grid shims ----------
   The Post Template block renders a <ul>; the design system expects
   grid children directly. We keep the mockup grid classes on the <ul>
   and make each <li> transparent to the grid. */
ul.wp-block-post-template.testi__grid,
ul.wp-block-post-template.cases-grid,
ul.wp-block-post-template.partners2,
ul.wp-block-post-template.ecourse__row,
ul.wp-block-post-template.all-col__list,
ul.wp-block-post-template.news-grid,
ul.wp-block-post-template.cs-side-list{list-style:none;margin:0;padding:0}
ul.wp-block-post-template.testi__grid>li,
ul.wp-block-post-template.cases-grid>li,
ul.wp-block-post-template.partners2>li,
ul.wp-block-post-template.ecourse__row>li,
ul.wp-block-post-template.news-grid>li{display:contents}
ul.wp-block-post-template.all-col__list>li,
ul.wp-block-post-template.cs-side-list>li{display:block}

/* ---------- Block element resets inside design-system cards ---------- */
.tc h3.tc__name,.case-card h3.case-card__title,.pt-card h3.pt-card__name,
.ecourse__col h3.ecourse__title,.news-card h3.news-card__title,
.all-item h3.all-item__title,.cs-feat h3.cs-feat__title,
.cs-side__example h4{margin:0}
.tc__q p,.ecourse__body p,.pt-card__body p{margin:0 0 .8rem;font:inherit;color:inherit;line-height:inherit}
.tc__q p:last-child,.ecourse__body p:last-child,.pt-card__body p:last-child{margin-bottom:0}
h3.tc__name a,h3.case-card__title a,h3.news-card__title a,h3.all-item__title a,
h3.cs-feat__title a,h4.cs-side__title a{color:inherit;text-decoration:none}

/* Empty bound paragraphs (missing meta) collapse away */
p.tc__stars:empty,p.tc__role:empty,p.ecourse__sub:empty,p.pt-card__sub:empty,
p.all-item__pub:empty,p.news-card__pub:empty,p.cs-feat__tag:empty,p.cs-side__tag:empty{display:none}

/* Protect design-system links from legacy page-builder global colors. */
.wp-site-blocks a.lnk{color:#73A9E0;text-decoration:none}
.wp-site-blocks a.lnk--w{color:#A8D0F5}

/* Featured images inside cards — the .cs-feat__img / .case-card__img wrappers
   keep the mockup gradient area even when no featured image is set. */
.cs-feat__img,.case-card__img{position:relative}
.cs-feat__img figure.cs-feat__media,.case-card__img figure.case-card__media{position:absolute;inset:0;margin:0;overflow:hidden}
.cs-feat__img figure.cs-feat__media img,.case-card__img figure.case-card__media img{width:100%;height:100%;object-fit:cover;display:block}
figure.pt-card__logo{margin:0;width:58px;height:58px;flex:0 0 58px}
figure.pt-card__logo img{width:100%;height:100%;object-fit:contain}

/* Read More block → design-system link */
a.wp-block-read-more{font-size:.8rem;font-weight:600;color:#73A9E0;text-decoration:none;display:inline-flex;align-items:center;gap:.3rem;transition:gap .22s cubic-bezier(.4,0,.2,1)}
a.wp-block-read-more:hover{gap:.52rem}
.cs-feat a.wp-block-read-more{color:#A8CAED}
.cs-feat a.wp-block-read-more:hover{color:#fff}

/* Query-loop buttons → design-system buttons */
.mm-q-btn .wp-block-button__link{display:inline-flex;align-items:center;gap:.5rem;padding:.72rem 1.7rem;border-radius:2px;font-family:'DM Sans',sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.04em;border:1.5px solid transparent;cursor:pointer;transition:all .22s cubic-bezier(.4,0,.2,1);text-decoration:none;background:#73A9E0;color:#161C2B}
.mm-q-btn .wp-block-button__link:hover{background:#232A3D;color:#fff;transform:translateY(-2px)}
.mm-q-link .wp-block-button__link{background:none;border:none;padding:0;font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#73A9E0;text-decoration:none;cursor:pointer}
.mm-q-link .wp-block-button__link:hover{color:#5A9AD4}

/* Post date + meta rows in query cards */
.all-item__meta,.news-card__meta-row{display:flex;gap:.45rem;align-items:baseline;font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:#A0AAB4}
.all-item__meta .wp-block-post-date,.news-card__meta-row .wp-block-post-date{font:inherit;color:inherit}
.all-item__meta p,.news-card__meta-row p{margin:0;font:inherit;color:inherit}
.all-item__meta p:not(:empty)::before,.news-card__meta-row p:not(:empty)::before{content:"· "}

/* Query pagination */
.wp-block-query-pagination{display:flex;gap:1rem;justify-content:center;margin:2.5rem 0 0;font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.wp-block-query-pagination a{color:#73A9E0;text-decoration:none}
.wp-block-query-pagination a:hover{color:#5A9AD4}
.wp-block-query-pagination .page-numbers.current{color:#141821;font-weight:600}

/* News archive header */
.mm-archive-head{padding:2.5rem 0 1rem}
.mm-archive-head .wp-block-query-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,4vw,3.5rem);line-height:.95;text-transform:uppercase;letter-spacing:.03em;margin:0}

/* Single post / case-study block shims */
.art-main__body>p:first-of-type{margin-top:0}
.article-meta p{margin:0;font:inherit;color:inherit;display:inline}
.stat-cell p{margin:0}
.wp-block-post-author{align-items:center;gap:.7rem}
.wp-block-post-author__avatar img{border-radius:50%}

/* Reduced motion safety net (the mockup's rule was truncated) */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---------- Late shims ---------- */
.cs-top>.wp-block-query{display:contents}
ul.wp-block-post-template.cs-feat-wrap{display:contents}
ul.wp-block-post-template.cs-feat-wrap>li{display:contents}
/* Kill the editor "flow layout" auto-margins inside hairline-gap grids —
   they render as grey strips at the top of grid cells. */
.all-view>*,.all-col>*,.cs-top>*,.cs-side>*,.testi__grid>*,.cases-grid>*,
.partners2>*,.ecourse__row>*{margin-block-start:0!important}
.cs-side .wp-block-query{display:block}
.cs-side-list .cs-side__link{display:block;padding:.7rem 0;border-top:1px solid rgba(255,255,255,.08)}
.cs-side__link-label{display:block;font-family:'DM Mono',monospace;font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;color:#A8CAED;margin-bottom:.2rem}
h4.cs-side__link-title{font-family:'Outfit',sans-serif;font-size:.85rem;font-weight:500;color:#fff;margin:0}
h4.cs-side__link-title a{color:inherit;text-decoration:none}
h4.cs-side__link-title a:hover{color:#A8CAED}
.wp-block-post-terms.news-card__type a{color:inherit;text-decoration:none}
.art-author .wp-block-post-author__name{font-family:'Outfit',sans-serif;font-weight:600}

/* ---------- Partial-row fix for dynamic grids ----------
   The mockup draws hairlines via a grey grid background + 1px gaps, which
   leaves grey "slabs" when the item count isn't a multiple of the columns.
   For Query Loop grids we draw the hairlines on the cards instead, so empty
   cells simply disappear. */
ul.wp-block-post-template.cases-grid,
ul.wp-block-post-template.partners2,
ul.wp-block-post-template.news-grid{background:transparent;border:none}
ul.wp-block-post-template.cases-grid .case-card,
ul.wp-block-post-template.news-grid .news-card{outline:1px solid #DDE3EA;background:#fff}
ul.wp-block-post-template.partners2 .pt-card{outline:1px solid #DDE3EA;background:#fff;height:100%}
/* Preserve the dark hover state defined by the Resources stylesheet.
   This must remain after the static Query Loop background shim above. */
ul.wp-block-post-template.cases-grid .case-card:hover{
	background:#232A3D;
}
ul.wp-block-post-template.cases-grid .case-card:hover .case-card__title,
ul.wp-block-post-template.cases-grid .case-card:hover .case-card__title a,
ul.wp-block-post-template.cases-grid .case-card:hover .case-card__body,
ul.wp-block-post-template.cases-grid .case-card:hover .case-card__body p{
	color:#fff;
}
ul.wp-block-post-template.cases-grid .case-card:hover .case-card__link{
	color:#73A9E0;
	border-top-color:rgba(255,255,255,.16);
}
ul.wp-block-post-template.news-grid .news-card:hover{
	background:#232A3D;
}
ul.wp-block-post-template.news-grid .news-card:hover .news-card__title,
ul.wp-block-post-template.news-grid .news-card:hover .news-card__title a{
	color:#fff;
}
ul.wp-block-post-template.news-grid .news-card:hover .news-card__excerpt,
ul.wp-block-post-template.news-grid .news-card:hover .news-card__excerpt p{
	color:rgba(255,255,255,.62);
}
ul.wp-block-post-template.news-grid .news-card:hover .news-card__meta,
ul.wp-block-post-template.news-grid .news-card:hover .news-card__meta-row{
	color:rgba(255,255,255,.45);
}
ul.wp-block-post-template.news-grid .news-card:hover .news-card__type,
ul.wp-block-post-template.news-grid .news-card:hover .wp-block-post-terms{
	color:#73A9E0;
}
ul.wp-block-post-template.news-grid .news-card:hover .news-card__link{
	color:#73A9E0;
	border-top-color:rgba(255,255,255,.16);
}

/* Branded fallback for case studies that do not yet have approved imagery. */
.case-card__img::before{
	content:"MOMENTHESIS \00B7 CASE STUDY";
	position:absolute;
	left:1.75rem;
	bottom:1.25rem;
	z-index:0;
	color:rgba(255,255,255,.58);
	font-family:var(--f-mono);
	font-size:.58rem;
	letter-spacing:.18em;
}
.case-card__img figure.case-card__media{z-index:1}

.all-col__empty{
	margin:0;
	padding:1.5rem 1.75rem;
	color:#7D8795;
	font-size:.78rem;
	line-height:1.6;
}

/* ---------- Frameworks & Downloads grid ---------- */
ul.wp-block-post-template.dl-grid{list-style:none;margin:1.75rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
ul.wp-block-post-template.dl-grid>li{display:contents}
.dl-card{background:#fff;outline:1px solid #DDE3EA;padding:1.6rem 1.75rem;display:flex;flex-direction:column;gap:.6rem;transition:transform .22s cubic-bezier(.4,0,.2,1),box-shadow .22s}
.dl-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(22,28,43,.08)}
p.dl-card__format{margin:0;font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#73A9E0}
h3.dl-card__title{margin:0;font-family:'Outfit',sans-serif;font-size:1rem;font-weight:600;color:#232A3D;line-height:1.35}
.dl-card__excerpt p{margin:0;font-size:.82rem;color:#5A6575;line-height:1.65}
.dl-card a.dl-card__link{margin-top:auto;padding-top:.5rem;font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase}
p.dl-card__format:empty{display:none}
@media(max-width:900px){ul.wp-block-post-template.dl-grid{grid-template-columns:1fr}}

/* Mobile card collections: swipe horizontally, one card at a time. */
html{scroll-padding-top:calc(var(--hh,68px) + 20px)}
[id]{scroll-margin-top:calc(var(--hh,68px) + 20px)}
@media(max-width:700px){
  .testi__grid,.team-grid,.diag-grid,.phases__track,.pillars__grid,.cases-grid,
  .news-grid,.all-view,.cs-bottom,.fw__grid{
    display:flex!important;
    grid-template-columns:none!important;
    overflow-x:auto!important;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    scrollbar-width:none;
    -ms-overflow-style:none;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
  }
  .testi__grid::-webkit-scrollbar,.team-grid::-webkit-scrollbar,.diag-grid::-webkit-scrollbar,
  .phases__track::-webkit-scrollbar,.pillars__grid::-webkit-scrollbar,.cases-grid::-webkit-scrollbar,
  .news-grid::-webkit-scrollbar,.all-view::-webkit-scrollbar,.cs-bottom::-webkit-scrollbar,
  .fw__grid::-webkit-scrollbar{display:none}
  .testi__grid>.tc,.team-grid>.tm,.diag-grid>.diag-cell,.phases__track>.phase,
  .pillars__grid>.pillar,.cases-grid>.case-card,.news-grid>.news-card,
  .all-view>.all-col,.cs-bottom>* ,.fw__grid>.fw__phase{
    flex:0 0 min(86vw,370px)!important;
    width:min(86vw,370px);
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  ul.wp-block-post-template.testi__grid>li,ul.wp-block-post-template.cases-grid>li,
  ul.wp-block-post-template.news-grid>li{
    display:block!important;
    flex:0 0 min(86vw,370px)!important;
    width:min(86vw,370px);
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  ul.wp-block-post-template.testi__grid>li>*,ul.wp-block-post-template.cases-grid>li>*,
  ul.wp-block-post-template.news-grid>li>*{height:100%}
  .fw__grid>.fw__arrow{display:none!important}
  .diag-cell{border-right:1px solid rgba(115,169,224,.18)!important;border-bottom:none!important}
  .tc{border-right:1px solid var(--grey)!important;border-bottom:none!important}
  .tm__photo{min-height:0!important}
}

/* Gated single: what's-inside list rendered from post content */
.gate-doc__list ul{display:flex;flex-direction:column;gap:.55rem;margin:0;padding:0;list-style:none}
.gate-doc__list li{position:relative;padding-left:1.4rem;font-size:.88rem;color:#3A4354;line-height:1.6}
.gate-doc__list li::before{content:'';position:absolute;left:0;top:.5em;width:14px;height:2px;background:#73A9E0}
p.gate-doc__type{margin:0}
.article-standfirst .wp-block-post-excerpt__excerpt{margin:0;font:inherit;color:inherit}
