/* Inner pages (services, about, contact) in the navy of the home page.
   Loaded after taste-polish.css. Home is never matched: every rule starts
   with body.taste:not([data-page="home"]). Surfaces: ink #131A22, deep #0E151C, raised #19222C. Text: white,
   body #C7CCD1, quiet #9AA4AD, lines rgba(255,255,255,.1). Amber stays the
   one accent. Backup of the light version: backups/navy-pre-20261028. */

body.taste:not([data-page="home"]){background:#131A22}
body.taste:not([data-page="home"]) :is(.services-intro,.area-nav,.module-details,.module-chapter:not(#quality),.section-mist,.scope,#ablauf,.start-steps,.cta-section){background:#131A22;color:#fff}
/* alternate surfaces so the sections still read as sections */
body.taste:not([data-page="home"]) :is(.module-chapter#payroll,.scope,.start-steps){background:#0E151C}
body.taste:not([data-page="home"]) .area-nav{background:rgba(19,26,34,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:rgba(255,255,255,.1)}

/* type on navy */
body.taste:not([data-page="home"]) main :is(h1,h2,h3,h4,.title,.chapter-title){color:#fff}
body.taste:not([data-page="home"]) main :is(.services-intro,.module-details,.section-mist,.scope,#ablauf,.start-steps,.cta-section) :is(p,li,dd,.lead){color:#C7CCD1}
body.taste:not([data-page="home"]) main :is(.services-intro,.module-details,.section-mist,.scope,#ablauf,.start-steps,.cta-section) :is(strong,b,dt){color:#fff}
body.taste:not([data-page="home"]) main .mono:not(.mslide-label):not(.kicker){color:#9AA4AD}
body.taste:not([data-page="home"]) main :is(.kicker,.mslide-label){color:var(--amber,#FF9900)}
body.taste:not([data-page="home"]) main :is(hr,.ruled){border-color:rgba(255,255,255,.1)}

/* the header reads white on every inner page, as on the home page */
body.taste:not([data-page="home"]) header.nav :is(.links a,.logo){color:#fff}
body.taste:not([data-page="home"]) header.nav .lang-btn:not(.active){color:#aab3bb}
body.taste:not([data-page="home"]) header.nav .nav-toggle{border-color:rgba(255,255,255,.3)}
body.taste:not([data-page="home"]) header.nav .nav-toggle-bars span{background:#fff}

/* second pass, from the contrast audit: these carry colours set at higher
   specificity in the light theme, so they are restated firmly here */
body.taste:not([data-page="home"]) main :is(h1,h2,h3,h4,blockquote,.chapter-quote) span:not([class]),
body.taste:not([data-page="home"]) main :is(.scope-area-name,.start-steps h3,#ablauf h3,#ablauf h2){color:#fff !important}
body.taste:not([data-page="home"]) main :is(.why-figure-l,.scope-area-sub,.dg-pin-label,.area-nav a){color:#C7CCD1 !important}
body.taste:not([data-page="home"]) main :is(.dg-mark-day,.dg-pin-time,.why-step-n){color:#9AA4AD !important}
body.taste:not([data-page="home"]) .area-nav a.on{color:#fff !important}
body.taste:not([data-page="home"]) main :is(.kicker,.mslide-label){color:var(--amber,#FF9900) !important}

/* the cabin photos: no frame, no box. The chapters take the photos' own
   backdrop (#0A121B, sampled from their edges) so there is no seam, and only
   a narrow band at each edge fades out; the cabin itself is never cut. */
body.taste:not([data-page="home"]) :is(.module-details,.module-chapter,.module-chapter#payroll,.module-chapter#quality){background:#0A121B !important;background-image:none !important}
body.taste:not([data-page="home"]) .module-chapter + .module-chapter{border-top:1px solid rgba(255,255,255,.06)}
body.taste:not([data-page="home"]) .chapter-photo{background:transparent !important;box-shadow:none !important;border:0 !important;position:relative}
body.taste:not([data-page="home"]) .chapter-photo::before,body.taste:not([data-page="home"]) .chapter-photo::after{display:none}
body.taste:not([data-page="home"]) .chapter-photo img{border-radius:0;filter:contrast(1.06) saturate(1.06);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 86%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 86%,transparent);
  mask-composite:intersect}

/* third pass: small pieces still painted for the light theme */
body.taste:not([data-page="home"]) main .why-step-n{align-self:flex-start;height:auto !important;min-height:0 !important;padding:5px 8px;border-radius:6px;line-height:1;background:rgba(255,153,0,.12) !important;color:var(--amber,#FF9900) !important;box-shadow:inset 0 0 0 1px rgba(255,153,0,.35)}
body.taste:not([data-page="home"]) main .dg-mark span:not([class]){color:#fff !important}
body.taste:not([data-page="home"]) main .dg-funnel-out,body.taste:not([data-page="home"]) main .dg-funnel-out span{color:var(--amber,#FF9900) !important}

/* ---- services: the module's cabin stays in view while its text passes -----
   Desktop and tablet landscape. One composition for all four chapters: the
   photo holds the left column and sticks under the header and the area tabs
   until the chapter ends; the subtitle, the example card and every slide run
   down the right column. The header wrapper steps aside (display:contents) so
   the photo can be a grid item and stick across the whole chapter. */
@media (min-width:1000px){
  body.taste:not([data-page="home"]) .module-chapter .chapter-grid{display:grid !important;grid-template-columns:minmax(0,5fr) minmax(0,6fr) !important;grid-template-rows:none !important;
    grid-template-areas:none !important;column-gap:clamp(48px,6vw,96px) !important;row-gap:0 !important;align-items:start !important}
  body.taste:not([data-page="home"]) .module-chapter .chapter-head{display:contents !important}
  body.taste:not([data-page="home"]) .module-chapter .chapter-photo{grid-column:1 !important;grid-row:1 / span 30 !important;align-self:start !important;
    position:sticky !important;top:150px !important;width:100% !important;max-width:none !important;margin:0 !important;z-index:1}
  body.taste:not([data-page="home"]) .module-chapter .chapter-photo img{width:100% !important;height:auto !important;max-height:calc(100vh - 180px) !important;
    aspect-ratio:4/5 !important;object-fit:contain !important;object-position:50% 50% !important}
  body.taste:not([data-page="home"]) .module-chapter :is(.chapter-sub,.module-card,.mslide,.chapter-quote){grid-column:2 !important;grid-row:auto !important;
    width:auto !important;max-width:none !important;margin-left:0 !important;margin-right:0 !important}
  body.taste:not([data-page="home"]) .module-chapter .chapter-sub{margin-top:0 !important}
  body.taste:not([data-page="home"]) .module-chapter .module-card{margin-block:24px 8px !important}
  body.taste:not([data-page="home"]) #payroll :is(.chapter-quote,.chapter-quote *){text-align:left !important;margin-left:0 !important}
}
/* phones and narrow screens: the cabin sits whole above its text */
@media (max-width:999px){
  body.taste:not([data-page="home"]) #payroll .chapter-photo{width:min(560px,100%) !important;max-width:min(560px,100%) !important;margin-left:auto !important;margin-right:auto !important}
  body.taste:not([data-page="home"]) #payroll .chapter-photo img{aspect-ratio:4/5 !important;max-height:none !important;object-fit:cover;object-position:50% 50% !important;width:100%;height:auto}
}


/* ---- spacing and symmetry pass (28.10.) ---------------------------------- */
/* services: every part of a chapter's text is spaced the same — one rule
   line, the same gap above and below it — whichever chapter it is in. */
body.taste:not([data-page="home"]) .module-chapter .module-card{margin-bottom:0 !important}
@media (min-width:1000px){
  body.taste:not([data-page="home"]) .module-chapter .mslide{margin-top:56px !important;padding-top:40px !important;padding-bottom:0 !important;border-top:1px solid rgba(255,255,255,.1) !important}
}
@media (max-width:999px){
  body.taste:not([data-page="home"]) .module-chapter .mslide{margin-top:40px !important;padding-top:28px !important;padding-bottom:0 !important;border-top:1px solid rgba(255,255,255,.1) !important}
  body.taste:not([data-page="home"]) #payroll .chapter-photo{margin-top:0 !important;margin-bottom:0 !important}
}
/* desktop: the cabin's box starts on the page's left edge, like the text above */
@media (min-width:1000px){body.taste:not([data-page="home"]) .module-chapter .chapter-photo img{object-position:0 50% !important}}

/* the header frame: a faint line on navy, not a light one */
body.taste:not([data-page="home"]) header.nav.nav{border-color:rgba(255,255,255,.1) !important}

/* about: the four figures — both columns the same width on phones */
@media (max-width:700px){body.taste:not([data-page="home"]) .why-figures > :nth-child(2n){padding-right:0 !important}}

/* contact: the headline is centred on the page, like the text and card under it */
body.taste:not([data-page="home"]) #kontakt h1{margin-left:auto !important;margin-right:auto !important}
/* the contact card: as much room under its last line as above its first */
body.taste:not([data-page="home"]) .reach .reach-pkg{margin-bottom:0 !important}
/* the three steps sit on the same centre line as the card above them */
@media (min-width:861px){body.taste:not([data-page="home"]) .start-steps > .wrap{max-width:720px !important;margin-inline:auto !important;padding-inline:0 !important}}

/* last small labels in the services diagrams up to the 12px floor */
body.taste:not([data-page="home"]) .scorecard-head .mono,
body.taste:not([data-page="home"]) .flow-hub span{font-size:12px}
