/*
Theme Name: InternetDemos Portal
Theme URI: https://internetdemos.de/
Author: ACD Internetservice
Description: Modernes Demo-Portal für WordPress-Designvorschläge auf internetdemos.de.
Version: 1.1.1
Text Domain: internetdemos-portal
*/
:root{--bg:#f6f8fc;--surface:#fff;--ink:#0f172a;--muted:#64748b;--line:#e2e8f0;--brand:#5b5cf0;--brand2:#8b5cf6;--accent:#06b6d4;--dark:#0b1020;--radius:22px;--shadow:0 18px 55px rgba(15,23,42,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);line-height:1.65}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}.id-wrap{width:min(1180px,calc(100% - 36px));margin:auto}.id-top{background:var(--dark);color:#dbeafe;font-size:14px}.id-top .id-wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:8px 0}.id-top b{color:white}.id-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(226,232,240,.8)}.id-nav{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px}.id-logo{display:flex;align-items:center;gap:11px;font-weight:900;font-size:22px}.id-logo-mark{width:38px;height:38px;border-radius:13px;background:linear-gradient(135deg,var(--brand),var(--brand2));display:grid;place-items:center;color:#fff;box-shadow:0 10px 25px rgba(91,92,240,.25)}.id-nav ul{display:flex;gap:26px;list-style:none;padding:0;margin:0;font-weight:700;font-size:15px}.id-actions{display:flex;align-items:center;gap:10px}.id-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 18px;border-radius:14px;font-weight:800;border:1px solid var(--line);background:#fff;transition:.2s}.id-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(15,23,42,.08)}.id-btn.primary{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;border-color:transparent}.id-menu-btn{display:none}.id-hero{position:relative;overflow:hidden;padding:88px 0 64px;background:radial-gradient(circle at 85% 20%,rgba(139,92,246,.18),transparent 34%),radial-gradient(circle at 14% 18%,rgba(6,182,212,.14),transparent 30%),linear-gradient(#fff,#f7f9ff)}.id-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}.id-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:#eef2ff;color:#4f46e5;font-weight:800;font-size:13px;letter-spacing:.03em}.id-hero h1{font-size:clamp(46px,6vw,78px);line-height:.98;letter-spacing:-.055em;margin:18px 0 24px;max-width:760px}.id-gradient{background:linear-gradient(135deg,var(--brand),var(--brand2) 55%,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}.id-hero p{font-size:20px;color:#475569;max-width:680px}.id-hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.id-micro{display:flex;gap:26px;flex-wrap:wrap;margin-top:26px;color:#64748b;font-size:14px;font-weight:700}.id-micro span:before{content:'✓';color:#16a34a;margin-right:7px}.id-browser{background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:0 30px 80px rgba(15,23,42,.16);overflow:hidden;transform:rotate(1deg)}.id-browser-top{height:44px;background:#f8fafc;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:7px;padding:0 15px}.id-dot{width:9px;height:9px;border-radius:50%;background:#cbd5e1}.id-url{margin-left:10px;background:white;border:1px solid var(--line);height:26px;border-radius:8px;flex:1}.id-preview{padding:22px;background:linear-gradient(135deg,#f8fafc,#eef2ff)}.id-preview-head{height:54px;border-radius:12px;background:#fff;margin-bottom:18px;box-shadow:0 8px 18px rgba(15,23,42,.05)}.id-preview-hero{display:grid;grid-template-columns:1fr 1fr;gap:14px}.id-preview-copy{padding:14px}.id-preview-copy div{height:12px;border-radius:20px;background:#c7d2fe;margin:10px 0}.id-preview-copy div:first-child{height:22px;width:86%;background:#818cf8}.id-preview-copy div:nth-child(3){width:65%}.id-preview-img{min-height:190px;border-radius:16px;background:linear-gradient(135deg,#1e293b,#6366f1 55%,#22d3ee);position:relative;overflow:hidden}.id-preview-img:after{content:'';position:absolute;inset:auto 12% 0 12%;height:70%;border-radius:80px 80px 0 0;background:rgba(255,255,255,.18)}.id-section{padding:84px 0}.id-section.white{background:#fff}.id-section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:34px}.id-section h2{font-size:clamp(34px,4vw,52px);letter-spacing:-.04em;line-height:1.05;margin:0}.id-section-head p{max-width:560px;color:var(--muted);margin:0}.id-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.id-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:0 10px 34px rgba(15,23,42,.05)}.id-card-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#eef2ff;color:#4f46e5;font-size:22px;margin-bottom:18px}.id-card h3{margin:0 0 9px;font-size:21px}.id-card p{margin:0;color:var(--muted)}.id-demo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.id-demo{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 14px 40px rgba(15,23,42,.08)}.id-demo-shot{aspect-ratio:16/11;background:linear-gradient(145deg,#eef2ff,#dbeafe);padding:18px}.id-demo-screen{height:100%;background:#fff;border-radius:16px;overflow:hidden;border:1px solid #dbe4f0}.id-demo-screen .bar{height:12%;background:#f8fafc;border-bottom:1px solid #e2e8f0}.id-demo-screen .hero{height:55%;background:linear-gradient(120deg,#fff 0 46%,#6366f1 46% 100%);position:relative}.id-demo:nth-child(2) .hero{background:linear-gradient(120deg,#0f172a,#312e81)}.id-demo:nth-child(3) .hero{background:linear-gradient(120deg,#fff 0 54%,#06b6d4 54%)}.id-demo-body{padding:20px}.id-demo-body small{color:#6366f1;font-weight:900}.id-demo-body h3{margin:4px 0 8px}.id-demo-body p{color:var(--muted);font-size:14px;margin:0 0 15px}.id-step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.id-step{position:relative;padding:24px;border-radius:20px;background:#fff;border:1px solid var(--line)}.id-num{font-size:13px;font-weight:900;color:#6366f1;margin-bottom:18px}.id-step h3{margin:0 0 8px}.id-step p{color:var(--muted);margin:0}.id-cta{background:linear-gradient(135deg,#111827,#312e81 62%,#164e63);border-radius:32px;color:white;padding:52px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:28px;box-shadow:0 30px 70px rgba(15,23,42,.18)}.id-cta h2{margin:0 0 10px}.id-cta p{margin:0;color:#cbd5e1}.id-footer{background:#0b1020;color:#cbd5e1;padding:52px 0 22px}.id-footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:34px}.id-footer h4{color:#fff;margin:0 0 13px}.id-footer a{display:block;margin:8px 0;color:#cbd5e1}.id-footer .id-logo{color:white}.id-subfooter{margin-top:38px;padding-top:20px;border-top:1px solid #1e293b;display:flex;justify-content:space-between;gap:20px;font-size:13px;color:#94a3b8}.id-pagehero{padding:70px 0 44px;background:linear-gradient(180deg,#fff,#f5f7ff)}.id-pagehero h1{font-size:clamp(42px,5vw,66px);line-height:1;letter-spacing:-.05em;margin:12px 0}.id-pagehero p{font-size:19px;color:var(--muted);max-width:720px}.id-content{padding:60px 0 90px}.id-content .prose{max-width:860px;background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px;box-shadow:0 10px 30px rgba(15,23,42,.05)}.prose h2{margin-top:1.6em}.prose h3{margin-top:1.4em}.prose a{text-decoration:underline;color:#4f46e5}.id-contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:28px}.id-contact-panel,.id-form{background:#fff;border:1px solid var(--line);border-radius:24px;padding:30px;box-shadow:0 10px 30px rgba(15,23,42,.05)}.id-form label{display:block;font-weight:800;margin-bottom:6px}.id-form input,.id-form textarea,.id-form select{width:100%;border:1px solid #cbd5e1;border-radius:12px;padding:12px 13px;font:inherit;background:#fff}.id-form textarea{min-height:150px}.id-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.id-field{margin-bottom:15px}.id-check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:#475569}.id-check input{width:auto;margin-top:5px}.id-notice{padding:14px 16px;border-radius:12px;margin-bottom:16px;background:#ecfdf5;color:#166534}.id-notice.err{background:#fef2f2;color:#991b1b}.id-hp{position:absolute!important;left:-9999px!important}.id-mobile-nav{display:none}
@media(max-width:900px){.id-nav ul,.id-actions .secondary{display:none}.id-menu-btn{display:inline-flex}.id-hero-grid,.id-contact-grid{grid-template-columns:1fr}.id-browser{transform:none}.id-cards,.id-demo-grid{grid-template-columns:1fr 1fr}.id-step-grid{grid-template-columns:1fr 1fr}.id-footer-grid{grid-template-columns:1fr 1fr}.id-cta{grid-template-columns:1fr}.id-mobile-nav.open{display:block;padding:0 0 18px}.id-mobile-nav a{display:block;padding:9px 0;font-weight:800}}
@media(max-width:620px){.id-top .id-wrap{justify-content:center}.id-top span:last-child{display:none}.id-hero{padding-top:58px}.id-hero h1{font-size:48px}.id-cards,.id-demo-grid,.id-step-grid,.id-footer-grid{grid-template-columns:1fr}.id-row{grid-template-columns:1fr}.id-section{padding:62px 0}.id-section-head{align-items:flex-start;flex-direction:column}.id-cta{padding:34px 26px}.id-subfooter{flex-direction:column}.id-nav{min-height:68px}.id-logo{font-size:19px}}

/* InternetDemos 1.1.0 – Mobile Feinschliff */
@media(max-width:620px){
  body{text-align:center}
  .id-wrap{width:min(100% - 28px,1180px)}
  .id-top .id-wrap,.id-nav,.id-hero-cta,.id-micro,.id-actions{justify-content:center}
  .id-header{position:relative}
  .id-nav{min-height:62px;flex-wrap:wrap;padding:10px 0;gap:10px}
  .id-logo{justify-content:center}
  .id-actions{width:100%}
  .id-actions .primary{width:auto;margin-inline:auto}
  .id-mobile-nav{text-align:center}
  .id-hero-grid,.id-section-head,.id-cta,.id-contact-grid{justify-items:center;text-align:center}
  .id-hero p,.id-section-head p,.id-pagehero p,.id-card p,.id-step p,.prose,.id-contact-panel,.id-form{margin-left:auto;margin-right:auto}
  .id-pagehero{padding:36px 0 24px}
  .id-pagehero .id-kicker{margin-bottom:4px}
  .id-pagehero h1{margin:4px 0 10px;font-size:42px}
  .id-pagehero p{font-size:17px}
  .id-content{padding:34px 0 62px}
  .id-content .prose{text-align:center;padding:25px 20px}
  .id-footer{padding-top:38px;text-align:center}
  .id-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px;align-items:start}
  .id-footer-grid>div:first-child{grid-column:1/-1}
  .id-footer .id-logo{justify-content:center}
  .id-footer a{margin:9px 0}
  .id-subfooter{align-items:center;text-align:center}
  /* Chat/WhatsApp Floating Buttons: mobile mittig */
  [class*="whatsapp"][class*="float"],[class*="whatsapp"][class*="button"],
  [class*="chat-manager"][class*="float"],[class*="cmp-"][class*="float"]{
    left:50%!important;right:auto!important;transform:translateX(-50%)!important
  }
}


