/* Gőzöm sincs design kit 0.1.61 – GENERÁLT FÁJL (tools/build-wp-plugin.py), ne szerkeszd. Forrás: site/assets/css/gs-kit.css */
body.gs .e-con:where(.e-atomic-element) { width: auto; height: auto; min-height: 0; max-width: none; margin: 0; padding-inline: 0; position: static; overflow: visible; border-radius: 0; z-index: auto; }
body.gs .e-div-block-base { padding: 0; min-width: 0; }
body.gs .e-con:where(.e-atomic-element)::before { inset: auto; width: auto; height: auto; transition: none; }
body.gs .e-heading-base { margin: 0; }
body.gs .e-paragraph-base:where(p) { margin: 0 0 1em; }
body.gs :where(.gs-t-figcaption, .gs-t-li, .gs-t-label, .gs-t-legend).e-paragraph-base { margin: 0; }
body.gs .elementor-location-header:has(.site-header) { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 50; }
body.gs .elementor-location-header .site-header { position: relative; }
body.gs :where(.e-paragraph-base) > :is(ul, ol):where(:only-child) { display: contents; }
body.gs :where(span.e-paragraph-base:has(> :is(ul, ol):only-child)) { display: block; }
body.gs .e-accordion-item-header-base, body.gs .e-accordion-item-content-base { padding: 0; min-width: 0; }
body.gs :where(.e-con[class*="gs-icon--"]):has(> svg:only-child) { flex: none; display: flex; }
body.gs .faq-body :where(.e-paragraph-base) > ul { display: block; }
body.gs .ty-visual > .elementor-widget-shortcode { grid-area: 1 / 1; justify-self: end; align-self: start; width: min(340px, 66cqw); margin-top: calc(var(--bw) * 735 / 520 * .8); z-index: 1; }
body.gs .ty-visual > .elementor-widget-shortcode .receipt { width: auto; margin: 0; }
@media (max-width: 640px) {
body.gs .ty-visual > .elementor-widget-shortcode { width: min(320px, 84cqw); margin-top: calc(var(--bw) * 735 / 520 * .86); }
}
body.gs .ty-visual > .gs-sc-slot, body.gs .ty-visual > .gs-sc-slot :is(.elementor-widget-shortcode, .elementor-widget-container, .elementor-shortcode) { display: contents; }
body.gs .ty-visual > .gs-sc-slot .receipt { grid-area: 1 / 1; }
body.gs .formats > .elementor-widget-shortcode { grid-column: 1 / -1; }
body.gs .formats > .elementor-widget-shortcode:not(:has(.format-bonus)) { display: none; }
body.gs :where(.e-con, .e-div-block-base):has(> .elementor-widget-shortcode .site-header) { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 50; }
body.gs .site-header, body.gs .site-footer { max-width: none; width: auto; margin-inline: 0; }
body.gs .site-header, body.gs .site-footer { padding-inline: 0; }
body.gs .site-header { padding-block: 0; }
body.gs a:where(:not([class])) { text-decoration: underline; }
body.gs .gs-doodle-slot { display: contents; }
@font-face { font-family: "Bobby Jones"; src: url("../fonts/bobby-jones-hu.woff2?v=3") format("woff2"); font-display: swap; }
@font-face { font-family: "Galano Grotesque"; src: url("../fonts/galano-regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Galano Grotesque"; src: url("../fonts/galano-semibold.woff2") format("woff2"); font-weight: 600 800; font-display: swap; }
@font-face { font-family: "Caveat"; src: url("../fonts/caveat-latin-ext.woff2") format("woff2"); font-weight: 500 700; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Caveat"; src: url("../fonts/caveat-latin.woff2") format("woff2"); font-weight: 500 700; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root {
  --paper: #F7F6F4;       
  --paper-2: #EFEFEC;     
  --white: #FFFFFF;       
  --ink: #141618;         
  --ink-soft: #3A3F4B;    
  --purple-deep: #381C77; 
  --purple: #4C298D;      
  --purple-mid: #6149A0;  
  --lilac: #9573D1;       
  --lilac-soft: #C9B8EC;  
  --lilac-pale: #EDE6FA;  
  --lilac-mist: #CFC3EA;  
  --teal-light: #A3E3F1;  
  --teal: #52BFD0;        
  --teal-deep: #0D91AA;   
  --petrol: #0A7292;      
  --yellow: #FBD32D;      
  --yellow-2: #FADA4F;    
  --note: #F9F2C8;        
  --red: #E0352B;         
  --chart-1: var(--purple-mid); 
  --chart-2: var(--teal-deep);  
  --chart-3: #D99A00;     
  --chart-4: var(--lilac);      
  --chart-muted: #B7B4AE; 
  --ok: #2E8540;          

  --f-logo: "Bobby Jones", "Arial Rounded MT Bold", sans-serif;  
  --f-label: "Galano Grotesque", "Montserrat", system-ui, sans-serif; 
  --f-sans: "Galano Grotesque", "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif; 
  --f-hand: "Caveat", "Comic Sans MS", cursive;                 

  --fs-hero: clamp(38px, 4.3vw, 62px);  
  --fs-h2: clamp(30px, 3.6vw, 50px);    
  --fs-h3: clamp(20px, 1.6vw, 23px);    
  --fs-lead: clamp(17px, 1.25vw, 19.5px); 
  --fs-body: 17px;                       
  --fs-hand-lg: clamp(28px, 2.6vw, 38px); 

  --container: 1200px;                    
  --gutter: clamp(20px, 4vw, 40px);       
  --section-y: clamp(88px, 11vw, 160px);  
  --torn-h: 30px;                         
  --radius: 18px;                         
  --shadow-note: 0 1px 1px color-mix(in srgb, var(--ink) 6%, transparent), 0 14px 28px -12px color-mix(in srgb, var(--ink) 28%, transparent); 
  --shadow-card: 0 1px 2px color-mix(in srgb, var(--ink) 4%, transparent), 0 18px 40px -22px color-mix(in srgb, var(--ink) 25%, transparent); 
  --shadow-btn: 0 3px 0 color-mix(in srgb, var(--ink) 90%, transparent), 0 14px 26px -12px color-mix(in srgb, var(--ink) 45%, transparent);    
  --ease: cubic-bezier(.2,.75,.25,1);     

  --book-ry: -34deg;                      
  --book-rx: 2deg;                        
  --book-depth: 52px;                     
}
body.gs *, body.gs *::before, body.gs *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; }
body.gs {
  margin: 0;
  font-family: var(--f-sans);
  font-size: var(--fs-body);
  line-height: 1.65;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.gs img { max-width: 100%; height: auto; display: block; }
body.gs a { color: inherit; }
body.gs p { margin: 0 0 1em; }
body.gs strong { font-weight: 600; }
body.gs h1, body.gs h2, body.gs h3 { margin: 0; font-weight: 600; }
body.gs ul, body.gs ol { margin: 0; padding: 0; list-style: none; }
body.gs button { font: inherit; cursor: pointer; }
body.gs .nowrap { white-space: nowrap; }
body.gs .visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (min-width: 641px) {
body.gs .nowrap-md { white-space: nowrap; }
}
body.gs .center { text-align: center; }
body.gs .container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
body.gs .section { padding-block: var(--section-y); position: relative; }
body.gs .skip { position: absolute; left: -9999px; top: 8px; z-index: 100; background: var(--yellow); padding: 10px 16px; border-radius: 99px; font-weight: 600; }
body.gs .skip:focus { left: 12px; }
body.gs :focus-visible { outline: 3px solid var(--purple); outline-offset: 3px; border-radius: 6px; }
body.gs .paper { background-color: var(--paper); }
body.gs .paper::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45  0 0 0 0 .42  0 0 0 0 .4  0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body.gs .paper > .container { position: relative; }
body.gs .paper-crumpled { background: var(--paper) url("../img/paper-crumpled.webp") center / cover; }
body.gs .paper-strong { background-color: color-mix(in srgb, var(--paper-2) 92%, var(--ink-soft)); }
body.gs .paper-strong::before { opacity: 1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .38  0 0 0 0 .36  0 0 0 0 .34  0 0 0 .3 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
body.gs .torn-top, body.gs .torn-bottom { position: relative; z-index: 1; }
body.gs .torn-top { -webkit-mask: url("../img/torn-top.svg") top / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 calc(var(--torn-h) - 1px) / 100% 100% no-repeat;
            mask: url("../img/torn-top.svg") top / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 calc(var(--torn-h) - 1px) / 100% 100% no-repeat;
            margin-top: calc(var(--torn-h) * -1 + 2px); padding-top: calc(var(--torn-h)); }
body.gs .torn-bottom { -webkit-mask: url("../img/torn-bottom.svg") bottom / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 0 / 100% calc(100% - var(--torn-h) + 1px) no-repeat;
               mask: url("../img/torn-bottom.svg") bottom / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 0 / 100% calc(100% - var(--torn-h) + 1px) no-repeat;
               margin-bottom: calc(var(--torn-h) * -1 + 2px); padding-bottom: var(--torn-h); }
body.gs .torn-top.torn-bottom {
  -webkit-mask: url("../img/torn-top.svg") top / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 calc(var(--torn-h) - 1px) / 100% calc(100% - var(--torn-h) * 2 + 2px) no-repeat, url("../img/torn-bottom.svg") bottom / 100% var(--torn-h) no-repeat;
          mask: url("../img/torn-top.svg") top / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 calc(var(--torn-h) - 1px) / 100% calc(100% - var(--torn-h) * 2 + 2px) no-repeat, url("../img/torn-bottom.svg") bottom / 100% var(--torn-h) no-repeat;
}
body.gs .h-hero { font-size: var(--fs-hero); line-height: 1.04; letter-spacing: -.025em; font-weight: 700; }
body.gs .h2 { font-size: var(--fs-h2); line-height: 1.1; letter-spacing: -.02em; font-weight: 700; margin-bottom: clamp(40px, 5vw, 72px); max-width: 22ch; }
body.gs .h2.center { margin-inline: auto; max-width: 24ch; }
body.gs .h2-light { color: var(--white); }
body.gs .h3 { font-size: var(--fs-h3); line-height: 1.25; margin-bottom: .55em; font-weight: 700; }
body.gs .lead { font-size: var(--fs-lead); line-height: 1.6; }
body.gs .hand { font-family: var(--f-hand); font-weight: 700; line-height: 1.15; }
body.gs .hand-lg { font-size: var(--fs-hand-lg); color: var(--purple); }
body.gs .eyebrow { font-family: var(--f-label); font-weight: 700; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); margin-bottom: 14px; }
body.gs .h-hero, body.gs .h2, body.gs .h3, body.gs .parent-q, body.gs .parent-a, body.gs .parent-title > span, body.gs .brush-kicker, body.gs .brush-text { -webkit-text-stroke: .018em currentColor; paint-order: stroke fill; }
body.gs .h3 { -webkit-text-stroke-width: .012em; }
body.gs :is(.h-hero, .h2, .h3) u { text-decoration: none; }
body.gs .mark, body.gs :is(.h-hero, .h2, .h3):not(.gs-u-line, .gs-u-hl) u { position: relative; white-space: nowrap; z-index: 0; }
body.gs .mark::before, body.gs :is(.h-hero, .h2, .h3):not(.gs-u-line, .gs-u-hl) u::before {
  content: ""; position: absolute; z-index: -1; left: -.12em; right: -.12em; bottom: .02em; height: .5em;
  background: var(--yellow); border-radius: .3em .5em .35em .6em / .5em .35em .6em .3em;
  transform: rotate(-1.2deg) scaleX(0); transform-origin: left center;
  transition: transform .9s var(--ease) .35s;
}
body.gs .is-in .mark::before, body.gs .mark.is-in::before, body.gs :is([data-reveal], .gs-reveal).is-in .mark::before, body.gs :is(.h-hero, .h2, .h3).is-in:not(.gs-u-line, .gs-u-hl) u::before, body.gs .is-in :is(.h-hero, .h2, .h3):not(.gs-u-line, .gs-u-hl) u::before { transform: rotate(-1.2deg) scaleX(1); }
body.gs .h-hero .mark::before, body.gs .h-hero:not(.gs-u-line, .gs-u-hl) u::before { height: .62em; bottom: -.02em; }
body.gs .mark-wrap { position: relative; display: inline-block; }
body.gs .hl-under, body.gs .gs-u-hl u { position: relative; color: var(--yellow); white-space: nowrap; }
body.gs .hl-under .doodle, body.gs .gs-u-hl u .doodle { left: -2%; bottom: -.2em; width: 104%; height: .3em; color: var(--yellow); }
body.gs .hl-under .doodle path, body.gs .gs-u-hl u .doodle path { stroke-width: 4px; vector-effect: non-scaling-stroke; }
body.gs .hl-under .doodle path + path, body.gs .gs-u-hl u .doodle path + path { transition-delay: .8s; }
body.gs .underline, body.gs .gs-u-line u { background: linear-gradient(var(--yellow), var(--yellow)) left 92% / 100% .22em no-repeat; padding-bottom: .05em; }
body.gs .doodle { position: absolute; pointer-events: none; overflow: visible; }
body.gs .doodle path { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.3s var(--ease) .5s; }
body.gs .is-in .doodle path, body.gs .doodle.is-in path { stroke-dashoffset: 0; }
body.gs .btn {
  --bg: var(--yellow); --fg: var(--ink);
  display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  padding: 16px 18px 16px 28px; border-radius: 999px; border: 0;
  background: var(--bg); color: var(--fg); text-decoration: none;
  font-family: var(--f-sans); font-weight: 700; font-size: 16.5px; line-height: 1.2; letter-spacing: -.005em;
  -webkit-text-stroke: .018em currentColor; paint-order: stroke fill; 
  box-shadow: var(--shadow-btn);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background-color .25s;
}
body.gs .btn:hover { transform: translateY(-2px); box-shadow: 0 5px 0 color-mix(in srgb, var(--ink) 90%, transparent), 0 20px 30px -14px color-mix(in srgb, var(--ink) 50%, transparent); }
body.gs .btn:active { transform: translateY(1px); box-shadow: 0 1px 0 color-mix(in srgb, var(--ink) 90%, transparent), 0 8px 16px -10px color-mix(in srgb, var(--ink) 45%, transparent); }
body.gs .btn-ico { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 50%; border: 2px solid currentColor; font-size: 18px; font-weight: 700; transition: transform .3s var(--ease); }
body.gs .btn-ico svg { width: 18px; height: 18px; }
body.gs [class*="gs-icon--"] > svg { display: block; width: 100%; height: 100%; }
body.gs .btn:hover .btn-ico { transform: translateX(4px); }
body.gs .gs-arrow::after { content: ""; width: 34px; height: 34px; flex: none; background: currentColor; -webkit-mask: url("../img/btn-arrow.svg") center / 100% no-repeat; mask: url("../img/btn-arrow.svg") center / 100% no-repeat; transition: transform .3s var(--ease); }
body.gs .btn-sm.gs-arrow::after { width: 26px; height: 26px; -webkit-mask-image: url("../img/btn-arrow-sm.svg"); mask-image: url("../img/btn-arrow-sm.svg"); }
body.gs .btn.gs-arrow:hover::after { transform: translateX(4px); }
body.gs .gs-raquo::after { content: "»"; width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 50%; border: 2px solid currentColor; font-size: 18px; font-weight: 700; line-height: 1; transition: transform .3s var(--ease); }
body.gs .btn.gs-raquo:hover::after { transform: translateX(4px); }
body.gs .gs-plus::after { content: ""; width: 34px; height: 34px; flex: none; background: currentColor; -webkit-mask: url("../img/btn-plus.svg") center / 100% no-repeat; mask: url("../img/btn-plus.svg") center / 100% no-repeat; transition: transform .3s var(--ease); }
body.gs .gs-plus[aria-expanded="true"]::after { transform: rotate(45deg); }
body.gs .btn-lg { font-size: clamp(16.5px, 1.25vw, 19px); padding: 18px 20px 18px 32px; }
body.gs .btn-sm { font-size: 14.5px; padding: 10px 12px 10px 20px; gap: 10px; box-shadow: 0 2px 0 color-mix(in srgb, var(--ink) 90%, transparent); }
body.gs .btn-sm .btn-ico { width: 26px; height: 26px; }
body.gs .btn-sm .btn-ico svg { width: 14px; height: 14px; }
body.gs .btn-black { --bg: var(--ink); --fg: var(--white); box-shadow: 0 14px 26px -12px color-mix(in srgb, var(--ink) 55%, transparent); }
body.gs .btn-black:hover { box-shadow: 0 20px 30px -14px color-mix(in srgb, var(--ink) 60%, transparent); }
body.gs .btn-block { width: 100%; }
body.gs .note {
  position: relative; background: var(--note); box-shadow: var(--shadow-note);
  transform: rotate(var(--r, 0deg));
  background-image: linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,0) 30%), linear-gradient(0deg, rgba(180,160,90,.08), transparent 40%);
}
body.gs .tape {
  position: absolute; top: -14px; left: 50%; width: 84px; height: 26px; transform: translateX(-50%) rotate(-3deg);
  background: rgba(255,255,255,.55); backdrop-filter: blur(1px);
  box-shadow: 0 1px 2px rgba(0,0,0,.08);
  -webkit-mask: linear-gradient(90deg, transparent 0 3px, #000 3px calc(100% - 3px), transparent 0) , none;
  clip-path: polygon(2% 10%, 98% 0, 100% 90%, 0 100%);
}
body.gs .site-header { position: sticky; top: 0; z-index: 50; background: color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px); transition: box-shadow .3s; }
body.gs .site-header.is-scrolled { box-shadow: 0 1px 0 color-mix(in srgb, var(--ink) 8%, transparent), 0 10px 30px -18px color-mix(in srgb, var(--ink) 25%, transparent); }
body.gs .header-inner { display: flex; align-items: center; gap: 32px; height: 82px; transition: height .3s var(--ease); }
body.gs .is-scrolled .header-inner { height: 68px; }
body.gs .logo { display: flex; align-items: center; gap: 14px; text-decoration: none; flex: none; }
body.gs .logo-word { font-family: var(--f-logo); font-size: 25px; line-height: .86; text-transform: uppercase; color: var(--ink); letter-spacing: .01em; }
body.gs .logo-tag { font-family: var(--f-label); font-weight: 700; font-size: 8.5px; line-height: 1.5; letter-spacing: .06em; text-transform: uppercase; color: var(--purple); padding-left: 14px; border-left: 1.5px solid color-mix(in srgb, var(--ink) 15%, transparent); }
body.gs .main-nav { margin-left: auto; }
body.gs .main-nav ul { display: flex; gap: clamp(18px, 2.4vw, 36px); }
body.gs .main-nav a { text-decoration: none; font-size: 15px; font-weight: 600; color: var(--ink-soft); position: relative; padding-block: 6px; }
body.gs .main-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--purple); transform: scaleX(0); transform-origin: right; transition: transform .3s var(--ease); }
body.gs .main-nav a:hover { color: var(--ink); }
body.gs .main-nav a:hover::after { transform: scaleX(1); transform-origin: left; }
body.gs .main-nav a[aria-current="page"] { color: var(--ink); }
body.gs .main-nav a[aria-current="page"]::after { transform: scaleX(1); }
body.gs .mobile-nav a[aria-current="page"] { color: var(--purple); }
body.gs .nav-toggle { display: none; margin-left: auto; width: 44px; height: 44px; border: 0; background: transparent; position: relative; }
body.gs .nav-toggle span { position: absolute; left: 11px; right: 11px; height: 2.5px; border-radius: 2px; background: var(--ink); transition: transform .3s var(--ease); }
body.gs .nav-toggle span:first-child { top: 17px; }
body.gs .nav-toggle span:last-child { top: 25px; }
body.gs .nav-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
body.gs .nav-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
body.gs .mobile-nav { display: flex; flex-direction: column; gap: 4px; padding: 8px var(--gutter) 24px; }
body.gs .mobile-nav[hidden] { display: none; }
body.gs .mobile-nav a:not(.btn) { padding: 12px 0; font-weight: 600; text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent); }
body.gs .mobile-nav .btn { margin-top: 16px; }
@media (max-width: 1100px) {
body.gs .main-nav { display: none; }
body.gs .nav-toggle { display: block; margin-left: 8px; }
body.gs .header-cta { margin-left: auto; }
}
@media (max-width: 640px) {
body.gs .header-inner { height: 68px; gap: 12px; }
body.gs .logo-tag, body.gs .header-cta { display: none; }
body.gs .nav-toggle { margin-left: auto; }
}
body.gs .brush { position: relative; padding: clamp(34px, 3.5vw, 52px) clamp(36px, 4.5vw, 64px); color: var(--white); isolation: isolate; }
body.gs .brush::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../img/brush.svg") center / 100% 100% no-repeat; transform-origin: left; transform: scaleX(0) rotate(-1.5deg); transition: transform 1s var(--ease) .1s; }
body.gs .brush.is-in::before { transform: scaleX(1) rotate(-1.5deg); }
body.gs .brush-kicker { font-weight: 700; font-size: clamp(26px, 2.6vw, 36px); line-height: 1.1; margin: 0 0 6px; color: var(--yellow); }
body.gs .brush-text { font-weight: 700; font-size: clamp(22px, 2.2vw, 31px); line-height: 1.22; margin: 0; letter-spacing: -.01em; }
body.gs .hero-bg { position: absolute; inset: 0; z-index: -1; background: var(--teal) url("../img/lockers-bg.webp") center 30% / cover no-repeat; }
body.gs .hero-bg::after { content: ""; position: absolute; inset: 0; background:
    linear-gradient(90deg, color-mix(in srgb, var(--teal-deep) 34%, transparent) 0%, color-mix(in srgb, var(--teal) 26%, transparent) 30%, transparent 46%),
    linear-gradient(90deg, transparent 0%, transparent 30%, color-mix(in srgb, color-mix(in srgb, var(--teal-light) 45%, var(--white)) 86%, transparent) 48%, color-mix(in srgb, color-mix(in srgb, var(--teal-light) 25%, var(--white)) 92%, transparent) 100%),
    linear-gradient(0deg, color-mix(in srgb, var(--purple-deep) 25%, transparent), transparent 35%); }
