﻿/* Eigene iTS-Komposition; die gemeinsamen Bausteine und Farben stammen aus Sedna. */
:root { --font-sans:"iTS Roboto","Segoe UI",sans-serif; }
.its-legacy-symbol { font-family:"iTS Symbole"; font-weight:400; font-style:normal; font-size:inherit; line-height:1; letter-spacing:normal; text-transform:none; white-space:nowrap; font-feature-settings:"liga"; -webkit-font-smoothing:antialiased; display:inline-block; }
.its-notice-editor .editor-body { min-height:200px; }
.its-compat-modal { max-height:calc(100dvh - 32px); }
.its-site { --mud-palette-background:var(--bg); --mud-palette-surface:var(--card-bg); --mud-palette-text-primary:var(--fg); --mud-palette-text-secondary:var(--muted); --mud-palette-divider:var(--border); --mud-palette-primary:var(--brand); }

/* Turnierseiten: bestehende Daten und Wertungen, dieselben Sedna-Farben und Abstände. */
.its-main-detail { max-width:1600px; margin-inline:auto; padding:28px 32px 64px; }
.its-site .equiscore-list-table,.its-site .equiscore-result-table { background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius-panel); }
.its-site .equiscore-list-table th,.its-site .equiscore-result-table th { background:var(--bg); color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.03em; }
.its-site .equiscore-list-mobile-card,.its-site .equiscore-result-mobile-card { background:var(--card-bg); border:1px solid var(--border); box-shadow:none; border-radius:var(--radius-surface); }
.its-site .equiscore-list-mobile-list,.its-site .equiscore-result-mobile-list { gap:8px; }
@media(max-width:700px) {
 .its-main-detail { padding:16px 12px 36px; }
 .its-site .equiscore-list-mobile-card,.its-site .equiscore-result-mobile-card { padding:11px 12px 11px 51px; position:relative; }
 .its-site .equiscore-list-start-chip-row,.its-site .equiscore-result-mobile-card-header>:first-child { position:absolute; left:10px; top:12px; }
 .its-site .equiscore-list-mobile-card-header { margin:0; }
 .its-site .equiscore-list-mobile-title,.its-site .equiscore-result-mobile-title { font-size:14px; }
 .its-site .equiscore-list-mobile-subtitle,.its-site .equiscore-result-mobile-subtitle { font-size:13px; }
 .its-site .equiscore-result-mobile-card-header { justify-content:flex-end; margin-bottom:6px; }
}

/* Die iTS-Seite kombiniert Sednas Bausteine; App-Klassen steuern nur ihre Anordnung. */
.its-site{background:var(--bg);color:var(--fg);min-height:100dvh;font-family:"iTS Roboto","Segoe UI",sans-serif;line-height:1.55}
.its-site a{text-decoration:none;color:inherit}.its-site a:hover{color:var(--brand-text)}
.its-site h1,.its-site h2,.its-site h3,.its-site p{margin-top:0}.its-site i[class^="ri-"]{flex-shrink:0}
.its-wrap{width:min(1240px,calc(100% - 80px));margin-inline:auto}
.its-header{position:sticky;top:0;z-index:200;background:var(--bg);border-bottom:1px solid var(--border)}
.its-header-row{height:88px;display:flex;align-items:center;gap:26px}
.its-brand{display:flex;gap:14px;align-items:center;flex-shrink:0}.its-brand img{width:62px;height:48px;object-fit:contain}
.its-brand>span{font-size:16px;font-weight:800;letter-spacing:.08em;line-height:1.25}.its-brand small{display:block;color:var(--muted);font-size:10px;letter-spacing:.015em;font-weight:400;margin-top:6px}
.its-desktop-nav{display:flex;gap:28px;align-items:center;margin-left:auto}.its-desktop-nav>a{min-height:44px;display:inline-flex;gap:7px;align-items:center;font-size:13px;color:var(--muted)}
.its-desktop-nav>a.active{color:var(--fg);box-shadow:0 2px 0 var(--brand)}
.its-header-actions{display:flex;align-items:center;gap:14px}.its-header-actions>.btn{min-height:42px}.its-desktop-contact{font-size:12px}
.its-menu-toggle,.its-mobile-shortcuts,.its-mobile-menu{display:none!important}
.its-main{min-height:45vh}.its-main-detail{width:min(1740px,calc(100% - 64px));margin:28px auto 48px}
.its-main-home{margin:0}.its-main-detail>.mud-container{max-width:100%;padding:0}
/* --- ERSETZT am 2026-11-14 (1.2.13): Zeilen 39-40 setzen das Kontaktband als rote Vollbreiten-Fläche mit weißem Knopf
   (background:var(--brand); color:var(--on-solid); .its-eyebrow font-size 9px/opacity .8; .btn background:var(--fg), color:var(--bg)).
   Grund: Frank 14.11.2026: Band dunkel wie die Karten, in Inhaltsbreite, mit rotem Sedna-Knopf. Neue Fassung: Block
   „Kontaktband“ am Dateiende (schlägt diese Werte, weil später und gleich spezifisch oder spezifischer). --- */
