/* Mithra Makina v2 — base layer (chrome part): tokens, type, buttons, icons, header, footer, quote modal.
   Self-contained (own reset + .container): page types load base + their own sheet (home | inner | inner+contact, header.php $mm_assets);
   the legacy Bootstrap/Porto stack only loads, before this file, on page types that opt in (today: product module only; home/inner/contact never).
   Measurements: target hedef-gorunum.png @1448 (see ../onizleme-1/RAPOR-tasarim-sistemi.md, RAPOR-ust-hero.md).

   TOKENS (use these, do not hard-code):
   colour   --mm-navy --mm-ink (glass bar text) --mm-text --mm-muted --mm-blue --mm-blue-dark --mm-blue-ink --mm-blue-light --mm-line --mm-line-strong
            --mm-bg-soft --mm-footer-bg --mm-danger --mm-success
   type     --mm-font --mm-fs-h1 --mm-fs-h2 --mm-fs-card --mm-fs-lead --mm-fs-body --mm-fs-menu --mm-fs-btn --mm-fs-eyebrow --mm-fs-small
   shape    --mm-radius --mm-radius-btn --mm-shadow --mm-shadow-hover --mm-shadow-pop
   layout   --mm-container (Bootstrap .container max, content = it − 30px)
   header   --mm-header-top (gap above the floating bar) --mm-header-h (bar height) --mm-header-space (top + h: where the bar ends)
            --mm-header-offset (padding the page gets when it does NOT start with a hero)
            A page whose first block should run UNDER the glass bar gives that block class .mm-hero (home) or .mm-page-hero (inner);
            then .main gets no top padding and the block must keep its own text below var(--mm-header-space).
   CLASSES  .mm-btn (+ .mm-btn-primary | .mm-btn-light [on dark] | .mm-btn-outline [on light] | .mm-btn-sm)
            .mm-arrow (.mm-arrow-left) .mm-chev .mm-globe .mm-x — mask icons in currentColor, 1em-ish
            .mm-round (42px round arrow button, on dark) .mm-round-sm (31px, card arrow on white) .mm-link-arrow ("Tümünü gör →")
            .mm-eyebrow .mm-t-display .mm-t-h2 .mm-t-card .mm-t-lead .mm-sr
*/

/* Figtree (SIL OFL 1.1), self-hosted; Google's own latin / latin-ext split (ğ Ğ ş Ş İ in latin-ext) */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 300 900; font-display: swap; src: url('../../fonts/figtree-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 300 900; font-display: swap; src: url('../../fonts/figtree-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
	--mm-font: 'Figtree', Arial, sans-serif;
	--mm-container: 1310px;
	--mm-navy: #00041f;
	--mm-text: #19294c;
	--mm-ink: #020b31;            /* menu text on the glass bar (target darkest glyph pixel rgb 2,11,49) */
	--mm-muted: #606c8b;          /* 5.23:1 on white */
	--mm-blue: #005fde;           /* 5.69:1 with white */
	--mm-blue-dark: #004cb2;      /* hover */
	--mm-blue-ink: #00398c;       /* blue TEXT on the glass bar: ≥4.75:1 on the worst hero/page pixel at fill .68, blur on or off (tools/chrome-glass.mjs) */
	--mm-blue-light: #c3e7fe;
	--mm-line: #dde2ea;
	--mm-line-strong: #7d879c;    /* form field borders: 3.6:1 on white (WCAG 1.4.11) */
	--mm-bg-soft: #fafcfe;
	--mm-footer-bg: #041833;
	--mm-danger: #b42318;
	--mm-success: #067647;
	--mm-radius: 8px;
	--mm-radius-btn: 8px;
	--mm-shadow: 0 24px 52px -16px rgba(17, 85, 154, .10);
	--mm-shadow-hover: 0 28px 60px -16px rgba(17, 85, 154, .18);
	--mm-shadow-pop: 0 18px 40px -12px rgba(0, 4, 31, .22);

	--mm-fs-h1: 60px; --mm-fs-h2: 32px; --mm-fs-card: 21px; --mm-fs-lead: 19px; --mm-fs-body: 15px;
	--mm-fs-menu: 12.5px; --mm-fs-btn: 15px; --mm-fs-eyebrow: 12px; --mm-fs-small: 13px;

	--mm-header-top: 20px;        /* target bar y 20–84 */
	--mm-header-h: 64px;
	--mm-header-space: calc(var(--mm-header-top) + var(--mm-header-h));
	--mm-header-offset: calc(var(--mm-header-space) + var(--mm-header-top));
	--mm-glass: rgba(248, 250, 255, .58); /* user 2026-10-21: ~10% more transparent (was .68); .55 = logo floor */  /* lowest ΔE2000 to the target bar on its own backdrop (tur2/glass-ref); fill carries the contrast, blur is decoration. Logo #005AAB needs ≥ .55 */

	--mm-ico-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M3 10h13.5M11 4.5 16.5 10 11 15.5' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	--mm-ico-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	--mm-ico-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.3'%3E%3Ccircle cx='8' cy='8' r='6.4'/%3E%3Cpath d='M1.6 8h12.8M8 1.6c-3.2 3.5-3.2 9.3 0 12.8M8 1.6c3.2 3.5 3.2 9.3 0 12.8'/%3E%3C/svg%3E");
	--mm-ico-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 5l10 10M15 5 5 15' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E");
	/* contact lines (Feather-style outlines, 24 grid; 1.95 = the globe's 1.3 on 16) */
	--mm-ico-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.95' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
	--mm-ico-mob: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.95' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='2' width='14' height='20' rx='2'/%3E%3Cpath d='M12 18h.01'/%3E%3C/svg%3E");
	--mm-ico-fax: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.95' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V2h12v7M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Crect x='6' y='14' width='12' height='8'/%3E%3C/svg%3E");
	--mm-ico-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.95' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 6-10 7L2 6'/%3E%3C/svg%3E");
}
@media (max-width: 991.98px) { :root { --mm-header-top: 10px; --mm-header-h: 60px; } }