body.gs .smoke { position: absolute; border-radius: 50%; filter: blur(50px); opacity: .55; mix-blend-mode: screen; will-change: transform; }
body.gs .smoke-1 { width: 55vw; height: 30vw; left: -10vw; bottom: -12vw; background: radial-gradient(closest-side, color-mix(in srgb, var(--lilac) 90%, transparent), color-mix(in srgb, var(--purple-mid) 0%, transparent)); animation: drift 22s ease-in-out infinite alternate; }
body.gs .smoke-2 { width: 40vw; height: 26vw; left: 25vw; bottom: -14vw; background: radial-gradient(closest-side, color-mix(in srgb, var(--lilac-soft) 80%, transparent), color-mix(in srgb, var(--lilac) 0%, transparent)); animation: drift 28s ease-in-out -8s infinite alternate-reverse; }
@keyframes drift { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(8vw,-3vw,0) scale(1.15); } }
body.gs .book-stage { position: relative; perspective: 1800px; width: min(400px, 78%); }
body.gs .book3d { --dz: calc(var(--book-depth) / 2); position: relative; transform-style: preserve-3d; transform: rotateY(var(--ry, var(--book-ry))) rotateX(var(--rx, var(--book-rx))); transition: transform .6s var(--ease); animation: float 6s ease-in-out infinite; }
body.gs .book3d > img { position: relative; transform: translateZ(var(--dz)); border-radius: 2px 6px 6px 2px; }
body.gs .book3d::before { 
  content: ""; position: absolute; top: 1%; bottom: 1%; right: 0; width: var(--book-depth); transform-origin: right center;
  transform: translateZ(var(--dz)) rotateY(-90deg);
  
  background:
    linear-gradient(90deg, var(--purple-deep) 0 3px, transparent 3px calc(100% - 2px), var(--purple) calc(100% - 2px)),
    linear-gradient(90deg, color-mix(in srgb, var(--ink) 20%, transparent), transparent 45%, transparent 82%, color-mix(in srgb, var(--ink) 8%, transparent)),
    linear-gradient(0deg, color-mix(in srgb, var(--ink) 12%, transparent), transparent 10%, transparent 90%, color-mix(in srgb, var(--ink) 8%, transparent)),
    repeating-linear-gradient(90deg, var(--white) 0 1.5px, color-mix(in srgb, var(--paper-2) 82%, var(--ink-soft)) 1.5px 2.5px);
}
body.gs .book-gloss { position: absolute; inset: 0; transform: translateZ(calc(var(--dz) + .5px)); border-radius: 2px 6px 6px 2px; pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,.3) 0, rgba(0,0,0,.3) 1.4%, rgba(255,255,255,.16) 3.2%, transparent 6.5%),
              linear-gradient(112deg, transparent 38%, rgba(255,255,255,.16) 49%, transparent 60%); }
