/* ── Seite: Online-Gutscheinshop ───────────────────────────── */
.ogs-crumb{padding:6px 0 0;}
.ogs-crumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;font-size:.82rem;font-weight:600;color:var(--muted,#6b6560);}
.ogs-crumb li::after{content:"›";margin-left:8px;opacity:.5;}
.ogs-crumb li:last-child::after{content:none;}
.ogs-crumb a{color:var(--muted,#6b6560);text-decoration:none;}
.ogs-crumb a:hover{color:var(--ink);}

.ogs-def{padding:clamp(50px,6vw,98px) 0;background:#fff;}
.ogs-def-in{width:80%;max-width:1400px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:start;}
.ogs-def h2{font-size:clamp(2rem,3.4vw,3rem);letter-spacing:-.035em;line-height:1.05;margin:0;color:var(--ink);text-wrap:balance;}
.ogs-def p{font-size:clamp(1.02rem,1.2vw,1.14rem);line-height:1.6;color:var(--text);margin:0 0 16px;text-wrap:pretty;}
.ogs-def p:last-child{margin-bottom:0;}
.ogs-def a{color:var(--cyan-deep,#1b97bd);font-weight:700;text-decoration:none;box-shadow:inset 0 -1px 0 0 color-mix(in srgb,var(--cyan) 45%,transparent);}
.ogs-def a:hover{color:var(--ink);box-shadow:inset 0 -1px 0 0 var(--ink);}
@media(max-width:900px){.ogs-def-in{grid-template-columns:1fr;}}

/* Stepper (Design-System: gs-stepper-dark) */
.gs-stepper-dark{position:relative;padding:clamp(50px,6vw,98px) 0;background:linear-gradient(135deg,#0e5570 0%,#1c6f64 52%,#8bc220 100%);overflow:hidden;}
.gs-stepper-dark .wrap{position:relative;z-index:2;}
.gs-stepper-dark .bx{position:absolute;z-index:1;border-radius:6px;box-shadow:0 8px 20px -8px rgba(20,30,15,.35);}
@media(max-width:560px){.gs-stepper-dark .bx{display:none;}}
.gs-stepper-dark .gs-h2{color:#fff;}
.gs-stepper-dark .gs-head .lead{color:rgba(255,255,255,.7);}
.gs-stepper-dark .step-thumb{background:repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 14px,rgba(255,255,255,.03) 14px 15px),rgba(255,255,255,.04);border-color:rgba(255,255,255,.14);aspect-ratio:4/3;}
.gs-stepper-dark .step-thumb.is-filled{background:rgba(255,255,255,.94);}
.gs-stepper-dark .step-thumb.is-filled img{position:absolute;top:4%;left:4%;width:92%;height:92%;object-fit:contain;}
.gs-stepper-dark .step-thumb-lab{background:rgba(0,0,0,.4);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.8);}
.gs-stepper-dark .step-thumb::after{border-top-color:rgba(255,255,255,.22);border-right-color:rgba(255,255,255,.22);}
.gs-stepper-dark .step-num{background:rgba(255,255,255,.14);color:#fff;}
.gs-stepper-dark .step-title{color:#fff;}
.gs-stepper-dark .step-desc{color:rgba(255,255,255,.65);}
.gs-stepper-cta{display:flex;justify-content:center;margin-top:clamp(28px,3.4vw,44px);}
.gs-stepper-cta .btn-primary{background:var(--ink)!important;}
.gs-stepper-cta .btn-primary:hover{background:#000!important;}

/* Vorteile */
.ogs-adv{padding:clamp(40px,4.4vw,72px) 0;background:var(--bg);}
.ogs-adv-in{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:clamp(28px,4vw,72px);align-items:start;}
.ogs-adv-side{position:sticky;top:150px;}
.ogs-adv-side h2{font-size:clamp(2rem,3.4vw,3rem);letter-spacing:-.035em;line-height:1.05;margin:0;color:var(--ink);text-wrap:balance;}
.ogs-adv-side .lead{margin:16px 0 0;max-width:24em;}
.ogs-adv-side h2 .hl{display:inline-block;background:var(--green);color:#fff;padding:0 .12em;border-radius:12px;transform:rotate(-1.5deg);}
.ogs-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,1.8vw,22px);}
.ogs-row{display:flex;flex-direction:column;gap:clamp(13px,1.4vw,17px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r,18px);box-shadow:var(--shadow-s);padding:clamp(22px,2.4vw,30px);transition:transform .2s cubic-bezier(.4,0,.2,1),box-shadow .2s,border-color .2s;}
.ogs-row:hover{transform:translateY(-3px);box-shadow:var(--shadow-m);border-color:var(--line-2);}
.ogs-ic{width:52px;height:52px;border-radius:15px;background:var(--green-soft);color:var(--green-press,#6fa018);display:grid;place-items:center;}
.ogs-ic svg{width:24px;height:24px;}
.ogs-row h3{margin:0;font-size:clamp(1.2rem,1.5vw,1.5rem);font-weight:700;letter-spacing:-.02em;line-height:1.14;color:var(--ink);}
.ogs-row p{margin:0;font-size:1rem;line-height:1.55;color:var(--text);text-wrap:pretty;}
@media(max-width:1200px){.ogs-list{grid-template-columns:1fr;}}
@media(max-width:900px){.ogs-adv-in{grid-template-columns:1fr;}.ogs-adv-side{position:static;}.ogs-list{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:640px){.ogs-list{grid-template-columns:1fr;}}

/* Einbindung */
.ogs-embed{position:relative;padding:clamp(58px,7vw,112px) 0 clamp(56px,6vw,92px);background:var(--bg-dark);color:#fff;}
.ogs-embed::before{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(9,10,12,.62) 0%,rgba(9,10,12,.48) 40%,rgba(9,10,12,.66) 72%,rgba(9,10,12,.9) 100%),
    url("/uploads/opt/employee-placing-potted-plant-desk.webp") center 45%/cover no-repeat;}
.ogs-embed .wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;}
.ogs-embed h2{font-size:clamp(2rem,3.4vw,3rem);letter-spacing:-.035em;line-height:1.05;margin:0;color:#fff;text-wrap:balance;max-width:18em;text-shadow:0 2px 16px rgba(0,0,0,.55);}
.ogs-embed .lead{color:#fff;margin:16px 0 0;max-width:34em;text-shadow:0 2px 16px rgba(0,0,0,.55);}
.ogs-ways{width:min(1120px,100%);margin-top:clamp(44px,5vw,72px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.2vw,18px);}
.ogs-way{display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(14px,1.3vw,20px);
  padding:clamp(22px,2.2vw,32px) clamp(16px,1.6vw,24px);border-radius:22px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(10px) saturate(1.2);
  transition:background .25s,border-color .25s,transform .3s cubic-bezier(.34,1.56,.64,1);}
.ogs-way:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);transform:translateY(-3px);}
.ogs-way-ico{display:grid;place-items:center;flex-shrink:0;width:clamp(46px,3.4vw,56px);height:clamp(46px,3.4vw,56px);
  border-radius:13px;color:var(--green-press);background:var(--green-soft);border:1px solid color-mix(in srgb,var(--green) 28%,transparent);
  transition:background .25s,color .25s,transform .3s cubic-bezier(.34,1.56,.64,1);}
.ogs-way:hover .ogs-way-ico{background:var(--green);color:#fff;transform:scale(1.06);}
.ogs-way-ico svg{width:52%;height:52%;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.ogs-way h3{margin:0;font-size:clamp(1.14rem,1.35vw,1.34rem);font-weight:700;letter-spacing:-.02em;line-height:1.2;color:#fff;text-wrap:balance;}
.ogs-way p{margin:0;font-size:1rem;line-height:1.55;color:rgba(255,255,255,.76);text-wrap:pretty;}
@media(max-width:900px){.ogs-ways{grid-template-columns:1fr;}.ogs-way{flex-direction:row;align-items:center;text-align:left;gap:16px;}}

/* Branchen */
.ogs-branch{padding:clamp(50px,6vw,98px) 0;background:var(--surface);}
.ogs-branch-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,20px);margin-top:clamp(30px,3.6vw,48px);max-width:1080px;margin-inline:auto;justify-items:stretch;}
.ogs-branch-card:nth-last-child(3){grid-column:1 / span 2;}
@media (max-width:900px){.ogs-branch-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.ogs-branch-card:nth-last-child(3){grid-column:auto;}}
@media (max-width:540px){.ogs-branch-grid{grid-template-columns:1fr;}}
.ogs-branch-card{position:relative;border-radius:22px;overflow:hidden;min-height:260px;display:flex;align-items:flex-end;text-decoration:none;box-shadow:var(--shadow-s);}
.ogs-branch-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.ogs-branch-card:hover img{transform:scale(1.05);}
.ogs-branch-card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,18,12,.82) 0%,rgba(20,18,12,.15) 55%,transparent 100%);}
.ogs-branch-card span{position:relative;z-index:2;padding:20px 22px;font-family:var(--head);font-weight:700;font-size:1.22rem;letter-spacing:-.02em;color:#fff;}

/* Hero der Vorteile-Seiten */
.vf-hero{position:relative;padding:clamp(40px,5vw,84px) 0 clamp(36px,4vw,64px);background:var(--bg);overflow:hidden;}
.vf-hero::before{content:"";position:absolute;top:-130px;bottom:0;left:calc(50% - 50vw);width:100vw;z-index:0;pointer-events:none;
  background:radial-gradient(62% 90% at 50% -18%,rgba(37,180,222,.20),transparent 68%),
             radial-gradient(48% 70% at 8% 104%,rgba(37,180,222,.10),transparent 62%);}
.vf-hero-in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;}
.vf-hero .bx{position:absolute;z-index:1;border-radius:6px;box-shadow:0 8px 20px -8px rgba(60,48,24,.28);}
@media(max-width:860px){.vf-hero .bx{display:none;}}
.vf-hero h1{margin:0;max-width:16em;font-size:clamp(2.6rem,5vw,4.4rem);font-weight:700;letter-spacing:-.035em;line-height:1.02;color:var(--ink);text-wrap:balance;}
.vf-hero h1 .hl{color:var(--cyan);}
.vf-hero-sub{margin:clamp(18px,2vw,26px) 0 0;max-width:38em;font-size:clamp(1.08rem,1.4vw,1.3rem);font-weight:600;line-height:1.55;color:var(--text);text-wrap:pretty;}
.vf-hero-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:clamp(26px,2.8vw,36px);}

/* Rollen-Unterzeile */
.rl-switch{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.rl-switch-in{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:4px clamp(18px,2.4vw,34px);}
.rl-hint{margin:0;padding:16px 0;font-size:.92rem;font-weight:600;color:var(--muted,#6b6560);}
.rl-tab{position:relative;display:inline-block;padding:16px 0;font-family:var(--head);font-weight:700;font-size:1.04rem;color:var(--muted,#6b6560);text-decoration:none;transition:color .16s;}
.rl-tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:2px;background:transparent;transition:background .16s;}
.rl-tab:hover{color:var(--ink);}
.rl-tab[aria-current="page"]{color:var(--ink);}
.rl-tab[aria-current="page"]::after{background:var(--green);}

/* Wirkungszahlen */
.vf-stats{padding:clamp(46px,5.4vw,84px) 0;background:var(--bg);}
.vf-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);}
@media(max-width:900px){.vf-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:520px){.vf-stats-grid{grid-template-columns:1fr;}}
.vf-stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r,18px);box-shadow:var(--shadow-s);padding:clamp(22px,2.4vw,30px);display:flex;flex-direction:column;gap:8px;transition:transform .2s cubic-bezier(.4,0,.2,1),box-shadow .2s;}
.vf-stat:hover{transform:translateY(-3px);box-shadow:var(--shadow-m);}
.vf-stat b{font-family:var(--head);font-weight:700;font-size:clamp(2.2rem,3.6vw,3.2rem);letter-spacing:-.035em;line-height:1;color:var(--acc,#8bc220);}
.vf-stat span{font-size:1rem;line-height:1.5;color:var(--text);font-weight:500;text-wrap:pretty;}

/* Einwand → Antwort als Dialog-Slider */
.vf-obj{padding:clamp(56px,6.5vw,104px) 0;background:var(--bg-dark);}
.vf-obj-in{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(30px,4.5vw,80px);align-items:center;}
@media(max-width:980px){.vf-obj-in{grid-template-columns:1fr;}}
.vf-obj-side h2{margin:0;font-size:clamp(2rem,3.4vw,3rem);letter-spacing:-.035em;line-height:1.05;color:#fff;text-wrap:balance;}
.vf-obj-side .lead{margin:18px 0 0;max-width:26em;color:rgba(255,255,255,.72);}
.vf-stage{display:grid;width:100%;}
.vf-pair{grid-area:1/1;display:flex;flex-direction:column;gap:14px;opacity:0;pointer-events:none;transition:opacity .28s;}
.vf-pair.active{opacity:1;pointer-events:auto;}
.vf-said,.vf-answer{opacity:0;transform:translateY(12px);}
.vf-pair.active .vf-said{animation:vf-in .45s cubic-bezier(.4,0,.2,1) forwards;}
.vf-pair.active .vf-answer{animation:vf-in .45s cubic-bezier(.4,0,.2,1) .14s forwards;}
@keyframes vf-in{to{opacity:1;transform:none;}}
@media(prefers-reduced-motion:reduce){.vf-pair.active .vf-said,.vf-pair.active .vf-answer{animation:none;opacity:1;transform:none;}}
.vf-said{align-self:flex-start;max-width:min(88%,520px);background:var(--surface);border:1px solid var(--line);border-radius:20px 20px 20px 6px;padding:18px clamp(20px,2vw,28px);}
.vf-said p{margin:0;font-family:var(--head);font-weight:700;font-size:clamp(1.18rem,1.7vw,1.56rem);letter-spacing:-.024em;line-height:1.28;color:var(--ink);text-wrap:balance;}
.vf-answer{align-self:flex-end;display:flex;align-items:flex-end;gap:10px;max-width:min(94%,600px);}
.vf-reply{background:var(--cyan);border-radius:20px 20px 6px 20px;box-shadow:var(--shadow-m);padding:17px clamp(20px,2vw,26px);}
.vf-reply p{margin:0;font-size:1rem;line-height:1.6;color:#fff;font-weight:500;text-wrap:pretty;}
.vf-reply a{color:#fff;font-weight:700;text-decoration:none;box-shadow:inset 0 -1px 0 0 rgba(255,255,255,.75);}
.vf-reply a:hover{box-shadow:inset 0 -2px 0 0 #fff;}
.vf-av{flex:none;order:2;width:40px;height:40px;border-radius:50%;overflow:hidden;background:var(--acc);border:2px solid var(--acc);box-shadow:0 6px 18px -8px rgba(0,0,0,.6);}
.vf-av img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 18%;}
.vf-nav{display:flex;align-items:center;justify-content:flex-start;gap:18px;margin-top:clamp(22px,2.4vw,32px);}
@media(max-width:980px){.vf-nav{justify-content:center;}}
.vf-arrow{width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.28);color:#fff;display:grid;place-items:center;cursor:pointer;font-size:1.25rem;line-height:1;transition:background .2s,color .2s,border-color .2s,transform .2s;}
.vf-arrow:hover{background:#fff;border-color:#fff;color:var(--ink);transform:scale(1.06);}
.vf-arrow:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;}
.vf-dots{display:flex;gap:8px;}
.vf-dot{width:28px;height:6px;border-radius:999px;border:0;padding:0;background:rgba(255,255,255,.3);cursor:pointer;transition:width .25s,background .25s;}
.vf-dot:hover{background:rgba(255,255,255,.55);}
.vf-dot.active{width:44px;background:var(--dot,#8bc220);}
@media(max-width:640px){.vf-said,.vf-answer{max-width:100%;}}

/* Kampagnenjahr (horizontale Aufklapp-Galerie) */
.vf-year{padding:clamp(50px,6vw,98px) 0;background:var(--surface);}
@media(max-width:860px){
  .vf-year .vgal{height:auto;}
  .vf-year .vcard{height:auto !important;min-height:300px !important;cursor:default;}
  .vf-year .vcard:not(.open) .vc-inner{top:auto !important;left:14px !important;right:14px !important;bottom:14px !important;width:auto !important;flex-direction:column !important;align-items:flex-start !important;padding:18px 20px 22px !important;}
  .vf-year .vcard:not(.open) .vc-head{writing-mode:horizontal-tb !important;transform:none !important;position:static !important;white-space:normal !important;font-size:1.15rem !important;}
  .vf-year .vcard:not(.open) .vc-detail{display:block !important;max-height:300px !important;opacity:1 !important;margin-top:8px !important;}
  .vf-year .vcard:not(.open) .vc-short{display:none !important;}
  .vf-year .vcard:not(.open) .vc-long{display:inline !important;}
  .vf-year .vc-arrow{display:none !important;}
}

/* Übergabe an Kollegen */
.vf-hand{padding:clamp(50px,6vw,98px) 0;background:var(--bg);}
.vf-hand-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,1.8vw,24px);margin-top:clamp(28px,3.4vw,44px);width:70%;margin-inline:auto;}
@media(max-width:1100px){.vf-hand-grid{width:100%;}}
@media(max-width:820px){.vf-hand-grid{grid-template-columns:1fr;}}
.vf-hand-card{display:flex;flex-direction:column;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r,18px);box-shadow:var(--shadow-s);padding:clamp(24px,2.6vw,34px);text-decoration:none;transition:transform .2s cubic-bezier(.4,0,.2,1),box-shadow .2s,border-color .2s;}
.vf-hand-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-m);border-color:var(--line-2);}
.vf-hand-card h3{margin:0;font-size:clamp(1.24rem,1.6vw,1.5rem);font-weight:700;letter-spacing:-.02em;color:var(--ink);}
.vf-hand-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.vf-hand-card li{position:relative;padding-left:26px;font-size:1rem;line-height:1.55;color:var(--text);}
.vf-hand-card li::before{content:"";position:absolute;left:0;top:.45em;width:12px;height:12px;border-radius:4px;background:var(--acc);}
.vf-hand-more{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--acc);}
.vf-hand-card:hover .vf-hand-more{gap:12px;}

/* Hebel-Karten (Gutscheinmarketing) */
.gm-levers{padding:clamp(50px,6vw,98px) 0;background:var(--bg);}
.gm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.8vw,24px);margin-top:clamp(30px,3.6vw,48px);}
@media(max-width:980px){.gm-grid{grid-template-columns:1fr;}}
.gm-card{display:flex;flex-direction:column;gap:clamp(13px,1.4vw,17px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r,18px);box-shadow:var(--shadow-s);padding:clamp(24px,2.6vw,34px);transition:transform .2s cubic-bezier(.4,0,.2,1),box-shadow .2s,border-color .2s;}
.gm-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-m);border-color:var(--line-2);}
.gm-card .ogs-ic{background:color-mix(in srgb,var(--acc) 16%,#fff);color:var(--acc);}
.gm-card h3{margin:0;font-size:clamp(1.3rem,1.7vw,1.6rem);font-weight:700;letter-spacing:-.02em;line-height:1.14;color:var(--ink);}
.gm-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.gm-list li{position:relative;padding-left:28px;font-size:1rem;line-height:1.55;color:var(--text);text-wrap:pretty;}
.gm-list li::before{content:"";position:absolute;left:0;top:.42em;width:14px;height:14px;border-radius:5px;background:var(--acc);}
.gm-list a{color:var(--ink);font-weight:700;text-decoration:none;box-shadow:inset 0 -1px 0 0 color-mix(in srgb,var(--acc) 55%,transparent);transition:box-shadow .18s,color .18s;}
.gm-list a:hover{color:var(--acc);box-shadow:inset 0 -1px 0 0 var(--acc);}
.gm-more{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:999px;border:1.5px solid transparent;background:var(--acc);color:#fff;font-family:var(--head);font-weight:700;font-size:1rem;line-height:1;text-decoration:none;box-shadow:var(--shadow-s);transition:background .18s,transform .18s,box-shadow .18s,gap .18s;background:var(--cyan);}
.gm-more:hover{gap:12px;background:var(--cyan-deep);transform:translateY(-2px);box-shadow:var(--shadow-m);}

/* Funktionen-Links */
.ogs-fn{padding:clamp(50px,6vw,98px) 0;background:var(--bg);}
.ogs-fn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:clamp(28px,3.4vw,44px);}
.ogs-fn-link{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;border-radius:14px;background:var(--surface);border:1px solid var(--line);text-decoration:none;color:var(--ink);font-weight:700;font-size:1rem;transition:transform .18s,box-shadow .18s,border-color .18s;}
.ogs-fn-link:hover{transform:translateY(-2px);box-shadow:var(--shadow-s);border-color:var(--line-2);}
.ogs-fn-link em{font-style:normal;color:var(--cyan);font-weight:700;}
@media(max-width:900px){.ogs-fn-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:560px){.ogs-fn-grid{grid-template-columns:1fr;}}