/* ============================================================
   INNER PAGES DESIGN SYSTEM — Atlas Agency 2026
   Restores layout for diensten/werkwijze/over-ons/contact/faq/manifest/cases
   (these classes were missing from the theme, causing unstyled pages)
   ============================================================ */

/* Shared section scaffold */
.atlas-section{padding:80px 0}
@media (max-width:680px){.atlas-section{padding:56px 0}}
.hairline{border:0;height:1px;background:var(--line);margin:0}
.container-wide{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}

/* Page hero */
.page-hero{padding:80px 0 40px;position:relative}
.page-hero .eyebrow{font-family:var(--font-mono);font-size:12px;color:var(--blue);letter-spacing:0.18em;text-transform:uppercase;display:block;margin-bottom:16px;font-weight:500}
.page-hero h1{font-family:var(--font-display);font-size:clamp(44px,7vw,92px);line-height:0.95;letter-spacing:-0.035em;font-weight:700;margin:0}
.page-hero h1 em{font-style:italic;font-weight:500;color:var(--blue)}
.page-hero__grid{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:end}
.page-hero .lead{font-size:clamp(16px,1.4vw,19px);color:var(--ink-80);line-height:1.6;margin:0;max-width:54ch}
@media (max-width:820px){.page-hero__grid{grid-template-columns:1fr;gap:24px}}
.eyebrow{font-family:var(--font-mono);font-size:12px;color:var(--blue);letter-spacing:0.18em;text-transform:uppercase;display:block;font-weight:500}
.lead{font-size:clamp(16px,1.4vw,19px);color:var(--ink-80);line-height:1.65}

/* Buttons */
.btn-arrow{display:inline-flex;align-items:center;gap:8px}
.btn-arrow svg{transition:transform .2s var(--ease)}
.btn-arrow:hover svg{transform:translateX(3px)}

/* ============ DIENSTEN (svc rows) ============ */
.svc-row{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:48px;padding:56px 0;border-top:1px solid var(--line)}
.svc-row:first-child{border-top:none}
.svc-row__sticky{position:sticky;top:110px;align-self:start}
.svc-row__num{font-family:var(--font-mono);font-size:12px;color:var(--blue);letter-spacing:0.16em;margin-bottom:14px}
.svc-row__title{font-family:var(--font-display);font-size:clamp(28px,3.6vw,44px);line-height:1.02;letter-spacing:-0.03em;font-weight:700;margin:0 0 16px}
.svc-row__title em{font-style:italic;font-weight:500;color:var(--blue)}
.svc-row__lead{color:var(--ink-80);font-size:16px;line-height:1.6;margin:0;max-width:36ch}
.svc-row__body{display:grid;gap:28px}
.svc-deliv{display:grid;gap:18px}
.svc-deliv > div{display:grid;gap:4px}
.svc-deliv b{font-family:var(--font-display);font-size:16px;font-weight:600;color:var(--ink)}
.svc-deliv span{color:var(--ink-80);font-size:15px;line-height:1.55}
.svc-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:20px;border-top:1px solid var(--line)}
.svc-meta .l{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-60);letter-spacing:0.12em;text-transform:uppercase;margin-bottom:6px}
.svc-meta .v{font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--ink)}
.svc-tools{display:flex;flex-wrap:wrap;gap:8px}
.svc-tools span{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-60);background:var(--surface-1);border:1px solid var(--line);padding:5px 12px;border-radius:999px}
@media (max-width:900px){.svc-row{grid-template-columns:1fr;gap:24px;padding:40px 0}.svc-row__sticky{position:static}.svc-meta{grid-template-columns:1fr 1fr}}