body.gs .book-shadow { position: absolute; left: 6%; right: -4%; bottom: -26px; height: 40px; background: radial-gradient(closest-side, color-mix(in srgb, var(--ink) 45%, transparent), transparent); filter: blur(6px); animation: shadow 6s ease-in-out infinite; z-index: -1; }
@keyframes float { 0%,100% { translate: 0 0; } 50% { translate: 0 -14px; } }
@keyframes shadow { 0%,100% { transform: scaleX(1); opacity: .9; } 50% { transform: scaleX(.88); opacity: .6; } }
body.gs .card { background: var(--white); border-radius: var(--radius); padding: clamp(36px, 3.4vw, 52px) clamp(28px, 2.8vw, 42px); box-shadow: var(--shadow-card); text-align: center; transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
body.gs .card:hover { transform: translateY(-6px); box-shadow: 0 30px 50px -28px color-mix(in srgb, var(--purple-deep) 45%, transparent); }
body.gs .card-ico { width: 64px; height: 64px; color: var(--ink); margin: 0 auto 26px; display: block; }
body.gs .card p { color: var(--ink-soft); margin: 0; }
body.gs .marquee { display: flex; flex-direction: column; gap: 18px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
body.gs .marquee-row { display: flex; gap: 16px; width: max-content; animation: marquee var(--dur, 60s) linear infinite; }
body.gs .marquee-row.reverse { animation-direction: reverse; --dur: 70s; }
body.gs .marquee:hover .marquee-row { animation-play-state: paused; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
body.gs .pill { flex: none; padding: 13px 26px; border-radius: 999px; font-weight: 600; font-size: 16px; white-space: nowrap; border: 2px solid var(--ink); }
body.gs .pill-y { background: var(--yellow); }
body.gs .pill-p { background: var(--purple); color: var(--white); border-color: var(--purple); }
body.gs .pill-o { background: var(--white); color: var(--purple); border-color: var(--purple); }
body.gs .stories { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(26px, 3vw, 44px); }
body.gs .story { position: relative; margin: 0; background: var(--white); padding: 38px 32px 34px; border-radius: 4px; box-shadow: var(--shadow-card); transform: rotate(var(--r, 0deg)); font-size: var(--fs-body); line-height: 1.65; color: var(--ink); counter-increment: story; transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
body.gs .story::before { content: "Történet #" counter(story, decimal-leading-zero); display: block; font-family: var(--f-hand); font-weight: 700; font-size: 22px; color: var(--purple); margin-bottom: 10px; line-height: 1; }
body.gs .story::after { content: ""; position: absolute; top: -11px; left: 50%; width: 70px; height: 22px; transform: translateX(-50%) rotate(2deg); background: color-mix(in srgb, var(--yellow) 55%, transparent); clip-path: polygon(2% 10%, 98% 0, 100% 90%, 0 100%); }
body.gs .story:nth-child(3n+2)::after { background: color-mix(in srgb, var(--lilac) 35%, transparent); transform: translateX(-50%) rotate(-3deg); }
body.gs .story:nth-child(3n)::after { background: color-mix(in srgb, var(--teal) 40%, transparent); }
body.gs .story:hover { transform: rotate(0) translateY(-6px); box-shadow: 0 28px 44px -26px color-mix(in srgb, var(--ink) 40%, transparent); }
body.gs .stories { counter-reset: story; }
body.gs .stories.is-collapsed .story:nth-child(n+7) { display: none; }
body.gs .stories-more { margin-top: clamp(44px, 5vw, 64px); }
body.gs .form { display: grid; gap: 14px; }
body.gs .form fieldset { border: 0; margin: 0 0 6px; padding: 0; min-width: 0; display: grid; gap: 12px; }
body.gs .form legend { padding: 0; margin-bottom: 10px; font-family: var(--f-label); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); }
body.gs .form label { display: grid; gap: 6px; align-content: start; font-weight: 600; font-size: 14px; }
body.gs .form .opt, body.gs .form small { font-weight: 400; color: var(--ink-soft); }
body.gs .form small { font-size: 13px; margin-top: -1px; }
body.gs .form input:not([type="checkbox"]):not([type="radio"]), body.gs .form textarea { width: 100%; padding: 10px 14px; border-radius: 10px; border: 1.5px solid color-mix(in srgb, var(--ink) 22%, transparent); background: var(--paper); font: inherit; font-size: 16px; line-height: 1.3; font-weight: 400; color: var(--ink); transition: border-color .2s, box-shadow .2s, background-color .2s; }
body.gs .form textarea { resize: vertical; min-height: 64px; line-height: 1.5; }
body.gs .form input:focus, body.gs .form textarea:focus { outline: none; border-color: var(--purple); background: var(--white); box-shadow: 0 0 0 4px color-mix(in srgb, var(--purple) 12%, transparent); }
body.gs .form input::placeholder { color: color-mix(in srgb, var(--ink) 35%, transparent); }
body.gs .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
body.gs .form-row-zip { grid-template-columns: 8rem 1fr; }
body.gs .form-row[hidden] { display: none; }
body.gs .form .consent, body.gs .form .check { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; font-size: 14px; line-height: 1.5; color: var(--ink-soft); }
body.gs .consent input, body.gs .check input { width: 18px; height: 18px; accent-color: var(--purple); margin-top: 3px; flex: none; }
body.gs .form .btn { margin-top: 8px; }
body.gs .coupon { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; }
body.gs .coupon .btn { margin: 0; padding: 11px 20px; font-size: 15px; }
body.gs .form-note { margin: -6px 0 0; min-height: 0; font-size: 14px; font-weight: 600; color: var(--purple); }
body.gs .form-note:empty { display: none; }
body.gs .order-summary { display: grid; grid-template-columns: 112px 1fr; gap: 6px 22px; align-items: center; margin: 14px 0 30px; padding: 18px 22px 18px 20px; border-radius: 3px; background: var(--yellow-2) linear-gradient(180deg, color-mix(in srgb, var(--white) 45%, transparent), transparent 30%); box-shadow: var(--shadow-note); transform: rotate(1.2deg); }
body.gs .order-cover { grid-row: span 2; width: 112px; margin: -34px 0 -8px -6px; border-radius: 2px 4px 4px 2px; transform: rotate(-5deg); box-shadow: 0 18px 30px -12px color-mix(in srgb, var(--ink) 55%, transparent), var(--shadow-card); }
body.gs .order-title { margin: 0 0 4px; font-weight: 700; font-size: 15px; line-height: 1.3; }
body.gs .order-meta { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13.5px; color: var(--ink-soft); }
body.gs .order-meta svg, body.gs .pay-note svg { width: 20px; height: 20px; flex: none; color: var(--purple); }
body.gs .order-price { margin: 0; align-self: start; font-family: var(--f-logo); font-size: 30px; line-height: 1; white-space: nowrap; color: var(--purple); }
@media (max-width: 640px) {
body.gs .order-summary { grid-template-columns: 88px 1fr; gap: 6px 16px; }
body.gs .order-cover { width: 88px; margin-top: -26px; }
}
body.gs .form-total { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; padding: 16px 0; border-block: 1.5px dashed color-mix(in srgb, var(--ink) 18%, transparent); }
body.gs .pay-note { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 14px; color: var(--ink-soft); }
body.gs .total { display: flex; align-items: baseline; gap: 12px; margin: 0; }
body.gs .total > span { font-size: 14px; font-weight: 600; color: var(--ink-soft); }
body.gs .total strong { font-family: var(--f-logo); font-weight: 400; font-size: 34px; line-height: 1; }
body.gs .order-price .cur, body.gs .total .cur, body.gs .order-price em { font-style: normal; font-family: var(--f-sans); font-weight: 700; font-size: .55em; letter-spacing: 0; }
body.gs .form-msg { margin: 0; min-height: 1.4em; font-weight: 600; color: var(--purple); }
body.gs .form-msg.is-error { color: var(--red); }
body.gs .form-steps { counter-reset: step; }
body.gs .form-steps fieldset { counter-increment: step; }
body.gs .form-steps legend { display: flex; align-items: center; gap: 12px; }
body.gs .form-steps legend::before { content: counter(step); width: 30px; height: 30px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--purple-mid); color: var(--white); font-family: var(--f-sans); font-weight: 700; font-size: 15px; letter-spacing: 0; }
body.gs :is(.h-hero, .h2, .h3, .gs-s-nem) s { text-decoration: none; }
body.gs .nem, body.gs :is(.h-hero, .h2, .h3, .gs-s-nem) s { color: var(--red); position: relative; }
body.gs .nem::after, body.gs :is(.h-hero, .h2, .h3, .gs-s-nem) s::after { content: ""; position: absolute; left: 0; right: 0; bottom: -.08em; height: .14em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 6'%3E%3Cpath d='M0 3 Q5 0 10 3 T20 3 T30 3 T40 3' stroke='%23E0352B' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") repeat-x left / .6em 100%; }
body.gs .form-hand { position: relative; justify-self: end; margin: 10px 6px -8px 0; font-size: clamp(24px, 2vw, 28px); color: var(--purple); transform: rotate(-3deg); }
body.gs .doodle-arrow-form { width: 50px; left: -58px; top: 14px; color: var(--purple); }
@media (max-width: 640px) {
body.gs .form-hand { justify-self: center; margin-right: 0; padding-left: 40px; }
body.gs .doodle-arrow-form { left: -14px; }
}
body.gs .sheet { position: relative; background: var(--white); border-radius: 4px; padding: clamp(36px, 3.4vw, 50px) clamp(22px, 3vw, 44px) clamp(28px, 3vw, 40px); transform: rotate(var(--r, 0deg));
  box-shadow: 0 1px 2px color-mix(in srgb, var(--ink) 6%, transparent), 0 30px 60px -30px color-mix(in srgb, var(--ink) 38%, transparent); }
body.gs .sheet > .tape { background: color-mix(in srgb, var(--teal) 42%, transparent); }
body.gs .sheet > .tape-r { background: color-mix(in srgb, var(--lilac) 38%, transparent); }
body.gs .toc { display: grid; gap: 2px; }
body.gs .toc li { display: grid; grid-template-columns: 2.6em 1fr auto; align-items: baseline; gap: 10px; padding: 7px 0; font-size: 15.5px; line-height: 1.4; }
body.gs .toc-t { display: flex; align-items: baseline; gap: 8px; }
body.gs .toc-t::after { content: ""; flex: 1; min-width: 24px; border-bottom: 2px dotted color-mix(in srgb, var(--ink) 22%, transparent); transform: translateY(-4px); }
body.gs .toc-p { font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink-soft); }
body.gs .toc-ch { margin-top: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .01em; }
body.gs .toc-ch:first-child { margin-top: 0; }
body.gs .toc-ch .toc-n { font-family: var(--f-logo); font-weight: 400; font-size: 1.25em; line-height: 1; color: var(--purple); }
body.gs .toc-hiba { flex: none; padding: 2px 9px; border-radius: 999px; background: var(--lilac-pale); color: var(--purple); font-size: 12.5px; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
body.gs .toc-sub, body.gs .toc-sub2 { display: none !important; color: var(--ink-soft); font-size: 14.5px; }
body.gs .toc-sub2 .toc-t { padding-left: 1.4em; }
body.gs .toc.is-open :is(.toc-sub, .toc-sub2) { display: grid !important; }
body.gs .zoom { position: relative; display: block; cursor: zoom-in; }
body.gs .zoom-ico { position: absolute; right: 14px; bottom: 14px; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: var(--yellow); color: var(--ink); box-shadow: var(--shadow-btn); transition: transform .3s var(--ease); }
body.gs .zoom-ico svg { width: 24px; height: 24px; }
body.gs .zoom:hover .zoom-ico { transform: scale(1.08); }
body.gs .lightbox { max-width: min(92vw, 900px); max-height: 92vh; padding: 0; border: 0; border-radius: 6px; background: var(--white); box-shadow: 0 40px 80px -20px color-mix(in srgb, var(--ink) 60%, transparent); overflow: auto; }
body.gs .lightbox::backdrop { background: color-mix(in srgb, var(--purple-deep) 78%, transparent); backdrop-filter: blur(4px); }
body.gs .lightbox img { display: block; width: 100%; height: auto; }
body.gs .lightbox-close { position: sticky; top: 12px; float: right; margin: 12px 12px -58px 0; z-index: 1; width: 46px; height: 46px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--ink); color: var(--white); }
body.gs .lightbox-close svg { width: 22px; height: 22px; transform: rotate(45deg); }
body.gs .lightbox[open] { animation: lb-in .35s var(--ease); }
body.gs .lightbox-nav { position: fixed; top: 50%; z-index: 2; width: 52px; height: 52px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--yellow); color: var(--ink); box-shadow: var(--shadow-btn); transform: translateY(-50%); }
body.gs .lightbox-nav svg { width: 24px; height: 24px; pointer-events: none; }
body.gs .lightbox-prev { left: max(12px, calc(50vw - min(46vw, 450px) - 66px)); }
body.gs .lightbox-prev svg { transform: scaleX(-1); }
body.gs .lightbox-next { right: max(12px, calc(50vw - min(46vw, 450px) - 66px)); }
body.gs .lightbox-nav:disabled { opacity: .35; cursor: default; }
body.gs .lightbox-count { position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); margin: 0; padding: 4px 14px; border-radius: 99px; background: var(--ink); color: var(--white); font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
body.gs .flip-page-zoom { position: absolute; top: 10px; right: 10px; z-index: 3; width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--yellow); color: var(--ink); box-shadow: 0 6px 14px -6px color-mix(in srgb, var(--ink) 55%, transparent); opacity: .92; transition: transform .25s var(--ease), opacity .2s; }
body.gs .flip-page-zoom svg { width: 20px; height: 20px; pointer-events: none; }
body.gs .flip-page-zoom:hover { transform: scale(1.08); opacity: 1; }
@keyframes lb-in { from { opacity: 0; transform: translateY(16px) scale(.98); } }
body.gs .phone { position: relative; width: 132px; aspect-ratio: 9 / 19; padding: 7px; border-radius: 26px; background: var(--ink); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--white) 18%, transparent) inset, 0 30px 50px -20px color-mix(in srgb, var(--ink) 55%, transparent); }
body.gs .phone::before { content: ""; position: absolute; top: 13px; left: 50%; width: 34%; height: 11px; transform: translateX(-50%); border-radius: 99px; background: var(--ink); z-index: 1; }
body.gs .phone > img { width: 100%; height: 100%; object-fit: contain; border-radius: 20px; background: var(--purple-deep); padding: 28px 10px; }
body.gs .book-duo { position: relative; display: flex; justify-content: center; padding: 10px 40px 30px 0; }
body.gs .book-duo .book-stage { width: min(250px, 66%); }
body.gs .book-duo .phone { position: absolute; right: 0; bottom: -6px; transform: rotate(7deg); z-index: 2; }
@media (max-width: 640px) {
body.gs .book-duo .phone { width: 104px; right: 2%; }
}
body.gs .flipbook { position: relative; margin-inline: auto; }
body.gs .flipbook:not(.stf__parent) { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
body.gs .flipbook.stf__parent { filter: drop-shadow(0 30px 40px color-mix(in srgb, var(--ink) 28%, transparent)); }
body.gs .flipbook.stf__parent { transition: transform .7s var(--ease); }
body.gs .flipbook.is-closed { transform: translateX(-25%); }
body.gs .flip-page { background: var(--white); overflow: hidden; }
body.gs .flip-page:not(.stf__item) { position: relative; }
body.gs .flip-page > img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.gs .flip-end { background: var(--note); }
body.gs .flip-page::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
body.gs .stf__item.--left:not(.--hard)::after { background: linear-gradient(270deg, color-mix(in srgb, var(--ink) 18%, transparent), transparent 9%); }
body.gs .stf__item.--right:not(.--hard)::after { background: linear-gradient(90deg, color-mix(in srgb, var(--ink) 16%, transparent), transparent 8%); }
body.gs .flip-end-inner { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 12%; text-align: center; }
body.gs .flip-end-title { margin: 0; font-weight: 700; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.15; -webkit-text-stroke: .015em currentColor; paint-order: stroke fill; }
body.gs .flip-end-text { margin: 0 0 10px; font-family: var(--f-hand); font-weight: 700; font-size: clamp(22px, 2vw, 28px); line-height: 1.15; color: var(--purple); }
body.gs .flip-ctrl { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 30px; }
body.gs .flip-btn { width: 48px; height: 48px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--ink); color: var(--white); box-shadow: var(--shadow-btn); transition: transform .25s var(--ease), opacity .2s; }
body.gs .flip-btn, body.gs .flip-page-zoom, body.gs .lightbox-close, body.gs .lightbox-nav, body.gs .nav-toggle { padding: 0; }
body.gs .flip-btn svg { width: 22px; height: 22px; }
body.gs .flip-btn[data-flip="prev"] svg { transform: scaleX(-1); }
body.gs .flip-btn:hover:not(:disabled) { transform: translateY(-2px); }
body.gs .flip-btn:disabled { opacity: .3; cursor: default; }
body.gs .flip-zoom { background: var(--yellow); color: var(--ink); margin-left: 10px; }
body.gs .flip-count { min-width: 5.5em; text-align: center; font-weight: 700; font-variant-numeric: tabular-nums; }
body.gs .bump { display: block; position: relative; margin: 8px 0 6px; border: 3px dashed var(--purple); border-radius: 8px; background: var(--yellow-2) linear-gradient(180deg, color-mix(in srgb, var(--white) 40%, transparent), transparent 40%); cursor: pointer; overflow: hidden; transition: border-color .25s, box-shadow .25s, transform .25s var(--ease); }
body.gs .bump:hover { transform: translateY(-1px); }
body.gs .bump-tag { display: block; padding: 7px 16px; background: var(--purple); color: var(--white); font-family: var(--f-label); font-weight: 700; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
body.gs .bump-body { display: grid; grid-template-columns: 100px 1fr; gap: 16px; align-items: start; padding: 16px 18px 18px; }
body.gs .bump-cover { width: 78px; height: auto; border-radius: 2px 4px 4px 2px; transform: rotate(-4deg); box-shadow: 0 10px 18px -8px color-mix(in srgb, var(--ink) 55%, transparent); }
body.gs .bump-body .bump-cover { width: 100px; }
body.gs .bump-main { display: grid; gap: 8px; }
body.gs .bump-head { display: flex; align-items: center; gap: 10px; }
body.gs .form .bump-head input { width: 22px; height: 22px; flex: none; margin: 0; accent-color: var(--purple); cursor: pointer; }
body.gs .bump-title { font-weight: 700; font-size: 17px; line-height: 1.3; color: var(--ink); -webkit-text-stroke: .012em currentColor; paint-order: stroke fill; }
body.gs .bump-arrow { width: 34px; height: 20px; flex: none; fill: none; stroke: var(--purple); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; animation: bump-nod 2.4s var(--ease) infinite; }
@keyframes bump-nod { 0%, 60%, 100% { transform: translateX(0); } 75% { transform: translateX(6px); } 85% { transform: translateX(1px); } 92% { transform: translateX(4px); } }
body.gs .bump-price { display: flex; align-items: baseline; gap: 10px; }
body.gs .bump-price s, body.gs .bump-was { font-size: 14px; font-weight: 400; color: var(--ink-soft); text-decoration: line-through; }
body.gs .bump-price strong { font-family: var(--f-logo); font-weight: 400; font-size: 24px; line-height: 1; color: var(--purple); }
body.gs .bump-price .cur { font-family: var(--f-sans); font-weight: 700; font-size: .55em; }
body.gs .bump-text { font-size: 14.5px; line-height: 1.5; font-weight: 400; color: var(--ink-soft); }
body.gs .bump:has(input:checked) { border-style: solid; box-shadow: 0 0 0 4px color-mix(in srgb, var(--purple) 16%, transparent); }
body.gs .bump:has(input:checked) .bump-arrow { display: none; }
body.gs .bump:has(input:focus-visible) { outline: 3px solid var(--purple); outline-offset: 3px; }
@media (max-width: 640px) {
body.gs .bump-tag { font-size: 10px; padding: 7px 14px; }
body.gs .bump-body { grid-template-columns: 1fr 76px; gap: 10px 14px; padding: 14px; }
body.gs .bump-main { display: contents; }
body.gs .bump-head { grid-column: 1 / -1; grid-row: 1; gap: 10px; align-items: flex-start; }
body.gs .bump-head input { margin-top: 2px !important; }
body.gs .bump-price { grid-column: 1; grid-row: 2; align-self: center; flex-wrap: wrap; }
body.gs .bump-cover { grid-column: 2; grid-row: 2; transform: rotate(4deg); }
body.gs .bump-body .bump-cover { width: 76px; }
body.gs .bump-text { grid-column: 1 / -1; grid-row: 3; }
body.gs .bump-title { font-size: 16px; }
body.gs .bump-arrow { display: none; }
body.gs .bump:not(:has(input:checked)) .bump-head input { animation: bump-pulse 2.4s var(--ease) infinite; border-radius: 4px; }
}
@keyframes bump-pulse { 0%, 55%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--purple) 0%, transparent); } 75% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--purple) 28%, transparent); } }
body.gs .video-wrap { position: relative; transform: rotate(1.2deg); }
body.gs .video { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; padding: 0; border-radius: 16px; overflow: hidden; background: var(--ink); box-shadow: 0 40px 60px -32px color-mix(in srgb, var(--ink) 55%, transparent); }
body.gs .video img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease), filter .4s; filter: saturate(.9); }
body.gs .video:hover img { transform: scale(1.04); filter: saturate(1.05); }
body.gs .video iframe, body.gs .video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
body.gs .video video { object-fit: contain; background: var(--ink); }
body.gs .video-vertical { aspect-ratio: 9 / 16; }
body.gs .video-vertical iframe { left: 50%; width: 316.05%; transform: translateX(-50%); }
body.gs .video-allo iframe { left: 0; width: 100%; transform: none; }
body.gs .play { position: absolute; left: 50%; top: 50%; width: 86px; height: 86px; margin: -43px 0 0 -43px; border-radius: 50%; background: var(--yellow); color: var(--ink); display: grid; place-items: center; box-shadow: 0 0 0 0 color-mix(in srgb, var(--yellow) 60%, transparent); animation: gs-pulse 2.4s ease-out infinite; transition: transform .3s var(--ease); }
body.gs .play svg { width: 34px; height: 34px; margin-left: 4px; }
body.gs .video:hover .play { transform: scale(1.08); }
@keyframes gs-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--yellow) 60%, transparent); } 70%,100% { box-shadow: 0 0 0 26px color-mix(in srgb, var(--yellow) 0%, transparent); } }
body.gs .tape-l { left: 8%; top: -12px; transform: rotate(-8deg); z-index: 2; }
body.gs .tape-r { left: auto; right: 2%; top: -10px; transform: rotate(9deg); z-index: 2; }
body.gs .faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
body.gs .faq-head { position: sticky; top: 120px; }
@media (max-width: 900px) {
body.gs .faq-grid { grid-template-columns: 1fr; }
body.gs .faq-head { position: static; }
}
body.gs .faq-head .h2 { margin-bottom: 24px; }
body.gs .faq details { border-bottom: 1.5px solid color-mix(in srgb, var(--ink) 12%, transparent); }
body.gs .faq details:first-child { border-top: 1.5px solid color-mix(in srgb, var(--ink) 12%, transparent); }
body.gs .faq summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 26px 0; font-weight: 600; font-size: clamp(17px, 1.3vw, 19.5px); line-height: 1.35; transition: color .2s; }
body.gs .faq summary::-webkit-details-marker { display: none; }
body.gs .faq summary:hover { color: var(--purple); }
body.gs .faq-ico { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--white); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--ink) 12%, transparent); transition: transform .35s var(--ease), background-color .25s, color .25s; }
body.gs .faq-ico svg { width: 18px; height: 18px; }
body.gs .faq details[open] .faq-ico { transform: rotate(45deg); background: var(--yellow); box-shadow: none; }
body.gs .faq-body { overflow: hidden; color: var(--ink-soft); }
body.gs .faq-body > :last-child { margin-bottom: 0; padding-bottom: 30px; }
body.gs .faq-body ul { list-style: disc; padding-left: 1.3em; margin: 0 0 1em; }
body.gs .book-stage-sm { --book-depth: 38px; width: min(300px, 70%); }
body.gs .portrait-pop { --cut: 24cqw; position: relative; isolation: isolate; container-type: inline-size; width: 100%; }
body.gs .portrait-pop::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; aspect-ratio: 1; z-index: -1; border-radius: 50%; background: color-mix(in srgb, var(--lilac-soft) 55%, transparent); }
body.gs .portrait-pop img { display: block; width: 100%; height: auto;
  -webkit-mask: linear-gradient(#000 0 0) top / 100% var(--cut) no-repeat, radial-gradient(circle 50cqw at 50% calc(100% - 50cqw), #000 calc(50cqw - 1px), transparent 50cqw);
          mask: linear-gradient(#000 0 0) top / 100% var(--cut) no-repeat, radial-gradient(circle 50cqw at 50% calc(100% - 50cqw), #000 calc(50cqw - 1px), transparent 50cqw); }
body.gs .site-footer { background: var(--ink); color: rgba(255,255,255,.7); padding-block: 40px; font-size: 14px; }
body.gs .footer-inner { display: flex; align-items: center; flex-wrap: wrap; column-gap: 32px; row-gap: 18px; }
body.gs .footer-inner p { margin: 0; }
body.gs .footer-inner > .footer-logo { margin-right: auto; }
body.gs .footer-inner > p:last-child:not(:first-child) { flex: 1 0 100%; padding-top: 18px; border-top: 1px solid color-mix(in srgb, var(--white) 12%, transparent); font-size: 13px; line-height: 1.9; }
@media (max-width: 640px) {
body.gs .footer-inner { row-gap: 12px; }
body.gs .footer-inner > p { flex: 1 0 100%; }
body.gs .footer-inner > .footer-logo { margin: 0 0 4px; }
}
body.gs .footer-logo { font-family: var(--f-logo); font-size: 22px; text-transform: uppercase; color: var(--white); }
body.gs .site-footer a { color: var(--white); text-decoration-color: rgba(255,255,255,.35); text-underline-offset: 3px; }
body.gs .site-footer button.cmplz-show-banner { background: none; border: 0; padding: 0; font: inherit; color: var(--white); text-decoration: underline; text-decoration-color: rgba(255,255,255,.35); text-underline-offset: 3px; cursor: pointer; }
body.gs [data-if-param][hidden], body.gs [data-if-not-param][hidden], body.gs [data-param-is][hidden] { display: none !important; }
body.gs .flow-steps { display: flex; align-items: center; gap: 6px; margin-left: auto; counter-reset: flow; font-size: 14px; font-weight: 600; color: var(--ink-soft); }
body.gs .flow-steps li { counter-increment: flow; display: flex; align-items: center; gap: 8px; }
body.gs .flow-steps li + li::before { content: ""; width: clamp(12px, 3vw, 36px); height: 2px; margin-right: 4px; border-radius: 2px; background: color-mix(in srgb, var(--ink) 16%, transparent); }
body.gs .flow-num { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 50%; font-size: 13px; font-weight: 700; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--ink) 22%, transparent); }
body.gs .flow-num::before { content: counter(flow); }
body.gs .flow-steps .is-done .flow-num { background: var(--purple-mid); color: var(--white); box-shadow: none; }
body.gs .flow-steps .is-done .flow-num::before { content: "✓"; }
body.gs .flow-steps .is-current { color: var(--ink); }
body.gs .flow-steps .is-current .flow-num { background: var(--yellow); box-shadow: none; }
@media (max-width: 640px) {
body.gs .flow-steps li:not(.is-current) .flow-label { display: none; }
}
body.gs .flow-ok { background: var(--lilac-pale); color: var(--purple-deep); font-weight: 600; font-size: 15px; }
body.gs .flow-ok .container { display: flex; align-items: center; gap: 12px; padding-block: 14px; }
body.gs .flow-ok .container > p { margin: 0; }
body.gs .flow-ok svg { width: 26px; height: 26px; flex: none; padding: 5px; border-radius: 50%; background: var(--purple-mid); color: var(--white); }
body.gs .receipt { position: relative; z-index: 1; width: 100%; max-width: 400px; padding: 34px clamp(22px, 2.4vw, 32px) 26px; color: var(--ink); background: var(--note) linear-gradient(180deg, color-mix(in srgb, var(--white) 50%, transparent), transparent 30%); box-shadow: var(--shadow-note); transform: rotate(var(--r, 2deg)); }
body.gs .receipt > .tape { background: color-mix(in srgb, var(--teal) 42%, transparent); }
body.gs .receipt-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 12px; margin-bottom: 16px; }
body.gs .receipt-title { margin: 0; white-space: nowrap; font-family: var(--f-label); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); }
body.gs .receipt-no { margin: 0; font-size: 13px; color: var(--ink-soft); white-space: nowrap; }
body.gs .receipt-rows { display: grid; gap: 8px; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1.5px dashed color-mix(in srgb, var(--ink) 20%, transparent); }
body.gs .receipt-row { display: flex; justify-content: space-between; gap: 16px; font-size: 15px; line-height: 1.35; }
body.gs .receipt-row > :last-child { white-space: nowrap; font-weight: 600; }
body.gs .receipt-row.is-muted { font-size: 13.5px; color: var(--ink-soft); }
body.gs .receipt-row.is-muted > :last-child { font-weight: 400; }
body.gs .receipt-total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 16px; }
body.gs .receipt-total > span { font-size: 14px; font-weight: 600; color: var(--ink-soft); }
body.gs .receipt-total strong { font-family: var(--f-logo); font-weight: 400; font-size: 32px; line-height: 1; color: var(--purple); }
body.gs .receipt-total .cur, body.gs .offer-price-now .cur, body.gs .offer-price-now em { font-style: normal; font-family: var(--f-sans); font-weight: 700; font-size: .55em; letter-spacing: 0; }
body.gs .receipt-notes { display: grid; gap: 8px; font-size: 13.5px; line-height: 1.45; color: var(--ink-soft); }
body.gs .receipt-notes li { display: flex; gap: 8px; }
body.gs .receipt-notes svg { width: 18px; height: 18px; flex: none; margin-top: 1px; color: var(--purple); }
body.gs .receipt-sign { margin: 20px 0 0; font-size: 28px; line-height: 1.05; color: var(--purple); text-align: center; transform: rotate(-3deg); }
body.gs .receipt-sign span { position: relative; display: inline-block; margin-left: 2.4em; font-size: .85em; }
body.gs .receipt-sign .doodle { width: 24px; height: 24px; left: calc(100% + 8px); bottom: 2px; color: var(--purple); transform: rotate(12deg); }
body.gs .receipt-sign .doodle path { stroke-width: 2; }
body.gs .formats { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 3vw, 44px); align-items: stretch; }
body.gs .format-card { position: relative; display: flex; flex-direction: column; background: var(--white); border-radius: 4px; padding: 34px clamp(22px, 2.2vw, 32px) 28px; box-shadow: var(--shadow-card); transform: rotate(var(--r, 0deg)); }
body.gs .format-card > .tape { background: color-mix(in srgb, var(--yellow) 55%, transparent); }
body.gs .format-card:nth-child(3n+2) > .tape { background: color-mix(in srgb, var(--lilac) 38%, transparent); }
body.gs .format-card:nth-child(3n) > .tape { background: color-mix(in srgb, var(--teal) 42%, transparent); }
body.gs .format-visual { height: 190px; display: grid; place-items: center; margin-bottom: 26px; }
body.gs .format-card .eyebrow { margin-bottom: 8px; }
body.gs .format-num { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px; font-family: var(--f-logo); font-size: 52px; line-height: 1; text-transform: uppercase; color: var(--purple); }
body.gs .format-num small, body.gs .format-num em { font-family: var(--f-hand); font-weight: 700; font-size: 26px; text-transform: none; color: var(--ink-soft); }
body.gs .format-card > p:not([class]) { font-size: 16px; color: var(--ink-soft); }
body.gs .chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 22px; }
body.gs .chips li { padding: 4px 12px; border-radius: 999px; background: var(--lilac-pale); color: var(--purple-deep); font-size: 13px; font-weight: 600; line-height: 1.5; }
body.gs .format-foot { margin-top: auto; display: grid; gap: 14px; }
body.gs .format-meta { display: flex; align-items: center; gap: 8px; margin: 0; padding-top: 14px; font-size: 13.5px; color: var(--ink-soft); border-top: 1.5px dashed color-mix(in srgb, var(--ink) 14%, transparent); }
body.gs .format-meta svg { width: 18px; height: 18px; flex: none; color: var(--purple); }
body.gs .format-foot .btn { width: 100%; padding-left: 22px; }
body.gs .dev-a4 { position: relative; isolation: isolate; width: 116px; aspect-ratio: 210 / 297; padding: 5px; background: var(--white); box-shadow: var(--shadow-card); transform: rotate(-4deg); }
body.gs .dev-a4::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--white); box-shadow: var(--shadow-card); transform: rotate(8deg) translate(12px, 2px); }
body.gs .dev-a4 img, body.gs .dev-reader img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
body.gs .format-visual .phone { width: 90px; padding: 5px; border-radius: 18px; transform: rotate(5deg); }
body.gs .format-visual .phone::before { top: 9px; height: 7px; }
body.gs .format-visual .phone > img { padding: 0; object-fit: cover; object-position: top; border-radius: 13px; background: var(--white); }
body.gs .dev-reader { width: 128px; aspect-ratio: 3 / 4; padding: 10px 10px 24px; border-radius: 14px; background: var(--ink-soft); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--white) 12%, transparent) inset, 0 26px 40px -20px color-mix(in srgb, var(--ink) 55%, transparent); transform: rotate(-3deg); }
body.gs .dev-reader img { border-radius: 3px; }
body.gs .format-bonus { grid-column: 1 / -1; border: 3px dashed var(--purple); border-radius: 8px; background: var(--yellow-2) linear-gradient(180deg, color-mix(in srgb, var(--white) 40%, transparent), transparent 40%); overflow: hidden; }
body.gs .format-bonus-body { display: grid; grid-template-columns: 78px 1fr auto; gap: 18px 28px; align-items: center; padding: 22px clamp(18px, 2.4vw, 30px); }
body.gs .format-bonus .h3 { margin-bottom: 4px; }
body.gs .format-bonus p { margin: 0; font-size: 15.5px; color: var(--ink-soft); }
@media (max-width: 960px) {
body.gs .formats { grid-template-columns: 1fr; max-width: 520px; margin-inline: auto; }
}
@media (max-width: 640px) {
body.gs .format-bonus-body { grid-template-columns: 60px 1fr; }
body.gs .format-bonus-body .btn { grid-column: 1 / -1; }
body.gs .format-bonus-body .bump-cover { width: 60px; grid-column: auto; grid-row: auto; transform: rotate(-4deg); }
}
body.gs .ticks { display: grid; gap: 10px; margin-bottom: 28px; }
body.gs .ticks li { display: flex; gap: 12px; align-items: flex-start; }
body.gs .ticks svg { width: 24px; height: 24px; flex: none; margin-top: 2px; padding: 5px; border-radius: 50%; background: var(--yellow); color: var(--ink); }
body.gs .offer-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; margin: 0 0 24px; }
body.gs .offer-price-was { width: 100%; margin: 0; font-size: 15px; color: var(--ink-soft); }
body.gs .offer-price-was strong { font-weight: 600; }
body.gs .offer-price-now { margin: 0; font-family: var(--f-logo); font-size: clamp(46px, 4.6vw, 62px); line-height: 1; color: var(--purple); }
body.gs .offer-price-vat { margin: 0; font-size: 14px; color: var(--ink-soft); }
body.gs .offer-skip { display: inline-block; margin-top: 20px; font-size: 15px; color: var(--ink-soft); text-decoration: underline; text-underline-offset: 4px; }
body.gs .offer-skip:hover { color: var(--ink); }
body.gs .polaroid { position: relative; margin: 0; padding: 12px 12px 0; background: var(--white); transform: rotate(var(--r, -2deg));
  box-shadow: 0 1px 2px color-mix(in srgb, var(--ink) 8%, transparent), 0 26px 44px -24px color-mix(in srgb, var(--ink) 45%, transparent); }