.its-contact-band{background:var(--brand);color:var(--on-solid);padding-block:30px}.its-contact-band>.its-wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}
.its-contact-band .its-eyebrow{font-size:9px;opacity:.8}.its-contact-band h2{font-size:34px;margin-bottom:0;letter-spacing:-.03em}.its-contact-band .btn{background:var(--fg);color:var(--bg);min-height:46px}
.its-footer{padding-block:40px 20px}.its-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr .8fr;gap:36px}
.its-footer-grid>div>p{font-size:13px;color:var(--muted);line-height:1.85;margin-top:20px}
.its-footer nav{display:flex;flex-direction:column;align-items:flex-start}.its-footer nav>h3{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.its-footer nav>a{display:flex;align-items:center;gap:8px;min-height:44px;font-size:14px}.its-footer-bottom{border-top:1px solid var(--border);margin-top:30px;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;color:var(--muted)}
.its-footer-bottom nav{flex-direction:row;flex-wrap:wrap;gap:22px}.its-footer-bottom nav>a{font-size:14px;min-height:44px}
.its-eyebrow{margin-bottom:12px;font-size:10px;letter-spacing:.15em;font-weight:650;color:var(--muted)}
/* Umweg, bis Sedna das abdeckt: https://github.com/dennisrahmen/Sedna.UI/issues/257 (Kopfband mit Bild: Startbild .its-hero, Sedna hat keinen Baustein dafür) */
.its-hero{height:420px;background:#121212;color:#f5f5f5;position:relative;overflow:hidden}.its-hero>img{position:absolute;right:0;top:0;width:74%;height:100%;object-fit:cover;object-position:center 57%;filter:brightness(1.18)}
.its-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#121212 0%,#121212 20%,#121212e8 35%,#12121255 65%,#12121215)}
.its-hero-inner{height:100%;position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px}.its-hero-copy{max-width:470px;padding-block:30px}
.its-hero-copy .its-eyebrow{color:#c1c1c1;font-size:9px}.its-hero h1{font-size:66px;line-height:1.04;letter-spacing:-.05em;font-weight:800;margin-bottom:19px}.its-hero h1 .its-hero-satz>span{color:#f0373b}/* ERSETZT am 2026-11-14 (1.2.16): ".its-hero h1 span{color:#f0373b}" - Grund: Der Spruch steckt jetzt in einer äußeren Hülle (.its-hero-satz, wechselt mit dem Foto); nur die zweite Zeile ist rot. */
.its-hero-description{font-size:15px;line-height:1.8;color:#c8c8c8;max-width:370px;margin-bottom:25px}.its-hero-actions{display:flex;align-items:center;gap:25px;font-size:12px}.its-hero-actions>.btn{min-height:46px}
.its-hero-gallery{display:flex;align-items:center;gap:8px;align-self:flex-end;margin-bottom:27px}.its-hero-gallery>span{font-size:11px;letter-spacing:.08em;margin-right:4px;font-variant-numeric:tabular-nums}.its-hero-gallery>.btn{color:#f5f5f5;background:#12121280;border:1px solid #ffffff55;width:44px;height:44px}
.its-home-events{padding-block:45px 43px;scroll-margin-top:110px}.its-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:36px;margin-bottom:24px}
.its-section-head h2{font-size:34px;line-height:1.2;letter-spacing:-.035em;margin-bottom:10px;font-weight:750}.its-section-head h2>span{color:var(--brand)}
.its-section-head>div>p:last-child{font-size:14px;color:var(--muted);margin-bottom:0}.its-section-head .its-eyebrow{font-size:9px;margin-bottom:9px}.its-archive-button{font-size:13px;min-height:46px}
.its-event-toolbar{justify-content:space-between;gap:20px;background:none;border:0;border-bottom:1px solid var(--border);padding:0 0 16px;flex-wrap:wrap}
.its-filter-buttons{display:flex;align-items:center;gap:5px}.its-filter-buttons>.btn{min-height:44px;gap:7px;font-size:13px}.its-filter-buttons img{object-fit:contain;background:#f5f5f5;border-radius:3px;padding:1px}
.its-search-controls{display:flex;align-items:center;gap:10px}.its-search input{width:230px;font-size:13px;min-height:42px}.its-search-toggle{display:none!important}.its-event-count{color:var(--muted);font-size:12px;margin:15px 0}
.its-event-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:21px}.its-event-card{padding:0;min-width:0;overflow:hidden;display:flex;flex-direction:column;gap:0}
.its-customer-logo{background:#f7f7f5;display:flex;align-items:center;justify-content:center;aspect-ratio:533/285;overflow:hidden;border-bottom:1px solid var(--border)}
.its-customer-logo img{width:100%;height:100%;object-fit:contain}.its-event-copy{padding:19px 21px 15px;flex:1;min-width:0}.its-event-date{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:500;margin-bottom:11px;color:var(--muted)}
.its-event-date .badge{font-size:9px}.its-event-copy h3{font-size:22px;line-height:1.25;letter-spacing:-.025em;font-weight:700;margin-bottom:13px;overflow-wrap:anywhere}
.its-disciplines{display:flex;gap:13px;align-items:center;flex-wrap:wrap;margin-bottom:13px}.its-disciplines>span{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.its-disciplines img{background:#f5f5f5;border-radius:3px;padding:1px;object-fit:contain;width:32px;height:24px}.its-event-location{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--muted)!important;line-height:1.75}.its-event-location>i{margin-top:2px}
.its-event-venue,.its-event-address{display:block}.its-event-links{margin:0 21px;padding:12px 0 16px;border-top:1px solid var(--border)}
.its-event-primary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:35px;font-size:14px;font-weight:600}.its-event-primary>i{color:var(--brand-text)}
.its-event-links>div{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.its-event-links>div>a{min-height:34px;display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted)}
.its-events-foot{display:flex;justify-content:flex-end;margin-top:18px}.its-events-foot a{min-height:44px;display:flex;align-items:center;gap:12px;font-size:13px}.its-empty{padding:25px;text-align:center}
.its-event-list{grid-template-columns:1fr}.its-event-list .its-event-card{display:grid;grid-template-columns:230px minmax(0,1fr) 250px;align-items:stretch}.its-event-list .its-customer-logo{aspect-ratio:auto;height:100%;border-right:1px solid var(--border);border-bottom:0}
.its-event-list .its-event-links{margin:22px 20px 22px 0;padding:8px 0 8px 24px;display:flex;justify-content:center;flex-direction:column;border-top:0;border-left:1px solid var(--border)}
/* --- ERSETZT am 2026-11-14 (1.2.15): .its-services{border-block:1px solid var(--border);background:var(--card-bg);padding-block:48px}
   Grund: Frank-Regel, außer dem Kopfband mit Foto keine Farbfläche über die volle Fensterbreite. --- */
.its-services{padding-block:24px}.its-services>.its-wrap{box-sizing:border-box;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-surface);padding:32px}
/* --- ENDE ERSETZT --- */
.its-services .its-section-head>p{font-size:14px;color:var(--muted);max-width:350px;line-height:1.8;margin:0}.its-services-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.its-service-photo{height:360px;position:relative;overflow:hidden;border-radius:var(--radius-surface)}.its-service-photo>img{width:100%;height:100%;object-fit:cover}.its-service-photo>span{position:absolute;bottom:18px;left:20px;color:#fff;background:#121212bb;padding:5px 10px;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.its-service-section{border-top:1px solid var(--border)}.its-service-section>button{width:100%;padding:19px 0;display:flex;align-items:center;gap:15px;text-align:left;background:none;border:0;color:var(--fg);font:inherit;cursor:pointer}
.its-service-section>button>small{font-size:11px;color:var(--muted)}.its-service-section>button>span{flex:1;font-size:18px;font-weight:600;letter-spacing:-.02em}.its-service-description{padding:0 28px 22px;font-size:14px;color:var(--muted);line-height:1.8}.its-service-description>a{font-size:13px;min-height:36px;display:inline-flex;align-items:center}
@media(min-width:1500px){.its-wrap{width:min(1740px,calc(100% - 112px))}.its-event-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.its-event-list{grid-template-columns:1fr}.its-hero{height:405px}.its-hero h1{font-size:72px}.its-hero-copy{max-width:510px}}
@media(max-width:1100px){.its-wrap{width:calc(100% - 56px)}.its-header-row{gap:16px}.its-desktop-nav{gap:18px}.its-desktop-nav>a{font-size:12px}.its-brand>span{font-size:14px}.its-brand img{width:52px;height:42px}.its-header-actions{gap:9px}.its-desktop-contact{font-size:11px}.its-hero h1{font-size:58px}.its-footer-grid{grid-template-columns:1.2fr 1fr 1fr;gap:25px}.its-footer-grid>nav:last-child{grid-column:2/4}.its-services-grid{gap:30px}.its-event-list .its-event-card{grid-template-columns:180px minmax(0,1fr) 220px}}
@media(max-width:850px){.its-desktop-nav,.its-desktop-contact{display:none!important}.its-header-row{height:70px}.its-header-actions{margin-left:auto}.its-menu-toggle{display:inline-flex!important}.its-mobile-shortcuts{display:flex!important;justify-content:space-between;gap:12px;border-top:1px solid var(--border)}.its-mobile-shortcuts>a{display:flex;align-items:center;gap:7px;min-height:44px;font-size:13px;font-weight:600}
.its-mobile-menu{display:flex!important;position:absolute;top:70px;left:0;right:0;flex-direction:column;gap:0;padding:12px 28px;background:var(--card-bg);border-bottom:1px solid var(--border);box-shadow:0 20px 35px #0004}.its-mobile-menu>a{min-height:44px;padding:10px 0;border-bottom:1px solid var(--border)}
.its-main-detail{width:calc(100% - 36px);margin-top:20px}.its-event-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.its-event-list{grid-template-columns:1fr}.its-event-list .its-event-card{grid-template-columns:180px minmax(0,1fr)}.its-event-list .its-customer-logo{grid-row:span 2}.its-event-list .its-event-links{margin:0 20px;padding:12px 0;border-left:0;border-top:1px solid var(--border)}.its-event-list .its-event-links>div{gap:16px}
.its-section-head{gap:20px}.its-section-head h2{font-size:30px}.its-archive-button{font-size:11px}.its-event-toolbar{flex-direction:column;align-items:stretch;gap:13px}.its-search-controls{justify-content:space-between}.its-search{flex:1}.its-search input{width:100%}.its-services .its-section-head{align-items:flex-start;flex-direction:column}.its-services .its-section-head>p{max-width:520px}.its-footer-grid{grid-template-columns:1fr 1fr}.its-footer-grid>div{grid-column:1/-1}.its-footer-grid>nav:last-child{grid-column:auto}.its-footer-bottom{flex-wrap:wrap}.its-home-events{scroll-margin-top:134px}}
/* Mobil zuerst: Die Übersicht ist eine kompakte Liste, keine verkleinerte Desktop-Karte. */
@media(max-width:580px){.its-wrap{width:calc(100% - 32px)}.its-header-row{height:62px;gap:8px}.its-brand{gap:9px}.its-brand img{width:45px;height:36px}.its-brand>span{font-size:12px}.its-brand small{font-size:8px;margin-top:4px}.its-header-actions{gap:2px}.its-header-actions>.btn{min-width:40px;min-height:44px;padding:6px}.its-mobile-shortcuts>a{font-size:12px;gap:6px}.its-mobile-menu{top:62px;padding-inline:16px}.its-main-detail{width:calc(100% - 24px);margin-top:15px}
.its-hero{height:108px}.its-hero-inner{gap:12px}.its-hero-copy{padding:12px 0}.its-hero-copy .its-eyebrow,.its-hero-description,.its-hero-actions{display:none}.its-hero h1{font-size:28px;line-height:1.07;letter-spacing:-.04em;margin:0}.its-hero>img{width:100%;object-position:65% 50%;opacity:.65}.its-hero-shade{background:linear-gradient(90deg,#121212f5,#12121288 70%,#12121244)}.its-hero-gallery{margin-bottom:16px;gap:4px}.its-hero-gallery>span{font-size:9px;letter-spacing:0;margin-right:3px}.its-hero-gallery>.btn{width:38px;min-width:38px;height:42px}.its-hero-prev{display:none!important}
.its-home-events{padding-block:22px 25px;scroll-margin-top:120px}.its-section-head{margin-bottom:13px;gap:10px}.its-section-head .its-eyebrow{display:none}.its-section-head h2{font-size:23px;margin-bottom:5px;line-height:1.15}.its-section-head>div>p:last-child{font-size:12px;line-height:1.5}.its-home-events .its-archive-button{display:none}
.its-event-toolbar{position:relative;flex-direction:row;align-items:center;gap:5px;padding-bottom:10px;flex-wrap:nowrap}.its-filter-buttons{gap:1px;min-width:0}.its-filter-buttons>.btn{font-size:11px;min-height:40px;gap:4px;padding:7px}.its-filter-buttons img{width:22px;height:18px}.its-search-toggle{display:inline-flex!important}.its-search-controls{gap:0;flex-shrink:0}.its-search-controls>.btn{width:36px;min-width:36px;height:40px;padding:6px}.its-search{display:none;position:absolute;top:52px;left:0;right:0;z-index:2;background:var(--bg);padding:6px 0;box-shadow:0 6px 10px #0003}.its-search.is-open{display:block}.its-search input{min-height:44px;font-size:14px}.its-event-count{font-size:11px;margin:9px 0 10px;line-height:1.4}
.its-event-grid,.its-event-list{grid-template-columns:1fr;gap:10px}.its-event-card,.its-event-list .its-event-card{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:11px;padding:10px 11px 0;min-height:0;border-radius:6px;align-items:start}.its-customer-logo,.its-event-list .its-customer-logo{height:73px;width:96px;aspect-ratio:auto;margin-top:4px;grid-row:1;align-self:start;border:1px solid var(--border);border-radius:4px}
.its-event-copy{padding:0;min-height:0}.its-event-date{font-size:10px;gap:4px;margin-bottom:4px;line-height:1.3}.its-event-date>i{display:none}.its-event-copy h3{font-size:16px;line-height:1.15;letter-spacing:-.02em;margin-bottom:5px;overflow-wrap:normal}.its-disciplines{gap:9px;margin-bottom:5px}.its-disciplines>span{font-size:10px;gap:4px}.its-disciplines img{width:22px;height:17px}.its-event-location{font-size:10px;line-height:1.35;gap:4px}.its-event-location>i{font-size:11px;margin-top:0}.its-event-venue{display:none}.its-event-address{display:block}
.its-event-links,.its-event-list .its-event-links{grid-column:1/-1;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:10px;margin:9px 0 0;padding:0;border-top:1px solid var(--border);border-left:0;min-height:42px}.its-event-primary{min-height:42px;font-size:12px;gap:9px}.its-event-primary>i{font-size:15px}.its-event-links>div{gap:10px;justify-content:flex-end}.its-event-links>div>a{min-height:42px;font-size:10px}.its-event-links>div>a:last-child:not(:first-child){display:none}
.its-event-list .its-event-card{grid-template-columns:78px minmax(0,1fr);column-gap:10px}.its-event-list .its-customer-logo{width:78px;height:59px}.its-event-list .its-disciplines{display:none}.its-events-foot{justify-content:flex-start;margin-top:14px}.its-events-foot a{font-size:13px;min-height:44px}
.its-services{padding-block:24px}.its-services>.its-wrap{padding:20px 16px}.its-services .its-section-head{gap:13px}.its-services .its-section-head h2{font-size:26px}.its-services .its-section-head>p{font-size:14px}.its-services-grid{grid-template-columns:1fr;gap:22px}.its-service-photo{height:215px}.its-service-section>button{padding-block:17px;gap:11px}.its-service-section>button>span{font-size:16px}.its-service-description{font-size:14px;padding-left:23px}.its-service-description>a{min-height:44px}.its-services-grid>div>.btn{font-size:12px;width:100%;justify-content:space-between}
}
@media(max-width:360px){.its-filter-buttons>.btn{font-size:10px;padding:6px;gap:3px}.its-filter-buttons img{width:19px;height:16px}.its-search-controls>.btn{width:32px;min-width:32px}.its-mobile-shortcuts>a{font-size:10px}.its-event-card,.its-event-list .its-event-card{grid-template-columns:80px minmax(0,1fr);gap:9px}.its-customer-logo{width:80px;height:62px}.its-event-copy h3{font-size:15px}.its-event-links>div>a{font-size:9px}.its-footer-grid{grid-template-columns:1fr}.its-footer-grid>div{grid-column:auto}.its-footer-bottom nav{gap:15px}}
@media(prefers-reduced-motion:reduce){.its-site *{scroll-behavior:auto!important;transition:none!important}}

.its-image-size { border-top:1px solid var(--border); margin-top:12px; padding-top:8px; }
.its-image-size>label { display:inline-flex; flex-direction:column; gap:4px; margin:8px; font-size:12px; }
.its-image-size input { max-width:110px; }
.its-image-size [role=status] { display:block; font-size:12px; }

/* Mobile Listen: klare Leserichtung und echte Grid-Spalten, ohne überlagerte Nummern. */
.its-main-detail { width:100%; box-sizing:border-box; margin:0 auto; }
@media(max-width:700px) {
 .its-site .equiscore-list-mobile-card { display:grid; grid-template-columns:34px minmax(0,1fr); column-gap:12px; row-gap:6px; padding:16px 14px; }
 .its-site .equiscore-list-mobile-card-header { display:contents; }
 .its-site .equiscore-list-start-chip-row { position:static; grid-column:1; grid-row:1 / span 5; align-self:start; flex-direction:column; gap:6px; }
 .its-site .equiscore-list-pos-chip { min-width:32px!important; padding:3px!important; min-height:28px; font-size:13px; border-radius:5px; }
 .its-site .equiscore-list-mobile-time { grid-column:2; font-size:12px; line-height:1.4; color:var(--muted); }
 .its-site .equiscore-list-mobile-title { grid-column:2; font-size:16px; line-height:1.4; font-weight:700; }
 .its-site .its-entry-horse { grid-column:2; display:flex; flex-direction:column; gap:2px; margin-top:2px; }
 .its-entry-label { font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
 .its-site .equiscore-list-mobile-subtitle { font-size:14px; line-height:1.4; font-weight:500; margin:0; }
 .its-site .equiscore-list-mobile-meta { grid-column:2; margin-top:2px; display:flex; flex-direction:column; align-items:flex-start; gap:3px; font-size:12px; line-height:1.5; }
 .its-site .equiscore-list-mobile-card>p { grid-column:2; font-size:12px; line-height:1.5; }
 .its-site .equiscore-result-mobile-card { padding:16px; }
 .its-site .equiscore-result-mobile-card-header { margin-bottom:12px; justify-content:space-between; align-items:flex-start; gap:12px; }
 .its-site .equiscore-result-mobile-card-header>:first-child { position:static; flex-shrink:0; }
 .its-site .equiscore-result-mobile-title { font-size:16px; line-height:1.4; margin-bottom:6px; }
 .its-site .equiscore-result-mobile-subtitle { font-size:14px; line-height:1.4; }
 .its-site .equiscore-result-mobile-meta { font-size:12px; line-height:1.5; margin-top:8px; }
 .its-site .equiscore-result-mobile-card>p { font-size:12px; line-height:1.5; }
 .its-site .equiscore-result-mobile-summary { font-size:14px; line-height:1.6; }
}

.its-site .equiscore-result-mobile-list,.its-site .equiscore-list-mobile-list { width:100%; min-width:0; }
.its-site .equiscore-result-mobile-card,.its-site .equiscore-list-mobile-card { width:100%; box-sizing:border-box; }
.its-site .equiscore-result-mobile-group-header { background:var(--card-bg); color:var(--fg); border:1px solid var(--border); border-left:3px solid var(--brand); border-radius:var(--radius-control); padding:10px 12px; font-size:13px; font-weight:600; }
.its-site :is(a,button,input,summary):focus-visible { outline:2px solid var(--brand-text); outline-offset:3px; box-shadow:none; }
@media(max-width:700px) {
 .its-site .equiscore-list-mobile-card>p { margin:0; }
 .its-site .equiscore-result-mobile-meta { display:flex; flex-direction:column; align-items:flex-start; gap:3px; }
}

/* Ergebniszeile: Rang links, Reiter/Pferd mittig, Wertung rechts. */
@media(max-width:700px) {
 .its-site .equiscore-result-mobile-card { display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:4px 10px; padding:12px; }
 .its-site .equiscore-result-mobile-card-header { display:contents; }
 .its-site .equiscore-result-mobile-card-header>:first-child { grid-column:1; grid-row:1 / span 2; position:static; }
 .its-site .equiscore-result-mobile-summary { grid-column:3; grid-row:1 / span 2; max-width:94px; font-size:12px; line-height:1.5; }
 .its-site .equiscore-result-mobile-title { grid-column:2; grid-row:1; margin:0; font-size:15px; line-height:1.35; }
 .its-site .equiscore-result-mobile-subtitle { grid-column:2; grid-row:2; margin:0; font-size:13px; line-height:1.4; font-weight:400; }
 .its-site .equiscore-result-mobile-meta { grid-column:2 / -1; display:block; margin-top:2px; font-size:11px; line-height:1.5; }
 .its-site .equiscore-result-mobile-meta span+span::before { content:" · "; }
 .its-site .equiscore-result-mobile-details { grid-column:2 / -1; border:0; padding:0; margin:0; }
 .its-site .equiscore-result-mobile-details summary { padding:4px 0; min-height:26px; line-height:1.5; font-size:11px; text-transform:none; letter-spacing:0; }
 .its-site .equiscore-result-mobile-detail-list { padding:4px 0 8px; line-height:1.5; }
}

/* Zeiteinteilung: volle Textbreite und eine gemeinsame Aktionszeile. */




.its-main-detail>.mud-container { padding:0!important; }
.its-site .equiscore-result-group-header-title { background:var(--bg); color:var(--fg); border:1px solid var(--border); border-left:3px solid var(--brand); border-radius:var(--radius-control); padding:6px 10px; font-size:12px; font-weight:600; }
.its-site .equiscore-result-table thead th:first-child,.its-site .equiscore-list-table thead th:first-child { width:72px; }
.its-site .equiscore-result-table thead th:nth-child(2),.its-site .equiscore-list-table thead th:nth-child(2) { width:80px; }

/* Der vollständige Firmenname behält das kleine i auch in Überschriften. */
.its-brand>span { text-transform:none; letter-spacing:.015em; }
.its-footer .its-brand-heading,.its-service-photo>span { text-transform:none; letter-spacing:.02em; }

/* Hauptaktionen sind erkennbare Schaltflächen; Bild-News gehören ins reguläre Raster. */
.its-event-count { min-height:18px; }
.its-site .its-event-primary { display:flex; width:100%; justify-content:space-between; min-height:42px; padding:10px 13px; border:1px solid var(--brand); border-radius:var(--radius-control); background:var(--brand); color:var(--on-solid); font-size:13px; font-weight:600; line-height:1.4; }
.its-site .its-event-primary>i { color:inherit; }
.its-site .its-event-primary:hover { background:var(--brand-hover); border-color:var(--brand-hover); color:var(--on-solid); }
.its-event-links>div>a { text-decoration:underline; text-decoration-color:color-mix(in srgb,var(--muted) 60%,transparent); text-underline-offset:3px; }
.its-promo-card .its-customer-logo { background:var(--card-bg); }
.its-promo-card .its-customer-logo>img { padding:14px; }
.its-promo-description { font-size:13px; line-height:1.65; color:var(--muted); margin:12px 0 0; }
.its-promo-card .its-event-copy h3 { margin-bottom:0; }
@media(max-width:700px) {
 .its-site .its-event-primary { width:auto; min-height:36px; margin-block:4px; padding:7px 10px; font-size:11px; gap:10px; }
 .its-site .its-event-links { min-height:46px; }
 .its-promo-card .its-customer-logo { height:84px; }
 .its-promo-card .its-customer-logo>img { padding:2px; }
 .its-promo-card .its-promo-description { display:none; }
 .its-promo-card .its-event-copy h3 { font-size:17px; line-height:1.3; }
 .its-promo-card .its-event-date { margin-bottom:8px; }
}

.its-filter-empty { padding:14px 0 0; color:var(--muted); font-size:13px; }
.its-filter-empty a { text-decoration:underline; text-underline-offset:3px; }

/* Knöpfe der Karten auf einer Höhe (nur Kartenraster ab Tablet-Breite): Der Fuß hat immer dieselbe Mindesthöhe
   (Trennlinie 1 + Polster 12 + Knopf 42 + Linkzeile 34 + Polster 16 = 105 px). Der Knopf steht oben im Fuß, die Linkzeile
   (falls vorhanden) unten. So sitzen alle Knopfoberkanten einer Reihe gleich hoch, auch wenn eine Karte
   (z. B. Jobs) keine Linkzeile hat. Ohne Knopf rutscht die Linkzeile nach unten, der Fuß bleibt gleich hoch.
   Listenansicht und Handy haben eigene Regeln und bleiben unberührt.
   Korrektur 14.11.2026 (1.2.12): Die Trennlinie zählt bei border-box mit; mit 104 px stand die Jobs-Karte
   auf Staging noch 1 px tiefer als die Turnierkarten. */
@media(min-width:701px) {
 .its-site .its-event-grid:not(.its-event-list) .its-event-links { display:flex; flex-direction:column; min-height:105px; box-sizing:border-box; }
 .its-site .its-event-grid:not(.its-event-list) .its-event-links>div { margin-top:auto; }
}

/* Startbild auf breiten Bildschirmen: Ab 1500 px endet das Bild an der rechten Kante des Inhaltsbereichs
   (gleiche Breite wie .its-wrap dort: min(1740px, 100% - 112px)) statt am Fensterrand. Darunter bleibt alles
   wie bisher. Die Breite des Bildes bezieht sich auf den Inhaltsbereich (74 %, wie vorher auf das Fenster). */
/* --- ERSETZT am 2026-11-14 (1.2.12): Regel galt nur ab 1500 px, darunter lief das Bild weiter bis an den
   Fensterrand (bei 1440 px rund 95 px über die Inhaltskante hinaus). Neue Fassung siehe unten. ---
@media(min-width:1500px) {
 .its-hero { --its-hero-r:max(0px,calc((100% - min(1740px,100% - 112px)) / 2)); }
 .its-hero>img { right:var(--its-hero-r); width:calc(min(1740px,100% - 112px) * .74); }
 .its-hero-shade::after { content:""; position:absolute; top:0; bottom:0; right:var(--its-hero-r); width:180px; background:linear-gradient(270deg,#121212,#12121200); }
}
   --- ENDE ERSETZT --- */
/* Startbild endet bei jeder PC-Breite (ab 851 px) an der rechten Kante des Inhaltsbereichs.
   --its-hero-wrap ist dieselbe Breite wie .its-wrap in der jeweiligen Stufe (Zeile 28, 75, 76 dieser Datei);
   ändert sich dort eine Breite, muss sie hier mitgezogen werden. Handy und Tablet (bis 850 px) bleiben wie bisher. */
@media(min-width:851px) {
 .its-hero { --its-hero-wrap:min(1240px,100% - 80px); --its-hero-r:max(0px,calc((100% - var(--its-hero-wrap)) / 2)); }
 .its-hero>img { right:var(--its-hero-r); width:calc(var(--its-hero-wrap) * .74); }
 /* --- ERSETZT am 2026-11-14 (1.2.13): Weicher dunkler Auslauf (180 px) an der rechten Bildkante:
 .its-hero-shade::after { content:""; position:absolute; top:0; bottom:0; right:var(--its-hero-r); width:180px; background:linear-gradient(270deg,#121212,#12121200); }
   Grund: Frank 14.11.2026: Bild soll rechts voll hell bleiben. --- */
 /* Verlauf am Bild ausgerichtet: Der allgemeine Verlauf (Zeile 48) rechnet über die ganze Bandbreite, das Bild endet
    aber an der Inhaltskante (74 % der Inhaltsbreite). Dadurch lagen an der rechten Bildkante noch rund 8 % Abdunklung.
    Neu: dunkel bis zur linken Bildkante, dann gleiches Ausblenden wie vorher, ab ca. 70 % der Bildbreite voll hell
    bis zum rechten Bildrand. --its-hero-bw = Bildbreite, --its-hero-bs = linke Bildkante (Prozent bezieht sich auf das Band). */
 .its-hero { --its-hero-bw:calc(var(--its-hero-wrap) * .74); --its-hero-bs:calc(100% - var(--its-hero-r) - var(--its-hero-bw)); }
 .its-hero-shade { background:linear-gradient(90deg,#121212 0,#121212 var(--its-hero-bs),#121212e8 calc(var(--its-hero-bs) + var(--its-hero-bw) * .1),#12121255 calc(var(--its-hero-bs) + var(--its-hero-bw) * .45),#12121200 calc(var(--its-hero-bs) + var(--its-hero-bw) * .7)); }
}
@media(min-width:851px) and (max-width:1100px) { .its-hero { --its-hero-wrap:calc(100% - 56px); } }
@media(min-width:1500px) { .its-hero { --its-hero-wrap:min(1740px,100% - 112px); } }

/* Schrift auf roten Sedna-Knöpfen, die Links sind (a.btn--solid): Die allgemeine Regel ".its-site a{color:inherit}"
   (Zeile 26) liegt außerhalb von Sednas Ebenen (@layer) und schlägt deshalb Sednas Knopffarbe. Folge im hellen Modus:
   dunkle Schrift auf Rot, nur 3,6 : 1 (z. B. „Gemeinsam Ihr Turnier …“, Mail-Knopf der Jobs-Seite). Hier bekommen nur
   die vollfarbigen Knöpfe Sednas eigene Schriftfarbe zurück (Weiß auf iTS-Rot = 5,3 : 1). Andere Links und Knöpfe
   bleiben bewusst bei „inherit“, weil z. B. „Sprechen wir darüber“ im roten Kontaktband davon abhängt. (14.11.2026, 1.2.12) */
.its-site a.btn.btn--solid { color:var(--tone-on-solid,var(--bg)); }

/* ===== Musterseite Jobs im Startseiten-Stil (Gruppe "its-page", NOT-1508) ===== */
.its-page { overflow-x:clip; }
.its-page .its-eyebrow { text-transform:uppercase; }
.its-page h1,.its-page h2,.its-page h3 { margin-bottom:0; }

/* Kopfbereich: wie das Startbild immer ein dunkles Band (feste Farben mit Absicht, auch im hellen Modus,
   weil Text auf einem Foto liegt). Kontrast: #f5f5f5 / #c8c8c8 auf #121212 = 17,2 : 1 / 11,2 : 1. */
/* Umweg, bis Sedna das abdeckt: https://github.com/dennisrahmen/Sedna.UI/issues/257 (Kopfband mit Bild auf den Info-Seiten: its-page-hero, Sedna hat keinen Baustein dafür) */
.its-page-hero { --its-page-w:min(1240px,100% - 80px); position:relative; overflow:hidden; background:#121212; color:#f5f5f5; }
/* 1.2.18: overflow:hidden, damit am Rahmen des Fotos nie etwas übersteht (Frank 14.11.2026; vorher wuchs das zoomende Foto über den Rand). */
.its-page-hero-media { position:absolute; top:0; bottom:0; left:50%; width:var(--its-page-w); transform:translateX(-50%); overflow:hidden; }
.its-page-hero-media>img { width:100%; height:100%; object-fit:cover; object-position:57% center; display:block; filter:brightness(1.1); }
/* Links dicht (Text), nach rechts offen; zusätzlich weicher Auslauf an der rechten Bildkante. */
/* --- ERSETZT am 2026-11-14 (1.2.18): .its-page-hero-shade { ... background:linear-gradient(270deg,#121212 0,#12121200 14%),linear-gradient(90deg,#121212 0%,#121212 38%,#121212d9 58%,#12121240 100%); }
   Grund: Frank 14.11.2026: Rechts soll das Foto voll hell sein wie auf der Startseite. Der alte Verlauf dunkelte rechts noch 25 % ab
   (#12121240 bei 100 %) und legte zusätzlich einen dunklen Randstreifen (14 %) darüber. Neu: Der Verlauf liegt im Rahmen des Fotos
   (.its-page-hero-media, dasselbe Maß wie die Inhaltsbreite) und läuft bis 0 % Deckkraft genau an der rechten Bildkante. --- */
.its-page-hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,#121212 0%,#121212 38%,#121212d9 58%,#12121240 80%,#12121200 100%); }
.its-page-hero-inner { position:relative; padding-block:64px; }
.its-page-hero-copy { max-width:600px; }
.its-page-hero .its-eyebrow { color:#c1c1c1; font-size:10px; }
.its-page-hero h1 { font-size:clamp(34px,5.4vw,60px); line-height:1.06; letter-spacing:-.045em; font-weight:800; margin-bottom:20px; max-width:12em; }
.its-page-hero h1 span { color:#f0373b; display:block; }
.its-page-hero-lead { font-size:17px; line-height:1.6; color:#f5f5f5; margin-bottom:12px; max-width:34em; }
.its-page-hero-text { font-size:15px; line-height:1.8; color:#c8c8c8; margin-bottom:26px; max-width:36em; }
.its-page-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; }
.its-page-actions>.btn { min-height:46px; }
.its-site .its-page-hero-tel { font-size:14px; min-height:44px; display:inline-flex; align-items:center; text-decoration:underline; text-underline-offset:4px; color:#f5f5f5; }
.its-site .its-page-hero-tel:hover { color:#ffffff; }

/* Abschnitte: wie die Startseite abwechselnd Grundfläche und Kartenfläche mit Linien. */
.its-page-section { padding-block:48px; }
.its-page-band { border-block:1px solid var(--border); background:var(--card-bg); }
.its-page-band .its-page-card { background:var(--bg); }
.its-page .its-section-head>div>p:last-child { max-width:72ch; }

.its-page-grid { display:grid; gap:21px; }
.its-page-grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.its-page-grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.its-page-grid-req { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); align-items:start; }
.its-page-stack { display:grid; gap:21px; min-width:0; }

/* Karten: Foto oben (nur Schmuck, deshalb ohne Alternativtext), Text darunter; Sedna-Karte mit Polster 0 wie die Turnierkarten. */
.its-page-card { padding:0; min-width:0; overflow:hidden; }
.its-page-card-accent { border-color:var(--brand); }
.its-page-photo { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; border-bottom:1px solid var(--border); }
.its-page-photo-wide { aspect-ratio:21/9; }
.its-page-card .card-body { padding:20px 22px 22px; }
.its-page-card .badge { margin-bottom:12px; }
.its-page-card h2,.its-page-card h3 { font-size:22px; line-height:1.25; letter-spacing:-.025em; font-weight:700; margin-bottom:12px; }
.its-page-card p { font-size:14px; line-height:1.7; color:var(--muted); margin-bottom:0; }
.its-page-card .its-eyebrow { margin-bottom:8px; font-size:10px; }
.its-page-card h2+ul,.its-page-card h3+ul { margin-top:2px; }

/* Listen: roter Punkt als Aufzählungszeichen (reine Zier), Text in Normalfarbe für gute Lesbarkeit. */
.its-page-list,.its-page-steps { list-style:none; margin:0; padding:0; display:grid; gap:11px; }
.its-page-list li { position:relative; padding-left:22px; font-size:14px; line-height:1.65; color:var(--fg); }
.its-page-list li::before { content:""; position:absolute; left:0; top:.55em; width:8px; height:8px; border-radius:50%; background:var(--brand); }
.its-page-steps { counter-reset:its-page-step; margin:16px 0 20px; }
.its-page-steps li { counter-increment:its-page-step; position:relative; padding-left:38px; min-height:26px; font-size:14px; line-height:1.6; color:var(--fg); }
.its-page-steps li::before { content:counter(its-page-step); position:absolute; left:0; top:-1px; width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--brand); color:var(--on-solid); font-size:13px; font-weight:700; }
.its-page-note-title { display:block; margin-bottom:8px; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--fg); }
.its-page-card .its-page-footnote { margin-top:18px; }
.its-page-card .its-page-actions>.btn { overflow-wrap:anywhere; }

@media(max-width:850px) {
 .its-page-hero-media { left:0; right:0; width:auto; transform:none; }
 /* Handy/Tablet: Bild ganzflächig, darüber gleichmäßig dunkel, damit der Text überall lesbar bleibt (>= 8 : 1). */
 .its-page-hero-shade { background:linear-gradient(90deg,#121212f2,#121212d9); }
 .its-page-hero-inner { padding-block:44px; }
 .its-page-grid-2,.its-page-grid-3,.its-page-grid-req { grid-template-columns:1fr; gap:16px; }
 .its-page-stack { gap:16px; }
 .its-page-section { padding-block:34px; }
}
@media(min-width:1100px) { .its-page-hero-media { width:var(--its-page-w); } }
/* 1.2.18: bis 1100 px ist der Inhaltsbereich (.its-wrap) 56 px schmaler als das Fenster, nicht 80 px; das Foto folgt ihm jetzt, sonst stand es dort 12 px innerhalb der Inhaltskante. */
@media(min-width:851px) and (max-width:1100px) { .its-page-hero { --its-page-w:calc(100% - 56px); } }
@media(min-width:1500px) { .its-page-hero { --its-page-w:min(1740px,100% - 112px); } }
@media(max-width:580px) {
 .its-page-hero-inner { padding-block:32px 36px; }
 .its-page-hero-lead { font-size:16px; }
 .its-page-card .card-body { padding:16px 16px 18px; }
 .its-page-card h2,.its-page-card h3 { font-size:19px; }
 .its-page-section { padding-block:26px; }
}

/* ===== Gemeinsame Bausteine aller Info-Seiten (Homepage-Redesign Schritt B, NOT-1508, 2026-11-14) =====
   Die Klassen der Musterseite Jobs (früher "its-jobs-…") heißen jetzt "its-page-…" und gelten für Leistungen, Kontakt,
   Über uns und alle CMS-Seiten (Referenzen, Partner, Impressum, Datenschutz). Grund: eine Quelle statt vier Kopien;
   Jobs sieht unverändert aus. Ergänzungen unten: Knopfreihe im Kopfband, Fließtext, Kennzahlen, Formular, Kopfband ohne Foto. */

/* Kopfband ohne Foto (Rechtstexte): schmaler, nur der dunkle Grund; Text bleibt links im Inhaltsbereich. */
.its-page-hero-plain .its-page-hero-inner { padding-block:44px; }
.its-page-hero-plain .its-page-hero-copy { max-width:760px; }
.its-page-hero-plain .its-page-hero-text:last-child { margin-bottom:0; }

/* Kopfband mit beliebigem (auch hellem, vom CMS gelieferten) Foto: Zwischen 851 und 1300 px reicht die 600 px breite Textspalte
   über die Zone, in der der Verlauf der Musterseite Jobs nur noch ~80 % deckt. Gemessen (Kontrast gegen ein ungünstigstes weißes
   Pixel): die rote Zeile der Überschrift fiele unter 3 : 1. Darum hier die Spalte höchstens 62 % der Inhaltsbreite und der
   deckende Teil des Verlaufs bis 52 % (statt 38 %) – dort erreicht die rote Zeile >= 3,9 : 1, der Fließtext >= 9 : 1.
   Jobs trägt die Klasse nicht und bleibt unverändert. Oberhalb 1300 und unterhalb 851 px reicht die Regel der Musterseite. */
@media(min-width:851px) and (max-width:1300px) {
 .its-page-hero-open .its-page-hero-copy { max-width:min(600px,62%); }
 /* ERSETZT am 2026-11-14 (1.2.18): background:linear-gradient(270deg,#121212 0,#12121200 14%),linear-gradient(90deg,#121212 0%,#121212 52%,#121212d9 72%,#12121240 100%); Grund: Frank: rechts voll hell (siehe oben). */
 .its-page-hero-open .its-page-hero-shade { background:linear-gradient(90deg,#121212 0%,#121212 52%,#121212d9 72%,#12121240 90%,#12121200 100%); }
}

/* Abgesetzter Abschnitt in der Inhaltsbreite ("Panel"): Farbfläche und Rahmen liegen auf dem inneren .its-wrap, also bündig mit den
   Karten der übrigen Abschnitte, nie über die volle Fensterbreite (Frank, Runden 1.2.12/1.2.13; Muster wie das Kontaktband).
   Ersetzt auf den neuen Info-Seiten das Vollbreiten-Band "its-page-band", das nur die Musterseite Jobs noch trägt. Karten darin
   liegen wie im Band auf dem Seitengrund (--bg), damit sie sich von der Fläche abheben. */
.its-page-panel { padding-block:24px; }
.its-page-panel>.its-wrap { box-sizing:border-box; background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius-surface); padding:32px; }
.its-page-panel .its-page-card { background:var(--bg); }
@media(max-width:580px) { .its-page-panel>.its-wrap { padding:20px 16px; } }

/* Knopfreihe im Kopfband: Nebenknöpfe als helle Kontur auf dem dunklen Band (feste Farben mit Absicht wie das Band;
   #f5f5f5 auf #121212 = 17,2 : 1, Kontur #ffffff8c ist größer als 3 : 1). Alle gleich hoch (46 px, wie die roten Knöpfe der Reihe). */
.its-page-hero-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
/* Umweg, bis Sedna das abdeckt: https://github.com/dennisrahmen/Sedna.UI/issues/257 (Knopf mit heller Kontur auf dunklem Foto, Sedna-Knöpfe sind nur für helle/dunkle Flächen des Themas gedacht) */
.its-site .its-page-hero-link { display:inline-flex; align-items:center; min-height:46px; box-sizing:border-box; padding:0 18px; border:1px solid #ffffff8c; border-radius:var(--radius-control,10px); color:#f5f5f5; font-size:14px; font-weight:600; text-decoration:none; background:transparent; }
.its-site .its-page-hero-link:hover { background:#ffffff1f; color:#ffffff; }

/* Karte als Link (Übersichtskacheln): ganze Karte klickbar, Rahmen wird beim Darüberfahren rot. */
/* Umweg, bis Sedna das abdeckt: https://github.com/dennisrahmen/Sedna.UI/issues/257 (ganze Karte als Link, Sedna kennt keine anklickbare Karte) */
.its-site a.its-page-card-link { display:block; color:inherit; text-decoration:none; }
.its-site a.its-page-card-link:hover,.its-site a.its-page-card-link:focus-visible { border-color:var(--brand); }
.its-page-card-meta { display:block; margin-top:12px; font-size:12px; font-weight:650; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }

/* Fließtext in Karten und Abschnitten (Leistungstexte, CMS-Texte, Rechtstexte). */
.its-page-body p { font-size:14px; line-height:1.7; color:var(--muted); margin:0 0 12px; }
.its-page-body p:last-child,.its-page-body ul:last-child { margin-bottom:0; }
.its-page-body ul { list-style:none; margin:0 0 12px; padding:0; display:grid; gap:9px; }
.its-page-body li { position:relative; padding-left:22px; font-size:14px; line-height:1.65; color:var(--fg); }
.its-page-body li::before { content:""; position:absolute; left:0; top:.55em; width:8px; height:8px; border-radius:50%; background:var(--brand); }
.its-page-body a { color:var(--brand-text); text-decoration:underline; text-underline-offset:3px; }
.its-page-body h2,.its-page-body h3,.its-page-body h4 { margin:22px 0 8px; font-weight:700; letter-spacing:-.02em; color:var(--fg); }
.its-page-body>:first-child { margin-top:0; }
/* Lesespalte für lange Texte (Impressum, Datenschutz, Textabschnitte): Zeilen nicht breiter als ca. 80 Zeichen. */
.its-page-prose { max-width:84ch; }
.its-page-prose p,.its-page-prose li { font-size:15px; }
.its-page-prose p { color:var(--fg); }

/* Link „Nach oben“ im Abschnittskopf und kleine Textlinks. */
.its-site a.its-page-toplink { font-size:13px; font-weight:600; color:var(--muted); white-space:nowrap; text-decoration:underline; text-underline-offset:4px; min-height:44px; display:inline-flex; align-items:center; }
.its-site a.its-page-toplink:hover { color:var(--fg); }

/* Abschnittskopf mit Beschriftung der Rubrik über der Kartenreihe (Leistungen: Bildkarussell neben den Themenkarten). */
.its-page-split { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:21px; align-items:start; }
.its-page-split-rev { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); }
.its-page-media { min-width:0; position:sticky; top:96px; }
.its-page-media .its-page-photo { border-bottom:0; }
/* Bildkarussell (Components/Services/ServiceImageCarousel.razor) im Kartenstil: sein eigener Block bringt 28 px Radius,
   Schatten und einen Abdunkel-Verlauf mit. In Karten (Rahmen und Radius kommen von der Karte) entfällt das; "Bilder nicht
   zusätzlich abdunkeln" (Frank). ".its-page" erhöht die Spezifität über den Block des Karussells. */
.its-page .its-page-card .services-carousel { border-radius:0; box-shadow:none; }
.its-page .services-carousel::after { background:none; }
.its-page-caption { padding:14px 18px 16px; font-size:13px; line-height:1.6; color:var(--muted); border-top:1px solid var(--border); }
.its-page-actions-row { margin-top:21px; }

/* Kennzahlen (Referenzen): große Zahl, kleine Beschriftung; drei in einer Reihe, auf dem Handy untereinander. */
.its-page-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:21px; margin-bottom:24px; }
/* Referenzen und Partner (CMS): Kartenwand aus Logos/Referenzen. Das Logo steht auf dem Seitengrund (--bg): viele Logos
   bringen ihren weißen Grund selbst mit, transparente bleiben so im hellen wie im dunklen Modus am ehesten erkennbar. */
.its-page-refgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px; }
.its-page-ref { height:100%; display:flex; flex-direction:column; }
.its-page-ref-media { aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; padding:6px; background:var(--bg); border-bottom:1px solid var(--border); overflow:hidden; }
.its-page-ref-media img { width:100%; height:100%; object-fit:contain; display:block; }
.its-page-ref-media-fallback { font-size:26px; font-weight:800; letter-spacing:.04em; color:var(--muted); }
.its-page-ref .card-body { padding:14px 14px 16px; display:flex; flex-direction:column; flex:1; }
.its-page-ref h3 { font-size:15px; line-height:1.3; margin-bottom:4px; }
.its-page-ref .its-page-card-meta { margin-top:0; margin-bottom:8px; text-transform:none; letter-spacing:0; font-weight:500; }
.its-page-ref .its-page-actions { margin-top:auto; padding-top:12px; }
.its-page-ref-badges { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.its-page-ref-badges .badge { margin-bottom:0; }
.its-page-logos { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px; }
.its-page-logo { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:18px; text-align:center; min-height:150px; }
.its-page-logo img { max-width:100%; max-height:84px; object-fit:contain; display:block; }
.its-page-logo span { font-size:14px; font-weight:650; color:var(--fg); }
.its-page-section[id] { scroll-margin-top:96px; }
/* Rechtstexte aus dem CMS bringen ein eigenes Stilblatt mit (".legal", Spalte 880 px, graues ".muted" #666 = zu blass auf
   dunklem Grund). Spalte und Abstand bleiben, nur die graue Schrift folgt den Sedna-Farben. */
.its-page .legal .muted { color:var(--muted); }
.its-page .legal { color:var(--fg); }
.its-page .legal a,.its-page-legacy a { color:var(--brand-text); }
.its-page-legacy { color:var(--fg); line-height:1.6; }
/* --- ERSETZT am 2026-11-14: eigene Kennzahl-Karten (its-page-metric-…); jetzt Sedna-Kacheln ".stat" (Schritt B, NOT-1508) ---
   .its-page-metric .card-body { padding:18px 22px; }
   .its-page-metric-value { display:block; font-size:clamp(22px,2.6vw,32px); font-weight:800; letter-spacing:-.03em; line-height:1.15; color:var(--fg); overflow-wrap:anywhere; }
   .its-page-metric-label { display:block; margin-top:4px; font-size:13px; color:var(--muted); }
   --- ENDE ERSETZT --- */
.its-page-metrics .stat { min-width:0; }
.its-page-metrics .stat-value { overflow-wrap:anywhere; }

/* Faktenliste (Kontakt: rechtliche Angaben): Beschriftung über dem Wert, zwei Spalten. */
.its-page-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 24px; margin:16px 0 18px; }
.its-page-facts p,.its-page-facts address { font-size:14px; line-height:1.6; color:var(--fg); margin:0; font-style:normal; }
.its-page-facts .badge { margin-bottom:8px; }

/* Formular: Sedna-Felder; hier nur Abstände und der Absendeknopf. */
.its-page-form { display:grid; gap:16px; margin-top:16px; }
.its-page-form .form-field { margin:0; }
.its-page-form-intro { font-size:14px; line-height:1.7; color:var(--muted); margin:0; }
.its-page-form .alert { margin-bottom:0; }
.its-page-form-actions { display:flex; justify-content:flex-start; }
.its-page-form-actions .btn { min-height:46px; }

/* Kopfzeile einer Karte im Seitenstil (Eyebrow + Überschrift). */
.its-page-card h2 .its-eyebrow { display:block; }

/* Kontakt: Formular breiter als die Hinweise daneben; Linklisten (Adressen, Telefon) und Hinweiskasten in den Karten. */
.its-page-grid-form { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:start; }
.its-page-linklist { display:grid; gap:4px; margin-top:16px; }
.its-site .its-page-linklist a,.its-site .its-page-card p a { color:var(--brand-text); font-size:14px; font-weight:600; overflow-wrap:anywhere; text-decoration:underline; text-underline-offset:3px; }
.its-site .its-page-linklist a { display:inline-flex; align-items:center; min-height:32px; }
/* --- ERSETZT am 2026-11-14: eigener Hinweiskasten; jetzt Sedna-Callout (callout callout--warn). Grund: Schritt B (NOT-1508) ---
   .its-page-card p.its-page-note { margin-top:14px; padding:12px 14px; border:1px solid var(--border); border-left:3px solid var(--brand); border-radius:var(--radius-surface); background:var(--bg); color:var(--fg); }
   --- ENDE ERSETZT --- */
.its-page-card .callout { margin:14px 0 0; }
.its-site .its-page-card .callout a { color:inherit; text-decoration:underline; }
.its-page-address { font-style:normal; font-size:14px; line-height:1.65; color:var(--fg); margin:0; }
.its-page-card h2+.its-page-address { margin-top:2px; }

/* Inhaltsübersicht der Rechtstexte: Karte mit Linkliste. */
.its-page-toc { margin-bottom:24px; }
.its-page-toc .card-body { padding:18px 22px; }
.its-page-toc-links { display:grid; gap:4px; }
.its-site .its-page-toc-links a { color:var(--fg); text-decoration:none; min-height:36px; display:inline-flex; align-items:center; }
.its-site .its-page-toc-links a:hover { color:var(--brand-text); text-decoration:underline; }

@media(max-width:850px) {
 .its-page-split { grid-template-columns:1fr; gap:16px; }
 .its-page-media { position:static; }
 .its-page-metrics { grid-template-columns:1fr; gap:16px; }
 .its-page-facts { grid-template-columns:1fr; }
 .its-page-grid-form { grid-template-columns:1fr; }
 .its-page-hero-plain .its-page-hero-inner { padding-block:32px; }
}

/* Kontaktband „Was planen Sie?“ (14.11.2026, 1.2.13, Frank): Dunkle Kartenfläche statt roter Vollbreiten-Fläche.
   Die <section> ist nur noch Abstandshalter (transparent); die Farbfläche liegt auf dem inneren .its-wrap, damit sie
   links und rechts bündig mit den Karten und Abschnitten darüber steht. Rahmen und Radius wie Sedna .card
   (1px --border, --radius-surface). Außerhalb bleibt der normale Seitenhintergrund. */
.its-contact-band { background:transparent; color:var(--fg); padding-block:40px 8px; }
.its-contact-band>.its-wrap { box-sizing:border-box; background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius-surface); padding:30px 32px; flex-wrap:wrap; }
/* Oberzeile: iTS-Rot in voller Deckkraft, größer als bisher (9 px/.8 war grau auf Rot, 1,9 : 1). */
.its-contact-band .its-eyebrow { font-size:11px; opacity:1; color:var(--brand-text); }
.its-contact-band h2 { color:var(--fg); }
/* Knopf: roter Sedna-Knopf (btn--brand btn--solid). Die alte Regel „.its-contact-band .btn{background:var(--fg);…}“ (Zeile 40)
   würde Sednas Farbe überstimmen; revert-layer gibt die Farbe an Sednas Ebene zurück. Schriftfarbe: Regel „a.btn.btn--solid“ oben. */
.its-contact-band .btn.btn--solid { background:revert-layer; }
@media(max-width:580px) {
 .its-contact-band { padding-block:28px 4px; }
 .its-contact-band>.its-wrap { padding:22px 18px; gap:16px; }
 .its-contact-band h2 { font-size:28px; }
}

/* ==========================================================================
   Version 1.2.16 (14.11.2026, NOT-1509): Startbild mit acht Fotos und Sprüchen, Turnierreihe nach Wochen,
   Seite „Turniere“, Leistungsauswahl, Einfahrt des Kopfbands, mehr Bewegung.
   Neue Regeln stehen bewusst hier unten und überstimmen ältere gleich starke Regeln weiter oben.
   Bewegung gibt es nur ohne „Bewegung reduzieren“ (prefers-reduced-motion: no-preference); sonst bleibt alles ruhig.
   ========================================================================== */

/* ----- Startbild: Fotos überblenden, Spruch wechselt mit ----- */
/* Höhe: Der längste Spruch („Sie laden ein. / Wir sorgen für Bild und Ton.“) läuft über drei Zeilen, dazu die längere Unterzeile
   und zwei Knöpfe; die feste Höhe verhindert, dass die Seite beim Bildwechsel springt. */
.its-hero { height:480px; }
.its-hero h1 { font-size:58px; min-height:3.12em; }
.its-hero-satz { display:block; }
.its-hero-description { max-width:410px; }
.its-hero-actions { gap:12px; flex-wrap:wrap; }
.its-hero-actions>.btn { min-width:196px; justify-content:space-between; }
/* Fotos liegen übereinander: nur das aktive und (zum Überblenden) das vorherige sind sichtbar. */
.its-hero>img.its-hero-bild { display:none; transform-origin:70% 50%; }
.its-hero>img.is-aktiv { display:block; z-index:1; }
/* ERSETZT am 2026-11-14 (1.2.18): is-vorher trug transform:scale(1.06) (Endstand des Zooms). Grund: Zoom entfällt, sonst spränge das ausblendende Foto größer. */
.its-hero>img.is-vorher { display:block; z-index:0; }
.its-hero-shade { z-index:2; }
.its-hero-inner { z-index:3; }
@media(min-width:1500px) { .its-hero { height:480px; } .its-hero h1 { font-size:64px; } }
/* Abdunklung links länger halten: Die Sprüche sind jetzt länger (bis drei Zeilen) und reichen ein Stück über die linke Bildkante;
   die rote Zeile braucht hinter sich dunklen Grund (WCAG: große Schrift 3 : 1). Maße wie in der Regel weiter oben (--its-hero-bs/-bw). */
@media(min-width:851px) {
 .its-hero-shade { background:linear-gradient(90deg,#121212 0,#121212 var(--its-hero-bs),#121212e8 calc(var(--its-hero-bs) + var(--its-hero-bw) * .22),#12121255 calc(var(--its-hero-bs) + var(--its-hero-bw) * .55),#12121200 calc(var(--its-hero-bs) + var(--its-hero-bw) * .78)); }
}
@media(min-width:851px) and (max-width:1100px) {
 .its-hero-shade { background:linear-gradient(90deg,#121212 0,#121212 var(--its-hero-bs),#121212ee calc(var(--its-hero-bs) + var(--its-hero-bw) * .42),#12121266 calc(var(--its-hero-bs) + var(--its-hero-bw) * .7),#12121200 calc(var(--its-hero-bs) + var(--its-hero-bw) * .9)); }
}
@media(max-width:1100px) { .its-hero h1 { font-size:52px; } }
@keyframes its-hero-zoom { from { transform:scale(1); } to { transform:scale(1.06); } }
@keyframes its-hero-ein { from { opacity:0; } to { opacity:1; } }
@keyframes its-hero-text-ein { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:no-preference) {
 /* ERSETZT am 2026-11-14 (1.2.18): .its-hero>img.is-aktiv { animation:its-hero-zoom 16s ease-out both; } und beim Wechsel zusätzlich its-hero-zoom.
    Grund: Frank: kein Zoom, das Foto steht still. Das weiche Überblenden bleibt. */
 .its-hero>img.is-aktiv.is-wechsel { animation:its-hero-ein 1.1s ease-out both; }
 .its-hero-satz.is-wechsel { animation:its-hero-text-ein .9s ease-out both; }
}
/* Handy: Statt des schmalen Bandes ein Startbild mit Spruch, Unterzeile und den zwei Knöpfen (vorher waren Unterzeile und Knöpfe
   dort ausgeblendet). */
@media(max-width:580px) {
 .its-hero { height:auto; }
 .its-hero-inner { flex-direction:column; align-items:stretch; justify-content:flex-start; height:auto; gap:0; padding-block:22px 14px; }
 .its-hero-copy { padding:0; max-width:none; }
 .its-hero-copy .its-eyebrow { display:block; margin-bottom:8px; }
 .its-hero h1 { font-size:30px; line-height:1.08; min-height:3.24em; }
 .its-hero-description { display:block; font-size:13px; line-height:1.55; max-width:none; margin:10px 0 16px; color:#e2e2e2; }
 .its-hero-actions { display:flex; flex-wrap:nowrap; gap:10px; }
 .its-hero-actions>.btn { flex:1 1 0; min-width:0; font-size:13px; padding-inline:12px; gap:6px; }
 .its-hero>img { opacity:.62; }
 .its-hero-shade { background:linear-gradient(180deg,#121212cc,#121212d4); }
 .its-hero-gallery { align-self:flex-end; margin:14px 0 0; }
}

/* ----- Turnierreihe: Überschrift je Turnierwoche ----- */
.its-event-group-head { display:flex; align-items:center; gap:14px; margin:30px 0 14px; font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.its-event-group-head::after { content:""; flex:1; height:1px; background:var(--border); }
.its-home-events-start .its-event-grid:first-child { margin-top:0; }
.its-home-events-start>.its-event-group-head:first-of-type { margin-top:6px; }
.its-home-events-voll .its-section-head { justify-content:flex-end; margin-bottom:12px; }
@media(max-width:580px) {
 .its-event-group-head { margin:22px 0 10px; font-size:12px; }
 .its-home-events-voll .its-section-head { margin:0; min-height:0; }
}

/* ----- Seite „Turniere“: Liste am Handy als echte Zeilenliste (Datum, Name, Ort, Knopf rechts), ohne Logo ----- */
@media(max-width:580px) {
 .its-home-events-voll .its-event-list { gap:0; border-top:1px solid var(--border); }
 .its-home-events-voll .its-event-list .its-event-card { grid-template-columns:86px minmax(0,1fr) auto; grid-template-areas:"d t b" "d o b"; column-gap:12px; row-gap:2px; align-items:center; padding:10px 0; border:0; border-bottom:1px solid var(--border); border-radius:0; background:none; box-shadow:none; }
 .its-home-events-voll .its-event-list .its-customer-logo,
 .its-home-events-voll .its-event-list .its-disciplines,
 .its-home-events-voll .its-event-list .its-promo-description,
 .its-home-events-voll .its-event-list .its-event-links>div { display:none; }
 .its-home-events-voll .its-event-list .its-event-copy { display:contents; }
 .its-home-events-voll .its-event-list .its-event-date { grid-area:d; align-self:start; margin:2px 0 0; font-size:11px; line-height:1.35; color:var(--muted); }
 .its-home-events-voll .its-event-list .its-event-copy h3 { grid-area:t; font-size:15px; line-height:1.2; margin:0; }
 .its-home-events-voll .its-event-list .its-event-location { grid-area:o; margin:0; font-size:11px; }
 .its-home-events-voll .its-event-list .its-event-links { grid-area:b; grid-column:auto; margin:0; padding:0; border:0; min-height:0; align-self:center; }
 .its-home-events-voll .its-event-list .its-event-primary { min-height:40px; margin:0; padding:6px 10px; font-size:12px; }
}

/* ----- Leistungsauswahl: aktiver Eintrag mit roter Markierung und Pfeil zum Foto, die anderen mit Plus ----- */
.its-service-section { position:relative; }
.its-service-section::before { content:""; position:absolute; left:0; top:-1px; bottom:0; width:3px; background:var(--brand); transform:scaleY(0); transform-origin:top; }
.its-service-section.is-aktiv::before { transform:scaleY(1); }
.its-service-section>button { padding-left:15px; }
.its-service-description { padding-left:43px; }
.its-service-section>button>i.its-service-pfeil { color:var(--brand-text); }
@media(max-width:580px) {
 /* Am Handy liegt das Foto über der Liste: Der Pfeil (links) zeigt dann nach oben. */
 .its-service-section>button>i.its-service-pfeil { transform:rotate(90deg); }
 .its-service-section>button { padding-left:14px; }
 .its-service-description { padding-left:38px; }
}
@media(prefers-reduced-motion:no-preference) {
 .its-service-section::before { transition:transform .25s ease-out; }
}

/* ----- Einfahrt von Logo und Name im Kopfband beim ersten Aufruf (Klasse am <html> setzt das Skript im Dokument-Kopf) ----- */
@keyframes its-logo-ein { from { opacity:0; transform:translateX(-46px); } to { opacity:1; transform:none; } }
@keyframes its-name-ein { from { opacity:0; transform:translateX(-16px); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:no-preference) {
 html.its-intro .its-header .its-brand>img { animation:its-logo-ein .55s cubic-bezier(.2,.8,.2,1) both; }
 html.its-intro .its-header .its-brand>span { animation:its-name-ein .5s ease-out .25s both; }
}

/* --- ERSETZT am 2026-11-14 (1.2.18): Kopfbänder der Info-Seiten: Foto mit langsamem Zoom.
@keyframes its-bild-zoom { from { transform:scale(1); } to { transform:scale(1.07); } }
@media(prefers-reduced-motion:no-preference) {
 .its-page-hero-media>img { animation:its-bild-zoom 24s ease-out both; transform-origin:60% 50%; }
}
   Grund: Frank 14.11.2026: Das Foto steht still. Der Zoom wuchs über den Rahmen hinaus, links und rechts entstanden helle Streifen. --- */

/* ----- Einblenden beim Hineinscrollen (Skript js/einblenden.js setzt die Klassen; ohne Skript ist alles sichtbar) ----- */
@media(prefers-reduced-motion:no-preference) {
 .its-rv { opacity:0; transform:translateY(14px); }
 .its-rv.its-rv--in { opacity:1; transform:none; transition:opacity .3s ease-out, transform .3s ease-out; }
}

/* ----- Karten heben sich am PC beim Überfahren mit der Maus leicht an ----- */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .its-event-card, .its-page-card { transition:transform .2s ease-out, box-shadow .2s ease-out; }
 .its-event-card:hover, .its-page-card:hover { transform:translateY(-3px); box-shadow:0 10px 24px #00000033; }
}

/* ----- Referenzen (NOT-1509 Punkt 8): Satz-Kennzahl statt zweier Kästen; am Handy kleinere Logo-Kacheln, 3 pro Reihe ----- */
.its-page-metrics .cms-reference-metric-satz { grid-column:span 2; display:flex; align-items:center; }
.its-page-metrics .cms-reference-metric-satz .stat-value { font-size:clamp(18px,2.2vw,24px); line-height:1.35; }
@media (max-width:850px) {
 .its-page-metrics .cms-reference-metric-satz { grid-column:auto; }
}
@media (max-width:640px) {
 .cms-reference-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
 .cms-reference-grid .its-page-ref-media { padding:4px; }
 .cms-reference-grid .its-page-ref .card-body { padding:8px 6px 10px; }
 .cms-reference-grid .its-page-ref h3 { font-size:11px; line-height:1.25; overflow-wrap:anywhere; hyphens:auto; }
 .cms-reference-grid .its-page-ref .its-page-card-meta { font-size:10px; margin-bottom:4px; }
 .cms-reference-grid .its-page-ref .card-body p { font-size:11px; line-height:1.4; }
 .cms-reference-grid .its-page-ref .its-page-actions .btn { font-size:11px; min-height:32px; padding-inline:6px; }
 .cms-reference-grid .its-page-ref-badges { gap:4px; margin-bottom:6px; }
}

/* ----- Stellenzeile der Jobs-Seite (NOT-1509 Punkt 4): kleine rote Zeile über der Überschrift. #f0373b auf dem dunklen Kopfband (#121212) = rund 4,7 : 1 (WCAG AA, nachgerechnet), wie das Rot im Startbild ----- */
.its-site .its-page-hero-copy .its-page-hero-wanted { color:#f0373b; font-size:12px; font-weight:700; letter-spacing:.08em; margin-bottom:10px; }

/* ----- Schnellwahl-Kacheln der Kontakt-Seite (NOT-1509 Punkt 6): 3 Spalten am PC, 2 am Handy; jede Kachel ist ein Link ----- */
.its-quick-section { padding-block:28px; }
.its-quick-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.its-site .its-quick-tile { display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:18px 20px; min-width:0; color:var(--fg); }
.its-site .its-quick-tile:hover,.its-site .its-quick-tile:focus-visible { color:var(--fg); border-color:var(--brand); }
.its-quick-tile i { font-size:26px; line-height:1; color:var(--brand-text); margin-bottom:6px; }
.its-quick-tile strong { font-size:17px; font-weight:700; letter-spacing:-.02em; }
.its-quick-tile span { font-size:14px; color:var(--muted); overflow-wrap:anywhere; }
.its-quick-tile-accent { border-color:var(--brand); }
@media (max-width:640px) {
 .its-quick-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .its-site .its-quick-tile { padding:14px 14px; }
}

/* Link mitten im Fließtext (z. B. „Nachricht schreiben“ im Kontakt-Kopfband): erbt die Textfarbe,
   ist aber unterstrichen, damit er als Link erkennbar bleibt (14.11.2026). */
.its-site a.its-inline-link { text-decoration:underline; text-underline-offset:3px; }