/* ---------- Reset (was Bootstrap reboot; v2 must not depend on the legacy CSS). Element selectors only, so any class rule wins. ---------- */
*, ::before, ::after { box-sizing: border-box; }
html { line-height: 1.15; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; }
body { margin: 0; }
h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: .5rem; }
p, ul, ol, dl, address, figure, blockquote, pre { margin-top: 0; margin-bottom: 1rem; }
figure, blockquote { margin-left: 0; margin-right: 0; }
dd { margin-left: 0; margin-bottom: .5rem; }
address { font-style: normal; }
b, strong { font-weight: bolder; }
small { font-size: 80%; }
a { text-decoration: none; background-color: transparent; }
img, svg { vertical-align: middle; border-style: none; }
svg { overflow: hidden; }
table { border-collapse: collapse; }
th { text-align: inherit; }
hr { height: 0; margin: 1rem 0; border: 0; border-top: 1px solid var(--mm-line); }
button, input, select, textarea { margin: 0; font: inherit; color: inherit; }
button { border-radius: 0; text-transform: none; }
button:not(:disabled), [type="button"]:not(:disabled), [type="submit"]:not(:disabled) { cursor: pointer; }
textarea { overflow: auto; resize: vertical; }
[hidden] { display: none !important; }
#myModal { display: none; } /* panel pop-up (Bootstrap modal markup, footer get_modal): nothing ever opened it; without Bootstrap CSS it must stay hidden */

/* Bootstrap 4 .container (all v2 templates use it): 15px gutters, centred, max 540/720/960 -> 1310 at ≥1200 (below) */
.container { width: 100%; margin-right: auto; margin-left: auto; padding-right: 15px; padding-left: 15px; }
@media (min-width: 576px) { .container { max-width: 540px; } }
@media (min-width: 768px) { .container { max-width: 720px; } }
@media (min-width: 992px) { .container { max-width: 960px; } }