body.gs .polaroid img { width: 100%; aspect-ratio: var(--ar, 4 / 3); object-fit: cover; }
body.gs .polaroid-cap { margin: 0; padding: 12px 8px 16px; font-family: var(--f-hand); font-weight: 700; font-size: clamp(21px, 1.7vw, 25px); line-height: 1.1; color: var(--purple); text-align: center; }
body.gs .polaroid > .tape { background: color-mix(in srgb, var(--yellow) 55%, transparent); }
body.gs .clip { position: absolute; top: -22px; left: var(--clip-x, 28px); z-index: 2; width: 16px; height: 48px; border: 2.5px solid color-mix(in srgb, var(--ink-soft) 50%, var(--white)); border-radius: 9px; transform: rotate(var(--clip-r, 5deg));
  filter: drop-shadow(0 2px 1px color-mix(in srgb, var(--ink) 18%, transparent)); }
body.gs .clip::before { content: ""; position: absolute; left: 2.5px; right: 2.5px; top: 9px; height: 28px; border: 2.5px solid color-mix(in srgb, var(--ink-soft) 50%, var(--white)); border-top: 0; border-radius: 0 0 6px 6px; }
body.gs .notebook { --margin: clamp(44px, 5vw, 76px); --line: 36px; position: relative; background-color: var(--white); transform: rotate(var(--r, 0deg));
  padding: clamp(52px, 5vw, 72px) clamp(26px, 4vw, 64px) clamp(36px, 4vw, 56px) calc(var(--margin) + clamp(18px, 2vw, 30px));
  background-image: linear-gradient(90deg, transparent calc(var(--margin) - 1px), color-mix(in srgb, var(--lilac) 55%, transparent) 0 calc(var(--margin) + 1px), transparent 0),
    repeating-linear-gradient(180deg, transparent 0 calc(var(--line) - 1px), color-mix(in srgb, var(--teal-deep) 15%, transparent) calc(var(--line) - 1px) var(--line));
  background-position: 0 0, 0 calc(clamp(52px, 5vw, 72px) - 8px);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--ink) 6%, transparent), 0 30px 60px -30px color-mix(in srgb, var(--ink) 38%, transparent); }