/* Bundles */
.bundle{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:36px}
@media (max-width:780px){.bundle{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px}
.card h3{font-family:var(--font-display);font-size:24px;font-weight:600;letter-spacing:-0.02em;margin:14px 0 10px;line-height:1.1}
.card p{color:var(--ink-80);font-size:14.5px;line-height:1.6;margin:0}
.card .price{font-family:var(--font-display);font-size:34px;font-weight:600;letter-spacing:-0.02em;margin-top:24px;display:flex;align-items:baseline;gap:10px}
.card .price small{font-family:var(--font-mono);font-size:11px;color:var(--ink-60);letter-spacing:0.08em;text-transform:uppercase}
.card .chip{display:inline-block;font-family:var(--font-mono);font-size:10.5px;background:rgba(14,165,255,0.1);color:var(--blue-text);padding:4px 10px;border-radius:999px;letter-spacing:0.10em;text-transform:uppercase;font-weight:500}

/* ============ WERKWIJZE (timeline) ============ */
.timeline{display:grid;gap:0;margin-top:32px}
.ts{display:grid;grid-template-columns:120px 1fr 220px;gap:40px;padding:44px 0;border-top:1px solid var(--line);align-items:start}
.ts:first-child{border-top:none}
.ts__week{font-family:var(--font-mono);font-size:11px;color:var(--blue);letter-spacing:0.14em;text-transform:uppercase;margin-bottom:10px;font-weight:500}
.ts__num{font-family:var(--font-display);font-size:clamp(48px,6vw,72px);font-weight:700;line-height:1;color:var(--ink);letter-spacing:-0.04em;opacity:0.15}
.ts__main h3{font-family:var(--font-display);font-size:clamp(22px,2.6vw,30px);font-weight:600;letter-spacing:-0.02em;margin:0 0 14px;line-height:1.1}
.ts__main p{color:var(--ink-80);font-size:16px;line-height:1.6;margin:0 0 18px}
.ts__activities{margin:0;padding-left:20px;color:var(--ink-80);font-size:14.5px;line-height:1.6;display:grid;gap:8px}
.ts__side{background:var(--surface-1);border:1px solid var(--line);border-radius:16px;padding:22px}
.ts__side h4{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-60);letter-spacing:0.12em;text-transform:uppercase;font-weight:500;margin:0 0 14px}
.ts__side ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.ts__side li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;color:var(--ink-80)}
.ts__side li b{color:var(--ink);font-weight:600;text-align:right}
.ts__side .who{display:flex;gap:6px;margin-top:10px}
.ts__side .who span{width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:var(--font-mono);font-size:11px;font-weight:600}
@media (max-width:900px){.ts{grid-template-columns:1fr;gap:18px;padding:32px 0}.ts__side{grid-column:1}}

/* Principles */
.principles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:36px}
.principles > div{background:var(--surface-1);border:1px solid var(--line);border-radius:16px;padding:26px}
.principles .n{font-family:var(--font-mono);font-size:11px;color:var(--blue);letter-spacing:0.12em;display:block;margin-bottom:14px}
.principles h4{font-family:var(--font-display);font-size:17px;font-weight:600;margin:0 0 8px}
.principles p{color:var(--ink-80);font-size:14px;line-height:1.6;margin:0}
@media (max-width:900px){.principles{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.principles{grid-template-columns:1fr}}

/* FAQ */
.faq{display:grid;margin-top:28px}
.faq-item{border-bottom:1px solid var(--line);padding:20px 0}
.faq-item summary{font-size:17px;font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--font-display)}
.faq-item summary::after{content:"+";font-size:22px;color:var(--blue);flex-shrink:0}
.faq-item[open] summary::after{content:"–"}
.faq-item div{margin-top:14px;color:var(--ink-80);font-size:15.5px;line-height:1.65;max-width:680px}