/* ---------- Base type ---------- */
html { scroll-padding-top: calc(var(--mm-header-space) + 16px); } /* anchors / focused items never hide under the fixed bar (WCAG 2.4.11) */
html { overscroll-behavior-y: none; } /* no macOS rubber-band at the top: the pinned near-white glass bar vanished over the white canvas it exposed */
body { font-family: var(--mm-font); font-size: var(--mm-fs-body); line-height: 1.6; color: var(--mm-text); background: #fff; -webkit-font-smoothing: antialiased; }
body p { color: var(--mm-text); }
h1, h2, h3, h4, h5, h6 { font-family: var(--mm-font); font-weight: 700; letter-spacing: 0; color: var(--mm-navy); }
h1 { font-size: calc(1.375rem + 1.5vw); line-height: 1.2; }
h2 { font-size: calc(1.325rem + .9vw); line-height: 1.2; }
h3 { font-size: calc(1.3rem + .6vw); line-height: 1.2; }
h4 { font-size: calc(1.275rem + .3vw); line-height: 1.2; }
@media (min-width: 1200px) { h1 { font-size: 2.5rem; } h2 { font-size: 2rem; } h3 { font-size: 1.75rem; } h4 { font-size: 1.5rem; } }
a { color: var(--mm-blue); }
a:hover { color: var(--mm-blue-dark); }
/* links inside running text: underlined, not colour alone (WCAG 1.4.1, axe link-in-text-block); nav, buttons, classed lists keep their look */
.main :where(p, td, blockquote, ul:not([class]) > li, ol:not([class]) > li) a:not([class]) { text-decoration: underline; text-underline-offset: 2px; }
/* !important: legacy theme.css (opt-in pages) has "body a { outline: none !important }" */
html body :focus-visible { outline: 3px solid var(--mm-blue) !important; outline-offset: 2px; }
.mm-footer :focus-visible { outline-color: var(--mm-blue-light) !important; }

.mm-t-display { font-size: var(--mm-fs-h1); line-height: 1; font-weight: 700; }
.mm-t-h2 { font-size: var(--mm-fs-h2); line-height: 1.1; font-weight: 700; }
.mm-t-card { font-size: var(--mm-fs-card); line-height: 1.2; font-weight: 700; }
.mm-t-lead { font-size: var(--mm-fs-lead); line-height: 25px; }
@media (max-width: 991.98px) { .mm-t-display { font-size: 32px; line-height: 40px; } .mm-t-h2 { font-size: 26px; line-height: 1.2; } .mm-t-lead { font-size: 16px; line-height: 24px; } }

.mm-sr, .mm-hp { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* container: content edge ~80px at ≥1200 (target 82), 1280 content from 1440 up */
@media (min-width: 1200px) { .container { max-width: min(var(--mm-container), calc(100% - 130px)); } }

/* section label: 28×2 blue line, 14px gap, 12px/600 caps, 2px tracking */
.mm-eyebrow { display: flex; align-items: center; gap: 14px; margin: 0; color: var(--mm-muted); font-size: var(--mm-fs-eyebrow); font-weight: 600; line-height: 1.2; letter-spacing: 2px; text-transform: uppercase; }
.mm-eyebrow::before { content: ""; flex: 0 0 28px; height: 2px; background: var(--mm-blue); }

/* ---------- Icons (mask = takes currentColor) ---------- */
.mm-arrow, .mm-chev, .mm-globe, .mm-x { display: inline-block; flex: none; background-color: currentColor; -webkit-mask: var(--mm-ico-arrow) center / contain no-repeat; mask: var(--mm-ico-arrow) center / contain no-repeat; }
.mm-arrow { width: 18px; height: 18px; }
.mm-arrow-left { transform: scaleX(-1); }
.mm-chev { width: 10px; height: 10px; -webkit-mask-image: var(--mm-ico-chev); mask-image: var(--mm-ico-chev); transition: transform .15s; }
.mm-globe { width: 15px; height: 15px; -webkit-mask-image: var(--mm-ico-globe); mask-image: var(--mm-ico-globe); }
.mm-x { width: 20px; height: 20px; -webkit-mask-image: var(--mm-ico-x); mask-image: var(--mm-ico-x); }
/* contact-line icons: one size everywhere, centred on the cap height of whatever text they sit in */
.mm-ci { display: inline-block; flex: none; width: 16px; height: 16px; margin-right: 8px; vertical-align: calc(.36em - 8px); background-color: currentColor; -webkit-mask: var(--mm-ico-tel) center / contain no-repeat; mask: var(--mm-ico-tel) center / contain no-repeat; }
.mm-btn > .mm-ci { margin-right: -8px; } /* .mm-btn gap 16 -> same 8px icon-text gap */
.mm-ci-mob { -webkit-mask-image: var(--mm-ico-mob); mask-image: var(--mm-ico-mob); }
.mm-ci-fax { -webkit-mask-image: var(--mm-ico-fax); mask-image: var(--mm-ico-fax); }
.mm-ci-mail { -webkit-mask-image: var(--mm-ico-mail); mask-image: var(--mm-ico-mail); }

/* ---------- Buttons (target: hero buttons 52px, radius 8, 28px side padding, 15/600, text→arrow 18px) ---------- */
.mm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 52px; padding: 0 28px; border: 1px solid transparent; border-radius: var(--mm-radius-btn); font-family: var(--mm-font); font-size: var(--mm-fs-btn); font-weight: 600; line-height: 1.2; text-decoration: none !important; white-space: nowrap; cursor: pointer; transition: background-color .15s, color .15s, border-color .15s; }
.mm-btn-primary, .mm-btn-primary:visited { background: var(--mm-blue); border-color: var(--mm-blue); color: #fff; }
.mm-btn-primary:hover, .mm-btn-primary:focus { background: var(--mm-blue-dark); border-color: var(--mm-blue-dark); color: #fff; }
.mm-btn-light { background: transparent; border-color: rgba(255, 255, 255, .85); color: #fff; }
.mm-btn-light:hover, .mm-btn-light:focus { background: #fff; color: var(--mm-navy); }
.mm-btn-outline { background: #fff; border-color: var(--mm-line-strong); color: var(--mm-navy); }
.mm-btn-outline:hover, .mm-btn-outline:focus { border-color: var(--mm-blue); color: var(--mm-blue); }
.mm-btn-sm { min-height: 40px; padding: 0 24px; gap: 14px; }
.mm-btn[disabled] { opacity: .6; cursor: progress; }
/* Bootstrap .btn-primary (contact form etc.): Porto skin #00AACE has 2.7:1 with white */
html .btn-primary, html .btn-primary:focus { background-color: var(--mm-blue); border-color: var(--mm-blue); color: #fff; font-weight: 600; border-radius: var(--mm-radius-btn); }
html .btn-primary:hover, html .btn-primary:active { background-color: var(--mm-blue-dark); border-color: var(--mm-blue-dark); color: #fff; }

.mm-round, .mm-round-sm { display: inline-flex; align-items: center; justify-content: center; flex: none; padding: 0; border-radius: 50%; cursor: pointer; transition: background-color .15s, color .15s; }
.mm-round { width: 42px; height: 42px; border: 1px solid rgba(255, 255, 255, .85); background: transparent; color: #fff; }
.mm-round:hover, .mm-round:focus { background: #fff; color: var(--mm-navy); }
.mm-round .mm-arrow { width: 16px; height: 16px; }
.mm-round-sm { width: 31px; height: 31px; border: 1px solid #d7dfe6; background: #fff; color: var(--mm-blue); }
.mm-round-sm .mm-arrow { width: 14px; height: 14px; }
.mm-link-arrow { display: inline-flex; align-items: center; gap: 18px; font-size: 13px; font-weight: 500; line-height: 20px; color: var(--mm-blue); white-space: nowrap; text-decoration: none; }
.mm-link-arrow:hover { color: var(--mm-navy); text-decoration: none; }
@media (prefers-reduced-motion: reduce) { .mm-btn, .mm-round, .mm-round-sm, .mm-chev { transition: none; } }

/* ---------- Skip link ---------- */
.mm-skip { position: fixed; top: 8px; left: 8px; z-index: 1100; padding: 10px 16px; border-radius: var(--mm-radius-btn); background: var(--mm-navy); color: #fff !important; font-weight: 600; transform: translateY(-200%); }
.mm-skip:focus { transform: none; }

/* ---------- Header: floating glass bar, same on every page ---------- */
.mm-header { position: fixed; top: var(--mm-header-top); left: 0; right: 0; z-index: 1030; pointer-events: none; font-family: var(--mm-font); }
/* bar = content width + 8px each side (target box 75–1373, content 82–1367); radius 12, 1px light edge */
.mm-header__bar { position: relative; display: flex; align-items: center; width: calc(100% - 20px); max-width: 1296px; height: var(--mm-header-h); margin: 0 auto; padding: 0 23px; pointer-events: auto; /* user 2026-10-21: logo-left gap = quote-right gap (was 50px left) */
	border: 1px solid rgba(255, 255, 255, .75); border-radius: 12px; background: var(--mm-glass); box-shadow: 0 8px 24px rgba(4, 24, 51, .12);
	-webkit-backdrop-filter: blur(10px) saturate(160%); backdrop-filter: blur(10px) saturate(160%); }
@media (min-width: 1200px) { .mm-header__bar { width: calc(100% - 144px); } }
@media (prefers-reduced-transparency: reduce) { .mm-header__bar { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; } }
.mm-header__logo { display: block; flex: none; line-height: 0; }
.mm-header__logo img { display: block; width: 177px; height: 40px; }
.mm-header__end { display: flex; align-items: center; gap: 30px; margin-left: auto; }

.mm-nav__list, .mm-nav__sub { margin: 0; padding: 0; list-style: none; }
.mm-nav__link { color: var(--mm-ink); text-decoration: none !important; white-space: nowrap; }
.mm-nav__link:hover { color: var(--mm-blue-ink); }
.mm-header__bar .mm-nav__item.is-current > .mm-nav__link { color: var(--mm-ink); } /* user 2026-10-21: navy on the thinner glass (blue was 3.25:1); blue underline marks the page */
.mm-nav__toggle { display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; background: none; color: var(--mm-ink); cursor: pointer; }
.mm-nav__toggle[aria-expanded="true"] .mm-chev { transform: rotate(180deg); }
.mm-nav__sub a { display: block; padding: 10px 12px; border-radius: 6px; color: var(--mm-text); font-size: 14px; font-weight: 500; line-height: 1.35; text-decoration: none !important; }
.mm-nav__sub a:hover { background: #eef4fd; color: var(--mm-blue-ink); }
.mm-nav__sub a[aria-current] { color: var(--mm-blue-ink); font-weight: 600; }

/* language */
.mm-lang { position: relative; }
.mm-lang__btn { gap: 8px; min-height: 44px; padding: 0 4px; font-family: var(--mm-font); font-size: var(--mm-fs-menu); font-weight: 500; color: var(--mm-ink); }
.mm-lang__btn .mm-chev { width: 9px; height: 9px; }
.mm-lang__list b { display: inline-block; width: 26px; font-weight: 700; }
.mm-header .mm-nav__sub { position: absolute; z-index: 2; display: none; min-width: 250px; padding: 8px; border: 1px solid var(--mm-line); border-radius: 10px; background: #fff; box-shadow: var(--mm-shadow-pop); }
.mm-lang .mm-nav__sub { top: calc(100% + 10px); right: -8px; min-width: 170px; }
.mm-lang .mm-nav__toggle[aria-expanded="true"] + .mm-nav__sub { display: block; }

/* Teklif Al: 138×40 (target 1211–1349 × 32–72), 15/600 */
.mm-header__quote { min-height: 40px; min-width: 138px; padding: 0 24px; gap: 14px; }
.mm-header__quote .mm-arrow { width: 16px; height: 16px; }

@media (min-width: 992px) {
	/* menu centred in the bar (target centre 725 ≈ bar centre 724), glyphs 38px apart (target) */
	.mm-nav { position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); }
	.mm-nav__list { display: flex; height: 100%; }
	.mm-nav__item { position: relative; display: flex; align-items: center; }
	.mm-nav__link { position: relative; display: block; padding: 0 18px; font-size: var(--mm-fs-menu); font-weight: 500; line-height: var(--mm-header-h); }
	/* current: 2px blue line under the text (target ≈2px at y 67–68) */
	.mm-nav__link::after { content: ""; position: absolute; left: 18px; right: 18px; bottom: 15px; height: 2px; border-radius: 2px; background: var(--mm-blue); transform: scaleX(0); transition: transform .2s; }
	.mm-nav__item.is-current > .mm-nav__link::after { transform: scaleX(1); }
	.mm-nav__item > .mm-nav__toggle { position: absolute; right: 2px; top: 50%; width: 18px; height: 24px; margin-top: -12px; }
	.mm-nav__item .mm-nav__sub { top: calc(100% - 8px); left: 6px; }
	/* dropdown: hover, keyboard focus, or the toggle (touch); Esc adds .is-closed (WCAG 1.4.13 dismissible) */
	.mm-nav__item.has-sub:hover > .mm-nav__sub, .mm-nav__item.has-sub:focus-within > .mm-nav__sub, .mm-nav__toggle[aria-expanded="true"] + .mm-nav__sub { display: block; }
	.mm-header .has-sub.is-closed > .mm-nav__sub { display: none; }
	.mm-nav__quote, .mm-burger { display: none !important; }
}
/* mouse users get hover; the chevron buttons are only for touch screens (target shows no chevrons) */
@media (min-width: 992px) and (hover: hover) and (pointer: fine) { .mm-nav__item > .mm-nav__toggle { display: none; } }
@media (min-width: 992px) and (max-width: 1199.98px) {
	.mm-header__bar { padding-left: 24px; }
	.mm-nav__link { padding: 0 10px; }
	.mm-nav__link::after { left: 10px; right: 10px; }
	.mm-header__end { gap: 16px; }
}
@media (prefers-reduced-motion: reduce) { .mm-nav__link::after { transition: none; } }

/* phone / tablet: logo + language + menu button; menu opens as a solid panel under the bar */
@media (max-width: 991.98px) {
	.mm-header__bar { padding: 0 8px 0 16px; }
	.mm-header__logo img { width: 150px; height: 34px; }
	.mm-header__end { gap: 4px; }
	.mm-header__quote { display: none; }
	.mm-burger { position: relative; display: inline-flex; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 8px; background: none; color: var(--mm-navy); cursor: pointer; }
	.mm-burger span, .mm-burger span::before, .mm-burger span::after { position: absolute; left: 12px; width: 20px; height: 2px; border-radius: 1px; background: currentColor; content: ""; transition: transform .2s, opacity .2s; }
	.mm-burger span { top: 21px; }
	.mm-burger span::before { left: 0; top: -6px; }
	.mm-burger span::after { left: 0; top: 6px; }
	.mm-burger[aria-expanded="true"] span { background: transparent; }
	.mm-burger[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); background: currentColor; }
	.mm-burger[aria-expanded="true"] span::after { transform: translateY(-6px) rotate(-45deg); background: currentColor; }

	.mm-nav { position: absolute; top: calc(100% + 8px); left: 0; right: 0; display: none; max-height: calc(100vh - var(--mm-header-space) - 28px); max-height: calc(100dvh - var(--mm-header-space) - 28px); overflow-y: auto; overscroll-behavior: contain;
		padding: 8px; border: 1px solid var(--mm-line); border-radius: 12px; background: #fff; box-shadow: var(--mm-shadow-pop); }
	.mm-nav-open .mm-nav { display: block; }
	.mm-nav__item { display: flex; flex-wrap: wrap; align-items: center; border-bottom: 1px solid var(--mm-line); }
	.mm-nav__link { flex: 1; min-height: 52px; padding: 14px 12px; font-size: 16px; font-weight: 600; line-height: 24px; white-space: normal; }
	.mm-nav__item.is-current > .mm-nav__link { box-shadow: inset 3px 0 0 var(--mm-blue); }
	.mm-nav__item > .mm-nav__toggle { width: 52px; height: 52px; border-radius: 8px; }
	.mm-nav__item > .mm-nav__toggle .mm-chev { width: 14px; height: 14px; }
	.mm-header .mm-nav__item .mm-nav__sub { position: static; flex-basis: 100%; min-width: 0; padding: 0 0 8px 12px; border: 0; box-shadow: none; }
	.mm-nav__item .mm-nav__toggle[aria-expanded="true"] + .mm-nav__sub { display: block; }
	.mm-nav__sub a { padding: 12px; font-size: 15px; }
	.mm-nav__quote { width: 100%; margin-top: 12px; }
	.mm-lang .mm-nav__sub { top: calc(100% + 12px); right: -52px; }
}
@media (max-width: 359.98px) { .mm-header__logo img { width: 124px; height: 28px; } }

/* pages without a hero start below the bar; .mm-hero / .mm-page-hero pages run under it */
.main { padding-top: var(--mm-header-offset); }
.main:has(.mm-hero, .mm-page-hero) { padding-top: 0; }

/* ---------- Footer: Swiss — 12-col grid, three blocks, thin rules ---------- */
.mm-footer { padding: 80px 0 0; background: var(--mm-footer-bg); color: rgba(255, 255, 255, .78); font-size: 14px; line-height: 1.65; }
.mm-footer a { color: #fff; text-decoration: none; }
.mm-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.mm-footer__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: 48px; padding-bottom: 72px; }
.mm-footer__brand { grid-column: 1 / span 4; }
.mm-footer__nav { grid-column: 7 / span 2; }
.mm-footer__contact { grid-column: 9 / span 4; }
.mm-footer__brand img { display: block; width: 177px; height: 40px; margin-bottom: 24px; }
.mm-footer__brand p { max-width: 30ch; margin: 0; color: rgba(255, 255, 255, .78); font-size: 16px; line-height: 1.5; }
.mm-footer__title { margin: 0 0 20px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .22); color: rgba(255, 255, 255, .66); font-family: var(--mm-font); font-size: var(--mm-fs-eyebrow); font-weight: 600; line-height: 1.2; letter-spacing: 2px; text-transform: uppercase; }
.mm-footer__list { margin: 0; padding: 0; list-style: none; }
.mm-footer__list li { line-height: 1.5; }
.mm-footer__list li + li { margin-top: 10px; }
.mm-footer address { margin: 0; font-style: normal; }
.mm-footer address p { margin: 0 0 10px; color: rgba(255, 255, 255, .78); line-height: 1.55; }
.mm-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 32px; padding: 22px 0 28px; line-height: 26px; border-top: 1px solid rgba(255, 255, 255, .22); font-size: var(--mm-fs-small); color: rgba(255, 255, 255, .66); }
.mm-footer__bottom p { margin: 0; color: inherit; }
.mm-footer__legal { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0; padding: 0; list-style: none; }
.mm-footer__legal a { color: rgba(255, 255, 255, .78); }
@media (max-width: 991.98px) {
	.mm-footer { padding-top: 56px; }
	.mm-footer__brand { grid-column: 1 / -1; }
	.mm-footer__nav { grid-column: 1 / span 5; }
	.mm-footer__contact { grid-column: 6 / -1; }
}
@media (max-width: 575.98px) {
	.mm-footer__grid { row-gap: 40px; padding-bottom: 48px; }
	.mm-footer__nav, .mm-footer__contact { grid-column: 1 / -1; }
}

/* ---------- Quote modal (<dialog id="mm-quote">) ---------- */
.mm-modal { width: min(600px, calc(100% - 24px)); max-width: none; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); margin: auto; padding: 0; border: 0; border-radius: 14px; background: #fff; color: var(--mm-text); box-shadow: 0 40px 90px -20px rgba(0, 4, 31, .5); font-family: var(--mm-font); overflow: auto; overscroll-behavior: contain; }
.mm-modal::backdrop { background: rgba(0, 4, 31, .58); }
.mm-modal[open] { animation: mm-pop .18s ease-out; }
@keyframes mm-pop { from { opacity: 0; transform: translateY(8px) scale(.98); } }
@media (prefers-reduced-motion: reduce) { .mm-modal[open] { animation: none; } }
html:has(.mm-modal[open]) { overflow: hidden; }
.mm-quote { position: relative; padding: 36px 40px 32px; }
.mm-quote__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 6px; }
.mm-quote__title { margin: 0; font-size: 28px; line-height: 1.15; color: var(--mm-navy); }
.mm-quote__intro { margin: 0 0 26px; color: var(--mm-muted); font-size: 15px; }
.mm-quote__close { width: 44px; height: 44px; margin: -8px -12px 0 0; border: 0; border-radius: 50%; background: none; color: var(--mm-navy); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.mm-quote__close:hover { background: #eef2f8; }
.mm-quote__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 575.98px) { .mm-quote { padding: 26px 20px 22px; } .mm-quote__row { grid-template-columns: 1fr; } .mm-quote__title { font-size: 24px; } }
.mm-field { margin-bottom: 18px; }
.mm-field label { display: block; margin: 0 0 6px; color: var(--mm-navy); font-size: 14px; font-weight: 600; line-height: 1.3; }
.mm-field input, .mm-field textarea { display: block; width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid var(--mm-line-strong); border-radius: var(--mm-radius-btn); background: #fff; color: var(--mm-navy); font: 400 16px/1.4 var(--mm-font); box-shadow: none; }
.mm-field textarea { min-height: 128px; resize: vertical; }
.mm-field input:focus, .mm-field textarea:focus { border-color: var(--mm-blue); outline: 0 !important; box-shadow: 0 0 0 3px rgba(0, 95, 222, .28); }
.mm-field [aria-invalid="true"] { border-color: var(--mm-danger); box-shadow: 0 0 0 1px var(--mm-danger); }
.mm-field__err { margin: 6px 0 0; color: var(--mm-danger) !important; font-size: 13.5px; font-weight: 500; line-height: 1.35; }
.mm-field__err[hidden] { display: none; }
.mm-quote__status { margin: 0 0 16px; padding: 12px 14px; border-radius: var(--mm-radius-btn); background: #fdecea; color: var(--mm-danger) !important; font-size: 14px; font-weight: 500; }
.mm-quote__status:empty { display: none; }
.mm-quote__send { margin-top: 4px; }
.mm-quote__kvkk { margin: 18px 0 0; color: var(--mm-muted) !important; font-size: 13px; line-height: 1.5; }
.mm-quote__kvkk a { text-decoration: underline; text-underline-offset: 2px; } /* link inside text: not by colour alone (WCAG 1.4.1) */
.mm-quote__done { display: none; padding: 8px 0 4px; }
.mm-quote.is-sent .mm-quote__fields { display: none; }
.mm-quote.is-sent .mm-quote__done { display: block; }
.mm-quote__done h3 { margin: 0 0 8px; font-size: 22px; color: var(--mm-success); }
.mm-quote__done h3:focus { outline: 0 !important; }
.mm-quote__done p { margin: 0 0 22px; }
.mm-quote__contact { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; } /* forms-off state: mail + phone buttons */

/* ---------- Card (.mm-card): the ONE card of the site — home strips, project/service lists (pagecat.php), galleries (in_gallery).
   No box at rest; hover / keyboard focus = light-blue surface behind the whole card + blue title; photo with 4 rounded corners (user 2026-10-21).
   Markup: a.mm-card > img.mm-card__img + span.mm-card__body > .mm-card__title [.mm-card__work] [.mm-card__meta]. Lists keep >= 12px around a card for the surface. ---------- */
.mm-card { position: relative; isolation: isolate; display: flex; flex-direction: column; width: 100%; height: 100%; color: var(--mm-text); text-decoration: none; }
.mm-card:hover, .mm-card:focus { color: var(--mm-text); text-decoration: none; }
.mm-card::before { content: ""; position: absolute; inset: -12px; z-index: -1; border-radius: 14px; background: #eaf1f9; opacity: 0; transform: scale(.96); transition: opacity .2s, transform .2s; pointer-events: none; } /* on #eaf1f9: blue title 5.0:1, muted 4.59:1 */
@media (hover: hover) { .mm-card:hover::before { opacity: 1; transform: none; } .mm-card:hover .mm-card__title { color: var(--mm-blue); } }
.mm-card:focus-visible::before { opacity: 1; transform: none; }
.mm-card:focus-visible .mm-card__title { color: var(--mm-blue); }
.mm-card:focus-visible { outline-offset: 9px; border-radius: 12px; } /* ring on the edge of the surface */
.mm-card__img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--mm-radius); background: var(--mm-line); }
.mm-card__body { flex: 1; display: grid; align-content: start; padding-top: 14px; }
.mm-card__body:first-child { padding-top: 0; } /* text-only card */
.mm-card__title { font-size: var(--mm-fs-card); line-height: 26px; font-weight: 700; color: var(--mm-navy); transition: color .2s; }
.mm-card__work, .mm-card__meta { margin-top: 6px; font-size: 15px; line-height: 19px; color: var(--mm-muted); } /* lines wrap, never "…" (tools/home-cards.mjs, inner-cards.mjs) */
.mm-card__work { color: var(--mm-text); } /* project line 2 (pages_lang.features kart_is) */
.mm-card__work + .mm-card__meta { margin-top: 4px; }
@media (max-width: 767.98px) { .mm-card__work, .mm-card__meta { font-size: 16px; line-height: 21px; } } /* phone body text >= 16px */
@media (prefers-reduced-motion: reduce) { .mm-card::before, .mm-card__title { transition: none; } }