/* =====================================================================
   ARENA — Gaming/Esports-Theme
   Handgeschriebenes CSS. Chrome (Header/Footer/Layout/Blocks) = Plain HTML
   mit .gg-*-Klassen. Geerbte Funktionsseiten (Account/Checkout/Module)
   laufen weiter über die Tailwind-Tokens (hier als CSS-Variablen definiert).
   ===================================================================== */

/* ---------- TOKENS: Neon-Grün auf Tiefschwarz (auch für geerbte Views) ---------- */
:root {
  --a-50:236 255 244;  --a-100:200 255 224; --a-200:150 255 200; --a-300:110 255 178;
  --a-400:64 255 150;  --a-500:43 255 136;  --a-600:20 214 108;  --a-700:15 170 86;
  --a-800:16 130 68;   --a-900:18 100 56;   --a-950:8 60 32;

  --canvas:7 8 12;     --surface:16 17 24;  --elevated:22 23 32;  --sunken:11 12 17;
  --ink-strong:236 237 243; --ink:200 201 212; --ink-muted:138 139 154; --ink-subtle:92 93 108; --ink-invert:7 8 12;
  --line:32 33 46;     --line-strong:52 53 70;
  --r:4px;             --r-lg:8px;
  --glow:0 0 0 1px rgb(var(--a-500)/.35), 0 0 24px -4px rgb(var(--a-500)/.5);
}

/* ---------- FONTS (Gaming: Chakra Petch Headlines, Inter Body) ---------- */
html, body, .font-sans { font-family:"Inter", ui-sans-serif, system-ui, sans-serif, "Twemoji Country Flags"; }
.font-display { font-family:"Chakra Petch","Inter", ui-sans-serif, sans-serif; }
.font-mono    { font-family:"JetBrains Mono", ui-monospace, SFMono-Regular, monospace; }