body.gs .notebook::before { content: ""; position: absolute; left: 18px; right: 18px; top: 14px; height: 14px;
  background: radial-gradient(circle, var(--hole, var(--paper)) 5px, transparent 5.6px) left center / 30px 14px repeat-x; }
body.gs .circled { position: relative; white-space: nowrap; }
body.gs .circled::after { content: ""; position: absolute; inset: -.2em -.38em -.16em; border: 2.2px solid var(--purple); border-radius: 50% 46% 52% 48% / 58% 52% 48% 44%; transform: rotate(-3deg); pointer-events: none;
  clip-path: inset(0 100% 0 0); transition: clip-path 1.1s var(--ease) .5s; }
body.gs .is-in .circled::after, body.gs .circled.is-in::after { clip-path: inset(0 0 0 0); }
body.gs .index-card { position: relative; display: grid; gap: 4px; padding: 30px 22px 20px; text-align: center; background-color: var(--white); transform: rotate(var(--r, 0deg)); box-shadow: var(--shadow-note);
  background-image: linear-gradient(180deg, transparent 22px, color-mix(in srgb, var(--lilac) 60%, transparent) 22px 24px, transparent 24px),
    repeating-linear-gradient(180deg, transparent 0 27px, color-mix(in srgb, var(--teal-deep) 13%, transparent) 27px 28px); background-position: 0 0, 0 24px; }
