/*
Theme Name: OfficeSystems Gamer
Description: OfficeSystems Design mit individueller Komponentenauswahl, Anpassungen im Customizer und WooCommerce-Unterstützung.
Version: 1.0.9
Author: OfficeSystems Germany
License: GNU General Public License v2 or later
Text Domain: officesystems-gamer
*/

:root{--bg:#101714;--panel:#19221c;--lime:#d0ff72;--white:#f5f5ed;--muted:#aab5aa;--line:#ffffff22;--dark:#202a22}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--white);font-family:Arial,Helvetica,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:5px}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--lime)}button{cursor:pointer}.wrap{max-width:1280px;margin:auto;padding:0 48px}.skip{position:absolute;top:-100px}.skip:focus{top:10px;left:10px;z-index:20;background:var(--lime);color:var(--bg);padding:10px}.topbar{font-size:11px;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid var(--line);padding:10px 0;color:#bec8bc}.topbar .wrap{display:flex;justify-content:space-between}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime);margin:0 8px 2px 0}.header{position:sticky;top:0;z-index:10;background:#101714f5;backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}nav{height:90px;display:flex;align-items:center;gap:34px}.brand{display:flex;align-items:center;gap:11px;margin-right:auto;line-height:1.05}.brand-mark{width:38px;height:42px;display:grid;place-items:center;background:var(--lime);color:var(--bg);font-size:19px;font-weight:900;clip-path:polygon(0 0,100% 0,100% 75%,75% 100%,0 100%)}.brand strong{display:block;font-size:19px;letter-spacing:-.6px}.brand small{font-size:10px;letter-spacing:.25em;color:var(--lime)}.navlink{font-size:13px;color:#d9ded6}.navlink:hover{color:var(--lime)}.btn{display:inline-flex;gap:25px;align-items:center;justify-content:center;border:1px solid var(--lime);background:var(--lime);color:var(--bg);padding:15px 22px;font-size:13px;font-weight:700;border-radius:3px;transition:transform .2s,background .2s}.btn:hover{background:#e0ffa5;transform:translateY(-2px)}.btn.secondary{border-color:#ffffff55;background:transparent;color:var(--white)}.btn.small{padding:11px 17px;font-size:12px}.arrow{font-size:20px;line-height:1}.mobile-links{display:none}.menu{display:none;background:none;border:1px solid var(--line);color:var(--white);padding:9px 12px}.hero{position:relative;overflow:hidden}.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;min-height:690px;gap:30px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--lime);display:flex;gap:12px;align-items:center}.eyebrow:before{content:"";width:27px;height:1px;background:currentColor}.hero h1{font-size:clamp(60px,6.8vw,96px);line-height:.99;letter-spacing:-6px;margin:28px 0;font-weight:800;max-width:660px}.hero h1 em{font-style:normal;color:var(--lime)}.hero .intro{color:#b7c1b5;font-size:16px;max-width:430px;margin:0 0 30px;line-height:1.8}.actions{display:flex;gap:13px;flex-wrap:wrap}.under{font-size:11px;color:#9eac9b;margin-top:20px}.hero-art{position:relative;align-self:stretch;display:grid;place-items:center}.hero-art:before{content:"";position:absolute;inset:10% -40% 0 -20%;background:radial-gradient(ellipse at center,#78ad4e22,transparent 60%);pointer-events:none}.hero-art svg{width:115%;max-width:650px;position:relative;filter:drop-shadow(0 30px 30px #0009)}.art-label{position:absolute;bottom:50px;right:0;font:10px/1.6 monospace;letter-spacing:.1em;color:#9cad99;border-left:1px solid var(--lime);padding-left:12px}.art-label strong{color:var(--white);font-size:12px;font-weight:400}.hero-index{position:absolute;top:35px;right:0;font:10px monospace;color:#8e9a89}.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.strip .wrap{display:grid;grid-template-columns:repeat(3,1fr);padding-top:24px;padding-bottom:24px;gap:35px}.strip strong{font-size:13px;display:block}.strip span{font-size:12px;color:var(--muted)}.strip b{color:var(--lime);font-weight:400;margin-right:12px}.section{padding:100px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:40px}.section h2{font-size:clamp(35px,4vw,54px);line-height:1.09;letter-spacing:-2px;margin:17px 0 0}.section-head p{max-width:350px;color:var(--muted);font-size:14px;margin:0}.profiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.profile{padding:28px;background:#19221c;border:1px solid #ffffff15;border-radius:5px;position:relative;display:flex;flex-direction:column;overflow:hidden}.profile.featured{border-color:#d0ff7288;background:#202c20}.tag{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}.profile.featured .tag{color:var(--lime)}.profile-number{font:11px monospace;color:#8d9e88;float:right}.profile h3{font-size:25px;letter-spacing:-.8px;margin:15px 0 3px}.resolution{font-size:52px;letter-spacing:-3px;line-height:1.2;font-weight:700;margin:24px 0 5px}.resolution small{font-size:13px;font-weight:400;letter-spacing:0;color:var(--muted);margin-left:7px}.profile p{color:#b1bdb0;font-size:13px;line-height:1.7;min-height:66px}.spec-list{padding:17px 0 5px;margin:0 0 22px;list-style:none;border-top:1px solid var(--line);font-size:12px;color:#c3cdc0}.spec-list li{padding:6px 0;display:flex;justify-content:space-between;gap:10px}.spec-list li span{color:var(--muted)}.profile .btn{margin-top:auto}.profile-note{font-size:11px;color:var(--muted);margin-top:18px}.light{background:#e9ecdf;color:#1a251b}.light .eyebrow{color:#455c30}.light .section-head p{color:#5f6d5b}.build-grid{display:grid;grid-template-columns:1fr 1.55fr;gap:70px}.build-intro h2{margin-bottom:25px}.build-intro p{font-size:15px;color:#62705c;max-width:320px}.build-intro .big-num{display:block;font-size:100px;line-height:1;color:#bcc7af;letter-spacing:-8px;margin-top:50px}.build-intro .small-label{font:10px monospace;letter-spacing:.1em;color:#68785d}.config{background:#f8f9f2;border:1px solid #17291a1a;border-radius:6px;padding:32px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.field{display:block;font-size:12px;font-weight:700}.field select,.field input,.field textarea{width:100%;margin-top:8px;border:1px solid #bec8b4;background:#fff;color:#24301e;padding:13px;border-radius:3px;font-size:14px;min-height:48px}.field textarea{resize:vertical;min-height:96px}.field.full{grid-column:1/-1}.summary{margin-top:25px;background:#e9eddf;padding:18px;border-left:3px solid #6d833f;font-size:13px;line-height:1.7}.summary strong{display:block;margin-bottom:3px}.config .btn{width:100%;margin-top:20px;background:#1c2a1d;color:var(--white);border-color:#1c2a1d}.fine{font-size:11px;color:#68735f;margin:13px 0 0;line-height:1.7}.process{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;border-top:1px solid var(--line);padding-top:35px}.process .step{font:12px monospace;color:var(--lime)}.process h3{font-size:20px;letter-spacing:-.4px;margin:20px 0 10px}.process p{font-size:14px;color:var(--muted);line-height:1.75}.faq-grid{display:grid;grid-template-columns:.9fr 1.3fr;gap:100px}.faq-grid h2{max-width:300px}.faq{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line);padding:23px 0}summary{cursor:pointer;display:flex;justify-content:space-between;gap:20px;font-size:15px;list-style:none}summary::-webkit-details-marker{display:none}summary:after{content:"+";color:var(--lime)}details[open] summary:after{content:"−"}details p{font-size:13px;line-height:1.8;color:var(--muted);max-width:570px;padding-right:20px;margin-bottom:0}.contact{background:var(--lime);color:var(--bg);padding:55px 0}.contact .wrap{display:flex;align-items:center;justify-content:space-between;gap:40px}.contact h2{font-size:40px;letter-spacing:-1.5px;line-height:1.1;margin:0 0 12px}.contact p{font-size:14px;margin:0;color:#455731}.contact .btn{background:var(--bg);border-color:var(--bg);color:var(--white);white-space:nowrap}footer{padding:45px 0 25px}.footer-top{display:flex;justify-content:space-between;gap:30px;align-items:center;padding-bottom:35px}.footer-links{display:flex;gap:25px;font-size:12px;color:var(--muted)}.footer-bottom{border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;color:#81917f;font-size:10px}.preview{font-size:10px;color:#9da995}a:hover{text-decoration-thickness:1px}.footer-links a:hover{text-decoration:underline}@media(min-width:1500px){.hero .wrap{min-height:740px}}@media(max-width:1000px){.wrap{padding:0 28px}.hero h1{font-size:70px;letter-spacing:-4px}.hero .wrap{min-height:610px}.navlink{display:none}.build-grid{gap:35px}.faq-grid{gap:45px}.profile{padding:22px}.resolution{font-size:45px}}@media(max-width:700px){.wrap{padding:0 22px}.topbar .wrap span:last-child{display:none}.topbar{font-size:9px}nav{height:75px;gap:12px}.brand strong{font-size:16px}.brand small{font-size:9px}.brand-mark{width:32px;height:36px;font-size:24px}nav>.btn{display:none}.menu{display:block}.nav-open{position:absolute;top:75px;left:0;right:0;background:var(--panel);display:flex;flex-direction:column;padding:22px;border-bottom:1px solid var(--line);gap:20px}.nav-open .navlink{display:block}nav .mobile-links{display:none}nav .mobile-links.nav-open{display:flex}.hero .wrap{display:flex;flex-direction:column;gap:0;align-items:stretch;padding-top:48px;min-height:0}.hero h1{font-size:62px;letter-spacing:-4px;margin:23px 0}.hero .intro{font-size:14px;max-width:350px;margin-bottom:25px}.hero-art{height:370px;align-self:auto;margin:0 -10px}.hero-art svg{height:390px;width:100%}.art-label{bottom:22px;font-size:8px;right:7px}.hero-index{top:15px;right:4px;font-size:8px}.hero .btn{padding:14px 17px;gap:15px}.under{font-size:10px}.strip .wrap{grid-template-columns:1fr;gap:20px;padding-top:25px;padding-bottom:25px}.strip strong{font-size:12px}.strip span{margin-left:24px;font-size:11px}.section{padding:65px 0}.section-head{display:block;margin-bottom:30px}.section-head p{margin-top:20px;font-size:13px}.section h2{font-size:39px;letter-spacing:-1.5px}.profiles{grid-template-columns:1fr;gap:14px}.profile{padding:25px}.profile p{min-height:0}.resolution{margin-top:17px}.build-grid,.faq-grid{grid-template-columns:1fr;gap:32px}.build-intro .big-num,.build-intro .small-label{display:none}.build-intro h2{margin-bottom:18px}.config{padding:23px}.form-grid{grid-template-columns:1fr;gap:18px}.field.full{grid-column:auto}.process{grid-template-columns:1fr;gap:20px}.process article{display:grid;grid-template-columns:30px 1fr;gap:0 17px}.process .step{grid-row:1/3;padding-top:5px}.process h3{margin:0 0 5px}.process p{margin:0;font-size:13px}.contact .wrap{display:block}.contact h2{font-size:33px}.contact .btn{margin-top:24px}.footer-top{display:block}.footer-links{flex-wrap:wrap;margin-top:25px;gap:15px 25px}.footer-bottom{display:block;line-height:2}.eyebrow{font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

body.admin-bar .header{top:32px}.content-page{min-height:60vh;padding:75px 0}.content-page h1{font-size:48px;line-height:1.1;letter-spacing:-2px}.content-page a{color:var(--lime)}.content-page input,.content-page select,.content-page textarea{background:#fff;color:#18211a;border:1px solid #607052;padding:12px;max-width:100%}.woocommerce ul.products li.product{background:var(--panel);padding:20px;border:1px solid var(--line);border-radius:5px}.woocommerce ul.products li.product .price{color:var(--lime)}.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{background:var(--lime);color:var(--bg);padding:14px 18px;border-radius:3px}.woocommerce div.product .woocommerce-tabs ul.tabs li{background:var(--panel)}.woocommerce div.product .woocommerce-tabs ul.tabs li a{color:var(--white)}.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:#35472b}.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--lime)}.woocommerce table.shop_table{border-color:var(--line)}.woocommerce-info,.woocommerce-message{background:var(--panel);color:var(--white);border-color:var(--lime)}.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea{background:#fff;color:#172119;padding:13px}.woocommerce #payment{background:var(--panel)}.content-page .wp-block-button__link{background:var(--lime);color:var(--bg)}.content-page .wp-block-image img{height:auto;max-width:100%}.content-page .wp-block-columns{gap:30px}.content-page .wp-block-column{min-width:0}.content-page .wp-block-group{margin-bottom:30px}.content-page .wp-block-table{overflow:auto}.woocommerce-ordering select{max-width:100%}@media(max-width:782px){body.admin-bar .header{top:46px}.content-page h1{font-size:35px}.woocommerce ul.products[class*=columns-] li.product{width:100%;float:none}}
.configure-preview{background:linear-gradient(135deg,#19221c,#111b20)}.component-path{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.component-path span{padding:18px 16px;border:1px solid #ffffff24;background:#ffffff05;border-radius:8px;font-size:14px}.component-path span:first-child{border-color:var(--lime);color:var(--lime)}.configure-note{border-left:3px solid var(--lime);padding:4px 0 4px 22px;margin-top:30px;max-width:760px}.configure-note p{color:var(--muted);margin:8px 0}.configure-note>span{font-size:13px;color:#c6d4c8}@media(max-width:850px){.component-path{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.component-path{grid-template-columns:repeat(2,minmax(0,1fr))}.component-path span{font-size:12px;padding:14px 10px}.brand-mark{font-size:17px}}

.component-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}.component-group{border:1px solid var(--line);border-radius:10px;background:#ffffff04;overflow:hidden}.component-group summary{padding:20px;cursor:pointer;display:flex;gap:16px;align-items:center;justify-content:space-between;font-weight:700;list-style:none}.component-group summary::after{content:"+";font-size:24px;color:var(--lime)}.component-group[open] summary::after{content:"−"}.component-group[open]{border-color:#d0ff7280}.component-group summary small{font-size:11px;color:var(--muted);font-weight:400;margin-left:auto}.component-models{padding:0 20px 20px}.component-model{background:#101714;border:1px solid var(--line);padding:18px;border-radius:6px}.component-model+.component-model{margin-top:12px}.component-model p,.component-models>p{color:var(--muted);font-size:13px}.component-model a{color:var(--lime);font-size:12px}.component-group summary:focus-visible{outline:2px solid var(--lime);outline-offset:-4px}@media(max-width:700px){.component-catalog{grid-template-columns:1fr}.component-group summary{padding:16px}}

.component-search-label{display:block;font-size:12px;color:var(--muted);margin-bottom:14px}.component-search{display:block;width:100%;padding:12px;border:1px solid var(--line);background:#101714;color:#fff;border-radius:5px;margin-top:6px}.component-choice{display:flex;align-items:center;gap:8px;color:var(--lime);font-size:12px;margin-bottom:12px;cursor:pointer}.component-choice input{accent-color:var(--lime);width:18px;height:18px}.component-model[hidden]{display:none}.component-summary{border:1px solid #d0ff7270;border-radius:10px;padding:28px;margin-top:28px;background:#131d16}.component-summary h3{font-size:26px;margin-top:0}.component-summary ul{list-style:none;padding:0}.component-summary li{display:flex;gap:16px;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}.component-summary li button,.component-reset{background:none;border:0;color:var(--muted);cursor:pointer;text-decoration:underline}.component-summary li button:hover,.component-reset:hover{color:#fff}.component-summary button:disabled{opacity:.4;cursor:default}#component-selection-feedback{font-size:12px;color:var(--lime)}.component-models{max-height:480px;overflow:auto}.component-model strong{display:block;overflow-wrap:anywhere}@media(max-width:700px){.component-summary{padding:18px}.component-summary .actions{align-items:stretch;flex-direction:column}}

.configuration-steps{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;padding:0;margin:0 0 24px;gap:12px}.configuration-steps li{background:#ffffff06;border:1px solid var(--line);padding:18px;border-radius:8px;font-size:14px}.configuration-steps b{color:var(--lime);margin-right:10px;font-family:monospace}.component-photo{background:#fff;border-radius:7px;padding:12px;margin:0 0 14px;display:flex;justify-content:center}.component-photo img{width:100%;height:150px;object-fit:contain}.hero h1{font-size:clamp(42px,5.4vw,76px);line-height:1.06}.hero .intro{max-width:520px}.component-catalog{align-items:start}.component-group summary{min-height:78px}.component-group{height:auto!important;min-height:0!important}@media(max-width:700px){.configuration-steps{grid-template-columns:1fr;gap:6px}.configuration-steps li{padding:12px}.hero h1{font-size:45px}.component-photo img{height:130px}}

/* OfficeSystems identity: white, violet and navy, matching the software shop. */
:root{--bg:#ffffff;--panel:#f5f3ff;--lime:#5b21b6;--white:#1f2937;--muted:#64748b;--line:#e2dff0;--dark:#0f172a}
body{background:#fff;color:#1f2937}.topbar{background:#f5f3ff;color:#5b21b6;border-color:#ede9fe}.header{background:#fffffff5;border-color:#e5e7eb}.brand-mark{background:#5b21b6;color:#fff;clip-path:none;border-radius:4px}.brand small{color:#5b21b6}.navlink{color:#334155}.navlink:hover{color:#5b21b6}.btn,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{background:#5b21b6;border-color:#5b21b6;color:#fff}.btn:hover{background:#4c1d95;color:#fff}.btn.secondary{background:#fff;border-color:#c4b5fd;color:#5b21b6}.btn.secondary:hover{background:#f5f3ff}.skip:focus{background:#5b21b6;color:#fff}.menu{color:#5b21b6;border-color:#c4b5fd}.hero{background:#0f172a;color:#fff}.hero h1{color:#fff;letter-spacing:-3px}.hero h1 em{color:#c4b5fd}.hero .eyebrow{color:#c4b5fd}.hero .intro{color:#e2e8f0}.hero .under{color:#cbd5e1}.hero-art:before{background:radial-gradient(ellipse at center,#8b5cf633,transparent 65%)}.hero-index{color:#cbd5e1}.art-label{color:#cbd5e1;border-color:#a78bfa}.art-label strong{color:#fff}.strip{background:#fff;border-color:#ede9fe}.configure-preview{background:linear-gradient(135deg,#faf9ff,#f1edff)}.component-group{background:#fff;padding:0;border-color:#ddd6fe;box-shadow:0 4px 14px #312e8105}.component-group[open]{border-color:#7c3aed}.component-group summary{color:#1f2937}.component-model{background:#fff;border-color:#e5e7eb}.component-model p,.component-models>p{color:#64748b}.component-search{background:#fff;color:#1f2937;border-color:#c4b5fd}.component-summary{background:#fff;border-color:#c4b5fd}.component-summary li button:hover,.component-reset:hover{color:#5b21b6}.configuration-steps li{background:#fff;border-color:#ddd6fe}.configure-note>span{color:#475569}.light{background:#f5f3ff;color:#1f2937}.light .eyebrow{color:#5b21b6}.build-intro p,.light .section-head p{color:#64748b}.build-intro .big-num{color:#c4b5fd}.build-intro .small-label{color:#5b21b6}.config{background:#fff;border-color:#ddd6fe}.config .btn{background:#5b21b6;border-color:#5b21b6;color:#fff}.field select,.field input,.field textarea{color:#1f2937;border-color:#d8d2e7}.summary{background:#f5f3ff;border-color:#7c3aed}.fine{color:#64748b}.contact{background:#5b21b6;color:#fff}.contact p{color:#ede9fe}.contact .btn{background:#fff;border-color:#fff;color:#5b21b6}footer{background:#fff;color:#1f2937}.footer-bottom,.preview{color:#64748b}.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:#ede9fe}.woocommerce-info,.woocommerce-message{background:#f5f3ff;color:#1f2937}.content-page .wp-block-button__link{background:#5b21b6;color:#fff}@media(max-width:700px){.hero h1{letter-spacing:-2px}.nav-open{background:#fff}}

.ready-pcs{background:#fff}.ready-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.ready-card{overflow:hidden;border:1px solid #e9e3f3;border-radius:18px;background:#fff;box-shadow:0 8px 30px #34165f09}.ready-card>img{width:100%;height:250px;object-fit:contain;background:#f5f3ff}.ready-body{padding:26px}.ready-body h3{font-size:25px;margin:10px 0}.ready-body p{color:#625c70}.ready-body details{margin:20px 0}.ready-body summary{cursor:pointer;font-weight:700;color:#5b21b6}.ready-body dl{font-size:14px}.ready-body dt{font-weight:700;margin-top:14px}.ready-body dd{margin:4px 0;line-height:1.5}.ready-body .btn{margin-top:12px}.ready-note{padding:16px 20px;background:#f5f3ff;border-left:3px solid #7c3aed;margin-bottom:28px}.ready-body .fine{font-size:12px;line-height:1.6}@media(max-width:700px){.ready-grid{grid-template-columns:1fr}.ready-card>img{height:210px}}
