/* Atlas Agency huisstijlhandboek: MkDocs Material in de look van atlasagency.nl.
   Elke kleur, maat, hoek en schaduw komt uit agency-tokens.css, dat build.py uit tokens.json maakt.
   Hier staan geen losse merkwaarden: wijzig tokens.json en bouw opnieuw. */

@font-face{font-family:"AA Inter";src:url("../fonts/Inter-var-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"AA Inter Tight";src:url("../fonts/InterTight-var-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"AA JetBrains Mono";src:url("../fonts/JetBrainsMono-var-latin.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}

:root,[data-md-color-scheme="default"]{
  --aa-f-body:"AA Inter",var(--ag-font-body);
  --aa-f-display:"AA Inter Tight",var(--ag-font-display);
  --aa-f-mono:"AA JetBrains Mono",var(--ag-font-mono);
  --md-text-font:"AA Inter";
  --md-code-font:"AA JetBrains Mono";
  --md-default-bg-color:var(--ag-color-white);
  --md-default-fg-color:var(--ag-color-ink);
  --md-default-fg-color--light:var(--ag-color-muted);
  --md-default-fg-color--lighter:rgba(10,22,40,.32);
  --md-default-fg-color--lightest:var(--ag-color-line);
  --md-primary-fg-color:var(--ag-color-white);
  --md-primary-fg-color--light:var(--ag-color-mist);
  --md-primary-fg-color--dark:var(--ag-color-ink);
  --md-primary-bg-color:var(--ag-color-ink);
  --md-primary-bg-color--light:var(--ag-color-muted);
  --md-accent-fg-color:var(--ag-color-blue-text);
  --md-accent-fg-color--transparent:rgba(14,165,255,.1);
  --md-typeset-color:var(--ag-color-ink);
  --md-typeset-a-color:var(--ag-color-blue-text);
  --md-typeset-table-color:var(--ag-color-line);
  --md-code-bg-color:var(--ag-color-mist);
  --md-code-fg-color:var(--ag-color-ink);
  --md-footer-bg-color:var(--ag-color-ink);
  --md-footer-bg-color--dark:var(--ag-color-ink);
  --md-footer-fg-color:#fff;
  --md-footer-fg-color--light:var(--ag-color-on-ink-muted);
  --md-footer-fg-color--lighter:rgba(255,255,255,.55);
}
html{scroll-behavior:smooth}
body{background:var(--ag-color-white);color:var(--ag-color-ink);font-family:var(--aa-f-body)}
.md-typeset{font-size:.84rem;line-height:1.65}
::selection{background:rgba(14,165,255,.25)}

/* header: wit, haarlijn, woordmerk */
.md-header{background:rgba(255,255,255,.97);color:var(--ag-color-ink);box-shadow:0 6px 24px -18px rgba(10,22,40,.45);border-bottom:1px solid var(--ag-color-line)}
.md-header__button.md-logo{padding:.3rem .4rem}
.md-header__button.md-logo img,.md-header__button.md-logo svg{height:1.5rem;width:auto}
.md-header__title{font-family:var(--aa-f-display);font-weight:650;letter-spacing:-.01em}
.md-header__topic:first-child{font-weight:650}
.md-search__form{background:var(--ag-color-mist);border-radius:var(--ag-radius-pill)}
.md-search__input{color:var(--ag-color-ink)}
.md-search__input::placeholder{color:var(--ag-color-muted)}
.md-search__icon{color:var(--ag-color-ink)}
.atlas-header-cta{margin:0 .4rem 0 .6rem;white-space:nowrap}
@media (max-width:59.9375em){.atlas-header-cta{display:none}}
.md-tabs{background:var(--ag-color-white);color:var(--ag-color-ink)}

/* navigatie */
.md-nav{font-size:.72rem}
.md-nav__link{color:var(--ag-color-ink)}
.md-nav__link:hover,.md-nav__link--active,.md-nav__item .md-nav__link--active{color:var(--ag-color-blue-text)!important;font-weight:600}
.md-nav--primary>.md-nav__list>.md-nav__item--section>label.md-nav__link,.md-nav__title{font-family:var(--aa-f-mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ag-color-blue-text)}
.md-nav--primary .md-nav__title{background:var(--ag-color-white)}

/* typografie in de pagina */
.atlas-page-eyebrow{margin:0 0 .6rem}
.atlas-eyebrow{font-family:var(--aa-f-mono);font-size:.62rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ag-color-blue-text)}
.md-typeset h1{font-family:var(--aa-f-display);font-weight:700;font-size:clamp(1.9rem,1.2rem + 2.4vw,2.9rem);line-height:1.04;letter-spacing:-.04em;color:var(--ag-color-ink);margin:0 0 1rem}
.md-typeset h2{font-family:var(--aa-f-display);font-weight:700;font-size:1.55rem;line-height:1.12;letter-spacing:-.03em;color:var(--ag-color-ink);margin:2.6rem 0 .8rem}
.md-typeset h3{font-family:var(--aa-f-display);font-weight:650;font-size:1.05rem;letter-spacing:-.015em;color:var(--ag-color-ink);margin:1.8rem 0 .5rem}
.md-typeset h4{font-family:var(--aa-f-mono);font-size:.62rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ag-color-blue-text)}
.md-typeset a{color:var(--ag-color-blue-text);text-underline-offset:2px}
.md-typeset a:hover{color:var(--ag-color-ink)}
.md-typeset .lead,.md-typeset p.lead{font-size:1rem;color:var(--ag-color-muted)}
.md-typeset code{background:var(--ag-color-mist);color:var(--ag-color-ink);border-radius:6px;padding:.05em .35em;font-size:.82em}
.md-typeset pre>code{border-radius:12px;padding:1rem 1.1rem}
.md-typeset table:not([class]){border:1px solid var(--ag-color-line);border-radius:16px;overflow:hidden;font-size:.74rem;box-shadow:none}
.md-typeset table:not([class]) th{background:var(--ag-color-mist);color:var(--ag-color-ink);font-weight:600}
.md-typeset table:not([class]) td{border-top:1px solid var(--ag-color-line)}
.md-typeset .admonition,.md-typeset details{border:1px solid var(--ag-color-line);border-left:3px solid var(--ag-color-blue);border-radius:16px;background:var(--ag-color-mist);box-shadow:none;font-size:.78rem}
.md-typeset .admonition-title,.md-typeset summary{background:transparent!important;font-weight:600}
.md-typeset .admonition-title::before,.md-typeset summary::before{background-color:var(--ag-color-blue-deep)!important}
.md-typeset .admonition.warning{border-left-color:#E0A100}
.md-typeset .admonition.danger{border-left-color:#D93A3A}
.md-typeset img{border-radius:0}

/* knoppen (exact de live .btn-primary en .aa-btn-ink) */
.atlas-cta,.atlas-ghost,.atlas-header-cta,.aa-btn{display:inline-flex;align-items:center;gap:.45em;border-radius:var(--ag-radius-pill);font-family:var(--aa-f-body);font-weight:600;letter-spacing:-.005em;text-decoration:none!important;border:1.5px solid transparent;transition:transform var(--ag-motion-fast) var(--ag-motion-ease),background-color var(--ag-motion-fast),box-shadow var(--ag-motion-fast),color var(--ag-motion-fast)}
.atlas-cta,.atlas-header-cta,.aa-btn-primary{background:var(--ag-color-blue);border-color:var(--ag-color-blue);color:var(--ag-color-ink)!important;box-shadow:var(--ag-shadow-btn-primary)}
.atlas-cta:hover,.atlas-header-cta:hover,.aa-btn-primary:hover{background:var(--ag-color-blue-hover);border-color:var(--ag-color-blue-hover);transform:translateY(-1px)}
.atlas-cta,.atlas-ghost{padding:.7rem 1.3rem;font-size:.8rem}
.atlas-header-cta{padding:.4rem 1rem;font-size:.7rem;box-shadow:none}
.atlas-ghost,.aa-btn-ink{background:transparent;border-color:var(--ag-color-ink);color:var(--ag-color-ink)!important}
.atlas-ghost:hover,.aa-btn-ink:hover{background:var(--ag-color-ink);color:#fff!important}
.aa-btn-light{background:transparent;border-color:rgba(255,255,255,.4);color:#fff!important}
.aa-btn-light:hover{background:#fff;color:var(--ag-color-ink)!important}
.aa-btn{padding:.9rem 1.6rem;font-size:1.02rem}
.aa-btn-sm{padding:.4rem 1rem;font-size:.8rem}
.aa-btn-arrow::after{content:" \2192";transition:translate .2s var(--ag-motion-ease)}
.aa-btn-arrow:hover::after{translate:4px 0}
.aa-btn:focus-visible,.atlas-cta:focus-visible,.atlas-ghost:focus-visible{outline:3px solid var(--ag-color-blue);outline-offset:3px}
.aa-btn[disabled]{opacity:.45;pointer-events:none}
svg.feather{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* home-hero: inkt over de echte bergenfoto van atlasagency.nl */
.atlas-hero{position:relative;margin:-1.2rem -.8rem 2rem;padding:clamp(2.5rem,6vw,5rem) clamp(1rem,4vw,3rem);border-radius:0 0 var(--ag-radius-card) var(--ag-radius-card);overflow:hidden;color:#fff;background:linear-gradient(180deg,rgba(10,22,40,.78),rgba(10,22,40,.92)),url("../img/mountains.webp") center/cover var(--ag-color-ink)}
@media (min-width:76.25em){.atlas-hero{margin:-1.2rem 0 2rem}}
.atlas-hero .dotline{display:flex;align-items:center;gap:.6rem;margin-bottom:1.2rem}
.atlas-hero .dot{width:8px;height:8px;border-radius:50%;background:var(--ag-color-blue);animation:aa-pulse 2.4s infinite}
@keyframes aa-pulse{0%{box-shadow:0 0 0 0 rgba(14,165,255,.55)}70%,100%{box-shadow:0 0 0 10px rgba(14,165,255,0)}}
.atlas-hero .atlas-eyebrow{color:var(--ag-color-blue)}
.md-typeset .atlas-hero h1{color:#fff;font-size:clamp(2.2rem,1.2rem + 4vw,4rem);line-height:1.02;letter-spacing:-.04em;margin:0 0 1.2rem;max-width:16ch}
.atlas-hero h1 em{font-style:normal;background:linear-gradient(92deg,var(--ag-color-blue) 0%,#7DD3FC 55%,#E0F2FE 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.atlas-hero p.lead{color:var(--ag-color-on-ink-muted);font-size:1rem;max-width:54ch}
.atlas-hero .btns{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.6rem}
.atlas-hero .atlas-ghost{border-color:rgba(255,255,255,.4);color:#fff!important}
.atlas-hero .atlas-ghost:hover{background:#fff;color:var(--ag-color-ink)!important}
.atlas-hero .checks{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-top:1.6rem;font-size:.72rem;color:var(--ag-color-on-ink-muted)}
.atlas-hero .checks span::before{content:"\2713";color:var(--ag-color-blue);margin-right:.4em;font-weight:700}
.atlas-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:2.2rem;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.12)}
.atlas-stats>div{background:rgba(10,22,40,.6);padding:1rem 1.1rem}
.atlas-stats b{display:block;font-family:var(--aa-f-mono);font-size:.9rem;color:#fff}
.atlas-stats i{display:inline-block;width:.8em;height:.8em;border-radius:50%;margin-right:.45em;vertical-align:-.05em;border:1px solid rgba(255,255,255,.3)}
.atlas-stats span{font-size:.68rem;color:var(--ag-color-on-ink-muted)}
@media (max-width:44em){.atlas-stats{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* kaarten en grids (live .aa-card) */
.atlas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:1rem;margin:1.2rem 0}
.atlas-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.atlas-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:44em){.atlas-grid.cols-2,.atlas-grid.cols-3{grid-template-columns:1fr}}
.atlas-card{display:block;background:#fff;border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);box-shadow:var(--ag-shadow-card);padding:1.2rem 1.25rem;color:var(--ag-color-ink)!important;text-decoration:none!important;transition:transform var(--ag-motion-base) var(--ag-motion-ease),box-shadow var(--ag-motion-base) var(--ag-motion-ease),border-color var(--ag-motion-base)}
a.atlas-card:hover{transform:translateY(-4px);box-shadow:var(--ag-shadow-card-hover);border-color:rgba(2,114,176,.35)}
.md-typeset .atlas-card h3{margin:.35rem 0 .35rem;font-size:1rem}
.md-typeset .atlas-card p{margin:0;font-size:.76rem;color:var(--ag-color-muted)}
.atlas-card .num{font-family:var(--aa-f-mono);font-size:.6rem;letter-spacing:.1em;color:var(--ag-color-blue-text)}
.atlas-card.ink{background:var(--ag-color-ink);color:#fff!important;border-color:var(--ag-color-ink)}
.md-typeset .atlas-card.ink p{color:var(--ag-color-on-ink-muted)}
.md-typeset .atlas-card.ink h3{color:#fff}
.atlas-card.ink .num{color:var(--ag-color-blue)}

/* kleurstalen */
.atlas-sw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1rem;margin:1.2rem 0}
.atlas-sw{border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);overflow:hidden;background:#fff;box-shadow:var(--ag-shadow-card)}
.atlas-sw i{display:block;height:6.5rem;border-bottom:1px solid var(--ag-color-line)}
.atlas-sw div{padding:.8rem 1rem 1rem;font-size:.72rem}
.atlas-sw b{display:block;font-family:var(--aa-f-display);font-size:.95rem}
.atlas-sw code{display:inline-block;margin:.2rem 0 .3rem;font-size:.75rem}
.atlas-sw small{display:block;color:var(--ag-color-muted);line-height:1.5}
.atlas-sw .tok{font-family:var(--aa-f-mono);font-size:.62rem;color:var(--ag-color-blue-text)}

/* contrastparen */
.atlas-pairs{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.8rem;margin:1.2rem 0}
.atlas-pair{border-radius:16px;padding:1rem 1.1rem;border:1px solid var(--ag-color-line);min-height:7.5rem;display:flex;flex-direction:column;justify-content:space-between}
.atlas-pair .t{font-family:var(--aa-f-display);font-weight:700;font-size:1.3rem;letter-spacing:-.02em}
.atlas-pair .m{font-family:var(--aa-f-mono);font-size:.6rem;letter-spacing:.04em;opacity:.95}
.atlas-badge{display:inline-block;font-family:var(--aa-f-mono);font-size:.58rem;font-weight:600;padding:.15rem .5rem;border-radius:999px;margin-left:.3rem;background:#fff;color:var(--ag-color-ink);border:1px solid var(--ag-color-line)}
.atlas-badge.fail{background:#FDE8E8;color:#8A1C1C}

/* logo's */
.atlas-logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1rem;margin:1.2rem 0}
.atlas-logo{border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);overflow:hidden;background:#fff;box-shadow:var(--ag-shadow-card)}
.atlas-logo .stage{height:9rem;display:flex;align-items:center;justify-content:center;padding:1.5rem;background:#fff;border-bottom:1px solid var(--ag-color-line)}
.atlas-logo .stage.mist{background:var(--ag-color-mist)}
.atlas-logo .stage.ink{background:var(--ag-color-ink)}
.atlas-logo .stage.blue{background:var(--ag-color-blue-deep)}
.atlas-logo .stage img{max-width:85%;max-height:100%}
.atlas-logo .stage img.icon{max-height:5rem}
.atlas-logo .cap{padding:.8rem 1rem 1rem;font-size:.72rem;color:var(--ag-color-muted)}
.atlas-logo .cap b{display:block;color:var(--ag-color-ink);font-size:.8rem}
.atlas-logo .cap .dl{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.5rem}
.atlas-logo .cap .dl a{font-family:var(--aa-f-mono);font-size:.6rem;padding:.15rem .55rem;border-radius:999px;background:var(--ag-color-mist);text-decoration:none;color:var(--ag-color-ink)}
.atlas-logo .cap .dl a:hover{background:var(--ag-color-blue)}
.atlas-dd{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:1rem;margin:1rem 0 1.6rem}
.atlas-dd figure{margin:0;border:1px solid var(--ag-color-line);border-radius:16px;overflow:hidden;background:#fff}
.atlas-dd img{display:block;width:100%;height:auto}
.atlas-dd figcaption{padding:.6rem .8rem .8rem;font-size:.7rem;text-align:left;color:var(--ag-color-ink)}
.atlas-dd figcaption::before{font-weight:700;margin-right:.35em}
.atlas-dd.do figcaption::before{content:"\2713  Wel";color:#0E7A43}
.atlas-dd.dont figcaption::before{content:"\2715  Niet";color:#B42318}
.atlas-dd.do figure{border-top:3px solid #12A15A}
.atlas-dd.dont figure{border-top:3px solid #D93A3A}
.atlas-figure{margin:1.2rem 0;border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);overflow:hidden;background:#fff}
.atlas-figure img{display:block;width:100%;height:auto}
.atlas-figure figcaption{padding:.6rem 1rem .8rem;font-size:.7rem;color:var(--ag-color-muted);text-align:left}
.atlas-minsize{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1.6rem;margin:1rem 0;padding:1.2rem;border:1px solid var(--ag-color-line);border-radius:16px}
.atlas-minsize figure{margin:0;text-align:left}
.atlas-minsize figcaption{font-family:var(--aa-f-mono);font-size:.58rem;color:var(--ag-color-muted);margin-top:.4rem}

/* typografie-specimen */
.atlas-spec{border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);padding:1.2rem 1.3rem;margin:1rem 0;background:#fff}
.atlas-spec .lbl{font-family:var(--aa-f-mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ag-color-blue-text)}
.atlas-spec .big{font-size:3.2rem;line-height:1;margin:.4rem 0 .5rem;letter-spacing:-.03em}
.atlas-spec .glyphs{font-size:.95rem;color:var(--ag-color-muted);word-break:break-all}
.atlas-spec.display .big,.atlas-spec.display .glyphs{font-family:var(--aa-f-display)}
.atlas-spec.display .big{font-weight:700;letter-spacing:-.04em}
.atlas-spec.body .big,.atlas-spec.body .glyphs{font-family:var(--aa-f-body)}
.atlas-spec.mono .big,.atlas-spec.mono .glyphs{font-family:var(--aa-f-mono)}
.atlas-spec.mono .big{font-size:2.2rem;letter-spacing:0}
.atlas-scale{padding:0}
.atlas-scale>div{display:grid;grid-template-columns:11rem 1fr;gap:1rem;align-items:baseline;padding:1rem 1.3rem;border-top:1px solid var(--ag-color-line)}
.atlas-scale>div:first-child{border-top:0}
.atlas-scale .k{font-family:var(--aa-f-mono);font-size:.6rem;color:var(--ag-color-muted);line-height:1.5}
.atlas-scale .v{color:var(--ag-color-ink);overflow-wrap:anywhere}
@media (max-width:44em){.atlas-scale>div{grid-template-columns:1fr;gap:.3rem}.atlas-spec .big{font-size:2.4rem}}

/* ruimte */
.atlas-space{display:flex;flex-direction:column;gap:.45rem;margin:1rem 0}
.atlas-space>div{display:grid;grid-template-columns:9rem 1fr;align-items:center;gap:1rem;font-size:.7rem}
.atlas-space .bar{height:.9rem;background:var(--ag-color-blue);border-radius:4px;opacity:.85;max-width:100%}
.atlas-space code{font-size:.7rem}
.atlas-radii{display:flex;flex-wrap:wrap;gap:1rem;margin:1rem 0}
.atlas-radii>div{width:7.5rem;text-align:center;font-size:.66rem;color:var(--ag-color-muted)}
.atlas-radii i{display:block;height:5rem;background:var(--ag-color-mist);border:1.5px solid var(--ag-color-blue-deep);margin-bottom:.4rem}
.atlas-shadows{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:1.4rem;margin:1rem 0 1.6rem;padding:1.4rem;background:var(--ag-color-mist);border-radius:var(--ag-radius-card)}
.atlas-shadows>div{background:#fff;border-radius:16px;padding:1rem;font-size:.66rem;min-height:5rem}
.atlas-shadows b{display:block;font-size:.76rem;margin-bottom:.2rem}
.atlas-gridview{position:relative;height:8rem;border-radius:16px;background:var(--ag-color-mist);overflow:hidden;margin:1rem 0;padding:0 1rem;display:grid;grid-template-columns:repeat(12,1fr);gap:.5rem}
.atlas-gridview span{background:rgba(14,165,255,.22);border-left:1px solid rgba(2,114,176,.35);border-right:1px solid rgba(2,114,176,.35)}

/* componenten (live agency.scss, één op één) */
.aa-stage{border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);padding:1.6rem;margin:1rem 0 .4rem;background:#fff;display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.aa-stage.mist{background:var(--ag-color-mist)}
.aa-stage.ink{background:var(--ag-color-ink);color:#fff}
.aa-stage.col{flex-direction:column;align-items:stretch}
.aa-code{font-family:var(--aa-f-mono);font-size:.62rem;color:var(--ag-color-muted);margin:0 0 1.4rem}
.aa-eyebrow{font-family:var(--aa-f-mono);font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ag-color-blue-text)}
.aa-stage.ink .aa-eyebrow{color:var(--ag-color-blue)}
.aa-more{font-weight:600;color:var(--ag-color-blue-text)!important;text-decoration:none!important;padding-right:1.35em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' fill='none' stroke='%230272B0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right .1em center/.95em no-repeat;transition:background-position .2s var(--ag-motion-ease)}
.aa-more:hover{background-position:right -.1em center}
.aa-card{background:#fff;border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);box-shadow:var(--ag-shadow-card);padding:1.6rem;max-width:20rem;flex:1 1 15rem;transition:transform var(--ag-motion-base) var(--ag-motion-ease),box-shadow var(--ag-motion-base) var(--ag-motion-ease),border-color var(--ag-motion-base)}
.aa-card:hover{transform:translateY(-4px);box-shadow:var(--ag-shadow-card-hover);border-color:rgba(2,114,176,.35)}
.aa-card h3{margin:.9rem 0 .4rem!important}
.aa-card p{color:var(--ag-color-muted);font-size:.8rem;margin:0 0 .8rem!important}
.aa-icon-tile{width:52px;height:52px;border-radius:var(--ag-radius-icon-tile);background:var(--ag-color-icon-tile);color:var(--ag-color-blue-deep);display:grid;place-items:center}
.aa-icon-tile svg{width:24px;height:24px}
.aa-chip{font-family:var(--aa-f-mono);font-size:.7rem;font-weight:500;padding:4px 10px;border-radius:var(--ag-radius-pill);background:var(--ag-color-mist);color:var(--ag-color-ink);border:1px solid rgba(10,22,40,.08)}
.aa-steps{display:flex;flex-wrap:wrap;gap:1.2rem;width:100%}
.aa-step{flex:1 1 9rem;text-align:center}
.aa-step-num{width:56px;height:56px;margin:0 auto .7rem;border-radius:50%;display:grid;place-items:center;font-family:var(--aa-f-mono);font-size:.8rem;color:var(--ag-color-blue);border:1px solid rgba(14,165,255,.45);box-shadow:0 0 0 6px rgba(14,165,255,.08);background:var(--ag-color-ink-2)}
.aa-step b{display:block;font-family:var(--aa-f-display);font-size:.9rem}
.aa-step small{color:var(--ag-color-on-ink-muted);font-size:.7rem}
.aa-faq{width:100%;border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-media);background:#fff;overflow:hidden}
.aa-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;font-weight:600;font-size:.85rem}
.aa-faq summary::-webkit-details-marker{display:none}
.aa-faq summary::after{content:"+";width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--ag-color-mist);color:var(--ag-color-blue-text);font-size:1.1rem}
.aa-faq[open] summary::after{content:"\2212"}
.aa-faq p{padding:0 1.2rem 1rem;margin:0;color:var(--ag-color-muted);font-size:.8rem}
.aa-browser{border-radius:var(--ag-radius-browser);overflow:hidden;background:#fff;box-shadow:var(--ag-shadow-browser);border:1px solid var(--ag-color-line)}
.aa-browser-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#F4F7FB;border-bottom:1px solid var(--ag-color-line);font-family:var(--aa-f-mono);font-size:.6rem;color:var(--ag-color-muted)}
.aa-browser-bar span{width:9px;height:9px;border-radius:50%;background:#D5DCE6;flex:none}
.aa-browser-bar em{font-style:normal;margin-left:.6rem}
.aa-browser img{display:block;width:100%;height:auto}
.aa-field{display:flex;flex-direction:column;gap:.35rem;flex:1 1 14rem;font-size:.75rem;font-weight:600}
.aa-field input{font:inherit;font-weight:400;font-size:.85rem;border:1px solid rgba(10,22,40,.18);border-radius:var(--ag-radius-input);padding:.75rem 1rem;color:var(--ag-color-ink);background:#fff}
.aa-field input:focus{outline:none;border-color:var(--ag-color-blue);box-shadow:0 0 0 4px rgba(14,165,255,.18)}
.aa-price{font-family:var(--aa-f-display);font-weight:700;font-size:2.2rem;letter-spacing:-.04em;line-height:1}
.aa-unit{font-size:.75rem;color:var(--ag-color-muted);margin-left:.3rem}
.aa-list{list-style:none;padding:0!important;margin:1rem 0!important}
.aa-list li{position:relative;padding-left:1.7rem;margin:.4rem 0!important;font-size:.8rem}
.aa-list li::before{content:"";position:absolute;left:0;top:.2em;width:1.15rem;height:1.15rem;border-radius:50%;background:var(--ag-color-icon-tile) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%230284C7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/.75rem no-repeat}

/* beeld */
.atlas-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1.2rem;margin:1.2rem 0}
.atlas-gallery figure{margin:0}
.atlas-gallery figcaption{font-size:.68rem;color:var(--ag-color-muted);margin-top:.5rem;text-align:left}
.atlas-gallery figcaption b{color:var(--ag-color-ink)}
.atlas-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--ag-radius-media);box-shadow:var(--ag-shadow-media);display:block}

/* sjablonen */
.atlas-tpl{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:1.2rem;margin:1.2rem 0}
.atlas-tpl figure{margin:0;border:1px solid var(--ag-color-line);border-radius:var(--ag-radius-card);overflow:hidden;background:var(--ag-color-mist)}
.atlas-tpl .thumb{padding:1rem;display:flex;align-items:center;justify-content:center;min-height:15rem}
.atlas-tpl .thumb img{max-width:100%;max-height:22rem;box-shadow:var(--ag-shadow-media);border-radius:6px;background:#fff}
.atlas-tpl figcaption{background:#fff;padding:.8rem 1rem 1rem;font-size:.72rem;color:var(--ag-color-muted);text-align:left;border-top:1px solid var(--ag-color-line)}
.atlas-tpl figcaption b{display:block;color:var(--ag-color-ink);font-size:.82rem}
.atlas-tpl figcaption .dl{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.5rem}
.atlas-tpl figcaption .dl a{font-family:var(--aa-f-mono);font-size:.6rem;padding:.15rem .55rem;border-radius:999px;background:var(--ag-color-mist);text-decoration:none;color:var(--ag-color-ink)}

/* tone of voice */
.atlas-say{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}
.atlas-say>div{border-radius:16px;padding:1rem 1.1rem;font-size:.8rem;border:1px solid var(--ag-color-line)}
.atlas-say .yes{background:#EAF7F0;border-color:#BFE6D0}
.atlas-say .no{background:#FDF0F0;border-color:#F3CACA}
.atlas-say b{display:block;font-family:var(--aa-f-mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.3rem}
@media (max-width:44em){.atlas-say{grid-template-columns:1fr}}

/* endorsement */
.atlas-endorse{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;padding:1.2rem 1.4rem;border-radius:var(--ag-radius-card);background:var(--ag-color-ink);color:#fff;margin:1.2rem 0}
.atlas-endorse img{height:2.2rem;width:auto}
.atlas-endorse p{margin:0!important;color:var(--ag-color-on-ink-muted);font-size:.78rem;flex:1 1 16rem}
.atlas-endorse a{color:var(--ag-color-blue)!important}

/* footer */
.md-footer-meta{background:var(--ag-color-ink)}
.md-footer-copyright{font-size:.64rem;color:var(--ag-color-on-ink-muted)}
.md-footer-copyright a{color:#fff}
.md-footer__inner{background:var(--ag-color-ink)}
.md-typeset figcaption{font-style:normal;max-width:none;margin:0}
.md-typeset .atlas-tpl figure,.md-typeset .atlas-gallery figure,.md-typeset .atlas-dd figure,.md-typeset .atlas-minsize figure{display:block;width:auto;max-width:none;margin:0}
.md-typeset .atlas-figure{display:block;width:auto;max-width:none;margin:1.2rem 0}
.md-typeset .atlas-tpl figcaption,.md-typeset .atlas-dd figcaption,.md-typeset .atlas-figure figcaption{margin:0;max-width:none}