body.gs .index-from { margin: 0; font-family: var(--f-hand); font-weight: 700; font-size: 24px; line-height: 1.1; color: var(--ink-soft); }
body.gs .index-from s { text-decoration-thickness: 2px; text-decoration-color: var(--purple); }
body.gs .index-to { margin: 0; font-weight: 700; font-size: 16.5px; line-height: 1.3; color: var(--ink); overflow-wrap: break-word; hyphens: auto; }
body.gs .index-to::before { content: "↓"; display: block; font-family: var(--f-hand); font-size: 26px; line-height: 1; color: var(--purple); }
body.gs .price-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 2.6vw, 40px); align-items: start; }
body.gs .price-card { position: relative; display: flex; flex-direction: column; padding: clamp(40px, 3.4vw, 52px) clamp(22px, 2.2vw, 32px) 26px; border-radius: 4px; background: var(--white); box-shadow: var(--shadow-card); transform: rotate(var(--r, 0deg)); }
body.gs .price-card .h3 { min-height: 3.75em; margin-bottom: 12px; }
body.gs .price-card.is-featured { box-shadow: 0 0 0 3px var(--purple), 0 34px 60px -30px color-mix(in srgb, var(--purple-deep) 55%, transparent); }
body.gs .price-badge { position: absolute; top: -15px; left: 50%; z-index: 3; margin: 0; padding: 7px 16px; transform: translateX(-50%) rotate(-2deg); border-radius: 3px; background: var(--purple); color: var(--white); font-family: var(--f-label); font-weight: 700; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
body.gs .price-for { min-height: 4.8em; margin: 0 0 18px; font-size: 15.5px; line-height: 1.55; color: var(--ink-soft); }
body.gs .price-num { margin: 0 0 6px; font-family: var(--f-logo); font-size: clamp(38px, 3.3vw, 48px); line-height: 1; white-space: nowrap; color: var(--purple); }
body.gs .price-num .cur, body.gs .price-num em { font-style: normal; font-family: var(--f-sans); font-weight: 700; font-size: .5em; letter-spacing: 0; }
body.gs .price-meta { margin: 0 0 22px; font-size: 14.5px; line-height: 1.45; font-weight: 600; color: var(--ink-soft); }
body.gs .price-card > .btn { width: 100%; padding-left: 22px; }
body.gs .price-steps-title { margin: 28px 0 6px; padding-top: 22px; border-top: 1.5px dashed color-mix(in srgb, var(--ink) 16%, transparent); font-family: var(--f-label); font-weight: 700; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); }
body.gs .price-steps { display: grid; }
body.gs .price-steps > li, body.gs .price-steps .e-accordion-item-base, body.gs .price-steps > .is-off { border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent); }
body.gs .price-steps > li:last-child, body.gs .price-steps > .is-off:last-child, body.gs .price-steps > .e-accordion-base:last-child > .e-accordion-item-base:last-child { border-bottom: 0; }
body.gs .price-steps summary, body.gs .price-steps .is-off { display: grid; grid-template-columns: 22px 1fr auto; gap: 12px; align-items: start; padding: 11px 0; font-size: 15px; line-height: 1.35; font-weight: 600; }
body.gs .price-steps summary { list-style: none; cursor: pointer; transition: color .2s; }
body.gs .price-steps summary::-webkit-details-marker { display: none; }
body.gs .price-steps summary:hover { color: var(--purple); }
body.gs .price-steps summary small, body.gs .price-steps .is-off small, body.gs .price-steps summary em, body.gs .price-steps .is-off em { display: block; font-style: normal; margin-top: 2px; font-size: 13px; font-weight: 400; color: var(--ink-soft); }
body.gs .price-steps summary > svg:first-child { width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: var(--yellow); color: var(--ink); }
body.gs .price-steps .step-ico { width: 20px; height: 20px; margin-top: 1px; color: var(--ink-soft); transition: transform .3s var(--ease); }
body.gs .price-steps details[open] .step-ico { transform: rotate(45deg); color: var(--purple); }
body.gs .price-step-body { padding: 0 0 14px 34px; font-size: 14.5px; line-height: 1.55; color: var(--ink-soft); }
body.gs .price-step-body p { margin: 0 0 .6em; }
body.gs .price-step-body ul { display: grid; gap: 6px; margin: 0 0 .6em; }
body.gs .price-step-body li { position: relative; padding-left: 16px; }
body.gs .price-step-body li::before { content: ""; position: absolute; left: 1px; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--purple); }
body.gs .price-steps .is-off { grid-template-columns: 22px 1fr; color: color-mix(in srgb, var(--ink) 38%, transparent); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--ink) 25%, transparent); }
body.gs .price-steps .is-off::before { content: ""; width: 22px; height: 22px; box-sizing: border-box; border-radius: 50%; border: 1.5px dashed color-mix(in srgb, var(--ink) 25%, transparent); }
@media (max-width: 960px) {
body.gs .price-cards { grid-template-columns: minmax(0, 520px); justify-content: center; gap: 48px; }
body.gs .price-card .h3, body.gs .price-for { min-height: 0; }
}
body.gs .radio-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
body.gs .form .radio-card { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; align-content: start; padding: 14px 16px; border: 1.5px solid color-mix(in srgb, var(--ink) 18%, transparent); border-radius: 12px; background: var(--paper); cursor: pointer; font-size: 15px; line-height: 1.35; transition: border-color .2s, background-color .2s, box-shadow .2s; }
body.gs .radio-card input { grid-row: span 2; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--purple); }
body.gs .radio-title { font-weight: 600; }
body.gs .radio-price { font-family: var(--f-logo); font-weight: 400; font-size: 20px; line-height: 1.1; color: var(--purple); }
body.gs .radio-price .cur { font-family: var(--f-sans); font-weight: 700; font-size: .6em; }
body.gs .radio-tag { position: absolute; top: -10px; right: 12px; padding: 2px 9px; transform: rotate(3deg); border-radius: 3px; background: var(--yellow); font-size: 11.5px; font-weight: 700; }
body.gs .form .radio-card:hover { border-color: color-mix(in srgb, var(--purple) 55%, transparent); }
body.gs .form .radio-card:has(input:checked) { border-color: var(--purple); background: var(--white); box-shadow: 0 0 0 4px color-mix(in srgb, var(--purple) 12%, transparent); }
body.gs .radio-card:has(input:focus-visible) { outline: 3px solid var(--purple); outline-offset: 2px; }
@media (max-width: 640px) {
body.gs .radio-cards { grid-template-columns: 1fr; }
}
body.gs .quote-card { position: relative; margin: 0; padding: 40px clamp(22px, 2.4vw, 32px) 26px; background: var(--white); box-shadow: var(--shadow-card); transform: rotate(var(--r, 0deg)); }
body.gs .quote-card > .tape { background: color-mix(in srgb, var(--yellow) 55%, transparent); }
body.gs .quote-card blockquote { margin: 0; font-size: 16.5px; line-height: 1.6; color: var(--ink); quotes: "„" "”"; }
body.gs .quote-card blockquote::before { content: open-quote; }
body.gs .quote-card blockquote::after { content: close-quote; }
body.gs .quote-card figcaption { margin-top: 18px; font-family: var(--f-hand); font-weight: 700; font-size: 26px; line-height: 1.05; color: var(--purple); }
body.gs .quote-card figcaption small { display: block; margin-top: 4px; font-family: var(--f-sans); font-weight: 400; font-size: 13.5px; color: var(--ink-soft); }
body.gs .sticky-cta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--paper) 92%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 -10px 26px -14px color-mix(in srgb, var(--ink) 35%, transparent); transform: translateY(110%); transition: transform .35s var(--ease); }
body.gs .sticky-cta.is-on { transform: none; }
@media (min-width: 961px) {
body.gs .sticky-cta { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
body.gs .sticky-cta { transition: none; }
}
body.gs .review-carousel { --card-w: min(640px, 86vw); --step: 80%; position: relative; overflow-x: clip; padding-top: 34px; }
body.gs .review-track { display: grid; gap: 56px; width: var(--card-w); margin: 0 auto; padding: 0; list-style: none; touch-action: pan-y; }
body.gs .review-carousel.is-ready .review-slide { grid-area: 1 / 1; align-self: center; --off: 0; opacity: .45; z-index: 1; cursor: pointer; transform: translateX(calc(var(--off) * var(--step))) scale(.84) rotate(calc(var(--off) * 1.5deg)); transition: transform .6s var(--ease), opacity .6s var(--ease), visibility .6s; }
body.gs .review-carousel.is-ready .review-slide.is-active { opacity: 1; z-index: 2; cursor: auto; transform: none; }
body.gs .review-carousel.is-ready .review-slide.is-far { opacity: 0; visibility: hidden; transform: translateX(calc(var(--off) * var(--step))) scale(.7); }
body.gs .review-slide { display: flex; }
body.gs .review-card { position: relative; display: flex; flex-direction: column; flex: 1; margin: 0; padding: clamp(30px, 3vw, 40px) clamp(24px, 3vw, 44px) 28px; background: var(--white); box-shadow: var(--shadow-card); color: var(--ink); }
body.gs .review-photo { position: absolute; top: -30px; right: clamp(18px, 3vw, 34px); width: clamp(88px, 9vw, 116px); padding: 7px 7px 20px; }
body.gs .review-card blockquote { margin: 0; }
body.gs .review-title { min-height: calc(3 * 1.28em); margin: 0 0 16px; padding-right: clamp(92px, 10vw, 130px); font-weight: 600; font-size: clamp(19px, 1.6vw, 22px); line-height: 1.28; letter-spacing: -.01em; quotes: "„" "”"; }
body.gs .review-title::before { content: open-quote; }
body.gs .review-title::after { content: close-quote; }
body.gs .clamp-text { max-height: calc(1.6em * 5); overflow: hidden; font-size: 16px; line-height: 1.6; color: var(--ink-soft); -webkit-mask: linear-gradient(#000 50%, transparent); mask: linear-gradient(#000 50%, transparent); }
body.gs .clamp-text.is-open { max-height: none; -webkit-mask: none; mask: none; }
body.gs .clamp-text p { margin: 0 0 .8em; }
body.gs .clamp-text p:last-child { margin-bottom: 0; }
body.gs .review-card .btn-link { align-self: flex-start; margin-top: 8px; }
body.gs .review-card .btn-link[hidden] { display: none; }
body.gs .review-card figcaption, body.gs .review-card .gs-t-figcaption { margin-top: auto; padding-top: 18px; font-family: var(--f-hand); font-weight: 700; font-size: 26px; line-height: 1.05; color: var(--purple); }
body.gs .review-card figcaption small, body.gs .review-card .gs-t-figcaption em { display: block; margin-top: 4px; font-style: normal; font-family: var(--f-sans); font-weight: 400; font-size: 13.5px; color: var(--ink-soft); }
body.gs .review-nav { display: none; justify-content: center; align-items: center; gap: 14px; margin-top: 36px; }
body.gs .review-carousel.is-ready .review-nav { display: flex; }
body.gs .review-arrow { display: grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 0; border-radius: 50%; background: var(--yellow); color: var(--ink); box-shadow: 0 4px 0 var(--ink); cursor: pointer; transition: transform .2s var(--ease), box-shadow .2s var(--ease); }
body.gs .review-arrow svg { width: 22px; height: 22px; }
body.gs .review-prev svg { transform: scaleX(-1); }
body.gs .review-arrow:hover { transform: translateY(-2px); box-shadow: 0 6px 0 var(--ink); }
body.gs .review-arrow:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--ink); }
body.gs .review-dots { display: flex; gap: 2px; }
body.gs .review-dots button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; }
body.gs .review-dots button::before { content: ""; width: 12px; height: 12px; border-radius: 50%; border: 2px solid currentColor; transition: background .3s, transform .3s; }
body.gs .review-dots button[aria-current="true"]::before { background: var(--yellow); border-color: var(--yellow); transform: scale(1.2); }
@media (max-width: 640px) {
body.gs .review-carousel { --card-w: 84vw; --step: 96%; }
body.gs .review-photo { width: 80px; top: -24px; }
body.gs .review-title { padding-right: 84px; font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
body.gs .review-carousel.is-ready .review-slide { transition: none; }
}
body.gs .more-text:not(.is-open) { display: none; }
body.gs .more-text.is-open { animation: more-in .5s var(--ease); }
@keyframes more-in { from { opacity: 0; transform: translateY(-6px); } }
body.gs .btn-link { display: inline-flex; align-items: center; gap: 8px; padding: 6px 0; border: 0; background: none; font-weight: 700; font-size: 15px; color: var(--purple); text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: color-mix(in srgb, var(--purple) 35%, transparent); text-underline-offset: 5px; }
body.gs .btn-link .btn-ico { width: 26px; height: 26px; border-width: 1.5px; }
body.gs .btn-link .btn-ico svg { width: 14px; height: 14px; }
body.gs .btn-link:hover { text-decoration-color: var(--purple); }
body.gs .btn-link.gs-plus::after { width: 26px; height: 26px; }
body.gs .pin { position: absolute; top: -9px; left: var(--pin-x, 50%); z-index: 3; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, color-mix(in srgb, var(--white) 75%, var(--pin-c, var(--purple))) 0 2.5px, var(--pin-c, var(--purple)) 6px, color-mix(in srgb, var(--pin-c, var(--purple)) 65%, var(--ink)) 100%);
  box-shadow: 3px 5px 0 -2px color-mix(in srgb, var(--ink) 22%, transparent), 0 8px 10px -4px color-mix(in srgb, var(--ink) 45%, transparent); }