/* ---------- BASE + STICKY FOOTER ---------- */
html, body { background: rgb(var(--canvas)); color: rgb(var(--ink)); min-height:100vh; }
body { display:flex; flex-direction:column; }
body > main { flex:1 0 auto; }
body > footer { flex-shrink:0; margin-top:auto; }
* { -webkit-tap-highlight-color: transparent; }
body { font-feature-settings:"ss01"; text-rendering:optimizeLegibility; }
::selection { background: rgb(var(--a-500)/.30); color:#07080c; }
h1,h2,h3,h4,h5,h6 { font-family:"Chakra Petch","Inter",sans-serif; color: rgb(var(--ink-strong)); letter-spacing:.01em; }
a { transition: color .15s ease; }
img { max-width:100%; }

/* subtiler Grid-Hintergrund fürs ganze Doc */
body::before {
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background-image:
    linear-gradient(rgb(var(--a-500)/.035) 1px, transparent 1px),
    linear-gradient(90deg, rgb(var(--a-500)/.035) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image: radial-gradient(120% 90% at 50% -10%, #000 30%, transparent 75%);
}

/* ---------- SCROLLBAR ---------- */
* { scrollbar-width: thin; scrollbar-color: rgb(var(--line-strong)) transparent; }
*::-webkit-scrollbar { width:10px; height:10px; }
*::-webkit-scrollbar-thumb { background: rgb(var(--line-strong)); border:3px solid rgb(var(--canvas)); border-radius:999px; }
*::-webkit-scrollbar-thumb:hover { background: rgb(var(--a-700)); }
.no-scrollbar::-webkit-scrollbar { display:none; }
.no-scrollbar { -ms-overflow-style:none; scrollbar-width:none; }

/* ---------- UTILITIES, die geerbte nova-Views brauchen ---------- */
.max-w-8xl { max-width: 88rem; }
.shadow-soft { box-shadow: 0 1px 2px 0 rgb(0 0 0/.4); }
.shadow-card { box-shadow: 0 10px 30px -14px rgb(0 0 0/.7); }
.shadow-pop  { box-shadow: 0 18px 50px -16px rgb(0 0 0/.75), 0 0 0 1px rgb(var(--line)); }
.shadow-glow { box-shadow: var(--glow); }
.animate-pulse-dot { animation: pulse-dot 1.6s ease-in-out infinite; }
@keyframes pulse-dot { 0%,100%{opacity:1} 50%{opacity:.3} }
.bg-grid, .bg-dots { background-image:none; }

/* weiche Ecken sind hier eckiger (Gaming) */
.bg-surface, .bg-elevated { border-radius: var(--r-lg); }
.accent-text {
  background: linear-gradient(100deg, rgb(var(--a-300)), rgb(var(--a-500)) 55%, rgb(var(--a-600)));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.glow-accent { box-shadow: var(--glow); }
.aura::before {
  content:""; position:absolute; inset:-1px; pointer-events:none; z-index:0;
  background:
    radial-gradient(60% 120% at 85% -15%, rgb(var(--a-500)/.20), transparent 60%),
    radial-gradient(50% 100% at 5% 0%, rgb(var(--a-600)/.12), transparent 55%);
}
.hairline { border-color: rgb(var(--line)); }
.divide-hairline > * + * { border-color: rgb(var(--line)); }

/* Solide Neon-Grün-Flächen -> DUNKLER Text (Esports-Look), Status weiß */
.bg-accent-400, .bg-accent-500, .bg-accent-600, .bg-accent-700 { color:#07080c !important; }
.bg-danger-500,.bg-danger-600,.bg-success-500,.bg-success-600 { color:#fff; }

/* Dropdown-Panels / Drawer / Toggle / Toast / Reveal (für geerbte Views) */
.menu-panel { opacity:0; transform:translateY(6px) scale(.985); transform-origin:top; pointer-events:none; transition:opacity .16s ease, transform .16s cubic-bezier(.2,.7,.3,1); }
.menu-panel[data-open="true"] { opacity:1; transform:none; pointer-events:auto; }
.drawer { transform:translateX(100%); transition:transform .28s cubic-bezier(.3,.8,.3,1); }
.drawer[data-open="true"] { transform:none; }
.drawer-backdrop { opacity:0; pointer-events:none; transition:opacity .28s ease; }
.drawer-backdrop[data-open="true"] { opacity:1; pointer-events:auto; }
.seg { position:relative; } .seg input { position:absolute; opacity:0; inset:0; cursor:pointer; }
.seg input:checked + .seg-opt { color: rgb(var(--ink-strong)); }
.switch { width:44px; height:24px; border-radius:999px; background:rgb(var(--line-strong)); position:relative; transition:background .18s ease; cursor:pointer; flex:none; }
.switch::after { content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:999px; background:#fff; transition:transform .18s cubic-bezier(.3,.8,.3,1); }
.switch[aria-checked="true"] { background: rgb(var(--a-500)); }
.switch[aria-checked="true"]::after { transform:translateX(20px); }
#toast-stack { position:fixed; z-index:80; right:16px; bottom:16px; display:flex; flex-direction:column; gap:10px; }
.toast { animation: toast-in .28s cubic-bezier(.2,.7,.3,1) both; }
@keyframes toast-in { 0%{opacity:0; transform:translateY(12px) scale(.97);} 100%{opacity:1; transform:none;} }
input[type="checkbox"], input[type="radio"] { accent-color: rgb(var(--a-500)); }
input::placeholder, textarea::placeholder { color: rgb(var(--ink-subtle)); }
[data-reveal] { opacity:0; transform:translateY(14px); }
[data-reveal].is-in { animation: fade-up-r .6s cubic-bezier(.2,.7,.3,1) both; }
@keyframes fade-up-r { to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.001ms!important; transition-duration:.001ms!important; } [data-reveal]{opacity:1;transform:none;} }

/* Legacy custom-Klassen (geerbte Account-Views) */
.theme-card { background:rgb(var(--surface)); border:1px solid rgb(var(--line)); border-radius:var(--r-lg); padding:1.5rem; box-shadow:0 10px 30px -14px rgb(0 0 0/.7); }
.theme-button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; background:rgb(var(--a-500)); color:#07080c; border:none; cursor:pointer; border-radius:var(--r); padding:.625rem 1.25rem; font-weight:700; transition:.15s; }
.theme-button:hover { background:rgb(var(--a-400)); box-shadow:var(--glow); }
.theme-input { background:rgb(var(--sunken)); border:1px solid rgb(var(--line)); color:rgb(var(--ink-strong)); border-radius:var(--r); padding:.625rem .875rem; width:100%; }
.theme-input:focus { outline:none; border-color:rgb(var(--a-500)); box-shadow:0 0 0 2px rgb(var(--a-500)/.30); }
.theme-table { width:100%; border-collapse:collapse; }
.theme-table th, .theme-table td { padding:.75rem; text-align:left; border-bottom:1px solid rgb(var(--line)); color:rgb(var(--ink)); }
.theme-table th { color:rgb(var(--ink-strong)); font-weight:700; }
.account-page { padding:2rem 0; }
.account-card { background:rgb(var(--surface)); border:1px solid rgb(var(--line)); border-radius:var(--r-lg); padding:1.5rem; margin-bottom:1.5rem; }
.account-card h1, .account-card h2 { color:rgb(var(--ink-strong)); margin-bottom:1rem; }
.prose { color:rgb(var(--ink-muted)); } .prose h1,.prose h2,.prose h3 { color:rgb(var(--ink-strong)); } .prose i { margin-right:.25rem; }
.product-option-select, #laufzeit-select {
  -webkit-appearance:none!important; -moz-appearance:none!important; appearance:none!important;
  background-color:rgb(var(--sunken))!important; border:1px solid rgb(var(--line))!important; border-radius:var(--r)!important;
  color:rgb(var(--ink-strong))!important; padding:.75rem 2.5rem .75rem 1rem!important;
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%232bff88' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")!important;
  background-position:right .75rem center!important; background-repeat:no-repeat!important; background-size:1.25rem!important;
}
@media (max-width:640px) {
  .settings-table, .settings-table tbody, .settings-table tr, .settings-table td { display:block; width:100%!important; }
  .settings-table tr { padding:.5rem 0; } .settings-table td { padding:.35rem 1rem!important; }
  .settings-table td:first-child { padding-bottom:0!important; color:rgb(var(--ink-muted)); font-size:.8125rem; }
}

/* =====================================================================
   ARENA PLAIN-HTML CHROME (.gg-*)
   ===================================================================== */
.gg-wrap { width:100%; max-width:1320px; margin:0 auto; padding:0 20px; }

/* Buttons */
.gg-btn { --clip: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem; height:44px; padding:0 22px;
  font-family:"Chakra Petch",sans-serif; font-weight:600; font-size:.9rem; letter-spacing:.03em; text-transform:uppercase;
  cursor:pointer; border:0; clip-path:var(--clip); transition:.16s ease; white-space:nowrap; }
.gg-btn--primary { background:rgb(var(--a-500)); color:#07080c; }
.gg-btn--primary:hover { background:rgb(var(--a-400)); box-shadow:0 0 22px -2px rgb(var(--a-500)/.6); transform:translateY(-1px); }
.gg-btn--ghost { background:transparent; color:rgb(var(--ink-strong)); box-shadow: inset 0 0 0 1px rgb(var(--line-strong)); }
.gg-btn--ghost:hover { box-shadow: inset 0 0 0 1px rgb(var(--a-500)/.6); color:rgb(var(--a-400)); }
.gg-btn--sm { height:38px; padding:0 16px; font-size:.8rem; }
.gg-btn--block { width:100%; }

/* Header */
.gg-header { position:sticky; top:0; z-index:40; }
.gg-topbar { display:none; background:rgb(var(--sunken)/.85); backdrop-filter:blur(8px); border-bottom:1px solid rgb(var(--line)/.7); font-size:.72rem; color:rgb(var(--ink-muted)); }
@media (min-width:768px){ .gg-topbar { display:block; } }
.gg-topbar-inner { display:flex; align-items:center; justify-content:space-between; height:34px; }
.gg-topbar a { color:rgb(var(--ink-muted)); display:inline-flex; align-items:center; gap:6px; }
.gg-topbar a:hover { color:rgb(var(--a-400)); }
.gg-topbar .gg-sep { display:inline-flex; gap:18px; align-items:center; }
.gg-status { display:inline-flex; align-items:center; gap:7px; }
.gg-status .dot { width:7px; height:7px; border-radius:999px; background:rgb(var(--a-500)); box-shadow:0 0 8px rgb(var(--a-500)); animation:pulse-dot 1.6s ease-in-out infinite; }

.gg-bar { background:rgb(var(--canvas)/.82); backdrop-filter:blur(14px); border-bottom:1px solid rgb(var(--line)); box-shadow:0 1px 0 rgb(var(--a-500)/.08); }
.gg-bar-inner { display:flex; align-items:center; justify-content:space-between; height:66px; gap:16px; }
.gg-left { display:flex; align-items:center; gap:28px; min-width:0; }

/* Logo */
.gg-logo { display:inline-flex; align-items:center; gap:11px; text-decoration:none; flex:none; }
.gg-logo-mark { position:relative; width:38px; height:38px; display:grid; place-items:center; color:#07080c; background:rgb(var(--a-500));
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); box-shadow:0 0 18px -2px rgb(var(--a-500)/.7); }
.gg-logo-txt { font-family:"Chakra Petch",sans-serif; font-weight:700; font-size:1.25rem; letter-spacing:.02em; color:rgb(var(--ink-strong)); text-transform:uppercase; }
.gg-logo-txt b { color:rgb(var(--a-500)); }

/* Nav */
.gg-nav { display:none; align-items:center; gap:2px; }
@media (min-width:1024px){ .gg-nav { display:flex; } }
.gg-nav-item { position:relative; }
.gg-nav-link { display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 14px; color:rgb(var(--ink-muted)); text-decoration:none;
  font-family:"Chakra Petch",sans-serif; font-weight:600; font-size:.86rem; letter-spacing:.03em; text-transform:uppercase; transition:.14s; }
.gg-nav-link:hover, .gg-nav-item[data-open="true"] > .gg-nav-link { color:rgb(var(--ink-strong)); }
.gg-nav-link::after { content:""; position:absolute; left:14px; right:14px; bottom:8px; height:2px; background:rgb(var(--a-500)); transform:scaleX(0); transform-origin:left; transition:transform .18s ease; }
.gg-nav-link:hover::after, .gg-nav-item[data-open="true"] > .gg-nav-link::after { transform:scaleX(1); }
.gg-chev { transition:transform .18s ease; } .gg-nav-item[data-open="true"] .gg-chev, [data-menu][data-open="true"] .gg-chev { transform:rotate(180deg); }

/* Dropdown-Panels (Nav / Cart / Account) */
.gg-menu { position:relative; }
.gg-panel { position:absolute; top:100%; margin-top:10px; z-index:50; min-width:240px;
  background:rgb(var(--elevated)); border:1px solid rgb(var(--line-strong)); box-shadow:0 20px 50px -18px #000, 0 0 0 1px rgb(var(--a-500)/.06);
  opacity:0; transform:translateY(8px); pointer-events:none; transition:opacity .16s ease, transform .16s cubic-bezier(.2,.7,.3,1); }
.gg-panel--right { right:0; } .gg-panel--left { left:0; }
[data-menu][data-open="true"] > .gg-panel, .gg-nav-item[data-open="true"] > .gg-panel { opacity:1; transform:none; pointer-events:auto; }
.gg-panel-link { display:flex; align-items:center; gap:10px; padding:11px 14px; color:rgb(var(--ink)); text-decoration:none; font-size:.9rem; border-left:2px solid transparent; transition:.12s; }
.gg-panel-link:hover { background:rgb(var(--a-500)/.08); color:rgb(var(--ink-strong)); border-left-color:rgb(var(--a-500)); }
.gg-panel-head { padding:12px 14px; border-bottom:1px solid rgb(var(--line)); }
.gg-panel-foot { padding:8px; border-top:1px solid rgb(var(--line)); }

/* Actions cluster */
.gg-actions { display:flex; align-items:center; gap:8px; }
.gg-icon-btn { position:relative; width:42px; height:42px; display:grid; place-items:center; background:transparent; border:0; color:rgb(var(--ink-muted)); cursor:pointer; transition:.14s; }
.gg-icon-btn:hover { color:rgb(var(--a-400)); background:rgb(var(--a-500)/.08); }
.gg-badge { position:absolute; top:4px; right:4px; min-width:17px; height:17px; padding:0 4px; display:grid; place-items:center;
  background:rgb(var(--a-500)); color:#07080c; font-size:10px; font-weight:800; border-radius:999px; }
.gg-account-btn { display:inline-flex; align-items:center; gap:8px; height:42px; padding:0 12px; background:transparent; border:0; cursor:pointer;
  color:rgb(var(--ink-muted)); font-weight:600; font-size:.9rem; transition:.14s; }
.gg-account-btn:hover { color:rgb(var(--ink-strong)); background:rgb(var(--a-500)/.08); }
.gg-avatar { width:26px; height:26px; display:grid; place-items:center; background:rgb(var(--a-500)/.15); color:rgb(var(--a-400)); border:1px solid rgb(var(--a-500)/.3); font-weight:700; font-size:.7rem; clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); }
.gg-burger { display:grid; place-items:center; width:42px; height:42px; background:transparent; border:0; color:rgb(var(--ink-strong)); cursor:pointer; }
@media (min-width:1024px){ .gg-burger { display:none; } }

/* Mini-Cart / Account panels */
.gg-cart-panel, .gg-account-panel { width:320px; }
.gg-cart-row { display:flex; align-items:center; gap:10px; padding:11px 14px; border-bottom:1px solid rgb(var(--line)); }
.gg-cart-thumb { width:36px; height:36px; display:grid; place-items:center; background:rgb(var(--sunken)); border:1px solid rgb(var(--line)); color:rgb(var(--ink-muted)); flex:none; }
.gg-cart-name { font-size:.85rem; color:rgb(var(--ink-strong)); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gg-cart-sub { font-size:.72rem; color:rgb(var(--ink-subtle)); }
.gg-price { font-family:"JetBrains Mono",monospace; color:rgb(var(--ink-strong)); font-weight:600; }
.gg-muted { color:rgb(var(--ink-muted)); } .gg-subtle { color:rgb(var(--ink-subtle)); }
.gg-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:8px; }

@media (max-width:1023px){
  .gg-cart-panel, .gg-account-panel { position:fixed; left:8px; right:8px; top:66px; width:auto; margin-top:0; }
}

/* Mobile Drawer */
.gg-drawer-root { position:fixed; inset:0; z-index:60; pointer-events:none; }
@media (min-width:1024px){ .gg-drawer-root { display:none; } }
.gg-drawer-backdrop { position:absolute; inset:0; background:rgb(0 0 0/.65); backdrop-filter:blur(3px); opacity:0; pointer-events:none; transition:opacity .28s ease; }
.gg-drawer-backdrop[data-open="true"] { opacity:1; pointer-events:auto; }
.gg-drawer { position:absolute; right:0; top:0; height:100%; width:86%; max-width:360px; background:rgb(var(--canvas));
  border-left:1px solid rgb(var(--a-500)/.25); box-shadow:-20px 0 60px -20px #000; display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform .3s cubic-bezier(.3,.8,.3,1); }
.gg-drawer[data-open="true"] { transform:none; }
.gg-drawer-head { display:flex; align-items:center; justify-content:space-between; height:66px; padding:0 18px; border-bottom:1px solid rgb(var(--line)); }
.gg-drawer-body { flex:1; overflow:auto; padding:14px; }
.gg-drawer-link { display:flex; align-items:center; gap:12px; padding:12px 10px; color:rgb(var(--ink)); text-decoration:none; text-transform:uppercase;
  font-family:"Chakra Petch",sans-serif; font-weight:600; font-size:.9rem; letter-spacing:.02em; border-bottom:1px solid rgb(var(--line)/.6); }
.gg-drawer-link:hover { color:rgb(var(--a-400)); }
.gg-drawer-foot { padding:14px; border-top:1px solid rgb(var(--line)); }
.gg-drawer-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:rgb(var(--ink-subtle)); padding:14px 10px 4px; }

/* Footer */
.gg-footer { position:relative; margin-top:80px; border-top:1px solid rgb(var(--line)); background:rgb(var(--surface)/.4); }
.gg-footer::before { content:""; position:absolute; left:0; right:0; top:-1px; height:2px; background:linear-gradient(90deg, transparent, rgb(var(--a-500)/.8), transparent); }
.gg-footer-grid { display:grid; grid-template-columns:1.4fr; gap:32px; padding:52px 0; }
@media (min-width:768px){ .gg-footer-grid { grid-template-columns:1.6fr repeat(4, 1fr); } }
.gg-foot-col h4 { font-family:"Chakra Petch",sans-serif; font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; color:rgb(var(--ink-subtle)); margin:0 0 16px; }
.gg-foot-col a { display:block; color:rgb(var(--ink-muted)); text-decoration:none; font-size:.88rem; padding:5px 0; }
.gg-foot-col a:hover { color:rgb(var(--a-400)); }
.gg-foot-desc { color:rgb(var(--ink-muted)); font-size:.9rem; line-height:1.6; max-width:22rem; margin:16px 0 0; }
.gg-social { display:flex; gap:8px; margin-top:18px; }
.gg-social a { width:38px; height:38px; display:grid; place-items:center; color:rgb(var(--ink-muted)); border:1px solid rgb(var(--line)); transition:.14s; }
.gg-social a:hover { color:rgb(var(--a-400)); border-color:rgb(var(--a-500)/.5); box-shadow:0 0 14px -4px rgb(var(--a-500)/.5); }
.gg-footer-bar { display:flex; flex-direction:column; gap:12px; align-items:center; justify-content:space-between; padding:22px 0; border-top:1px solid rgb(var(--line)); font-size:.78rem; color:rgb(var(--ink-subtle)); }
@media (min-width:640px){ .gg-footer-bar { flex-direction:row; } }
.gg-footer-bar a { color:rgb(var(--a-400)); text-decoration:none; }

/* Discount banner */
.gg-banner { background:rgb(var(--a-500)); color:#07080c; text-align:center; padding:9px 16px; font-weight:600; font-size:.85rem; }

/* ---------- CMS-BLOCK-STYLES (Plain-HTML Blocks) ---------- */
.gg-section { padding:72px 0; }
.gg-eyebrow { display:inline-flex; align-items:center; gap:8px; font-family:"Chakra Petch",sans-serif; font-size:.72rem; text-transform:uppercase; letter-spacing:.16em; color:rgb(var(--a-400)); }
.gg-h2 { font-family:"Chakra Petch",sans-serif; font-weight:700; font-size:2rem; line-height:1.1; color:rgb(var(--ink-strong)); text-transform:uppercase; margin:0; }
.gg-lead { color:rgb(var(--ink-muted)); font-size:1.05rem; margin-top:12px; }
.gg-card { position:relative; background:rgb(var(--surface)); border:1px solid rgb(var(--line)); padding:26px; transition:.18s;
  clip-path:polygon(0 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%); }
.gg-card:hover { border-color:rgb(var(--a-500)/.5); box-shadow:0 0 28px -12px rgb(var(--a-500)/.5); transform:translateY(-3px); }
.gg-card-ico { width:46px; height:46px; display:grid; place-items:center; color:rgb(var(--a-400)); background:rgb(var(--a-500)/.1); border:1px solid rgb(var(--a-500)/.25); margin-bottom:16px; }
.gg-card h3 { font-family:"Chakra Petch",sans-serif; font-size:1.15rem; color:rgb(var(--ink-strong)); margin:0 0 8px; }
.gg-card p { color:rgb(var(--ink-muted)); font-size:.92rem; line-height:1.6; margin:0; }
.gg-grid { display:grid; gap:16px; }
.gg-grid--2 { grid-template-columns:1fr; } .gg-grid--3 { grid-template-columns:1fr; } .gg-grid--4 { grid-template-columns:1fr; }
@media (min-width:640px){ .gg-grid--2,.gg-grid--3,.gg-grid--4 { grid-template-columns:1fr 1fr; } }
@media (min-width:1024px){ .gg-grid--3 { grid-template-columns:repeat(3,1fr); } .gg-grid--4 { grid-template-columns:repeat(4,1fr); } }

/* Hero */
.gg-hero { position:relative; overflow:hidden; padding:96px 0 84px; }
.gg-hero-badge { display:inline-flex; align-items:center; gap:8px; padding:6px 12px; background:rgb(var(--a-500)/.1); border:1px solid rgb(var(--a-500)/.25); color:rgb(var(--a-400)); font-size:.75rem; font-weight:600; }
.gg-hero h1 { font-family:"Chakra Petch",sans-serif; font-weight:700; font-size:clamp(2.4rem,6vw,4.2rem); line-height:1.02; color:rgb(var(--ink-strong)); text-transform:uppercase; margin:22px 0 0; }
.gg-hero p { color:rgb(var(--ink-muted)); font-size:1.1rem; max-width:38rem; margin:20px 0 0; line-height:1.6; }
.gg-hero-cta { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }

/* Pricing */
.gg-tier { position:relative; background:rgb(var(--surface)); border:1px solid rgb(var(--line)); padding:28px; display:flex; flex-direction:column; }
.gg-tier--feat { border-color:rgb(var(--a-500)); box-shadow:0 0 40px -16px rgb(var(--a-500)/.55); }
.gg-tier-tag { position:absolute; top:0; right:0; background:rgb(var(--a-500)); color:#07080c; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; padding:5px 12px; clip-path:polygon(10px 0,100% 0,100% 100%,0 100%); }
.gg-price-big { font-family:"Chakra Petch",sans-serif; font-weight:700; font-size:2.6rem; color:rgb(var(--ink-strong)); }
.gg-tier ul { list-style:none; padding:0; margin:20px 0 0; display:flex; flex-direction:column; gap:11px; }
.gg-tier li { display:flex; gap:10px; color:rgb(var(--ink)); font-size:.9rem; }
.gg-tier li svg { color:rgb(var(--a-500)); flex:none; margin-top:2px; }

/* FAQ */
.gg-faq { border-top:1px solid rgb(var(--line)); }
.gg-faq-item { border-bottom:1px solid rgb(var(--line)); }
.gg-faq-q { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 4px; background:transparent; border:0; cursor:pointer; text-align:left; color:rgb(var(--ink-strong)); font-family:"Chakra Petch",sans-serif; font-weight:600; font-size:1rem; }
.gg-faq-q .gg-faq-ico { color:rgb(var(--a-400)); transition:transform .25s ease; flex:none; }
.gg-faq-item[data-open="true"] .gg-faq-ico { transform:rotate(45deg); }
.gg-faq-a { display:grid; grid-template-rows:0fr; transition:grid-template-rows .28s ease; }
.gg-faq-item[data-open="true"] .gg-faq-a { grid-template-rows:1fr; }
.gg-faq-a > div { overflow:hidden; }
.gg-faq-a p { color:rgb(var(--ink-muted)); line-height:1.65; padding:0 4px 20px; margin:0; }

/* CTA */
.gg-cta { position:relative; overflow:hidden; background:rgb(var(--surface)); border:1px solid rgb(var(--a-500)/.3); text-align:center; padding:64px 24px; }
.gg-cta h2 { font-family:"Chakra Petch",sans-serif; font-weight:700; font-size:clamp(1.8rem,4vw,2.8rem); color:rgb(var(--ink-strong)); text-transform:uppercase; margin:0; }
.gg-cta p { color:rgb(var(--ink-muted)); font-size:1.05rem; margin:14px auto 0; max-width:34rem; }

/* Testimonials */
.gg-quote { background:rgb(var(--surface)); border:1px solid rgb(var(--line)); padding:24px; }
.gg-stars { display:flex; gap:2px; color:rgb(var(--a-500)); }
.gg-quote blockquote { color:rgb(var(--ink)); line-height:1.6; margin:14px 0 0; font-size:.95rem; }
.gg-quote figcaption { display:flex; align-items:center; gap:12px; margin-top:18px; }
.gg-quote .gg-avatar { width:38px; height:38px; font-size:.85rem; }

/* Utility helpers used by blocks */
.gg-center { text-align:center; }
.gg-mt-8 { margin-top:32px; } .gg-mt-10 { margin-top:40px; }
.gg-flex { display:flex; align-items:center; gap:16px; }
.gg-between { justify-content:space-between; }
.gg-lang { display:flex; align-items:center; gap:2px; }
.gg-lang a { padding:2px 6px; color:rgb(var(--ink-muted)); text-decoration:none; }
.gg-lang a.active, .gg-lang a:hover { color:rgb(var(--a-400)); }