/* InternetDemos 1.1.1 – Chat Manager / WhatsApp Popup mobil */
@media(max-width:620px){
  /* Das globale Chat-Manager-Popup auf kleinen Displays kompakt halten. */
  [role="dialog"][class*="chat" i],
  [role="dialog"][class*="whatsapp" i],
  [class*="chat-manager" i][class*="modal" i],
  [class*="chat_manager" i][class*="modal" i],
  [class*="cmp-" i][class*="modal" i],
  [class*="cmp_" i][class*="modal" i],
  [class*="whatsapp" i][class*="modal" i],
  [class*="whatsapp" i][class*="popup" i]{
    width:calc(100vw - 24px)!important;
    max-width:520px!important;
    max-height:calc(100dvh - 150px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    margin:0 auto!important;
    border-radius:22px!important;
  }
  [role="dialog"][class*="chat" i] form,
  [role="dialog"][class*="whatsapp" i] form,
  [class*="chat-manager" i][class*="modal" i] form,
  [class*="chat_manager" i][class*="modal" i] form,
  [class*="cmp-" i][class*="modal" i] form,
  [class*="cmp_" i][class*="modal" i] form,
  [class*="whatsapp" i][class*="modal" i] form,
  [class*="whatsapp" i][class*="popup" i] form{
    padding:18px!important;
  }
  [role="dialog"][class*="chat" i] input,
  [role="dialog"][class*="chat" i] select,
  [role="dialog"][class*="chat" i] textarea,
  [role="dialog"][class*="whatsapp" i] input,
  [role="dialog"][class*="whatsapp" i] select,
  [role="dialog"][class*="whatsapp" i] textarea,
  [class*="chat-manager" i][class*="modal" i] input,
  [class*="chat-manager" i][class*="modal" i] select,
  [class*="chat-manager" i][class*="modal" i] textarea,
  [class*="cmp-" i][class*="modal" i] input,
  [class*="cmp-" i][class*="modal" i] select,
  [class*="cmp-" i][class*="modal" i] textarea,
  [class*="whatsapp" i][class*="popup" i] input,
  [class*="whatsapp" i][class*="popup" i] select,
  [class*="whatsapp" i][class*="popup" i] textarea{
    min-height:48px!important;
    padding:10px 12px!important;
    font-size:16px!important;
  }
  [role="dialog"][class*="chat" i] h1,
  [role="dialog"][class*="chat" i] h2,
  [role="dialog"][class*="chat" i] h3,
  [role="dialog"][class*="whatsapp" i] h1,
  [role="dialog"][class*="whatsapp" i] h2,
  [role="dialog"][class*="whatsapp" i] h3,
  [class*="chat-manager" i][class*="modal" i] h1,
  [class*="chat-manager" i][class*="modal" i] h2,
  [class*="chat-manager" i][class*="modal" i] h3,
  [class*="cmp-" i][class*="modal" i] h1,
  [class*="cmp-" i][class*="modal" i] h2,
  [class*="cmp-" i][class*="modal" i] h3,
  [class*="whatsapp" i][class*="popup" i] h1,
  [class*="whatsapp" i][class*="popup" i] h2,
  [class*="whatsapp" i][class*="popup" i] h3{
    margin-top:8px!important;
    margin-bottom:8px!important;
    line-height:1.2!important;
  }
  /* Schwebenden WhatsApp-Button während eines geöffneten Dialogs aus dem Weg halten. */
  body:has([role="dialog"][class*="chat" i]) [class*="whatsapp" i][class*="float" i],
  body:has([role="dialog"][class*="whatsapp" i]) [class*="whatsapp" i][class*="float" i],
  body:has([class*="chat-manager" i][class*="modal" i]) [class*="whatsapp" i][class*="float" i],
  body:has([class*="cmp-" i][class*="modal" i]) [class*="whatsapp" i][class*="float" i]{
    opacity:0!important;
    pointer-events:none!important;
  }
}