body.gs .clue-row { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; }
body.gs .clue { position: relative; isolation: isolate; flex: none; display: inline-grid; place-items: center; width: 42px; height: 38px; padding-top: 4px; font-family: var(--f-logo); font-size: 21px; line-height: 1; color: var(--ink);
  transform: rotate(var(--r, -4deg)); filter: drop-shadow(0 5px 4px color-mix(in srgb, var(--ink) 28%, transparent)); }
body.gs .clue::before { content: ""; position: absolute; inset: 0; z-index: -1; clip-path: polygon(13% 0, 87% 0, 100% 100%, 0 100%);
  background: linear-gradient(180deg, var(--yellow) 0 76%, color-mix(in srgb, var(--yellow) 70%, var(--ink)) 76%); }
body.gs .clue-label { font-family: var(--f-label); font-weight: 700; font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--purple); }
body.gs .yarn { position: absolute; z-index: 0; top: var(--yarn-top, 0); bottom: var(--yarn-bottom, 0); left: var(--yarn-x, 24px); width: 16px; margin-left: -8px; pointer-events: none; background: color-mix(in srgb, var(--purple) 80%, transparent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='160'%3E%3Cpath d='M8 0c6 26-6 54 0 80s-6 54 0 80' fill='none' stroke='%23000' stroke-width='2.2'/%3E%3C/svg%3E") center top / 16px 160px repeat-y;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='160'%3E%3Cpath d='M8 0c6 26-6 54 0 80s-6 54 0 80' fill='none' stroke='%23000' stroke-width='2.2'/%3E%3C/svg%3E") center top / 16px 160px repeat-y; }
.js body.gs .yarn { clip-path: inset(0 0 100% 0); transition: clip-path 1.8s var(--ease) .2s; }
.js body.gs .yarn.is-in { clip-path: inset(0); }
@media (max-width: 1279px) {
body.gs .yarn { display: none; }
}
body.gs .stamp { display: inline-block; padding: .3em .62em .24em; border: .12em solid currentColor; border-radius: .16em; outline: .05em solid currentColor; outline-offset: .1em;
  color: var(--purple); font-family: var(--f-label); font-weight: 700; font-size: var(--stamp-fs, 26px); letter-spacing: .14em; line-height: 1; text-transform: uppercase; white-space: nowrap;
  transform: rotate(var(--r, -8deg)); opacity: .82; mix-blend-mode: multiply;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 -3 2.6'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 -3 2.6'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
body.gs .stamp-round { display: inline-grid; place-items: center; width: var(--stamp-size, 116px); aspect-ratio: 1; padding: 0; border-radius: 50%; outline-offset: .14em; text-align: center; letter-spacing: .04em; white-space: normal; }
.js body.gs :is([data-reveal="stamp"], .gs-reveal-stamp) { opacity: 0; transform: rotate(var(--r, -8deg)) scale(1.7); transition: opacity .25s var(--ease) var(--d, .3s), transform .45s cubic-bezier(.3,1.5,.6,1) var(--d, .3s); }
.js body.gs :is([data-reveal="stamp"], .gs-reveal-stamp).is-in { opacity: .82; transform: rotate(var(--r, -8deg)); }
body.gs .laptop { position: relative; width: min(860px, 100%); margin-inline: auto; }
body.gs .laptop-screen { position: relative; padding: clamp(10px, 1.4vw, 16px); border-radius: 18px 18px 4px 4px; background: var(--ink);
  box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--white) 14%, transparent) inset, 0 40px 60px -34px color-mix(in srgb, var(--ink) 60%, transparent); }
