/* ═══════════════════════════════════════════════════════════════
   Ai on Edge — Provider Shared CSS (provider-base.css)
   Shared across homepage (provider.html) and all subpages.
   All sizing uses clamp() for fluid responsiveness.
   ═══════════════════════════════════════════════════════════════ */

/* ─── Reset & Variables ─── */
*{margin:0;padding:0;box-sizing:border-box}
:root{
--bg:#000;--fg:#fff;
--gray-100:#fafafa;--gray-200:#eaeaea;--gray-300:#999;--gray-400:#888;
--gray-500:#666;--gray-600:#444;--gray-700:#333;--gray-800:#222;--gray-900:#111;
--accent:#fff;--border:#333;--rad:6px;
--font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif
}
body{font-family:var(--font);background:var(--bg);color:var(--fg);min-height:100vh;-webkit-font-smoothing:antialiased}
a{color:var(--gray-300);text-decoration:none;transition:color .15s}
a:hover{color:var(--fg)}
body[data-lang]:not([data-lang="en"]){opacity:0;transition:opacity .05s}
body.i18n-ready{opacity:1!important}

/* ─── Header ─── */
header{border-bottom:1px solid var(--border);padding:clamp(.6rem,1.5vw,.8rem) clamp(1rem,4vw,3rem);min-height:56px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:rgba(0,0,0,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:50;gap:.5rem;flex-wrap:wrap}
.logo{font-size:clamp(.95rem,2vw,1.1rem);font-weight:700;letter-spacing:-.02em;color:var(--fg)}
header nav{display:flex;align-items:center;gap:clamp(.8rem,2vw,2rem);flex-wrap:wrap}
header nav a{font-size:clamp(.78rem,1.4vw,.88rem);opacity:.7;padding:.3rem 0;transition:opacity .15s}
header nav a:hover{opacity:1;color:var(--fg)}
header nav a.nav-link{font-size:clamp(.8rem,1.4vw,.9rem);opacity:.7;padding:.3rem 0}
header nav a.nav-link:hover{opacity:1}
.btn-header{background:var(--fg);color:var(--bg);padding:clamp(.4rem,.8vw,.5rem) clamp(.8rem,1.5vw,1.2rem);border-radius:var(--rad);font-size:clamp(.78rem,1.3vw,.88rem);font-weight:500;transition:.15s;border:none;cursor:pointer;opacity:1}
.btn-header:hover{opacity:.85;color:var(--bg)}

/* ─── Mobile Hamburger ─── */
.mobile-toggle{display:none;align-items:center;justify-content:center;background:none;border:1px solid var(--border);color:var(--fg);width:34px;height:34px;border-radius:var(--rad);cursor:pointer;flex-shrink:0}
.mobile-toggle svg{width:18px;height:18px}

/* ─── Language Switcher ─── */
.lang-switch{position:relative}
.lang-btn{background:transparent;border:1px solid var(--border);color:var(--fg);padding:clamp(.3rem,.6vw,.4rem) clamp(.5rem,1vw,.7rem);border-radius:var(--rad);cursor:pointer;font-size:clamp(.72rem,1.2vw,.82rem);display:flex;align-items:center;gap:.35rem;transition:.15s}
.lang-btn:hover{border-color:var(--gray-500)}
.lang-btn svg{width:14px;height:14px;opacity:.6}
.lang-menu{display:none;position:absolute;top:calc(100% + 6px);right:0;background:var(--gray-900);border:1px solid var(--border);border-radius:var(--rad);min-width:140px;z-index:60;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.lang-menu.open{display:block}
.lang-menu a{display:block;padding:clamp(.4rem,.8vw,.5rem) clamp(.8rem,1.2vw,1rem);font-size:clamp(.78rem,1.2vw,.85rem);color:var(--gray-300);transition:.1s;border-bottom:1px solid rgba(255,255,255,.04)}
.lang-menu a:last-child{border-bottom:none}
.lang-menu a:hover{background:var(--gray-800);color:var(--fg)}
.lang-menu a.active{color:var(--fg);font-weight:600}

/* ─── Hero ─── */
.hero{text-align:center;padding:clamp(2.5rem,12vw,8rem) clamp(1rem,4vw,3rem) clamp(1.5rem,5vw,3rem);max-width:800px;margin:0 auto}
.hero h1{font-size:clamp(2.2rem,6vw,4rem);font-weight:800;letter-spacing:-.04em;line-height:1.1;margin-bottom:clamp(.8rem,2vw,1.2rem);background:linear-gradient(180deg,#fff 40%,rgba(255,255,255,.5));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero .subtitle{font-size:clamp(1.05rem,2vw,1.35rem);color:var(--gray-300);margin-bottom:clamp(.5rem,1vw,.8rem);font-weight:500}
.hero p{font-size:clamp(.95rem,1.8vw,1.2rem);color:var(--gray-400);line-height:1.6;max-width:560px;margin:0 auto}

/* ─── Section Titles ─── */
.section-label{font-size:clamp(.7rem,1.2vw,.82rem);text-transform:uppercase;letter-spacing:.1em;color:var(--gray-400);margin-bottom:clamp(.5rem,1vw,.8rem)}
.section-title{font-size:clamp(1.5rem,3.5vw,2.4rem);font-weight:700;letter-spacing:-.03em;margin-bottom:clamp(2rem,4vw,3rem)}

/* ─── Buttons ─── */
.btn-primary{background:var(--fg);color:var(--bg);padding:clamp(.6rem,1.2vw,.8rem) clamp(1.5rem,3vw,2rem);border-radius:var(--rad);font-size:clamp(.88rem,1.5vw,1rem);font-weight:500;border:none;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:.5rem}
.btn-primary:hover{opacity:.85;color:var(--bg);text-decoration:none}
.btn-secondary{background:transparent;color:var(--fg);border:1px solid var(--border);padding:clamp(.6rem,1.2vw,.8rem) clamp(1.5rem,3vw,2rem);border-radius:var(--rad);font-size:clamp(.88rem,1.5vw,1rem);font-weight:500;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:.5rem}
.btn-secondary:hover{border-color:var(--gray-500);color:var(--fg)}

/* ─── CTA Section ─── */
.cta-section{border-top:1px solid var(--border);padding:clamp(3rem,6vw,5rem) clamp(1rem,4vw,3rem);text-align:center}
.cta-section .container{max-width:600px;margin:0 auto}
.cta-section h2{font-size:clamp(1.5rem,3.5vw,2.4rem);font-weight:700;letter-spacing:-.03em;margin-bottom:clamp(.5rem,1vw,.8rem)}
.cta-section p{color:var(--gray-400);margin-bottom:clamp(1.5rem,3vw,2rem);font-size:clamp(.85rem,1.5vw,1rem);line-height:1.6}
.cta-section p a{color:var(--fg);border-bottom:1px solid var(--gray-500);padding-bottom:1px}
.cta-section p a:hover{border-color:var(--fg)}

/* ─── Footer (simple — subpages) ─── */
footer{border-top:1px solid var(--border);padding:clamp(1.2rem,2vw,1.5rem) clamp(1rem,4vw,3rem);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;font-size:clamp(.72rem,1.2vw,.8rem);color:var(--gray-500)}

/* ─── Footer (full grid — homepage) ─── */
footer .ft-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:clamp(1.5rem,3vw,2.5rem);margin-bottom:clamp(1.5rem,3vw,2rem);width:100%}
footer .ft-col h4{font-size:clamp(.75rem,1.2vw,.82rem);text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);margin-bottom:clamp(.6rem,1vw,.8rem);font-weight:600}
footer .ft-col a{display:block;font-size:clamp(.75rem,1.2vw,.82rem);color:var(--gray-500);padding:.2rem 0;transition:color .15s}
footer .ft-col a:hover{color:var(--fg)}
footer .ft-bottom{display:flex;justify-content:space-between;align-items:center;width:100%;padding-top:clamp(.8rem,1.5vw,1rem);border-top:1px solid var(--border);flex-wrap:wrap;gap:.5rem}

/* ─── Toast ─── */
.toast{position:fixed;bottom:clamp(.8rem,2vw,1.2rem);right:clamp(.8rem,2vw,1.2rem);background:var(--fg);color:var(--bg);padding:clamp(.5rem,1vw,.7rem) clamp(1rem,2vw,1.5rem);border-radius:var(--rad);font-size:clamp(.8rem,1.3vw,.9rem);transform:translateY(100px);opacity:0;transition:.3s;z-index:99;font-weight:500}
.toast.show{transform:translateY(0);opacity:1}
.toast.error{background:#e5484d;color:#fff}

/* ─── Table Scroll Wrapper ─── */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 clamp(-1rem,-4vw,-3rem);padding:0 clamp(1rem,4vw,3rem)}

/* ─── Legal Pages (privacy, terms, impressum) ─── */
.legal{max-width:800px;margin:0 auto;padding:0 clamp(1rem,4vw,2rem) clamp(3rem,6vw,5rem)}
.legal h1{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800;letter-spacing:-.03em;margin-bottom:clamp(1.5rem,3vw,2.5rem);line-height:1.15}
.legal h2{font-size:clamp(1.2rem,2.5vw,1.6rem);font-weight:700;letter-spacing:-.02em;margin:clamp(2rem,4vw,3rem) 0 clamp(.6rem,1vw,.8rem);padding-bottom:clamp(.4rem,.8vw,.6rem);border-bottom:1px solid var(--border)}
.legal h3{font-size:clamp(1rem,1.8vw,1.2rem);font-weight:600;margin:clamp(1.5rem,3vw,2rem) 0 clamp(.4rem,.8vw,.5rem)}
.legal h4{font-size:clamp(.9rem,1.5vw,1.05rem);font-weight:600;margin:clamp(1rem,2vw,1.5rem) 0 clamp(.3rem,.6vw,.4rem)}
.legal p{color:var(--gray-300);line-height:1.8;margin-bottom:clamp(.6rem,1vw,.8rem);font-size:clamp(.85rem,1.4vw,.95rem)}
.legal ul,.legal ol{color:var(--gray-300);padding-left:1.5rem;margin-bottom:clamp(.6rem,1vw,.8rem)}
.legal li{line-height:1.8;margin-bottom:clamp(.3rem,.5vw,.4rem);font-size:clamp(.85rem,1.4vw,.95rem)}
.legal blockquote{border-left:3px solid var(--border);background:var(--gray-900);padding:clamp(1rem,2vw,1.5rem);margin:clamp(1rem,2vw,1.5rem) 0;border-radius:0 var(--rad) var(--rad) 0}
.legal blockquote p{margin:0;color:var(--gray-400)}
.legal table{width:100%;border-collapse:collapse;margin:clamp(1rem,2vw,1.5rem) 0;font-size:clamp(.8rem,1.3vw,.9rem)}
.legal table th,.legal table td{padding:clamp(.4rem,.8vw,.6rem) clamp(.5rem,1vw,.8rem);border-bottom:1px solid var(--border);text-align:left;color:var(--gray-300)}
.legal table th{color:var(--fg);font-weight:600;border-bottom-width:2px}
.legal .loading{text-align:center;padding:clamp(3rem,6vw,5rem);color:var(--gray-500)}

/* ─── Comparison Tables (shared across compare, vs-* pages) ─── */
.comp-table{width:100%;border-collapse:collapse}
.comp-table thead th{padding:clamp(.6rem,1.2vw,.8rem) clamp(.5rem,1vw,.8rem);font-size:clamp(.72rem,1.2vw,.85rem);text-align:left;border-bottom:2px solid var(--border);font-weight:600}
.comp-table thead th:not(:first-child){text-align:center}
.comp-table thead th:first-child{color:var(--gray-400);font-weight:500}
.comp-table thead th.aoe{color:#4ade80}
.comp-table tbody td{padding:clamp(.5rem,1vw,.7rem) clamp(.5rem,1vw,.8rem);font-size:clamp(.75rem,1.2vw,.88rem);border-bottom:1px solid rgba(255,255,255,.06);color:var(--gray-300);vertical-align:top}
.comp-table tbody td:not(:first-child){text-align:center}
.comp-table tbody td:first-child{font-weight:500;color:var(--fg)}
.comp-table tbody tr:hover{background:rgba(255,255,255,.02)}
.comp-check{color:#4ade80;font-weight:700}
.comp-limit{color:var(--gray-400);font-size:clamp(.72rem,1.1vw,.8rem)}
.t-yes{color:#4ade80;font-weight:700}
.t-no{color:var(--gray-600)}
.t-ttfb-fast{color:#4ade80}
.t-ttfb-slow{color:#ef4444}
.t-ttfb-mid{color:var(--gray-400)}

/* ─── Advantage / Feature Cards Grid ─── */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:clamp(1rem,2vw,1.5rem)}
.adv-card{background:var(--gray-900);border:1px solid var(--border);border-radius:calc(var(--rad) + 4px);padding:clamp(1.2rem,2.5vw,1.8rem);transition:border-color .2s,transform .2s}
.adv-card:hover{border-color:var(--gray-500);transform:translateY(-2px)}
.adv-card h3{font-size:clamp(1rem,1.8vw,1.15rem);font-weight:700;letter-spacing:-.02em;margin-bottom:clamp(.4rem,.8vw,.6rem)}
.adv-card p{font-size:clamp(.8rem,1.3vw,.9rem);color:var(--gray-400);line-height:1.6}

/* ─── Generic Content Sections (vs-* pages, subpages) ─── */
.table-section,.cards-section,.h2h-section,.adv-section,.matrix-section,.features-section-page{border-top:1px solid var(--border);padding:clamp(3rem,6vw,5rem) clamp(1rem,4vw,3rem);max-width:1100px;margin:0 auto}
.table-section .section-label,.table-section .section-title,.cards-section .section-label,.cards-section .section-title,.h2h-section .section-label,.h2h-section .section-title,.adv-section .section-label,.adv-section .section-title{text-align:center}

/* ─── Compare Other Links Grid ─── */
.compare-section{border-top:1px solid var(--border);padding:clamp(3rem,6vw,5rem) clamp(1rem,4vw,3rem);max-width:1100px;margin:0 auto}
.compare-grid{display:flex;gap:clamp(.5rem,1vw,.8rem);margin-top:clamp(1.5rem,3vw,2rem);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:.5rem}
.compare-grid::-webkit-scrollbar{display:none}
.compare-link{display:flex;align-items:center;justify-content:center;padding:clamp(.6rem,1.2vw,.8rem) clamp(.8rem,1.5vw,1rem);background:var(--gray-900);border:1px solid var(--border);border-radius:var(--rad);font-size:clamp(.75rem,1.2vw,.85rem);color:var(--gray-300);transition:.15s;text-decoration:none;text-align:center;white-space:nowrap;flex-shrink:0}
.compare-link:hover{border-color:var(--gray-500);color:var(--fg);background:var(--gray-800)}
.compare-link.current{border-color:var(--fg);color:var(--fg);font-weight:600;pointer-events:none}
.compare-all{display:block;text-align:center;margin-top:clamp(1rem,2vw,1.5rem);font-size:clamp(.82rem,1.3vw,.9rem);color:var(--gray-400)}
.compare-all:hover{color:var(--fg)}

/* ─── Prevent horizontal overflow ─── */
html,body{overflow-x:hidden}

/* ─── Mobile Responsive ─── */
@media(max-width:640px){
/* Hamburger visible */
.mobile-toggle{display:flex!important}
/* Nav collapses */
header nav{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(0,0,0,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);flex-direction:column;padding:1rem clamp(1rem,4vw,3rem);border-bottom:1px solid var(--border);gap:.3rem;z-index:55}
header nav.open{display:flex}
header nav a,header nav a.nav-link{padding:.5rem 0;font-size:.88rem;opacity:.8}
header nav a:hover,header nav a.nav-link:hover{opacity:1}
.btn-header{margin-top:.3rem;text-align:center;display:block;padding:.5rem 1rem}
.lang-switch{margin-top:.3rem;align-self:flex-start}
/* Tables scroll horizontally */
.table-section,.h2h-section,.adv-section{overflow-x:auto;-webkit-overflow-scrolling:touch}
.comp-table,.summary-table,.matrix,.h2h-table{min-width:480px}
/* Grids collapse */
.cards-grid{grid-template-columns:1fr}
footer .ft-grid{grid-template-columns:1fr 1fr}
/* Hero spacing */
.hero{padding-top:clamp(2.5rem,8vw,4rem);padding-bottom:clamp(1.5rem,4vw,2.5rem)}
.hero h1{font-size:clamp(1.8rem,8vw,2.8rem)}
/* Section titles */
.section-title{font-size:clamp(1.3rem,5vw,1.8rem)}
/* Comparison table first column */
.comp-table thead th:first-child,.comp-table tbody td:first-child{min-width:100px;white-space:normal;word-break:break-word}
/* Compare grid links */
.compare-grid{flex-wrap:nowrap}
/* Legal pages */
.legal{padding:0 1rem clamp(2rem,4vw,3rem)}
.legal h1{font-size:clamp(1.5rem,6vw,2rem)}
}