/* ============ CONTACT ============ */
.contact-hero{padding:80px 0 32px}
.contact-hero h1{font-family:var(--font-display);font-size:clamp(44px,7vw,88px);line-height:0.95;letter-spacing:-0.035em;font-weight:700;margin:0}
.contact-hero h1 em{font-style:italic;font-weight:500;color:var(--blue)}
.contact-hero .lead{color:var(--ink-80);font-size:17px;line-height:1.6}
.contact-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;gap:40px}}
.contact-form{background:#fff;border:1px solid var(--line);border-radius:20px;padding:32px}
.contact-form h3{font-family:var(--font-display);font-size:24px;font-weight:600;margin:0 0 24px}
.field{margin-bottom:18px}
.field label{display:block;font-family:var(--font-mono);font-size:11px;color:var(--ink-60);letter-spacing:0.12em;text-transform:uppercase;margin-bottom:8px;font-weight:500}
.field input,.field textarea{width:100%;padding:13px 16px;border:1px solid var(--line-strong);border-radius:10px;font-size:15px;color:var(--ink);background:var(--bg);font-family:var(--font-body);transition:border-color .2s}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue)}
.field textarea{min-height:120px;resize:vertical}
.pkg-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pkg-grid label{display:flex;align-items:center;gap:8px;font-family:var(--font-body);font-size:14px;color:var(--ink-80);cursor:pointer;text-transform:none;letter-spacing:0}
.pkg-grid input{width:auto;margin:0}
@media (max-width:560px){.pkg-grid{grid-template-columns:1fr}}
.contact-info ul{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:16px}
.contact-info li{display:flex;gap:16px;align-items:flex-start}
.contact-info .icon{width:40px;height:40px;border-radius:12px;background:var(--surface-1);display:grid;place-items:center;color:var(--blue);flex-shrink:0}
.contact-info li span{font-family:var(--font-mono);font-size:10px;color:var(--ink-60);letter-spacing:0.14em;display:block;margin-bottom:3px}
.contact-info li b{font-size:15px;color:var(--ink);font-weight:600;display:block}
.contact-info li b a{color:var(--ink)}
.ecosystem{margin-top:36px;padding-top:28px;border-top:1px solid var(--line)}
.ecosystem h4{font-family:var(--font-display);font-size:17px;font-weight:600;margin:0}
.ecosystem .links{display:grid;gap:8px;margin-top:14px}
.ecosystem .links a{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:var(--surface-1);border:1px solid var(--line);border-radius:12px;color:var(--ink);text-decoration:none;transition:border-color .2s,transform .2s}
.ecosystem .links a:hover{border-color:var(--blue);transform:translateX(2px)}
.ecosystem .links a b{font-size:14px;font-weight:600}
.ecosystem .links a span{font-size:12.5px;color:var(--ink-60)}

/* ============ CASES (page-cases) ============ */
.cases-hero{padding:80px 0 40px}
.cases-hero h1{font-family:var(--font-display);font-size:clamp(44px,7vw,92px);line-height:0.95;letter-spacing:-0.035em;font-weight:700;margin:0}
.cases-hero h1 em{font-style:italic;font-weight:500;color:var(--blue)}
.cases-hero .lead{color:var(--ink-80);font-size:17px;line-height:1.6}
.case-deep{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:48px 0;border-top:1px solid var(--line);align-items:center}
.case-deep:first-child{border-top:none}
.case-deep__head h3{font-family:var(--font-display);font-size:clamp(26px,3.4vw,40px);font-weight:600;letter-spacing:-0.03em;line-height:1.05;margin:0 0 12px}
.case-deep__head p{color:var(--ink-80);font-size:16px;line-height:1.6;margin:0}
.case-deep__body{display:grid;gap:24px}
.case-deep__metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;border-top:1px solid var(--line);padding-top:20px}
.case-deep__metric .l{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-60);letter-spacing:0.12em;text-transform:uppercase;margin-bottom:6px}
.case-deep__metric .v{font-family:var(--font-display);font-size:28px;font-weight:600;letter-spacing:-0.02em}
.case-deep__quote{font-style:italic;color:var(--ink-80);font-size:15px;line-height:1.6;border-left:3px solid var(--blue);padding-left:16px}
.case-deep__quote .sig{display:block;margin-top:8px;font-style:normal;font-family:var(--font-mono);font-size:11px;color:var(--ink-60);letter-spacing:0.1em;text-transform:uppercase}
@media (max-width:820px){.case-deep{grid-template-columns:1fr;gap:24px}}