body.gs .laptop-screen::before { content: ""; position: absolute; top: clamp(3px, .5vw, 6px); left: 50%; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: color-mix(in srgb, var(--white) 22%, var(--ink)); }
body.gs .laptop .video { border-radius: 3px; box-shadow: none; }
body.gs .laptop-base { position: relative; height: clamp(14px, 1.7vw, 22px); margin-inline: -7%; border-radius: 2px 2px 16px 16px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--paper-2) 62%, var(--ink-soft)), color-mix(in srgb, var(--paper-2) 86%, var(--ink-soft)) 35%, color-mix(in srgb, var(--paper-2) 58%, var(--ink-soft)));
  box-shadow: 0 22px 26px -16px color-mix(in srgb, var(--ink) 55%, transparent); }
body.gs .laptop-base::before { content: ""; position: absolute; top: 0; left: 50%; width: 16%; height: 42%; transform: translateX(-50%); border-radius: 0 0 9px 9px; background: color-mix(in srgb, var(--paper-2) 55%, var(--ink-soft)); }
body.gs .goz { position: absolute; z-index: var(--goz-z, 0); left: 0; right: 0; bottom: 0; height: var(--goz-h, 60%); pointer-events: none;
  opacity: var(--goz-o, .5); filter: saturate(var(--goz-sat, .8)) blur(var(--goz-blur, 0px));
  background: center bottom / 100% auto no-repeat;
  -webkit-mask-image: linear-gradient(to top, #000 var(--goz-fade, 30%), transparent);
          mask-image: linear-gradient(to top, #000 var(--goz-fade, 30%), transparent); }
body.gs .goz-sav { background-image: url("../img/goz-sav.webp"); }
body.gs .goz-fatyol { background-image: url("../img/goz-fatyol.webp"); }
body.gs .goz-pamacs, body.gs .goz-pamacs-t { left: auto; right: auto; bottom: auto; height: auto; aspect-ratio: 1; background-size: contain; background-position: center; -webkit-mask-image: none; mask-image: none; }
body.gs .goz-pamacs { background-image: url("../img/goz-pamacs-2.webp"); }
body.gs .goz-pamacs-t { background-image: url("../img/goz-pamacs-1.webp"); }
body.gs .goz-flip { transform: scaleX(-1); }
body.gs .goz-papir { --goz-o: .35; --goz-h: 55%; --goz-fade: 40%; mix-blend-mode: multiply; }
body.gs .goz-papir-teli { --goz-z: -1; --goz-o: .28; --goz-h: 100%; --goz-fade: 55%; mix-blend-mode: multiply; }
body.gs .goz-savon { --goz-z: -1; --goz-o: .35; --goz-h: 70%; --goz-fade: 10%; mix-blend-mode: screen; }
body.gs .goz-zaro { --goz-z: -1; --goz-o: .7; --goz-h: 58%; --goz-fade: 30%; }
body.gs .goz-csomagok { --goz-o: .3; --goz-h: 45%; }
body.gs .goz-drift { animation: goz-drift var(--goz-dur, 38s) ease-in-out infinite alternate; }
@keyframes goz-drift { from { translate: -2% 0; } to { translate: 2% -1.5%; } }
.js body.gs :is([data-reveal], .gs-reveal, .gs-reveal-drop) { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease) var(--d, 0s), transform .9s var(--ease) var(--d, 0s); }
.js body.gs :is([data-reveal], .gs-reveal, .gs-reveal-drop).is-in { opacity: 1; transform: none; }
.js body.gs :is([data-reveal="drop"], .gs-reveal-drop) { transform: translateY(-36px) rotate(calc(var(--r, 0deg) * -3)); }
.js body.gs :is([data-reveal="drop"], .gs-reveal-drop).is-in { transform: rotate(var(--r, 0deg)); transition-timing-function: cubic-bezier(.34,1.56,.64,1); }
.js body.gs .note-worry.is-in:hover { transform: rotate(0deg) translateY(-8px) scale(1.02); transition-delay: 0s; }
.js body.gs .story { opacity: 0; transform: translateY(24px) rotate(var(--r)); transition: opacity .7s var(--ease) var(--d, 0s), transform .7s var(--ease) var(--d, 0s), box-shadow .4s; }
.js body.gs .story.is-in { opacity: 1; transform: rotate(var(--r)); }
.js body.gs .story.is-in:hover { transform: rotate(0) translateY(-6px); transition-delay: 0s; }
body.gs .playlist { display: grid; grid-template-columns: minmax(250px, .78fr) 1.62fr; gap: clamp(24px, 3.4vw, 56px); align-items: start; }
body.gs .pl-list { display: grid; gap: 10px; counter-reset: pl; }
body.gs .pl-item { counter-increment: pl; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 12px 14px 12px 12px; border-radius: 14px; background: var(--white); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--ink) 9%, transparent); color: var(--ink); text-decoration: none; font-weight: 600; font-size: clamp(16.5px, 1.25vw, 18.5px); line-height: 1.25; transition: background-color .25s, box-shadow .25s, transform .3s var(--ease); }
body.gs .pl-item::before { content: counter(pl, decimal-leading-zero); width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--purple-mid); color: var(--white); font-family: var(--f-label); font-weight: 700; font-size: 13px; letter-spacing: .04em; transition: background-color .25s; }
body.gs .pl-ico { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; color: var(--ink); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--ink) 14%, transparent); transition: background-color .25s, box-shadow .25s, transform .3s var(--ease); }
body.gs .pl-ico svg { width: 15px; height: 15px; margin-left: 2px; }
body.gs .pl-item:hover { transform: translateX(4px); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--purple) 35%, transparent), var(--shadow-card); }
body.gs .pl-item:hover .pl-ico { background: var(--yellow); box-shadow: none; }
body.gs .pl-item:focus-visible { outline: 3px solid var(--purple); outline-offset: 3px; }
body.gs .pl-item[aria-current] { background: var(--yellow); box-shadow: var(--shadow-btn); transform: none; }
body.gs .pl-item[aria-current]::before { background: var(--purple-deep); }
body.gs .pl-item[aria-current] .pl-ico { background: var(--ink); color: var(--yellow); box-shadow: none; }
body.gs .pl-stage { position: sticky; top: 110px; padding: 18px 18px 14px; background: var(--white); border-radius: 6px; box-shadow: var(--shadow-card); transform: rotate(.6deg); }
body.gs .pl-stage > .tape { z-index: 2; }
body.gs .pl-screen { position: relative; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: var(--purple-deep); }
body.gs .pl-screen iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
body.gs .pl-poster { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 22px; padding: 24px; text-align: center; color: var(--lilac-pale); isolation: isolate; }
body.gs .pl-poster::after { content: ""; position: absolute; inset: auto 0 0; height: 70%; z-index: -1; background: url("../img/goz-sav.webp") center bottom / cover no-repeat; opacity: .6; mix-blend-mode: screen; -webkit-mask-image: linear-gradient(to top, #000 35%, transparent); mask-image: linear-gradient(to top, #000 35%, transparent); }
body.gs .pl-poster .hand { font-size: var(--fs-hand-lg); color: var(--yellow); transform: rotate(-2deg); margin: 0; }
body.gs .pl-start { position: relative; inset: auto; margin: 0; border: 0; cursor: pointer; }
body.gs .pl-start:hover { transform: scale(1.08); }
body.gs .pl-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 18px; min-height: 44px; margin-top: 12px; }
body.gs .pl-now { margin: 0; font-size: 15px; color: var(--ink-soft); }
body.gs .pl-now-name { font-weight: 700; color: var(--ink); }
body.gs .playlist:not(.has-active) .pl-now { visibility: hidden; }
body.gs .pl-next[hidden] { display: none; }
@media (max-width: 900px) {
body.gs .playlist { grid-template-columns: 1fr; }
body.gs .playlist:not(.has-active) .pl-stage { display: none; }
body.gs .pl-list > li > .pl-stage { position: relative; top: 0; margin: 14px 0 10px; transform: none; padding: 10px 10px 4px; }
body.gs .pl-stage .tape { display: none; }
body.gs .pl-item:hover { transform: none; }
}
body.gs .pw-page { position: relative; overflow: hidden; isolation: isolate; min-height: max(560px, calc(100svh - 240px)); display: grid; place-items: center; padding: clamp(64px, 9vw, 130px) var(--gutter); }
body.gs .pw-page > .hero-bg::after { background: linear-gradient(0deg, color-mix(in srgb, var(--purple-deep) 45%, transparent), color-mix(in srgb, var(--teal-deep) 12%, transparent) 60%); }
body.gs .pw-note { width: min(520px, 100%); padding: clamp(36px, 4vw, 52px) clamp(26px, 4vw, 48px) clamp(30px, 3.4vw, 42px); }
body.gs .pw-note .tape { width: 110px; }
body.gs .pw-lock { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--purple); color: var(--white); margin-bottom: 18px; }
body.gs .pw-lock svg { width: 26px; height: 26px; }
body.gs .pw-note .h3 { font-size: clamp(26px, 2.6vw, 34px); line-height: 1.12; margin: 0 0 14px; }
body.gs .pw-note p { margin: 0 0 22px; color: var(--ink-soft); }
body.gs .pw-note .form { gap: 12px; }
body.gs .pw-note .form-msg { min-height: 0; margin: 0 0 4px; }
body.gs .pw-note .pw-hand { margin: 20px 0 0; font-size: 25px; color: var(--purple); transform: rotate(-3deg); }
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
body.gs *, body.gs *::before, body.gs *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
.js body.gs :is([data-reveal], .gs-reveal, .gs-reveal-drop), .js body.gs .story { opacity: 1 !important; transform: rotate(var(--r, 0deg)) !important; }
body.gs .marquee-row { animation: none !important; flex-wrap: wrap; width: auto; justify-content: center; padding-inline: var(--gutter); }
body.gs .marquee-row [aria-hidden="true"] { display: none; }
body.gs .marquee { -webkit-mask-image: none; mask-image: none; }
body.gs .doodle path, body.gs .bubble-ring path { stroke-dashoffset: 0 !important; }
body.gs .lightbox[open] { animation: none; }
body.gs .flipbook.stf__parent { transition: none; }
body.gs .bump-arrow, body.gs .bump .bump-head input { animation: none !important; }
body.gs .mark::before, body.gs .brush::before, body.gs :is(.h-hero, .h2, .h3) u::before { transform: rotate(-1.2deg) scaleX(1) !important; }
body.gs .circled::after { clip-path: none !important; }
body.gs .yarn { clip-path: none !important; }
}