/* SkyGen Hungarian rebuild – local-safe, no font preload/CORS */
:root{
  --ink:#07141f; --ink-2:#0e2534; --cream:#fff7e8; --paper:#f8f4ea; --mist:#e7f6f3;
  --teal:#1fc7b6; --teal-2:#0d9488; --coral:#ff6b4a; --gold:#f5bd4f; --silver:#d7e0e7;
  --muted:#5f6c75; --white:#ffffff; --line:rgba(7,20,31,.12); --shadow:0 24px 80px rgba(7,20,31,.16);
  --radius:28px; --max:1180px; --nav-h:78px;
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;font-family:var(--font);background:var(--paper);color:var(--ink);overflow-x:clip}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container-wide{width:min(calc(100% - 40px),var(--max));margin-inline:auto}.section{padding:104px 0}.section-tint{padding:104px 0;background:linear-gradient(180deg,#fffaf0 0%,#eaf8f5 100%)}.skip-link{position:absolute;left:16px;top:-80px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:12px;z-index:999}.skip-link:focus{top:16px}.scroll-progress{position:fixed;top:0;left:0;width:100%;height:3px;z-index:1000;background:transparent}.scroll-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--gold),var(--coral));box-shadow:0 0 24px rgba(31,199,182,.55)}
.site-header{position:fixed;top:16px;left:0;width:100%;z-index:900;pointer-events:none}.sky-nav{pointer-events:auto;width:min(calc(100% - 32px),1220px);min-height:64px;margin:auto;padding:10px 12px 10px 14px;border:1px solid rgba(255,255,255,.52);background:rgba(255,247,232,.84);backdrop-filter:blur(18px);border-radius:24px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 18px 58px rgba(7,20,31,.12);transition:transform .35s ease,background .35s ease}.site-header.is-scrolled .sky-nav{transform:translateY(-4px);background:rgba(255,255,255,.9)}.brand{display:inline-flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:44px;height:44px;display:grid;place-items:center;border-radius:15px;background:conic-gradient(from 160deg,var(--teal),var(--gold),var(--coral),var(--teal));color:var(--ink);font-weight:950;box-shadow:0 14px 30px rgba(31,199,182,.28)}.brand-copy{display:flex;flex-direction:column;line-height:1.05}.brand-copy strong{font-size:1.05rem}.brand-copy small{font-size:.76rem;color:var(--muted);font-weight:800}.nav-menu{display:flex;align-items:center;gap:4px}.nav-menu>a{padding:12px 13px;border-radius:16px;font-weight:850;font-size:.94rem;color:#183141;white-space:nowrap}.nav-menu>a:hover,.nav-menu>a.active{background:rgba(31,199,182,.12);color:#062b31}.nav-toggle{display:none;width:46px;height:46px;border:0;background:var(--ink);border-radius:16px;align-items:center;justify-content:center;flex-direction:column;gap:5px}.nav-toggle span{width:20px;height:2px;background:#fff;border-radius:99px;transition:.25s ease}.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.eyebrow{display:inline-flex;align-items:center;gap:9px;margin-bottom:18px;padding:8px 12px;border-radius:999px;background:rgba(31,199,182,.12);color:#0b6f67;font-weight:950;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 6px rgba(255,107,74,.15)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(3.2rem,8.5vw,6.7rem);letter-spacing:-.075em;line-height:.88;margin-bottom:24px}h1 em{font-style:normal;color:var(--teal);text-shadow:0 16px 44px rgba(31,199,182,.25)}h2{font-size:clamp(2rem,5vw,4.35rem);line-height:.95;letter-spacing:-.055em;margin-bottom:20px}h3{font-size:1.22rem;letter-spacing:-.02em}.lead{font-size:clamp(1.08rem,2.2vw,1.34rem);line-height:1.62;color:#36515d;max-width:680px}.section-heading{max-width:820px}.section-heading.center{text-align:center;margin:0 auto 48px}.section-heading p{font-size:1.12rem;color:var(--muted);line-height:1.75}.center-actions{display:flex;justify-content:center;margin-top:34px}
.hero{position:relative;min-height:100svh;padding:136px 0 48px;background:radial-gradient(circle at 20% 12%,rgba(31,199,182,.24),transparent 32%),radial-gradient(circle at 85% 15%,rgba(255,107,74,.18),transparent 33%),linear-gradient(135deg,#fff7e8 0%,#ecfbf7 52%,#fff 100%);overflow:hidden}.hero:after{content:"";position:absolute;inset:auto 0 0;height:170px;background:linear-gradient(0deg,var(--paper),transparent);pointer-events:none}.hero-orb{position:absolute;border-radius:50%;filter:blur(18px);opacity:.46;pointer-events:none}.hero-orb-a{width:320px;height:320px;background:var(--teal);left:-80px;top:170px}.hero-orb-b{width:260px;height:260px;background:var(--gold);right:-60px;top:120px}.hero-layout{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(360px,.88fr);gap:54px;align-items:center}.hero-price-row{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}.mini-price{padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.72);border:1px solid rgba(7,20,31,.1);box-shadow:0 14px 32px rgba(7,20,31,.08);display:flex;align-items:baseline;gap:9px}.mini-price span{font-weight:850;color:#35505a}.mini-price strong{font-size:2rem;letter-spacing:-.04em}.mini-price.active{background:var(--ink);color:#fff}.mini-price.active span,.mini-price.active small{color:rgba(255,255,255,.75)}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:24px 0}.trust-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.trust-pills span{padding:10px 13px;border-radius:999px;background:rgba(255,255,255,.64);border:1px solid rgba(7,20,31,.08);color:#35505a;font-weight:850;font-size:.9rem}.hero-visual{position:relative;min-height:610px}.browser-card{margin:0;border-radius:34px;background:#fff;border:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow);overflow:hidden}.main-preview{position:absolute;right:4%;top:4%;width:min(92%,520px);transform:rotate(2deg)}.browser-card img{height:380px;width:100%;object-fit:cover}.browser-card figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;background:#fff}.browser-card figcaption span{font-weight:900;color:var(--muted)}.browser-card figcaption strong{font-weight:950}.floating-shot{position:absolute;margin:0;border-radius:28px;overflow:hidden;border:8px solid rgba(255,255,255,.84);box-shadow:0 20px 52px rgba(7,20,31,.18);background:#fff}.floating-shot img{width:100%;height:100%;object-fit:cover}.shot-one{width:230px;height:154px;left:0;bottom:86px;transform:rotate(-4deg)}.shot-two{width:210px;height:210px;right:0;bottom:10px;border-radius:50%;transform:rotate(6deg)}.hero-bar{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}.hero-bar div{padding:20px;border-radius:24px;background:rgba(255,255,255,.72);border:1px solid rgba(7,20,31,.09);box-shadow:0 18px 42px rgba(7,20,31,.08)}.hero-bar strong{font-size:2.5rem;letter-spacing:-.06em}.hero-bar span{display:block;color:var(--muted);font-weight:800}
.btn-frame,.btn-ink,.btn-paper,.btn-submit{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 22px;border-radius:999px;border:0;font-weight:950;white-space:nowrap;cursor:pointer;transition:transform .28s ease,box-shadow .28s ease,color .28s ease}.btn-frame{background:var(--ink);color:#fff;box-shadow:0 18px 42px rgba(7,20,31,.22)}.btn-frame:before,.btn-frame:after{content:"";position:absolute;inset:6px;border-radius:999px;border:1px solid rgba(245,189,79,.85);opacity:.65;transform:scaleX(.86);transition:transform .38s cubic-bezier(.2,.9,.2,1),opacity .38s ease}.btn-frame:after{inset:-4px;border-color:rgba(31,199,182,.5);opacity:0;transform:scale(.94)}.btn-frame:hover{transform:translateY(-3px)}.btn-frame:hover:before{transform:scaleX(1)}.btn-frame:hover:after{opacity:1;transform:scale(1)}.btn-frame:focus-visible,.btn-ink:focus-visible,.btn-paper:focus-visible{outline:3px solid rgba(31,199,182,.55);outline-offset:4px}.btn-ink{background:var(--teal);color:#06262c;overflow:hidden;box-shadow:0 18px 42px rgba(31,199,182,.24)}.btn-ink:before{content:"";position:absolute;inset:auto auto 0 0;width:180%;height:0;background:var(--gold);transform:rotate(-9deg) translate(-12%,25%);transition:height .36s cubic-bezier(.2,.9,.2,1);z-index:-1}.btn-ink:hover:before{height:230%}.btn-ink:hover{transform:translateY(-3px)}.btn-paper{background:#fff;color:var(--ink);border:1px solid rgba(7,20,31,.14);box-shadow:0 16px 34px rgba(7,20,31,.1);overflow:hidden}.btn-paper:before{content:"";position:absolute;right:0;top:0;border-style:solid;border-width:0 0 0 0;border-color:transparent transparent rgba(255,107,74,.2) transparent;transition:border-width .3s ease}.btn-paper:hover:before{border-width:0 34px 34px 0}.btn-paper:hover{transform:translateY(-3px)}.btn-submit{width:100%}.btn-submit.is-sent:after{content:" ✓"}
.split-text,.industries-layout,.why-layout,.faq-layout,.contact-layout,.offer-layout,.work-hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:54px;align-items:start}.pain-grid{display:grid;gap:16px}.pain-grid article,.feature-card,.check-grid article,.industry-grid article,.timeline article,.price-card,.faq-list details,.contact-card,.contact-form,.work-card{background:rgba(255,255,255,.78);border:1px solid rgba(7,20,31,.1);border-radius:var(--radius);box-shadow:0 18px 55px rgba(7,20,31,.08)}.pain-grid article{padding:24px}.pain-grid span{display:inline-flex;width:42px;height:42px;border-radius:15px;background:var(--mist);align-items:center;justify-content:center;font-weight:950;color:#0b6f67}.feature-bento{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:18px}.feature-card{padding:26px;position:relative;overflow:hidden}.feature-large{grid-row:span 2;display:grid;grid-template-rows:260px auto;gap:22px}.feature-card img{width:100%;height:100%;object-fit:cover;border-radius:22px}.feature-card.accent{background:var(--ink);color:#fff}.feature-card.accent p{color:rgba(255,255,255,.72)}.offer-layout{align-items:center}.price-stack{display:grid;gap:18px}.price-card{padding:30px;position:relative;overflow:hidden}.price-card.active{background:linear-gradient(135deg,var(--ink),#123545);color:#fff;border-color:rgba(255,255,255,.14)}.price-card.compact{background:#fff}.price-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:20px}.price-top span{font-weight:950;letter-spacing:.03em;text-transform:uppercase;color:var(--teal)}.price-top strong{font-size:clamp(3rem,8vw,5.2rem);letter-spacing:-.08em}.price-top small{font-weight:900}.price-card ul{padding:0;margin:0 0 24px;list-style:none;display:grid;gap:12px}.price-card li{position:relative;padding-left:28px;color:inherit}.price-card li:before{content:"✓";position:absolute;left:0;color:var(--gold);font-weight:950}.check-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.check-grid article{padding:20px;display:grid;gap:16px;min-height:130px}.check-grid b{width:42px;height:42px;border-radius:14px;background:var(--ink);color:#fff;display:grid;place-items:center}.check-grid span{font-weight:900}.sticky-heading{position:sticky;top:112px}.industry-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.industry-grid article{padding:22px;font-weight:950;min-height:80px;display:flex;align-items:center;background:linear-gradient(135deg,#fff,rgba(31,199,182,.1))}.timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.timeline-line{position:absolute;left:5%;right:5%;top:54px;height:4px;background:rgba(7,20,31,.1);border-radius:99px}.timeline-line span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--teal),var(--gold),var(--coral));border-radius:99px}.timeline article{position:relative;padding:26px;z-index:2}.timeline b{display:grid;place-items:center;width:58px;height:58px;border-radius:20px;background:var(--ink);color:#fff;font-size:1.3rem;margin-bottom:18px}.preview-marquee{display:grid;grid-template-columns:1.05fr .95fr .95fr 1.05fr;gap:16px}.preview-card{min-height:340px;border-radius:32px;overflow:hidden;position:relative;box-shadow:var(--shadow);background:#000}.preview-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease,filter .6s ease}.preview-card:hover img{transform:scale(1.06);filter:saturate(1.08)}.preview-card span{position:absolute;left:18px;right:18px;bottom:18px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.86);font-weight:950}.wide-image{margin:0;border-radius:36px;overflow:hidden;box-shadow:var(--shadow);min-height:360px}.wide-image img{width:100%;height:100%;object-fit:cover}.faq-list{display:grid;gap:12px}.faq-list details{padding:20px}.faq-list summary{font-weight:950;cursor:pointer}.faq-list p{margin:14px 0 0;color:var(--muted);line-height:1.7}.contact{background:linear-gradient(135deg,#07141f,#123545);color:#fff}.contact .eyebrow{background:rgba(31,199,182,.14);color:#bff8ef}.contact h2{color:#fff}.contact p{color:rgba(255,255,255,.74)}.contact-card,.contact-form{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);box-shadow:0 24px 80px rgba(0,0,0,.2)}.contact-card{padding:30px}.contact-image{margin:24px 0 0;border-radius:28px;overflow:hidden}.contact-image img{width:100%;height:260px;object-fit:cover}.contact-form{padding:26px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:grid;gap:8px}.field span{font-weight:950;color:#fff}.field input,.field select,.field textarea{width:100%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1);border-radius:18px;color:#fff;padding:14px 15px;outline:none;transition:border-color .25s ease,box-shadow .25s ease,background .25s ease}.field input::placeholder,.field textarea::placeholder{color:rgba(255,255,255,.48)}.field select option{color:#07141f}.field.is-focused input,.field.is-focused select,.field.is-focused textarea{border-color:var(--teal);box-shadow:0 0 0 5px rgba(31,199,182,.12);background:rgba(255,255,255,.14)}.field.full,.full{grid-column:1/-1}.field small{color:rgba(255,255,255,.58);font-weight:800}.optional,.field em{font-style:normal;color:rgba(255,255,255,.58)}.privacy{display:flex;gap:12px;align-items:flex-start;color:rgba(255,255,255,.78);line-height:1.5}.privacy input{width:20px;height:20px;accent-color:var(--teal);margin-top:2px}.privacy a{color:#bff8ef;text-decoration:underline}.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;opacity:0}.form-status{grid-column:1/-1;border-radius:18px;padding:14px;background:rgba(255,255,255,.12);font-weight:900}.form-status.success{background:rgba(31,199,182,.18)}.form-status.error{background:rgba(255,107,74,.18)}
.site-footer{padding:54px 0;background:#06101a;color:#fff}.footer-grid{display:grid;grid-template-columns:1.1fr .9fr auto;gap:28px;align-items:center}.footer-grid p{color:rgba(255,255,255,.64);margin:18px 0 0;max-width:440px}.footer-links{display:flex;gap:8px;flex-wrap:wrap}.footer-links a{padding:10px 12px;border-radius:999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);font-weight:800}.social-wrap{display:flex;gap:10px;align-items:center;justify-content:flex-end}.social-link{width:46px;height:46px;padding:0;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);transition:transform .25s ease,background .25s ease}.social-link img{width:21px;height:21px;object-fit:contain;display:block}.social-link:hover{transform:translateY(-3px);background:rgba(31,199,182,.18)}.back-top{position:fixed;right:18px;bottom:18px;width:48px;height:48px;border:0;border-radius:16px;background:var(--ink);color:#fff;font-weight:950;box-shadow:0 18px 45px rgba(0,0,0,.25);opacity:0;pointer-events:none;transform:translateY(12px);transition:.25s ease;z-index:890}.back-top.show{opacity:1;pointer-events:auto;transform:none}
/* Work page */.work-page{background:var(--paper)}.work-hero{padding-top:140px;background:radial-gradient(circle at 20% 20%,rgba(31,199,182,.22),transparent 30%),linear-gradient(135deg,#fff7e8,#eefaf7)}.work-hero-img{margin:0;border-radius:36px;overflow:hidden;box-shadow:var(--shadow);min-height:420px}.work-hero-img img{width:100%;height:100%;object-fit:cover}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.work-card{overflow:hidden}.work-card img{width:100%;height:240px;object-fit:cover}.work-card div{padding:22px}.work-card span{display:inline-block;margin-bottom:10px;color:#0b6f67;font-weight:950;text-transform:uppercase;font-size:.75rem;letter-spacing:.08em}.mini-link{font-weight:950;color:#0b6f67}
[data-reveal],[data-cascade]>*{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.9,.2,1)}[data-reveal].is-visible,[data-cascade].is-visible>*{opacity:1;transform:none}[data-cascade].is-visible>*:nth-child(2){transition-delay:.06s}[data-cascade].is-visible>*:nth-child(3){transition-delay:.12s}[data-cascade].is-visible>*:nth-child(4){transition-delay:.18s}[data-cascade].is-visible>*:nth-child(5){transition-delay:.24s}[data-image-clip]{clip-path:inset(0 0 0 0 round 36px);transition:clip-path .8s cubic-bezier(.2,.9,.2,1)}
@media (max-width:1120px){.hero-layout,.split-text,.industries-layout,.why-layout,.faq-layout,.contact-layout,.offer-layout,.work-hero-grid{grid-template-columns:1fr}.hero-visual{min-height:560px}.sticky-heading{position:static}.feature-bento{grid-template-columns:1fr 1fr}.timeline{grid-template-columns:1fr 1fr}.timeline-line{display:none}.preview-marquee,.work-grid{grid-template-columns:1fr 1fr}.check-grid{grid-template-columns:1fr 1fr 1fr}.nav-menu>a{padding-inline:10px;font-size:.88rem}}
@media (max-width:920px){html{scroll-padding-top:84px}.site-header{top:10px}.sky-nav{width:calc(100% - 20px);border-radius:22px}.nav-toggle{display:flex}.nav-menu{position:absolute;left:0;right:0;top:calc(100% + 10px);display:grid;gap:6px;padding:12px;background:rgba(255,247,232,.97);border:1px solid rgba(7,20,31,.1);border-radius:22px;box-shadow:0 24px 70px rgba(7,20,31,.18);transform-origin:top;opacity:0;pointer-events:none;transform:translateY(-8px) scale(.98);transition:.25s ease}.nav-menu.open{opacity:1;pointer-events:auto;transform:none}.nav-menu>a{width:100%;padding:14px 16px}.hero{padding-top:114px;min-height:auto}.hero-layout{gap:20px}.hero-copy{text-align:left}.hero-visual{min-height:470px}.main-preview{position:relative;right:auto;top:auto;width:100%;transform:none}.floating-shot{display:none}.hero-bar{grid-template-columns:1fr}.feature-bento,.timeline,.preview-marquee,.work-grid{grid-template-columns:1fr}.check-grid{grid-template-columns:1fr 1fr}.contact-form{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.social-wrap{justify-content:flex-start}.browser-card img{height:300px}.section,.section-tint{padding:72px 0}.work-hero{padding-top:118px}.work-hero-img{min-height:320px}}
@media (max-width:560px){.container-wide{width:min(calc(100% - 26px),var(--max))}h1{font-size:clamp(2.55rem,16vw,4.4rem);letter-spacing:-.065em}h2{font-size:clamp(1.9rem,10vw,3.2rem)}.lead{font-size:1.02rem}.hero-price-row,.hero-actions{display:grid}.btn-frame,.btn-ink,.btn-paper{width:100%;min-height:54px}.mini-price{justify-content:space-between}.hero-visual{min-height:auto}.main-preview img{height:230px}.check-grid,.industry-grid{grid-template-columns:1fr}.contact-form,.contact-card{padding:18px;border-radius:24px}.price-card{padding:22px}.footer-links{display:grid}.social-link{width:44px;height:44px}.brand-copy small{display:none}.back-top{right:12px;bottom:12px}.site-footer{padding-bottom:76px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}[data-reveal],[data-cascade]>*{opacity:1!important;transform:none!important}}
/* Legal */.legal-page{background:var(--paper);color:var(--ink)}.legal-wrap{width:min(900px,calc(100% - 32px));margin:36px auto;padding:34px;background:#fff;border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow)}.legal-wrap h1{font-size:clamp(2.2rem,7vw,4rem);letter-spacing:-.055em}.legal-wrap h2{font-size:1.5rem;margin-top:28px}.legal-wrap p{color:var(--muted);line-height:1.8}.legal-wrap .brand{margin-bottom:28px}.legal-wrap .btn-frame{margin-top:20px}


/* SkyGen patch: readable nav CTA + Headline Soft Blur Wave + Scroll Blinds Section Reveal */
.nav-action.btn-frame,
.nav-action.btn-frame span{color:#fff!important;position:relative;z-index:2;}
.plan-badge{display:inline-flex;align-items:center;width:max-content;margin-bottom:14px;padding:8px 11px;border-radius:999px;background:rgba(31,199,182,.14);color:#0b6f67;font-size:.74rem;font-weight:950;letter-spacing:.08em;text-transform:uppercase;}
.price-card.active .plan-badge{background:rgba(255,255,255,.13);color:#bff8ef;}
.plan-fit{margin:-6px 0 18px;color:var(--muted);line-height:1.65;font-weight:750;}
.price-card.active .plan-fit{color:rgba(255,255,255,.72);}
[data-headline-wave] .headline-wave-word{display:inline-block;filter:blur(12px);opacity:0;transform:translateY(18px) scale(.96);}
[data-headline-wave].headline-wave-ready .headline-wave-word{animation:headlineSoftBlurWave .82s cubic-bezier(.18,.9,.22,1) forwards;animation-delay:calc(var(--wave-index,0) * 58ms);}
@keyframes headlineSoftBlurWave{0%{filter:blur(12px);opacity:0;transform:translateY(18px) scale(.96);}62%{filter:blur(2px);opacity:1;transform:translateY(-2px) scale(1.012);}100%{filter:blur(0);opacity:1;transform:none;}}
[data-scroll-blinds]{--blind-a:0%;--blind-b:0%;position:relative;overflow:hidden;}
[data-scroll-blinds]::before{content:"";position:absolute;inset:0;z-index:6;pointer-events:none;background:repeating-linear-gradient(90deg, var(--paper) 0 9%, rgba(248,244,234,.94) 9% 10%);transform-origin:top;clip-path:inset(0 0 0 0);opacity:.94;transition:clip-path .9s cubic-bezier(.18,.9,.22,1), opacity .55s ease;}
[data-scroll-blinds].section-tint::before{background:repeating-linear-gradient(90deg, #fffaf0 0 9%, rgba(234,248,245,.95) 9% 10%);}
[data-scroll-blinds].contact::before{background:repeating-linear-gradient(90deg,#07141f 0 9%,#123545 9% 10%);}
[data-scroll-blinds].blinds-open::before{clip-path:inset(0 0 100% 0);opacity:0;}
@media (max-width:1120px){.price-stack{grid-template-columns:1fr;}.price-card{min-width:0;}}
@media (prefers-reduced-motion:reduce){[data-headline-wave] .headline-wave-word{filter:none!important;opacity:1!important;transform:none!important;animation:none!important;}[data-scroll-blinds]::before{display:none!important;}}


/* Patch: Ft árak, új SkyGen logó, desktop pricing és hero motion finomítás */
.brand-logo-wrap{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:118px;height:48px;overflow:visible;border-radius:14px;background:rgba(255,255,255,.72);box-shadow:0 10px 26px rgba(7,20,31,.10);}
.brand-logo-img{width:112px;height:auto;max-height:46px;object-fit:contain;display:block;}
.footer-brand .brand-logo-wrap{width:128px;height:52px;background:rgba(255,255,255,.82);}
.legal-wrap .brand-logo-wrap{width:128px;height:52px;}
.nav-action.btn-frame:hover,.nav-action.btn-frame:focus-visible{background:#e85634;color:#fff!important;box-shadow:0 20px 52px rgba(232,86,52,.32);}
.nav-action.btn-frame:hover span,.nav-action.btn-frame:focus-visible span{color:#fff!important;}
.hero[data-hero-motion]{--hero-drift-x:0px;--hero-drift-y:0px;}
.hero[data-hero-motion] .hero-orb-a{transform:translate(calc(var(--hero-drift-x) * .55),calc(var(--hero-drift-y) * .35));transition:transform .22s ease-out;}
.hero[data-hero-motion] .hero-orb-b{transform:translate(calc(var(--hero-drift-x) * -.42),calc(var(--hero-drift-y) * -.28));transition:transform .22s ease-out;}
.hero[data-hero-motion] .hero-price-row,.hero[data-hero-motion] .hero-actions,.hero[data-hero-motion] .trust-pills,.hero[data-hero-motion] .hero-visual,.hero[data-hero-motion] .hero-bar div{opacity:0;transform:translateY(18px) scale(.985);}
.hero.hero-ready .hero-price-row{animation:heroRiseSoft .72s cubic-bezier(.18,.9,.22,1) .18s forwards;}
.hero.hero-ready .hero-actions{animation:heroRiseSoft .72s cubic-bezier(.18,.9,.22,1) .30s forwards;}
.hero.hero-ready .trust-pills{animation:heroRiseSoft .72s cubic-bezier(.18,.9,.22,1) .42s forwards;}
.hero.hero-ready .hero-visual{animation:heroFloatIn .92s cubic-bezier(.18,.9,.22,1) .24s forwards;}
.hero.hero-ready .hero-bar div:nth-child(1){animation:heroRiseSoft .62s cubic-bezier(.18,.9,.22,1) .52s forwards;}
.hero.hero-ready .hero-bar div:nth-child(2){animation:heroRiseSoft .62s cubic-bezier(.18,.9,.22,1) .62s forwards;}
.hero.hero-ready .hero-bar div:nth-child(3){animation:heroRiseSoft .62s cubic-bezier(.18,.9,.22,1) .72s forwards;}
@keyframes heroRiseSoft{to{opacity:1;transform:none;}}
@keyframes heroFloatIn{0%{opacity:0;transform:translateY(22px) rotate(-1.5deg) scale(.98);}100%{opacity:1;transform:none;}}
.price-stack .price-card{display:flex;flex-direction:column;}
.price-stack .price-card ul{flex:1;}
.price-card.premium{background:linear-gradient(145deg,#16101f 0%,#2a1732 48%,#7a4417 100%);color:#fff;border-color:rgba(245,189,79,.46);box-shadow:0 26px 80px rgba(122,68,23,.24);}
.price-card.premium:before{content:"";position:absolute;inset:-1px;border-radius:inherit;border:1px solid rgba(245,189,79,.46);pointer-events:none;}
.price-card.premium:after{content:"";position:absolute;right:-52px;top:-72px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(245,189,79,.36),transparent 62%);pointer-events:none;}
.price-card.premium .plan-badge{background:rgba(245,189,79,.17);color:#ffe6ad;border:1px solid rgba(245,189,79,.36);}
.price-card.premium .price-top span{color:#ffe6ad;}
.price-card.premium .plan-fit{color:rgba(255,255,255,.76);}
.price-card.premium .btn-paper{background:#ffe6ad;color:#1a1420;border-color:rgba(255,255,255,.18);}
.price-card.premium .btn-paper span{color:#1a1420;}
@media (min-width:1121px){.offer-layout{grid-template-columns:1fr;gap:34px;}.offer-copy{max-width:860px;}.price-stack{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;}.price-top strong{font-size:clamp(2.55rem,4.2vw,4.1rem);}.price-card{min-height:100%;}}
@media (max-width:560px){.brand-logo-wrap{width:96px;height:42px;}.brand-logo-img{width:92px;}.footer-brand .brand-logo-wrap{width:106px;height:44px;}}
@media (prefers-reduced-motion:reduce){.hero[data-hero-motion] .hero-price-row,.hero[data-hero-motion] .hero-actions,.hero[data-hero-motion] .trust-pills,.hero[data-hero-motion] .hero-visual,.hero[data-hero-motion] .hero-bar div{opacity:1!important;transform:none!important;animation:none!important}.hero[data-hero-motion] .hero-orb-a,.hero[data-hero-motion] .hero-orb-b{transform:none!important;}}

/* Targeted business patch: premium hero price + clearer nav CTA spacing */
.mini-price.mini-price-premium{
  background:linear-gradient(145deg,#16101f 0%,#2a1732 48%,#7a4417 100%);
  color:#fff;
  border-color:rgba(245,189,79,.46);
  box-shadow:0 22px 58px rgba(122,68,23,.24);
}
.mini-price.mini-price-premium span,
.mini-price.mini-price-premium small{color:#ffe6ad;}
.mini-price.mini-price-premium strong{color:#fff;}
.mini-price.mini-price-premium::after{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:#f5bd4f;
  box-shadow:0 0 0 8px rgba(245,189,79,.16);
  align-self:center;
}
@media (min-width:981px){
  .nav-menu .nav-action{margin-left:18px;}
}
.nav-action.btn-frame:hover,
.nav-action.btn-frame:focus-visible{
  background:#d91f35;
  color:#fff!important;
  box-shadow:0 20px 54px rgba(217,31,53,.38);
}
.nav-action.btn-frame:hover:before,
.nav-action.btn-frame:focus-visible:before{border-color:rgba(255,255,255,.86);}
.nav-action.btn-frame:hover:after,
.nav-action.btn-frame:focus-visible:after{border-color:rgba(255,215,170,.72);}


/* Patch: warmer neutral section backgrounds instead of pale green */
.section-tint{background:linear-gradient(180deg,#fffaf2 0%, #f6f0e8 56%, #f1f3f8 100%);} 
[data-scroll-blinds].section-tint::before{background:repeating-linear-gradient(90deg,#fffaf2 0 9%, rgba(241,243,248,.95) 9% 10%);} 
.offer.section .offer-layout,.offer-layout{align-items:start;} 
.why-cheap .wide-image img,.contact-image img,.feature-large img,.browser-card img{object-position:center center;} 


/* Patch 4: hero background refresh, footer link animations, button 004 integration */
.hero{background:radial-gradient(circle at 18% 10%, rgba(245,189,79,.22), transparent 30%),radial-gradient(circle at 86% 14%, rgba(217,31,53,.16), transparent 28%),linear-gradient(135deg,#fff7ee 0%,#f9efe7 40%,#eef2f8 100%);} 
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.28),transparent 42%,rgba(255,255,255,.15) 66%,transparent 100%);pointer-events:none;}
.hero-visual .main-preview{transform:rotate(1.3deg);} 
.work-hero{background:radial-gradient(circle at 20% 20%,rgba(245,189,79,.18),transparent 30%),linear-gradient(135deg,#fff7ee,#eef2f8);} 
.footer-links a.footer-link-anim{position:relative;overflow:hidden;padding:11px 15px;border-radius:999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.12);transition:transform .26s ease, color .26s ease, border-color .26s ease, box-shadow .26s ease;}
.footer-links a.footer-link-anim:before{content:"";position:absolute;inset:1px;border-radius:inherit;background:linear-gradient(135deg,rgba(245,189,79,.0),rgba(217,31,53,.0));clip-path:polygon(0 0,0 0,0 100%,0 100%);transition:clip-path .45s cubic-bezier(.16,1,.3,1), background .3s ease;z-index:0;}
.footer-links a.footer-link-anim:hover,.footer-links a.footer-link-anim:focus-visible{transform:translateY(-2px);color:#fff;border-color:rgba(255,255,255,.22);box-shadow:0 16px 30px rgba(0,0,0,.18);}
.footer-links a.footer-link-anim:hover:before,.footer-links a.footer-link-anim:focus-visible:before{background:linear-gradient(135deg,rgba(245,189,79,.18),rgba(217,31,53,.28));clip-path:polygon(0 0,100% 0,84% 100%,0 100%);} 
.footer-links a.footer-link-anim{isolation:isolate;} .footer-links a.footer-link-anim > *{position:relative;z-index:1;} 
/* Button animation 004 adapted */
.sg-button-004{--sg004-dark:#07111f;--sg004-panel:#0d1b2f;--sg004-text:#ffffff;--sg004-orange:#ff7a18;--sg004-blue:#38bdf8;position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;min-width:260px;padding:18px 30px;border-radius:999px;color:var(--sg004-text)!important;text-decoration:none;font-size:15px;font-weight:900;letter-spacing:.04em;background:linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.02)) padding-box, linear-gradient(135deg, rgba(255,122,24,.76), rgba(56,189,248,.74)) border-box;border:1px solid transparent;box-shadow:0 22px 55px rgba(0,0,0,.24), inset 0 0 0 1px rgba(255,255,255,.05);overflow:visible;cursor:pointer;transform:translateY(0) scale(1);transition:transform .34s cubic-bezier(.2,.9,.2,1.25),box-shadow .34s ease,letter-spacing .34s ease;}
.sg-button-004::before{content:"";position:absolute;inset:3px;border-radius:inherit;background:linear-gradient(135deg,var(--sg004-panel),#081323);z-index:-3;}
.sg004-bg{position:absolute;inset:3px;border-radius:inherit;background:linear-gradient(115deg,var(--sg004-orange), #f59e0b 43%, var(--sg004-blue));clip-path:polygon(0 0,0 0,0 100%,0 100%);transform:translateX(-4%) skewX(-10deg);transform-origin:left center;opacity:.96;z-index:-2;transition:clip-path .58s cubic-bezier(.16,1,.3,1), transform .58s cubic-bezier(.16,1,.3,1);} 
.sg004-content{position:relative;z-index:2;display:inline-flex;align-items:center;gap:11px;transform:translateX(8px);transition:transform .36s cubic-bezier(.2,.9,.2,1.35);} 
.sg004-text{display:inline-block;text-shadow:0 1px 20px rgba(0,0,0,.25);} 
.sg004-arrow{display:inline-grid;place-items:center;width:27px;height:27px;border-radius:999px;background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);transform:translateX(18px) rotate(-35deg) scale(.68);opacity:0;transition:transform .38s cubic-bezier(.2,.9,.2,1.45), opacity .22s ease, background .22s ease;} 
.sg004-orbit{position:absolute;inset:-7px;border-radius:inherit;opacity:0;transform:scale(.88) rotate(0deg);pointer-events:none;z-index:1;transition:opacity .26s ease,transform .34s cubic-bezier(.2,.9,.2,1.2);} 
.sg004-orbit i{position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:999px;background:var(--sg004-orange);box-shadow:0 0 16px rgba(255,122,24,.95);} 
.sg004-orbit i:nth-child(1){transform:translate(-50%,-50%) rotate(0deg) translateX(148px);} 
.sg004-orbit i:nth-child(2){background:var(--sg004-blue);box-shadow:0 0 16px rgba(56,189,248,.95);transform:translate(-50%,-50%) rotate(120deg) translateX(148px);} 
.sg004-orbit i:nth-child(3){width:5px;height:5px;background:#fff;box-shadow:0 0 13px rgba(255,255,255,.9);transform:translate(-50%,-50%) rotate(240deg) translateX(148px);} 
.sg-button-004:hover,.sg-button-004:focus-visible{transform:translateY(-4px) scale(1.02);letter-spacing:.07em;box-shadow:0 28px 70px rgba(0,0,0,.28),0 0 34px rgba(56,189,248,.16),0 0 42px rgba(255,122,24,.15),inset 0 0 0 1px rgba(255,255,255,.1);} 
.sg-button-004:hover .sg004-bg,.sg-button-004:focus-visible .sg004-bg{clip-path:polygon(0 0,100% 0,86% 100%,0 100%);transform:translateX(0) skewX(0deg);} 
.sg-button-004:hover .sg004-content,.sg-button-004:focus-visible .sg004-content{transform:translateX(0);} 
.sg-button-004:hover .sg004-arrow,.sg-button-004:focus-visible .sg004-arrow{opacity:1;transform:translateX(0) rotate(0deg) scale(1);} 
.sg-button-004:hover .sg004-orbit,.sg-button-004:focus-visible .sg004-orbit{opacity:1;transform:scale(1) rotate(0deg);animation:sg004-orbit-spin 2.35s linear infinite;} 
.sg-button-004:focus-visible{outline:3px solid rgba(56,189,248,.72);outline-offset:6px;} 
.sg-button-004:active{transform:translateY(-1px) scale(.985);} 
.sg004-click-pulse{position:absolute;width:22px;height:22px;left:var(--pulse-x);top:var(--pulse-y);border-radius:999px;border:1px solid rgba(255,255,255,.85);transform:translate(-50%,-50%) scale(.3);opacity:.9;pointer-events:none;z-index:3;animation:sg004-click-pulse .62s ease-out forwards;} 
@keyframes sg004-orbit-spin{to{transform:scale(1) rotate(360deg);}} 
@keyframes sg004-click-pulse{to{transform:translate(-50%,-50%) scale(6.4);opacity:0;}} 
.center-actions .sg-button-004{min-width:min(100%,360px);} 
@media (max-width:560px){.sg-button-004{width:100%;min-width:0;padding:17px 22px;}.sg004-orbit i:nth-child(1),.sg004-orbit i:nth-child(2),.sg004-orbit i:nth-child(3){transform-origin:center center;}.sg004-orbit i:nth-child(1){transform:translate(-50%,-50%) rotate(0deg) translateX(118px);} .sg004-orbit i:nth-child(2){transform:translate(-50%,-50%) rotate(120deg) translateX(118px);} .sg004-orbit i:nth-child(3){transform:translate(-50%,-50%) rotate(240deg) translateX(118px);} }


/* Patch 5: restore original green hero + responsive repair */
html,body{overflow-x:hidden;}
.hero{background:radial-gradient(circle at 20% 12%,rgba(31,199,182,.24),transparent 32%),radial-gradient(circle at 85% 15%,rgba(255,107,74,.18),transparent 33%),linear-gradient(135deg,#fff7e8 0%,#ecfbf7 52%,#fff 100%)!important;}
.hero:before{display:none!important;}
.center-actions{overflow:clip;}
.footer-grid > *{min-width:0;}
.footer-links{min-width:0;}
.footer-links a.footer-link-anim{display:inline-flex;align-items:center;justify-content:center;text-align:center;max-width:100%;}
.sg-button-004{max-width:100%;}
.work-button-004{width:min(100%, 100%);}
@media (max-width:920px){
  .hero-copy,.hero-visual,.main-preview,.browser-card,.hero-bar,.center-actions,.footer-grid,.footer-links,.social-wrap{min-width:0;}
  .center-actions .sg-button-004,.work-button-004{width:100%;min-width:0;}
  .sg-button-004{padding:17px 22px;letter-spacing:.03em;}
  .sg004-orbit i:nth-child(1){transform:translate(-50%,-50%) rotate(0deg) translateX(118px);} 
  .sg004-orbit i:nth-child(2){transform:translate(-50%,-50%) rotate(120deg) translateX(118px);} 
  .sg004-orbit i:nth-child(3){transform:translate(-50%,-50%) rotate(240deg) translateX(118px);} 
  .footer-links{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
  .footer-links a.footer-link-anim{width:100%;}
  .social-wrap{flex-wrap:wrap;}
}
@media (max-width:560px){
  .footer-links{grid-template-columns:1fr;}
  .hero-price-row{gap:10px;}
  .mini-price{min-width:0;width:100%;}
}


/* Patch 6: desktop hero H1 collision fix + work CTA size restore */
@media (min-width: 921px){
  .hero-layout{
    grid-template-columns:minmax(0,.9fr) minmax(420px,.86fr);
    gap:clamp(54px,6vw,90px);
  }
  .hero-copy{
    max-width:640px;
    min-width:0;
  }
  .hero-copy h1{
    max-width:640px;
    font-size:clamp(3.25rem,5.05vw,5.95rem);
    line-height:.91;
    letter-spacing:-.058em;
    overflow-wrap:normal;
    text-wrap:balance;
  }
  .hero-copy .lead{
    max-width:610px;
  }
  .hero-visual{
    min-width:0;
  }
}
@media (min-width: 921px) and (max-width: 1240px){
  .hero-copy h1{
    font-size:clamp(3rem,4.75vw,4.95rem);
    max-width:560px;
  }
  .hero-layout{
    grid-template-columns:minmax(0,.96fr) minmax(360px,.82fr);
    gap:46px;
  }
  .mini-price strong{
    font-size:1.72rem;
  }
}
@media (min-width: 921px) and (max-width: 1080px){
  .hero-copy h1{
    font-size:clamp(2.8rem,4.35vw,4.35rem);
    max-width:520px;
  }
  .hero-layout{
    grid-template-columns:minmax(0,1fr) minmax(330px,.72fr);
    gap:36px;
  }
}
.center-actions{
  display:flex;
  align-items:center;
  justify-content:center;
}
.center-actions .sg-button-004,
.work-button-004{
  width:auto!important;
  min-width:auto!important;
  max-width:100%;
  min-height:52px;
  padding:0 24px;
  font-size:14px;
  letter-spacing:.035em;
}
.center-actions .sg004-content{
  transform:translateX(4px);
}
.center-actions .sg004-arrow{
  width:24px;
  height:24px;
}
.center-actions .sg004-orbit i:nth-child(1){transform:translate(-50%,-50%) rotate(0deg) translateX(122px);}
.center-actions .sg004-orbit i:nth-child(2){transform:translate(-50%,-50%) rotate(120deg) translateX(122px);}
.center-actions .sg004-orbit i:nth-child(3){transform:translate(-50%,-50%) rotate(240deg) translateX(122px);}
@media (max-width:560px){
  .center-actions .sg-button-004,
  .work-button-004{
    width:auto!important;
    min-width:0!important;
    max-width:100%;
    padding:0 20px;
    min-height:52px;
    white-space:normal;
  }
  .center-actions .sg004-text{
    line-height:1.15;
  }
  .center-actions .sg004-orbit{
    display:none;
  }
}


/* Patch 7: restore Button Animation 004 sizing + mobile hero title containment */
.center-actions .sg-button-004,
.center-actions .work-button-004,
.work-button-004{
  width:auto!important;
  min-width:min(100%,360px)!important;
  max-width:100%!important;
  min-height:initial!important;
  padding:18px 30px!important;
  font-size:15px!important;
  letter-spacing:.04em!important;
  white-space:nowrap!important;
}
.center-actions .sg004-content{
  transform:translateX(8px)!important;
}
.center-actions .sg004-arrow{
  width:27px!important;
  height:27px!important;
}
.center-actions .sg004-orbit{
  display:block!important;
}
.center-actions .sg004-orbit i:nth-child(1){transform:translate(-50%,-50%) rotate(0deg) translateX(129px)!important;}
.center-actions .sg004-orbit i:nth-child(2){transform:translate(-50%,-50%) rotate(120deg) translateX(129px)!important;}
.center-actions .sg004-orbit i:nth-child(3){transform:translate(-50%,-50%) rotate(240deg) translateX(129px)!important;}

.hero-copy,
.hero-copy h1,
.hero-copy .lead{
  min-width:0;
  max-width:100%;
}
@media (max-width:920px){
  .hero-layout{
    grid-template-columns:1fr!important;
    overflow:hidden;
  }
  .hero-copy{
    width:100%;
    overflow-wrap:anywhere;
  }
  .hero-copy h1{
    width:100%;
    max-width:100%;
    font-size:clamp(2.2rem,10.8vw,4.1rem)!important;
    line-height:.94!important;
    letter-spacing:-.052em!important;
    overflow-wrap:break-word;
    word-break:normal;
    text-wrap:balance;
  }
  .hero-copy h1 em{
    display:inline-block;
    white-space:nowrap;
  }
}
@media (max-width:560px){
  .hero-copy h1{
    font-size:clamp(2rem,12.2vw,3.15rem)!important;
    line-height:.96!important;
    letter-spacing:-.045em!important;
  }
  .hero-copy h1 em{
    display:inline;
    white-space:normal;
  }
  .hero-price-row,
  .hero-actions,
  .trust-pills{
    max-width:100%;
  }
  .center-actions .sg-button-004,
  .center-actions .work-button-004,
  .work-button-004{
    width:auto!important;
    min-width:0!important;
    padding:17px 24px!important;
    font-size:14px!important;
    white-space:normal!important;
  }
  .center-actions .sg004-orbit{
    display:none!important;
  }
}
@media (max-width:380px){
  .hero-copy h1{
    font-size:clamp(1.86rem,11.4vw,2.65rem)!important;
  }
}


/* Patch 8: calmer work-page CTA hover + more spacing from cards */
.work-preview .center-actions,
.center-actions:has(.work-button-004){
  margin-top:44px!important;
  padding-top:8px;
}

.work-button-004{
  min-width:auto!important;
  width:auto!important;
  max-width:100%!important;
  padding:17px 30px!important;
  border-radius:999px!important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.02)) padding-box,
    linear-gradient(135deg, rgba(255,122,24,.82), rgba(56,189,248,.72)) border-box!important;
  box-shadow:
    0 18px 42px rgba(7,17,31,.22),
    inset 0 0 0 1px rgba(255,255,255,.08)!important;
  transform:none!important;
  transition:
    transform .26s ease,
    box-shadow .26s ease,
    letter-spacing .26s ease!important;
}

/* The orbit dots looked jumpy near the cards, so this CTA uses the smoother panel + arrow part of Button 004. */
.work-button-004 .sg004-orbit{
  display:none!important;
}

.work-button-004 .sg004-bg{
  inset:3px!important;
  clip-path:polygon(0 0, 0 0, 0 100%, 0 100%)!important;
  transform:translateX(-6%) skewX(-8deg)!important;
  opacity:.92!important;
}

.work-button-004 .sg004-content{
  transform:translateX(6px)!important;
  gap:10px!important;
}

.work-button-004 .sg004-arrow{
  opacity:.72!important;
  transform:translateX(4px) rotate(-12deg) scale(.92)!important;
}

.work-button-004:hover,
.work-button-004:focus-visible{
  transform:translateY(-2px)!important;
  letter-spacing:.045em!important;
  box-shadow:
    0 22px 54px rgba(7,17,31,.26),
    0 0 24px rgba(56,189,248,.13),
    0 0 28px rgba(255,122,24,.12),
    inset 0 0 0 1px rgba(255,255,255,.12)!important;
}

.work-button-004:hover .sg004-bg,
.work-button-004:focus-visible .sg004-bg{
  clip-path:polygon(0 0, 100% 0, 92% 100%, 0 100%)!important;
  transform:translateX(0) skewX(0deg)!important;
}

.work-button-004:hover .sg004-content,
.work-button-004:focus-visible .sg004-content{
  transform:translateX(0)!important;
}

.work-button-004:hover .sg004-arrow,
.work-button-004:focus-visible .sg004-arrow{
  opacity:1!important;
  transform:translateX(0) rotate(0deg) scale(1)!important;
}

.work-button-004 .sg004-click-pulse{
  animation:sg004-click-pulse-soft .5s ease-out forwards!important;
}

@keyframes sg004-click-pulse-soft{
  to{transform:translate(-50%,-50%) scale(4.2);opacity:0;}
}

@media (max-width:560px){
  .work-preview .center-actions,
  .center-actions:has(.work-button-004){
    margin-top:32px!important;
  }

  .work-button-004{
    padding:16px 22px!important;
    font-size:14px!important;
    max-width:calc(100vw - 40px)!important;
  }
}

/* Hero animated monitor scene */

/* Hero animated monitor scene — refined premium version */
.hero-visual-empty{
  min-height:610px;
  display:grid;
  place-items:center;
  position:relative;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.hero-monitor-scene{
  --monitor-accent:#1fc7b6;
  --monitor-blue:#6787ff;
  position:relative;
  width:min(100%,570px);
  aspect-ratio:10/9;
  display:grid;
  place-items:center;
  filter:drop-shadow(0 34px 54px rgba(7,20,31,.22));
  animation:monitorFloat 6.8s ease-in-out infinite;
}
.hero-monitor-halo{
  position:absolute;
  inset:7% 2% 25%;
  border-radius:50%;
  background:
    radial-gradient(circle at 38% 50%,rgba(31,199,182,.34),transparent 48%),
    radial-gradient(circle at 68% 38%,rgba(103,135,255,.28),transparent 52%);
  filter:blur(22px);
  opacity:.9;
  animation:heroHaloFloat 7s ease-in-out infinite;
}
.hero-monitor-shell{
  position:relative;
  width:100%;
  max-width:530px;
  padding:18px 18px 82px;
  border-radius:30px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.14),transparent 22%),
    linear-gradient(155deg,#101722 0%,#2c3b4f 52%,#172232 100%);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -18px 34px rgba(0,0,0,.16),
    0 28px 60px rgba(7,20,31,.24);
}
.hero-monitor-camera{
  position:absolute;
  top:8px;
  left:50%;
  width:58px;
  height:7px;
  border-radius:999px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(255,255,255,.08),rgba(255,255,255,.26),rgba(255,255,255,.08));
}
.hero-monitor-camera::after{
  content:"";
  position:absolute;
  width:4px;height:4px;border-radius:50%;
  right:9px;top:1.5px;
  background:#78e3d6;
  box-shadow:0 0 8px rgba(120,227,214,.8);
}
.hero-monitor-screen{
  position:relative;
  overflow:hidden;
  aspect-ratio:16/10;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background:#eaf2f8;
  box-shadow:
    inset 0 0 0 2px rgba(0,0,0,.25),
    inset 0 0 28px rgba(0,0,0,.12),
    0 0 0 1px rgba(255,255,255,.06);
  isolation:isolate;
}
.hero-screen-mode{
  position:absolute;
  inset:0;
  transform:translateZ(0);
  transition:filter .8s ease,transform .8s cubic-bezier(.2,.85,.2,1);
}
.hero-screen-web{
  z-index:1;
  opacity:1;
  background:linear-gradient(180deg,#f7fbff,#eaf3fa);
}
.hero-screen-game{
  z-index:2;
  opacity:1;
  clip-path:inset(0 100% 0 0 round 16px);
  transition:clip-path 1.05s cubic-bezier(.72,0,.18,1),filter .8s ease;
  background:linear-gradient(180deg,#102138 0,#224a78 45%,#5fc4e5 46%,#9cf1ff 100%);
}
.hero-monitor-scene.is-game .hero-screen-game{clip-path:inset(0 0 0 0 round 16px)}
.hero-monitor-scene.is-transition .hero-screen-web{filter:saturate(.7) brightness(.96)}
.hero-monitor-scene.is-transition .hero-monitor-screen{animation:screenPulse 1.05s ease}
.hero-monitor-scene.is-transition .hero-monitor-halo{animation:heroFlash 1.05s ease}
.hero-transform-beam{
  position:absolute;
  z-index:6;
  top:0;bottom:0;
  left:-18%;
  width:18%;
  opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.9) 45%,rgba(31,199,182,.75) 70%,transparent);
  filter:blur(2px);
  mix-blend-mode:screen;
  pointer-events:none;
}
.hero-transform-beam::before{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(180deg,transparent 0 7px,rgba(255,255,255,.4) 7px 9px);
}
.hero-monitor-scene.is-transition.to-game .hero-transform-beam{animation:beamToGame 1.05s cubic-bezier(.72,0,.18,1)}
.hero-monitor-scene.is-transition.to-web .hero-transform-beam{animation:beamToWeb 1.05s cubic-bezier(.72,0,.18,1)}
.hero-screen-reflection{
  position:absolute;
  z-index:7;
  inset:-40% 52% 20% -20%;
  transform:rotate(-16deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  pointer-events:none;
}
.hero-screen-scan{
  position:absolute;
  z-index:8;
  inset:0;
  background:
    linear-gradient(180deg,rgba(255,255,255,.07),transparent 25%),
    repeating-linear-gradient(180deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px);
  mix-blend-mode:soft-light;
  pointer-events:none;
}
.hero-monitor-brand{
  position:absolute;
  left:50%;
  bottom:55px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:7px;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.12em;
  color:rgba(255,255,255,.68);
}
.hero-monitor-brand span{
  width:6px;height:6px;border-radius:50%;
  background:#52ddca;
  box-shadow:0 0 10px rgba(82,221,202,.9);
}
.hero-monitor-stand{
  position:absolute;
  left:50%;bottom:23px;
  width:120px;height:56px;
  transform:translateX(-50%);
  clip-path:polygon(37% 0,63% 0,79% 100%,21% 100%);
  background:linear-gradient(180deg,#34485f,#1b2738);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1);
}
.hero-monitor-foot{
  position:absolute;
  left:50%;bottom:0;
  width:224px;height:18px;
  transform:translateX(-50%);
  border-radius:999px;
  background:linear-gradient(180deg,#2c4058,#151f2d);
  box-shadow:0 10px 24px rgba(7,20,31,.24),inset 0 1px 0 rgba(255,255,255,.12);
}
.hero-scene-chip{
  position:absolute;
  z-index:9;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 13px;
  border-radius:999px;
  font-size:.67rem;
  font-weight:950;
  letter-spacing:.07em;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 14px 32px rgba(7,20,31,.18);
  backdrop-filter:blur(12px);
  transition:opacity .45s ease,transform .45s ease,background .45s ease;
}
.hero-scene-chip span{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}
.chip-web{top:22px;right:-7px;color:#0c756b;background:rgba(240,255,252,.88)}
.chip-game{bottom:94px;left:-6px;color:#d9e5ff;background:rgba(19,28,42,.82)}
.hero-monitor-scene.is-web .chip-web,
.hero-monitor-scene.is-game .chip-game{transform:translateY(-3px);opacity:1}
.hero-monitor-scene.is-web .chip-game,
.hero-monitor-scene.is-game .chip-web{opacity:.45;transform:scale(.94)}
.hero-scene-caption{
  position:absolute;
  bottom:50px;
  right:4px;
  padding:9px 12px;
  border-radius:13px;
  background:rgba(255,255,255,.74);
  border:1px solid rgba(7,20,31,.08);
  box-shadow:0 12px 28px rgba(7,20,31,.12);
  color:#24404b;
  font-size:.76rem;
  font-weight:900;
}

/* Website screen */
.web-topbar{
  height:13%;
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:16px;
  padding:0 14px;
  background:rgba(18,31,48,.07);
  border-bottom:1px solid rgba(23,46,70,.05);
}
.web-window-dots{display:flex;gap:6px}
.web-window-dots span{width:8px;height:8px;border-radius:50%;background:#91b3cf}
.web-window-dots span:nth-child(1){background:#ff8b78}
.web-window-dots span:nth-child(2){background:#ffd074}
.web-window-dots span:nth-child(3){background:#70d9ca}
.web-address{
  justify-self:center;
  width:min(56%,190px);
  padding:5px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.65);
  color:#6e8293;
  font-size:.55rem;
  font-weight:800;
  text-align:center;
}
.web-layout{display:grid;grid-template-columns:76px 1fr;height:87%}
.web-sidebar{
  padding:14px 11px;
  display:grid;
  align-content:start;
  gap:11px;
  background:linear-gradient(180deg,rgba(23,46,70,.08),rgba(23,46,70,.025));
}
.web-mini-logo{
  width:38px;height:38px;
  display:grid;place-items:center;
  border-radius:13px;
  color:#fff;
  font-weight:950;
  background:linear-gradient(135deg,#20ccb9,#6787ff);
  box-shadow:0 8px 18px rgba(43,173,184,.22);
}
.web-sidebar i{height:8px;border-radius:999px;background:rgba(30,52,78,.12)}
.web-sidebar i:nth-of-type(1){width:90%}
.web-sidebar i:nth-of-type(2){width:70%}
.web-sidebar i:nth-of-type(3){width:82%}
.web-main{padding:12px 14px 14px;display:grid;grid-template-rows:auto 1fr auto;gap:10px}
.web-nav{display:flex;align-items:center;gap:8px;min-height:18px}
.web-nav b{font-size:.54rem;letter-spacing:.09em;color:#253e54;margin-right:auto}
.web-nav span{width:24px;height:5px;border-radius:999px;background:rgba(37,62,84,.13)}
.web-hero-card{
  position:relative;
  overflow:hidden;
  padding:18px;
  border-radius:18px;
  background:linear-gradient(145deg,#10233a 0%,#153e54 56%,#18a99a 140%);
  box-shadow:0 12px 28px rgba(20,38,61,.14);
  display:grid;
  align-content:center;
  justify-items:start;
  gap:7px;
  color:#fff;
}
.web-hero-card>b{font-size:.46rem;letter-spacing:.12em;color:#79ebdd}
.web-hero-card>strong{font-size:1.05rem;line-height:1.05;letter-spacing:-.04em;max-width:72%;position:relative;z-index:2}
.web-hero-card>em{font-style:normal;font-size:.46rem;color:rgba(255,255,255,.68);position:relative;z-index:2}
.web-hero-card>span{margin-top:3px;padding:7px 10px;border-radius:8px;background:#f5c159;color:#132338;font-size:.48rem;font-weight:950;position:relative;z-index:2}
.web-preview-orb{
  position:absolute;
  width:128px;height:128px;
  right:-16px;bottom:-28px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 32%,#8af3e5 0 9%,#45c4d7 10% 32%,#4d73e8 33% 62%,#253a80 63% 100%);
  opacity:.9;
  box-shadow:0 0 38px rgba(82,212,216,.35);
}
.web-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.web-cards>span{
  min-height:50px;
  padding:8px;
  border-radius:12px;
  background:rgba(255,255,255,.9);
  box-shadow:0 7px 14px rgba(20,38,61,.07);
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:6px;
}
.web-cards i{width:16px;height:16px;border-radius:6px;background:linear-gradient(135deg,#33d1be,#6d8aff)}
.web-cards b{font-size:.48rem;color:#42576a}
.web-cursor{
  position:absolute;
  z-index:5;
  left:58%;top:53%;
  width:13px;height:18px;
  background:#fff;
  clip-path:polygon(0 0,0 100%,30% 72%,47% 100%,61% 92%,44% 66%,78% 65%);
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.4));
  animation:webCursorTour 4.6s ease-in-out infinite;
}

/* Game screen */
.game-hud{
  position:absolute;z-index:3;
  top:0;left:0;right:0;height:17%;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 18px;
  color:#eff8ff;
  font-family:monospace;
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.06em;
  text-shadow:0 2px 0 rgba(0,0,0,.3);
  background:linear-gradient(180deg,rgba(8,14,24,.58),transparent);
}
.game-field{position:absolute;inset:0;overflow:hidden}
.game-sun{position:absolute;top:20%;right:14%;width:50px;height:50px;border-radius:50%;background:#ffd66d;box-shadow:0 0 38px rgba(255,214,109,.5)}
.game-cloud{position:absolute;height:16px;border-radius:999px;background:rgba(255,255,255,.78)}
.game-cloud::before,.game-cloud::after{content:"";position:absolute;border-radius:50%;background:inherit}
.game-cloud::before{width:19px;height:19px;left:7px;bottom:3px}
.game-cloud::after{width:23px;height:23px;left:23px;bottom:1px}
.cloud-a{top:25%;left:10%;width:58px;animation:cloudDrift 9s linear infinite}
.cloud-b{top:34%;left:40%;width:66px;animation:cloudDrift 12s linear infinite reverse}
.game-ground{position:absolute;left:0;right:0;bottom:0;height:23%;background:linear-gradient(180deg,#189d73,#0d7758)}
.game-ground::before{content:"";position:absolute;left:0;right:0;top:0;height:9px;background:repeating-linear-gradient(90deg,#9cf183 0 16px,#72da63 16px 32px)}
.game-platform{position:absolute;height:11px;border-radius:2px;background:#f7e6bd;box-shadow:0 4px 0 #c98f56,0 7px 0 rgba(0,0,0,.12)}
.platform-a{left:15%;bottom:35%;width:72px}
.platform-b{left:44%;bottom:47%;width:82px}
.platform-c{right:11%;bottom:36%;width:76px}
.game-coin{position:absolute;width:17px;height:17px;border-radius:50%;background:#ffd861;border:2px solid #fff1a5;box-shadow:0 0 0 3px rgba(255,216,97,.2);animation:coinFloat 1.35s ease-in-out infinite}
.coin-a{left:51%;bottom:57%}
.coin-b{right:21%;bottom:47%;animation-delay:.35s}
.game-player{
  position:absolute;left:21%;bottom:23%;
  width:25px;height:32px;
  border-radius:5px 5px 3px 3px;
  background:linear-gradient(180deg,#ff7757 0 38%,#334ab3 38% 100%);
  box-shadow:0 0 0 3px rgba(28,39,66,.12);
  animation:playerHop 2.15s ease-in-out infinite;
}
.game-player::before{content:"";position:absolute;top:-9px;left:4px;width:17px;height:17px;border-radius:50%;background:#ffd5bc;box-shadow:inset -3px -2px 0 rgba(202,126,95,.2)}
.game-player::after{content:"";position:absolute;bottom:5px;left:100%;width:42px;height:5px;border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,.26),transparent)}

@keyframes monitorFloat{0%,100%{transform:translateY(0) rotate(.25deg)}50%{transform:translateY(-9px) rotate(-.25deg)}}
@keyframes heroHaloFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.035)}}
@keyframes beamToGame{0%{left:-18%;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
@keyframes beamToWeb{0%{left:100%;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:-18%;opacity:0}}
@keyframes cloudDrift{0%,100%{transform:translateX(0)}50%{transform:translateX(17px)}}
@keyframes coinFloat{0%,100%{transform:translateY(0) rotateY(0)}50%{transform:translateY(-7px) rotateY(180deg)}}
@keyframes playerHop{0%,100%{transform:translate(0,0)}20%{transform:translate(14px,-17px)}40%{transform:translate(28px,-5px)}60%{transform:translate(46px,-25px)}80%{transform:translate(62px,0)}}
@keyframes screenPulse{0%{transform:scale(1)}35%{transform:scale(1.012)}100%{transform:scale(1)}}
@keyframes heroFlash{0%{opacity:.9}50%{opacity:1.18}100%{opacity:.9}}
@keyframes webCursorTour{0%,100%{transform:translate(0,0)}35%{transform:translate(48px,18px)}55%{transform:translate(48px,18px) scale(.88)}75%{transform:translate(-34px,50px)}}

@media (max-width:1100px){
  .hero-monitor-scene{max-width:500px}
  .chip-web{right:8px}
  .chip-game{left:8px}
  .hero-scene-caption{right:12px}
}
@media (max-width:920px){
  .hero-visual-empty{display:none!important;min-height:0!important}
}
@media (prefers-reduced-motion:reduce){
  .hero-monitor-scene,.hero-monitor-halo,.web-cursor,.game-cloud,.game-coin,.game-player{animation:none!important}
  .hero-screen-game{transition:none!important}
  .hero-transform-beam{display:none!important}
}


/* Hero compact cleanup: only core message + visual animation */
.hero{
  min-height:auto!important;
  padding:104px 0 20px!important;
}
.hero-layout{
  align-items:start!important;
}
.hero-copy{
  padding-top:22px;
}
.hero-copy .lead{
  margin-bottom:20px;
}
.hero-actions{
  margin:20px 0 0!important;
}
.hero-visual-empty{
  min-height:500px!important;
  margin-top:6px;
}
.hero-monitor-scene{
  width:min(100%,540px)!important;
}
.web-address{
  min-height:18px;
}
.web-mini-logo::before{
  content:"";
  width:16px;
  height:16px;
  border-radius:5px;
  border:2px solid rgba(255,255,255,.9);
  box-shadow:6px 5px 0 -3px rgba(255,255,255,.75);
}
.web-nav b{
  width:54px;
  height:6px;
  border-radius:999px;
  background:rgba(37,62,84,.2);
}
.web-hero-card>b{
  width:76px;
  height:6px;
  border-radius:999px;
  background:#79ebdd;
}
.web-hero-card>strong{
  width:62%;
  height:22px;
  border-radius:8px;
  background:rgba(255,255,255,.88);
}
.web-hero-card>em{
  width:48%;
  height:7px;
  border-radius:999px;
  background:rgba(255,255,255,.36);
}
.web-hero-card>span{
  width:70px;
  height:24px;
  border-radius:8px;
  background:#f5c159;
}
.web-cards b{
  width:70%;
  height:6px;
  border-radius:999px;
  background:rgba(66,87,106,.22);
}
.game-field{
  inset:0!important;
}
@media (max-width:1100px){
  .hero{
    padding-top:108px!important;
  }
  .hero-copy{
    padding-top:0;
  }
  .hero-visual-empty{
    margin-top:-18px;
  }
}
@media (max-width:920px){
  .hero{
    padding:108px 0 34px!important;
  }
}


@media (max-width:560px){
  .hero-visual-empty{
    min-height:290px!important;
    margin-top:6px!important;
  }
  .hero-monitor-scene{
    width:min(100%,350px)!important;
  }
  .hero-monitor-shell{
    max-width:350px;
    padding:14px 14px 58px;
    border-radius:24px;
  }
  .hero-monitor-brand{
    bottom:41px;
    font-size:.55rem;
  }
  .hero-monitor-stand{
    bottom:16px;
    width:92px;
    height:42px;
  }
  .hero-monitor-foot{
    width:172px;
    height:14px;
  }
  .hero-scene-chip{
    min-height:28px;
    padding:0 10px;
    font-size:.58rem;
    gap:6px;
  }
  .hero-scene-chip span{
    width:6px;
    height:6px;
  }
  .hero-scene-caption{
    padding:7px 10px;
    font-size:.64rem;
    right:8px;
    bottom:34px;
  }
}

/* Patch 10: premium hero monitor polish + visible responsive mobile scene */
.hero-monitor-scene::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:10% 1% 27%;
  border-radius:50%;
  background:conic-gradient(from 20deg,rgba(31,199,182,0),rgba(31,199,182,.34),rgba(103,135,255,.22),rgba(245,189,79,.18),rgba(31,199,182,0));
  filter:blur(7px);
  opacity:.72;
  animation:heroOrbitGlow 15s linear infinite;
  pointer-events:none;
}
.hero-monitor-scene::after{
  content:"";
  position:absolute;
  z-index:1;
  width:5px;
  height:5px;
  left:10%;
  top:22%;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  box-shadow:
    68px -25px 0 0 rgba(31,199,182,.75),
    385px 14px 0 1px rgba(103,135,255,.64),
    438px 164px 0 0 rgba(245,189,79,.72),
    41px 282px 0 1px rgba(31,199,182,.46),
    320px 330px 0 0 rgba(255,255,255,.72);
  filter:drop-shadow(0 0 8px currentColor);
  opacity:.62;
  animation:heroParticleDrift 7.6s ease-in-out infinite;
  pointer-events:none;
}
.hero-monitor-halo{
  z-index:0;
  background:
    radial-gradient(circle at 35% 52%,rgba(31,199,182,.4),transparent 47%),
    radial-gradient(circle at 70% 34%,rgba(103,135,255,.32),transparent 50%),
    radial-gradient(circle at 55% 72%,rgba(245,189,79,.14),transparent 48%);
}
.hero-monitor-shell{
  z-index:2;
  transition:transform .24s ease-out,box-shadow .35s ease;
  transform:translate(calc(var(--hero-drift-x, 0px) * .13),calc(var(--hero-drift-y, 0px) * .09));
  border-color:rgba(255,255,255,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -18px 34px rgba(0,0,0,.18),
    0 30px 64px rgba(7,20,31,.25),
    0 0 0 1px rgba(31,199,182,.08),
    0 0 38px rgba(103,135,255,.1);
}
.hero-monitor-shell::before{
  content:"";
  position:absolute;
  inset:5px;
  border-radius:25px;
  border:1px solid rgba(255,255,255,.075);
  pointer-events:none;
}
.hero-monitor-shell::after{
  content:"";
  position:absolute;
  left:13%;
  right:13%;
  top:2px;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.64),rgba(31,199,182,.45),transparent);
  opacity:.8;
  pointer-events:none;
}
.hero-monitor-screen{
  box-shadow:
    inset 0 0 0 2px rgba(0,0,0,.25),
    inset 0 0 28px rgba(0,0,0,.12),
    0 0 0 1px rgba(255,255,255,.07),
    0 0 24px rgba(31,199,182,.12),
    0 12px 30px rgba(0,0,0,.2);
}
.hero-screen-reflection{
  animation:heroScreenSheen 6.4s ease-in-out infinite;
}
.hero-monitor-foot{
  box-shadow:
    0 12px 28px rgba(7,20,31,.26),
    inset 0 1px 0 rgba(255,255,255,.16),
    0 0 24px rgba(31,199,182,.08);
}
.hero-scene-chip{
  z-index:5;
}
.hero-monitor-scene.is-web .chip-web,
.hero-monitor-scene.is-game .chip-game{
  box-shadow:0 16px 34px rgba(7,20,31,.2),0 0 22px rgba(31,199,182,.13);
}
.hero-scene-caption{
  z-index:5;
  background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(244,252,251,.68));
  backdrop-filter:blur(10px);
}
.web-preview-orb{
  animation:webOrbBreathe 5.2s ease-in-out infinite;
}
.game-sun{
  animation:gameSunBreathe 4.8s ease-in-out infinite;
}

@keyframes heroOrbitGlow{
  to{transform:rotate(360deg)}
}
@keyframes heroParticleDrift{
  0%,100%{transform:translate3d(0,0,0);opacity:.48}
  50%{transform:translate3d(7px,-10px,0);opacity:.82}
}
@keyframes heroScreenSheen{
  0%,22%,100%{transform:translateX(-18%) rotate(-16deg);opacity:.42}
  46%,68%{transform:translateX(56%) rotate(-16deg);opacity:.78}
}
@keyframes webOrbBreathe{
  0%,100%{transform:scale(1);filter:saturate(1)}
  50%{transform:scale(1.055);filter:saturate(1.12)}
}
@keyframes gameSunBreathe{
  0%,100%{transform:scale(1);box-shadow:0 0 38px rgba(255,214,109,.5)}
  50%{transform:scale(1.06);box-shadow:0 0 52px rgba(255,214,109,.67)}
}

@media (max-width:920px){
  .hero-layout{
    overflow:visible!important;
  }
  .hero-visual-empty{
    display:grid!important;
    width:100%;
    min-height:clamp(340px,66vw,470px)!important;
    margin:18px auto 0!important;
    place-items:center;
  }
  .hero-monitor-scene{
    width:min(calc(100% - 20px),470px)!important;
  }
  .hero-monitor-shell{
    transform:none;
  }
}

@media (max-width:560px){
  .hero{
    padding-bottom:24px!important;
  }
  .hero-visual-empty{
    min-height:330px!important;
    margin-top:16px!important;
  }
  .hero-monitor-scene{
    width:min(calc(100% - 12px),350px)!important;
  }
  .hero-monitor-scene::before{
    inset:9% 2% 25%;
    filter:blur(5px);
  }
  .hero-monitor-scene::after{
    left:13%;
    top:20%;
    transform:scale(.72);
    transform-origin:top left;
    opacity:.46;
  }
  .hero-monitor-shell::before{
    inset:4px;
    border-radius:20px;
  }
  .chip-web{
    top:3px;
    right:0;
  }
  .chip-game{
    left:0;
    bottom:69px;
  }
  .hero-scene-caption{
    right:0;
    bottom:25px;
  }
}

@media (max-width:380px){
  .hero-visual-empty{
    min-height:305px!important;
  }
  .hero-monitor-scene{
    width:min(calc(100% - 8px),326px)!important;
  }
  .hero-scene-chip{
    font-size:.53rem;
    padding-inline:8px;
  }
  .hero-scene-caption{
    font-size:.58rem;
  }
}

@media (prefers-reduced-motion:reduce){
  .hero-monitor-scene::before,
  .hero-monitor-scene::after,
  .hero-screen-reflection,
  .web-preview-orb,
  .game-sun{
    animation:none!important;
  }
}

@media (max-width:560px){
  .hero-monitor-scene::after{
    left:11%;
    top:22%;
    transform:none;
    box-shadow:
      46px -17px 0 0 rgba(31,199,182,.75),
      224px 7px 0 1px rgba(103,135,255,.64),
      278px 104px 0 0 rgba(245,189,79,.72),
      28px 188px 0 1px rgba(31,199,182,.46),
      208px 220px 0 0 rgba(255,255,255,.72);
  }
}

/* Patch 10b: clean miniature website preview + tighter first mobile viewport */
.web-nav b,
.web-hero-card>b,
.web-hero-card>strong,
.web-hero-card>em,
.web-hero-card>span,
.web-cards b{
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-shadow:none!important;
  overflow:hidden;
}

@media (max-width:560px){
  .hero{
    padding-top:96px!important;
  }
  .hero-copy h1{
    font-size:clamp(2rem,10.8vw,2.8rem)!important;
    margin-bottom:18px;
  }
  .hero-copy .eyebrow{
    margin-bottom:12px;
  }
  .hero-copy .lead{
    font-size:1rem;
    line-height:1.55;
    margin-bottom:14px;
  }
  .hero-actions{
    gap:10px;
    margin-top:14px!important;
  }
  .hero-actions .btn-frame,
  .hero-actions .btn-ink{
    min-height:50px;
  }
  .hero-visual-empty{
    margin-top:8px!important;
  }
}


/* Patch 11: SkyGen hero animated background + brand-aligned copy contrast */
.hero{
  background:linear-gradient(135deg,#06111d 0%,#0b1d2b 38%,#10273b 100%)!important;
  color:#f7fbff;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 32%,rgba(6,17,29,0) 62%,rgba(6,17,29,.22) 100%);
  pointer-events:none;
}
.hero::after{
  height:190px;
  background:linear-gradient(0deg,var(--paper),rgba(248,244,234,.12) 36%,transparent);
}
.hero-bg-animated{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}
.hero-bg-blob,
.hero-bg-grid,
.hero-bg-glow,
.hero-bg-spark{
  position:absolute;
  pointer-events:none;
}
.hero-bg-blob{
  border-radius:50%;
  filter:blur(28px);
  mix-blend-mode:screen;
  opacity:.6;
}
.hero-bg-blob.blob-a{
  width:32vw;
  min-width:280px;
  max-width:460px;
  aspect-ratio:1/1;
  left:-8%;
  top:10%;
  background:radial-gradient(circle at 30% 30%,rgba(31,199,182,.85),rgba(31,199,182,.25) 42%,rgba(31,199,182,0) 70%);
  animation:heroBlobDriftA 18s ease-in-out infinite;
}
.hero-bg-blob.blob-b{
  width:34vw;
  min-width:320px;
  max-width:520px;
  aspect-ratio:1/1;
  right:-10%;
  top:2%;
  background:radial-gradient(circle at 50% 45%,rgba(103,135,255,.78),rgba(103,135,255,.26) 45%,rgba(103,135,255,0) 72%);
  animation:heroBlobDriftB 22s ease-in-out infinite;
}
.hero-bg-blob.blob-c{
  width:28vw;
  min-width:260px;
  max-width:420px;
  aspect-ratio:1/1;
  right:18%;
  bottom:2%;
  background:radial-gradient(circle at 48% 48%,rgba(245,189,79,.5),rgba(255,107,74,.18) 46%,rgba(255,107,74,0) 74%);
  animation:heroBlobDriftC 20s ease-in-out infinite;
}
.hero-bg-grid{
  inset:0;
  opacity:.34;
  background:
    linear-gradient(rgba(151,180,204,.12) 1px,transparent 1px),
    linear-gradient(90deg,rgba(151,180,204,.12) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(circle at 50% 42%,rgba(0,0,0,1),rgba(0,0,0,.8) 32%,rgba(0,0,0,.26) 68%,transparent 100%);
  animation:heroGridFloat 16s linear infinite;
}
.hero-bg-grid::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.06) 50%,transparent 75%);
  transform:translateX(-120%);
  animation:heroGridSweep 11s ease-in-out infinite;
}
.hero-bg-glow{
  width:48%;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),rgba(255,255,255,0));
  box-shadow:0 0 18px rgba(255,255,255,.15);
  opacity:.72;
}
.hero-bg-glow.glow-a{left:9%;top:31%;transform:rotate(-12deg);animation:heroLineSlideA 9s ease-in-out infinite;}
.hero-bg-glow.glow-b{right:6%;bottom:29%;transform:rotate(7deg);animation:heroLineSlideB 12s ease-in-out infinite;}
.hero-bg-spark{
  width:8px;
  height:8px;
  border-radius:50%;
  background:rgba(255,255,255,.95);
  box-shadow:0 0 10px rgba(255,255,255,.55),0 0 22px rgba(31,199,182,.25);
  opacity:.75;
}
.hero-bg-spark::before,
.hero-bg-spark::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:18px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:translate(-50%,-50%);
}
.hero-bg-spark::after{transform:translate(-50%,-50%) rotate(90deg);}
.spark-a{left:18%;top:18%;animation:heroSparkFloat 7.4s ease-in-out infinite;}
.spark-b{right:21%;top:20%;animation:heroSparkFloat 8.2s ease-in-out infinite 1.4s;}
.spark-c{right:14%;bottom:26%;animation:heroSparkFloat 7.9s ease-in-out infinite .6s;}
.hero-orb{opacity:.22;filter:blur(34px);}
.hero-copy,.hero-copy h1,.hero-copy .lead{position:relative;z-index:3;}
.hero-copy h1{
  color:#ffffff;
  text-shadow:0 12px 42px rgba(0,0,0,.22);
}
.hero-copy .lead{
  color:rgba(232,242,249,.88)!important;
  max-width:700px;
}
.hero-copy .eyebrow{
  background:rgba(255,255,255,.09)!important;
  color:#dcfbf8!important;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 30px rgba(3,9,16,.14);
}
.hero-copy .eyebrow::before{
  background:#7ef3e5;
  box-shadow:0 0 0 6px rgba(126,243,229,.16);
}
.hero-actions .btn-ink{
  box-shadow:0 20px 46px rgba(31,199,182,.22);
}
.hero-actions .btn-frame{
  box-shadow:0 20px 46px rgba(0,0,0,.28);
}
.hero-monitor-halo{opacity:1;}
@keyframes heroBlobDriftA{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(56px,18px,0) scale(1.08)}}
@keyframes heroBlobDriftB{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-52px,28px,0) scale(1.1)}}
@keyframes heroBlobDriftC{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(24px,-26px,0) scale(1.06)}}
@keyframes heroGridFloat{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(22px,18px,0)}}
@keyframes heroGridSweep{0%,18%{transform:translateX(-120%);opacity:0}30%,62%{transform:translateX(18%);opacity:1}100%{transform:translateX(140%);opacity:0}}
@keyframes heroLineSlideA{0%,100%{transform:translateX(0) rotate(-12deg);opacity:.35}50%{transform:translateX(34px) rotate(-10deg);opacity:.82}}
@keyframes heroLineSlideB{0%,100%{transform:translateX(0) rotate(7deg);opacity:.4}50%{transform:translateX(-30px) rotate(8deg);opacity:.78}}
@keyframes heroSparkFloat{0%,100%{transform:translate3d(0,0,0) scale(1);opacity:.55}50%{transform:translate3d(0,-12px,0) scale(1.14);opacity:1}}
@media (max-width:920px){
  .hero-bg-grid{background-size:36px 36px;opacity:.28;}
  .hero-bg-blob.blob-a{left:-22%;top:16%;}
  .hero-bg-blob.blob-b{right:-22%;top:5%;}
  .hero-bg-blob.blob-c{right:4%;bottom:6%;}
}
@media (max-width:560px){
  .hero-copy .eyebrow{font-size:.71rem;line-height:1.3;}
  .hero-copy .lead{color:rgba(236,244,250,.9)!important;}
  .hero-bg-grid{background-size:28px 28px;opacity:.22;}
  .hero-bg-glow{width:64%;}
  .hero-bg-glow.glow-a{left:-4%;top:28%;}
  .hero-bg-glow.glow-b{right:-10%;bottom:34%;}
  .spark-a{left:12%;top:16%;}
  .spark-b{right:10%;top:22%;}
  .spark-c{right:9%;bottom:30%;}
}
@media (prefers-reduced-motion:reduce){
  .hero-bg-blob,.hero-bg-grid,.hero-bg-grid::after,.hero-bg-glow,.hero-bg-spark{animation:none!important;}
}


/* Patch 12: desktop hero spacing fix — move monitor southwest and remove bottom white strip */
@media (min-width:921px){
  .hero::after{
    display:none!important;
  }
  .hero-visual-empty{
    left:-30px;
    top:30px;
  }
}


/* Patch 13: stable desktop hero columns and fully visible monitor */
@media (min-width:921px){
  .hero::after{
    display:none!important;
  }
  .hero-layout{
    grid-template-columns:minmax(0, .95fr) minmax(500px, 1.05fr)!important;
    gap:52px!important;
    align-items:start!important;
  }
  .hero-copy{
    width:100%;
    max-width:570px;
    min-width:0;
    padding-top:22px!important;
  }
  .hero-copy h1{
    width:100%;
    max-width:570px;
    font-size:clamp(3.55rem,5.15vw,4.8rem)!important;
    line-height:.93!important;
    letter-spacing:-.055em!important;
    overflow:visible!important;
  }
  .hero-visual-empty{
    left:auto!important;
    top:auto!important;
    width:100%!important;
    min-width:0!important;
    min-height:500px!important;
    margin:30px 0 0 18px!important;
    display:grid!important;
    place-items:center!important;
    overflow:visible!important;
  }
  .hero-monitor-scene{
    width:min(100%,520px)!important;
    max-width:520px!important;
    margin:0 0 0 auto!important;
  }
  .hero-monitor-shell{
    display:block!important;
    width:100%!important;
    max-width:520px!important;
    opacity:1!important;
    visibility:visible!important;
  }
  .hero-monitor-screen{
    display:block!important;
    width:100%!important;
    opacity:1!important;
    visibility:visible!important;
  }
}
@media (min-width:921px) and (max-width:1240px){
  .hero-layout{
    grid-template-columns:minmax(0,1fr) minmax(460px,.95fr)!important;
    gap:34px!important;
  }
  .hero-copy{
    max-width:540px;
  }
  .hero-copy h1{
    max-width:540px;
    font-size:clamp(3.2rem,5.15vw,4.15rem)!important;
  }
  .hero-visual-empty{
    margin-left:10px!important;
  }
  .hero-monitor-scene{
    width:min(100%,475px)!important;
    max-width:475px!important;
  }
  .hero-monitor-shell{
    max-width:475px!important;
  }
}


/* Patch 14: hero primary CTA light gray for stronger contrast on dark background */
.hero-actions .btn-frame{
  background:#d6dbe1!important;
  color:#0b1620!important;
  box-shadow:0 20px 46px rgba(0,0,0,.22), 0 0 0 1px rgba(255,255,255,.14) inset!important;
}
.hero-actions .btn-frame span{
  color:#0b1620!important;
}
.hero-actions .btn-frame:before{
  border-color:rgba(255,255,255,.65)!important;
  opacity:.85;
}
.hero-actions .btn-frame:after{
  border-color:rgba(31,199,182,.46)!important;
}
.hero-actions .btn-frame:hover,
.hero-actions .btn-frame:focus-visible{
  background:#e4e8ed!important;
  color:#08121b!important;
  box-shadow:0 22px 54px rgba(0,0,0,.26), 0 0 0 1px rgba(255,255,255,.24) inset!important;
}
.hero-actions .btn-frame:hover span,
.hero-actions .btn-frame:focus-visible span{
  color:#08121b!important;
}


/* Patch 15: optimized video background under the second section */
.pain-video-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#fff;
  background:#07141f;
}
.pain-video-section .section-bg-video,
.pain-video-section .section-video-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.pain-video-section .section-bg-video{
  z-index:0;
  object-fit:cover;
  object-position:center center;
  filter:saturate(.94) contrast(1.04);
}
.pain-video-section .section-video-overlay{
  z-index:1;
  background:
    linear-gradient(90deg,rgba(5,15,25,.92) 0%,rgba(5,15,25,.83) 42%,rgba(5,15,25,.68) 100%),
    linear-gradient(180deg,rgba(5,15,25,.36),rgba(5,15,25,.68));
  pointer-events:none;
}
.pain-video-section > .container-wide{
  position:relative;
  z-index:2;
}
.pain-video-section h2{
  color:#fff;
  text-shadow:0 12px 34px rgba(0,0,0,.28);
}
.pain-video-section .seo-sales-intro,
.pain-video-section .pain-grid p{
  color:rgba(237,245,249,.84);
}
.pain-video-section .eyebrow{
  color:#d9fbf6;
  background:rgba(10,28,40,.56);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 14px 34px rgba(0,0,0,.18);
  backdrop-filter:blur(12px);
}
.pain-video-section .pain-grid article{
  color:#fff;
  background:linear-gradient(145deg,rgba(8,24,36,.78),rgba(13,38,52,.58));
  border-color:rgba(255,255,255,.16);
  box-shadow:0 22px 58px rgba(0,0,0,.24);
  backdrop-filter:blur(14px);
}
.pain-video-section .pain-grid span{
  color:#09262a;
  background:linear-gradient(135deg,#d7f8f3,#92e8dc);
  box-shadow:0 10px 24px rgba(31,199,182,.2);
}
.pain-video-section[data-scroll-blinds]::before{
  background:repeating-linear-gradient(90deg,#07141f 0 9%,#102839 9% 10%);
}
@media (max-width:760px){
  .pain-video-section .section-bg-video{
    object-position:58% center;
  }
  .pain-video-section .section-video-overlay{
    background:linear-gradient(180deg,rgba(5,15,25,.86),rgba(5,15,25,.78));
  }
}
@media (prefers-reduced-motion:reduce){
  .pain-video-section .section-bg-video{
    display:none;
  }
  .pain-video-section{
    background:
      linear-gradient(rgba(5,15,25,.8),rgba(5,15,25,.82)),
      url('../images/skygen-network-poster.webp') center/cover no-repeat;
  }
}

/* Patch 16: SkyGen First Impression Lab */
.impression-section-inner{
  position:relative;
  z-index:2;
}
.impression-intro{
  max-width:960px;
  margin:0 auto 48px;
  text-align:center;
}
.impression-intro .seo-sales-intro{
  max-width:850px;
  margin-inline:auto;
  font-size:1.08rem;
  line-height:1.75;
}
.impression-lab{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  border-radius:34px;
  background:linear-gradient(145deg,rgba(5,18,29,.88),rgba(9,31,45,.72));
  box-shadow:0 32px 90px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
}
.impression-lab::before{
  content:"";
  position:absolute;
  inset:-35% 48% 54% -18%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(31,199,182,.18),transparent 68%);
  pointer-events:none;
  animation:labAmbientFloat 9s ease-in-out infinite;
}
.lab-toolbar{
  position:relative;
  z-index:3;
  min-height:66px;
  padding:14px 18px 14px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid rgba(255,255,255,.11);
  background:rgba(4,14,23,.42);
}
.lab-toolbar-title{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  color:#fff;
  letter-spacing:.075em;
}
.lab-toolbar-title strong{font-size:.82rem;font-weight:950;}
.lab-toolbar-title small{
  padding:6px 9px;
  border-radius:999px;
  color:#b9f7ee;
  background:rgba(31,199,182,.12);
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.04em;
}
.lab-live-dot{
  width:9px;
  height:9px;
  flex:0 0 auto;
  border-radius:50%;
  background:#62ebd8;
  box-shadow:0 0 0 6px rgba(98,235,216,.1),0 0 18px rgba(98,235,216,.8);
  animation:labLivePulse 1.8s ease-in-out infinite;
}
.lab-replay{
  min-height:38px;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  color:#edf8fb;
  background:rgba(255,255,255,.06);
  font-size:.75rem;
  font-weight:900;
  cursor:pointer;
  transition:transform .25s ease,background .25s ease,border-color .25s ease;
}
.lab-replay span{display:inline-block;margin-right:4px;font-size:1rem;transition:transform .45s ease;}
.lab-replay:hover,.lab-replay:focus-visible{transform:translateY(-2px);background:rgba(31,199,182,.12);border-color:rgba(98,235,216,.45);}
.lab-replay:hover span{transform:rotate(-240deg);}
.lab-replay:focus-visible,.lab-scenario:focus-visible{outline:3px solid rgba(98,235,216,.42);outline-offset:3px;}
.lab-stage{
  position:relative;
  padding:26px 28px 28px;
}
.lab-journey{
  position:relative;
  height:72px;
  margin:0 20px 24px;
}
.lab-journey-line{
  position:absolute;
  left:7%;
  right:7%;
  top:20px;
  height:3px;
  overflow:hidden;
  border-radius:99px;
  background:rgba(255,255,255,.12);
}
.lab-journey-line span{
  display:block;
  width:10%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#56e7d4,#6d93ff,#f6bf5e);
  box-shadow:0 0 16px rgba(86,231,212,.45);
  transition:width 1.1s cubic-bezier(.2,.9,.2,1);
}
.lab-journey-step{
  position:absolute;
  top:0;
  display:grid;
  justify-items:center;
  gap:7px;
  color:rgba(230,241,247,.55);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.04em;
  transition:color .4s ease,transform .4s ease;
}
.lab-journey-step b{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#c9dae4;
  background:#112b3d;
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 8px 22px rgba(0,0,0,.2);
  transition:background .4s ease,color .4s ease,box-shadow .4s ease;
}
.lab-journey-step.is-search{left:7%;transform:translateX(-50%);}
.lab-journey-step.is-impression{left:50%;transform:translateX(-50%);}
.lab-journey-step.is-contact{left:93%;transform:translateX(-50%);}
.lab-visitor{
  position:absolute;
  z-index:5;
  left:7%;
  top:11px;
  width:20px;
  height:20px;
  transform:translateX(-50%);
  transition:left 1.1s cubic-bezier(.2,.9,.2,1),filter .4s ease;
}
.lab-visitor::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
  background:rgba(98,235,216,.12);
  animation:labVisitorPulse 1.6s ease-in-out infinite;
}
.lab-visitor i{
  position:absolute;
  inset:4px;
  border-radius:50%;
  background:#dffefa;
  box-shadow:0 0 16px #65ead7;
}
.lab-stage[data-phase="fail"] .is-search,
.lab-stage[data-phase="build"] .is-impression,
.lab-stage[data-phase="success"] .is-contact{color:#eafffc;}
.lab-stage[data-phase="fail"] .is-search b,
.lab-stage[data-phase="build"] .is-impression b,
.lab-stage[data-phase="success"] .is-contact b{
  color:#062326;
  background:#70eddc;
  box-shadow:0 0 0 7px rgba(112,237,220,.11),0 10px 28px rgba(31,199,182,.28);
}
.lab-stage[data-phase="fail"] .lab-visitor{left:7%;}
.lab-stage[data-phase="build"] .lab-visitor{left:50%;filter:hue-rotate(18deg);}
.lab-stage[data-phase="success"] .lab-visitor{left:93%;filter:hue-rotate(72deg);}
.lab-stage[data-phase="fail"] .lab-journey-line span{width:10%;}
.lab-stage[data-phase="build"] .lab-journey-line span{width:50%;}
.lab-stage[data-phase="success"] .lab-journey-line span{width:100%;}
.lab-stage-grid{
  display:grid;
  grid-template-columns:minmax(0,1.42fr) minmax(285px,.72fr);
  gap:24px;
  align-items:stretch;
}
.lab-browser{
  min-width:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.17);
  border-radius:24px;
  background:#dceaf1;
  box-shadow:0 26px 58px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.7);
}
.lab-browser-top{
  height:42px;
  display:grid;
  grid-template-columns:auto minmax(120px,1fr) auto;
  align-items:center;
  gap:14px;
  padding:0 14px;
  color:#698091;
  background:linear-gradient(180deg,#f5f9fb,#e9f0f4);
  border-bottom:1px solid rgba(15,39,55,.1);
}
.lab-window-dots{display:flex;gap:6px;}
.lab-window-dots i{width:8px;height:8px;border-radius:50%;background:#f07767;}
.lab-window-dots i:nth-child(2){background:#efbd57;}
.lab-window-dots i:nth-child(3){background:#54c9b8;}
.lab-browser-address{
  justify-self:center;
  width:min(86%,320px);
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border-radius:999px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(22,53,72,.08);
  font-size:.62rem;
}
.lab-browser-address span{width:6px;height:6px;border-radius:50%;background:#47c5b5;box-shadow:0 0 8px rgba(71,197,181,.5);}
.lab-browser-address b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lab-browser-secure{font-size:.7rem;color:#328c7f;font-weight:950;}
.lab-browser-screen{
  position:relative;
  height:348px;
  overflow:hidden;
  background:linear-gradient(145deg,#f7fbfd,#dfeef4);
  isolation:isolate;
}
.lab-search-state,.lab-build-state,.lab-site-state{
  position:absolute;
  inset:0;
  padding:30px;
  transition:opacity .55s ease,transform .75s cubic-bezier(.2,.85,.2,1),filter .55s ease;
}
.lab-search-state{
  display:grid;
  align-content:start;
  gap:28px;
  background:
    radial-gradient(circle at 80% 18%,rgba(100,139,255,.12),transparent 34%),
    linear-gradient(145deg,#f8fbfd,#e9f2f6);
}
.lab-search-bar{
  width:min(88%,470px);
  min-height:46px;
  margin:8px auto 0;
  padding:0 18px;
  display:flex;
  align-items:center;
  gap:12px;
  border-radius:999px;
  background:#fff;
  color:#526b7b;
  box-shadow:0 15px 36px rgba(28,62,82,.1),inset 0 0 0 1px rgba(31,65,85,.07);
  font-size:.76rem;
  font-weight:800;
}
.lab-search-bar i{
  width:15px;height:15px;border:2px solid #6b8392;border-radius:50%;position:relative;flex:0 0 auto;
}
.lab-search-bar i::after{content:"";position:absolute;width:7px;height:2px;right:-6px;bottom:-3px;background:#6b8392;transform:rotate(45deg);border-radius:99px;}
.lab-empty-result{
  width:min(84%,440px);
  margin:auto;
  padding:27px;
  display:grid;
  justify-items:center;
  gap:10px;
  text-align:center;
  border:1px dashed rgba(48,78,97,.22);
  border-radius:22px;
  color:#294556;
  background:rgba(255,255,255,.58);
}
.lab-empty-icon{
  width:58px;height:58px;display:grid;place-items:center;border-radius:18px;
  color:#9a4a44;background:#ffe6e2;font-size:1.35rem;font-weight:950;
  box-shadow:0 12px 26px rgba(204,81,68,.12);
}
.lab-empty-result strong{font-size:1.05rem;}
.lab-empty-result small{max-width:330px;color:#627987;line-height:1.5;}
.lab-build-state{
  display:grid;
  place-items:center;
  color:#fff;
  background:radial-gradient(circle at 50% 50%,#153b55,#071724 74%);
}
.lab-build-grid{
  position:absolute;inset:0;
  background:linear-gradient(rgba(117,235,220,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(117,235,220,.08) 1px,transparent 1px);
  background-size:28px 28px;
  mask-image:radial-gradient(circle,black,transparent 78%);
  animation:labGridMove 6s linear infinite;
}
.lab-build-core{
  position:relative;
  z-index:3;
  width:118px;height:118px;
  display:grid;place-items:center;align-content:center;gap:4px;
  border-radius:50%;
  background:radial-gradient(circle at 38% 32%,#50e3d0,#159e94 42%,#0b4d59 72%);
  box-shadow:0 0 0 13px rgba(77,229,210,.07),0 0 50px rgba(52,221,202,.38);
}
.lab-build-core span{position:absolute;inset:14px;border-radius:50%;border:1px solid rgba(255,255,255,.3);}
.lab-build-core b{font-size:.84rem;letter-spacing:.1em;}
.lab-build-core small{font-size:.57rem;color:rgba(255,255,255,.72);text-transform:uppercase;letter-spacing:.08em;}
.lab-build-ring{position:absolute;border:1px solid rgba(101,234,215,.3);border-radius:50%;animation:labRingSpin 8s linear infinite;}
.lab-build-ring::before,.lab-build-ring::after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:#65ead7;box-shadow:0 0 12px #65ead7;}
.lab-build-ring::before{left:8%;top:28%;}.lab-build-ring::after{right:12%;bottom:21%;}
.lab-build-ring.ring-a{width:210px;height:210px;}
.lab-build-ring.ring-b{width:285px;height:285px;animation-duration:12s;animation-direction:reverse;border-color:rgba(108,145,255,.22);}
.lab-build-packet{position:absolute;width:36px;height:22px;border-radius:7px;background:rgba(255,255,255,.88);box-shadow:0 9px 20px rgba(0,0,0,.18);animation:labPacketFly 2.1s ease-in-out infinite;}
.lab-build-packet::before{content:"";position:absolute;left:6px;right:6px;top:6px;height:3px;border-radius:99px;background:#4ccfbd;box-shadow:0 6px 0 rgba(72,95,115,.22);}
.packet-a{left:14%;top:26%;}.packet-b{right:13%;top:35%;animation-delay:.5s;}.packet-c{left:24%;bottom:18%;animation-delay:1s;}
.lab-site-state{
  padding:0;
  color:#172b39;
  background:linear-gradient(145deg,#f7fbfd,#eaf3f7);
}
.lab-site-nav{
  height:48px;
  padding:0 17px;
  display:flex;
  align-items:center;
  gap:9px;
  background:rgba(255,255,255,.82);
  border-bottom:1px solid rgba(24,54,72,.07);
}
.lab-site-logo{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;color:#fff;background:linear-gradient(135deg,#27cbb8,#6689f4);font-size:.7rem;font-weight:950;margin-right:auto;}
.lab-site-nav i{width:27px;height:5px;border-radius:99px;background:rgba(37,67,84,.13);}
.lab-site-nav b{padding:7px 9px;border-radius:7px;color:#06332f;background:#69dfcf;font-size:.47rem;}
.lab-site-hero{
  min-height:195px;
  padding:25px 27px;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(110px,.65fr);
  gap:18px;
  align-items:center;
  color:#fff;
  background:linear-gradient(135deg,#0b2031,#123d54 56%,#176f76);
}
.lab-site-hero>div:first-child{display:grid;justify-items:start;gap:8px;}
.lab-site-hero small{font-size:.48rem;color:#72e5d6;font-weight:950;letter-spacing:.11em;}
.lab-site-hero strong{max-width:420px;font-size:clamp(1.35rem,2.8vw,2.15rem);line-height:1;letter-spacing:-.055em;}
.lab-site-hero span{max-width:390px;font-size:.62rem;line-height:1.5;color:rgba(255,255,255,.72);}
.lab-site-hero>div:first-child>b{margin-top:3px;padding:8px 10px;border-radius:8px;color:#142534;background:#f4c45f;font-size:.48rem;}
.lab-site-orb{position:relative;width:118px;height:118px;justify-self:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#9bf5e9,#42c5cf 29%,#617ce7 63%,#233777);box-shadow:0 0 45px rgba(74,211,210,.28);animation:labOrbFloat 4s ease-in-out infinite;}
.lab-site-orb i{position:absolute;inset:20px;border:1px solid rgba(255,255,255,.35);border-radius:50%;transform:rotate(30deg);}
.lab-site-orb span{position:absolute;width:13px;height:13px;left:18px;top:33px;border-radius:50%;background:#fff;box-shadow:62px 47px 0 -2px rgba(255,255,255,.72);}
.lab-site-cards{height:90px;padding:12px 16px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.lab-site-cards>span{padding:10px;display:flex;align-items:center;gap:8px;border-radius:12px;background:#fff;box-shadow:0 8px 18px rgba(31,60,78,.08);}
.lab-site-cards i{width:19px;height:19px;border-radius:7px;background:linear-gradient(135deg,#3ad2bf,#6b8cf1);}
.lab-site-cards b{font-size:.55rem;color:#476071;}
.lab-site-cursor{position:absolute;z-index:4;left:70%;top:70%;width:14px;height:20px;background:#fff;clip-path:polygon(0 0,0 100%,31% 72%,48% 100%,63% 92%,45% 66%,79% 65%);filter:drop-shadow(0 2px 3px rgba(0,0,0,.45));animation:labCursorClick 2.5s ease-in-out infinite;}
.lab-scan-beam{position:absolute;z-index:8;top:0;bottom:0;left:-24%;width:22%;opacity:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),rgba(75,226,207,.6),transparent);filter:blur(2px);mix-blend-mode:screen;pointer-events:none;}
.lab-search-state{opacity:1;transform:none;}
.lab-build-state,.lab-site-state{opacity:0;transform:scale(.97);pointer-events:none;}
.lab-stage[data-phase="build"] .lab-search-state{opacity:0;transform:scale(.96);filter:blur(3px);}
.lab-stage[data-phase="build"] .lab-build-state{opacity:1;transform:none;}
.lab-stage[data-phase="build"] .lab-scan-beam{animation:labBeamSweep 1.45s cubic-bezier(.72,0,.18,1);}
.lab-stage[data-phase="success"] .lab-search-state,.lab-stage[data-phase="success"] .lab-build-state{opacity:0;transform:scale(.96);filter:blur(3px);}
.lab-stage[data-phase="success"] .lab-site-state{opacity:1;transform:none;}
.lab-narrative{
  min-width:0;
  padding:27px;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.13);
  border-radius:24px;
  color:#fff;
  background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.045));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.lab-phase-label{
  align-self:flex-start;
  padding:7px 9px;
  border-radius:999px;
  color:#ffd9d3;
  background:rgba(255,107,74,.13);
  font-size:.61rem;
  font-weight:950;
  letter-spacing:.085em;
  transition:color .4s ease,background .4s ease;
}
.lab-state-icon{
  position:relative;
  width:66px;height:66px;
  margin:22px 0 18px;
  display:grid;place-items:center;
  border-radius:20px;
  background:linear-gradient(145deg,#ff8a75,#b93f3c);
  box-shadow:0 15px 34px rgba(195,64,58,.2);
  transition:background .55s ease,transform .55s ease,box-shadow .55s ease;
}
.lab-state-icon span{width:8px;height:28px;border-radius:99px;background:#fff;}
.lab-state-icon i{position:absolute;width:8px;height:8px;bottom:12px;border-radius:50%;background:#fff;}
.lab-narrative h3{margin:0 0 10px;font-size:clamp(1.35rem,2.1vw,1.85rem);color:#fff;}
.lab-narrative p{margin:0;color:rgba(230,241,247,.72);line-height:1.65;font-size:.94rem;}
.lab-signal-bars{height:48px;margin:22px 0 18px;display:flex;align-items:flex-end;gap:7px;}
.lab-signal-bars span{width:12px;border-radius:5px 5px 2px 2px;background:#ff7f6a;box-shadow:0 0 12px rgba(255,127,106,.2);transition:height .55s ease,background .55s ease;}
.lab-signal-bars span:nth-child(1){height:18%;}.lab-signal-bars span:nth-child(2){height:31%;}.lab-signal-bars span:nth-child(3){height:22%;}.lab-signal-bars span:nth-child(4){height:42%;}
.lab-result-message{margin-top:auto;padding:13px 14px;display:flex;align-items:center;gap:10px;border-radius:15px;color:#ffdcd7;background:rgba(255,107,74,.1);border:1px solid rgba(255,128,105,.18);transition:color .4s ease,background .4s ease,border-color .4s ease;}
.lab-result-message span{width:27px;height:27px;flex:0 0 auto;display:grid;place-items:center;border-radius:9px;background:rgba(255,107,74,.18);font-weight:950;}
.lab-result-message strong{font-size:.76rem;line-height:1.35;}
.lab-progress{height:3px;margin-top:17px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.09);}
.lab-progress span{display:block;width:18%;height:100%;border-radius:inherit;background:#ff7f6a;transition:width 1s ease,background .4s ease;}
.lab-stage[data-phase="build"] .lab-phase-label{color:#d9e3ff;background:rgba(104,137,255,.14);}
.lab-stage[data-phase="build"] .lab-state-icon{background:linear-gradient(145deg,#6f92ff,#415bbd);transform:rotate(8deg);box-shadow:0 15px 34px rgba(80,107,212,.24);}
.lab-stage[data-phase="build"] .lab-state-icon span{width:30px;height:30px;border:2px dashed #fff;border-radius:50%;background:transparent;animation:labRingSpin 2s linear infinite;}
.lab-stage[data-phase="build"] .lab-state-icon i{display:none;}
.lab-stage[data-phase="build"] .lab-signal-bars span{background:#7696ff;}
.lab-stage[data-phase="build"] .lab-progress span{width:62%;background:#7696ff;}
.lab-stage[data-phase="build"] .lab-result-message{color:#e0e7ff;background:rgba(104,137,255,.1);border-color:rgba(104,137,255,.2);}
.lab-stage[data-phase="build"] .lab-result-message span{background:rgba(104,137,255,.18);}
.lab-stage[data-phase="success"] .lab-phase-label{color:#c9fff6;background:rgba(31,199,182,.13);}
.lab-stage[data-phase="success"] .lab-state-icon{background:linear-gradient(145deg,#65ead7,#159b91);transform:none;box-shadow:0 15px 38px rgba(31,199,182,.24);}
.lab-stage[data-phase="success"] .lab-state-icon span{width:28px;height:15px;border-left:5px solid #fff;border-bottom:5px solid #fff;border-radius:2px;background:transparent;transform:rotate(-45deg) translate(2px,-2px);}
.lab-stage[data-phase="success"] .lab-state-icon i{display:none;}
.lab-stage[data-phase="success"] .lab-signal-bars span{background:#56e5d1;}
.lab-stage[data-phase="success"] .lab-signal-bars span:nth-child(1){height:40%;}.lab-stage[data-phase="success"] .lab-signal-bars span:nth-child(2){height:62%;}.lab-stage[data-phase="success"] .lab-signal-bars span:nth-child(3){height:80%;}.lab-stage[data-phase="success"] .lab-signal-bars span:nth-child(4){height:100%;}
.lab-stage[data-phase="success"] .lab-progress span{width:100%;background:#56e5d1;}
.lab-stage[data-phase="success"] .lab-result-message{color:#d6fff9;background:rgba(31,199,182,.1);border-color:rgba(74,230,210,.22);}
.lab-stage[data-phase="success"] .lab-result-message span{background:rgba(31,199,182,.18);}
.lab-scenarios{
  position:relative;
  z-index:3;
  padding:0 28px 28px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.lab-scenario{
  min-width:0;
  min-height:104px;
  padding:16px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:13px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:19px;
  color:#fff;
  text-align:left;
  background:rgba(255,255,255,.045);
  cursor:pointer;
  transition:transform .3s ease,background .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.lab-scenario:hover{transform:translateY(-4px);background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.21);}
.lab-scenario.is-active{background:linear-gradient(145deg,rgba(31,199,182,.17),rgba(104,137,255,.08));border-color:rgba(91,232,214,.42);box-shadow:0 16px 34px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.08);}
.lab-scenario-no{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;color:#9cefe4;background:rgba(31,199,182,.1);font-size:.75rem;font-weight:950;}
.lab-scenario-copy{min-width:0;display:grid;gap:5px;}
.lab-scenario-copy strong{font-size:.83rem;line-height:1.2;}
.lab-scenario-copy small{color:rgba(225,238,245,.6);font-size:.68rem;line-height:1.4;}
.lab-scenario-arrow{font-size:1.1rem;color:rgba(255,255,255,.38);transition:transform .3s ease,color .3s ease;}
.lab-scenario.is-active .lab-scenario-arrow{transform:translateX(3px);color:#75eadb;}
@keyframes labAmbientFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(42px,24px,0)}}
@keyframes labLivePulse{0%,100%{opacity:.65;transform:scale(.9)}50%{opacity:1;transform:scale(1.12)}}
@keyframes labVisitorPulse{0%,100%{transform:scale(.8);opacity:.4}50%{transform:scale(1.25);opacity:.8}}
@keyframes labGridMove{to{transform:translate(28px,28px)}}
@keyframes labRingSpin{to{transform:rotate(360deg)}}
@keyframes labPacketFly{0%,100%{transform:translate3d(0,0,0) scale(.9);opacity:.45}50%{transform:translate3d(14px,-12px,0) scale(1.05);opacity:1}}
@keyframes labBeamSweep{0%{left:-24%;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:106%;opacity:0}}
@keyframes labOrbFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(3deg)}}
@keyframes labCursorClick{0%,100%{transform:translate(0,0)}48%{transform:translate(-23px,-26px)}58%{transform:translate(-23px,-26px) scale(.82)}75%{transform:translate(12px,-48px)}}
@media (max-width:980px){
  .lab-stage-grid{grid-template-columns:1fr;}
  .lab-narrative{display:grid;grid-template-columns:auto 1fr;column-gap:18px;align-items:start;}
  .lab-phase-label{grid-column:1/-1;}
  .lab-state-icon{grid-row:2/5;margin:18px 0 0;}
  .lab-narrative h3{margin-top:18px;}
  .lab-signal-bars,.lab-result-message,.lab-progress{grid-column:1/-1;}
  .lab-result-message{margin-top:0;}
}
@media (max-width:760px){
  .pain-video-section{padding:78px 0 84px;}
  .impression-intro{text-align:left;margin-bottom:32px;}
  .impression-intro .seo-sales-intro{font-size:1rem;}
  .impression-lab{border-radius:26px;}
  .lab-toolbar{padding:13px 14px;}
  .lab-toolbar-title small{display:none;}
  .lab-stage{padding:20px 14px 18px;}
  .lab-journey{margin:0 11px 20px;height:66px;}
  .lab-journey-step span{font-size:.59rem;}
  .lab-journey-step b{width:36px;height:36px;}
  .lab-journey-line{top:17px;}
  .lab-visitor{top:8px;}
  .lab-browser-screen{height:310px;}
  .lab-search-state,.lab-build-state{padding:20px;}
  .lab-site-hero{min-height:184px;padding:20px;grid-template-columns:1fr 96px;}
  .lab-site-orb{width:92px;height:92px;}
  .lab-site-hero strong{font-size:1.45rem;}
  .lab-site-cards{height:78px;padding:10px;gap:6px;}
  .lab-site-cards>span{padding:7px;}
  .lab-site-cards b{font-size:.48rem;}
  .lab-narrative{padding:21px;}
  .lab-scenarios{grid-template-columns:1fr;padding:0 14px 18px;gap:9px;}
  .lab-scenario{min-height:86px;}
}
@media (max-width:480px){
  .lab-toolbar-title strong{font-size:.68rem;letter-spacing:.045em;}
  .lab-replay{width:38px;padding:0;font-size:0;}
  .lab-replay span{margin:0;font-size:1rem;}
  .lab-journey{margin-inline:4px;}
  .lab-journey-step span{max-width:72px;text-align:center;line-height:1.15;}
  .lab-browser-top{grid-template-columns:auto 1fr;padding-inline:11px;gap:9px;}
  .lab-browser-secure{display:none;}
  .lab-browser-screen{height:285px;}
  .lab-search-state{gap:20px;padding:17px;}
  .lab-search-bar{width:100%;min-height:41px;font-size:.66rem;}
  .lab-empty-result{width:100%;padding:20px 15px;}
  .lab-empty-icon{width:48px;height:48px;}
  .lab-build-ring.ring-b{width:240px;height:240px;}
  .lab-build-ring.ring-a{width:174px;height:174px;}
  .lab-build-core{width:100px;height:100px;}
  .lab-site-nav{height:42px;padding-inline:10px;gap:5px;}
  .lab-site-nav i{width:17px;}
  .lab-site-nav b{font-size:.4rem;padding:6px;}
  .lab-site-hero{min-height:174px;padding:16px;grid-template-columns:1fr 72px;gap:9px;}
  .lab-site-orb{width:70px;height:70px;}
  .lab-site-hero strong{font-size:1.22rem;}
  .lab-site-hero span{font-size:.54rem;}
  .lab-site-cards{height:68px;}
  .lab-site-cards i{width:15px;height:15px;}
  .lab-site-cards b{display:none;}
  .lab-site-cards>span{justify-content:center;}
  .lab-narrative{grid-template-columns:1fr;}
  .lab-state-icon{grid-row:auto;width:58px;height:58px;margin:18px 0 13px;}
  .lab-narrative h3{margin-top:0;}
  .lab-signal-bars{margin-top:17px;}
  .lab-scenario{grid-template-columns:auto 1fr auto;padding:13px;}
  .lab-scenario-copy small{font-size:.64rem;}
}
@media (prefers-reduced-motion:reduce){
  .impression-lab::before,.lab-live-dot,.lab-visitor::before,.lab-build-grid,.lab-build-ring,.lab-build-packet,.lab-site-orb,.lab-site-cursor{animation:none!important;}
  .lab-search-state,.lab-build-state,.lab-site-state,.lab-visitor,.lab-journey-line span{transition:none!important;}
}

/* Patch 17: SkyGen Website X-Ray — interactive solution section */
.solution#mit-kapsz{
  position:relative;
  overflow:hidden;
}
.solution#mit-kapsz::after{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  right:-260px;
  top:120px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(31,199,182,.12),rgba(31,199,182,0) 68%);
  pointer-events:none;
}
.xray-lab{
  position:relative;
  z-index:2;
  max-width:1160px;
  margin:0 auto;
  border:1px solid rgba(7,20,31,.11);
  border-radius:34px;
  background:rgba(255,255,255,.76);
  box-shadow:0 30px 90px rgba(7,20,31,.12);
  overflow:hidden;
  backdrop-filter:blur(16px);
}
.xray-toolbar{
  min-height:74px;
  padding:14px 18px 14px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid rgba(7,20,31,.09);
  background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(242,247,248,.82));
}
.xray-toolbar-title{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.xray-toolbar-title>div{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.xray-toolbar-title strong{
  color:#102331;
  font-size:.77rem;
  letter-spacing:.105em;
  font-weight:950;
}
.xray-toolbar-title small{
  margin-top:3px;
  color:#657783;
  font-size:.76rem;
  font-weight:750;
}
.xray-live-dot{
  position:relative;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#1fc7b6;
  box-shadow:0 0 0 7px rgba(31,199,182,.12),0 0 20px rgba(31,199,182,.4);
  flex:0 0 auto;
}
.xray-live-dot::after{
  content:"";
  position:absolute;
  inset:-7px;
  border:1px solid rgba(31,199,182,.34);
  border-radius:50%;
  animation:xrayLivePulse 2.4s ease-out infinite;
}
.xray-replay{
  border:1px solid rgba(7,20,31,.12);
  border-radius:999px;
  min-height:40px;
  padding:0 15px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#fff;
  color:#203744;
  font-weight:900;
  font-size:.78rem;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(7,20,31,.07);
  transition:transform .22s ease,background .22s ease,box-shadow .22s ease;
}
.xray-replay span{
  font-size:1.05rem;
}
.xray-replay:hover{
  transform:translateY(-2px);
  background:#f7fbfb;
  box-shadow:0 12px 26px rgba(7,20,31,.1);
}
.xray-layout{
  display:grid;
  grid-template-columns:minmax(260px,320px) minmax(0,1fr);
  min-height:650px;
}
.xray-controls{
  padding:20px;
  display:grid;
  align-content:center;
  gap:12px;
  background:linear-gradient(180deg,rgba(248,250,251,.92),rgba(238,243,245,.78));
  border-right:1px solid rgba(7,20,31,.08);
}
.xray-control{
  position:relative;
  width:100%;
  min-height:108px;
  padding:17px 16px;
  border-radius:22px;
  border:1px solid rgba(7,20,31,.09);
  background:rgba(255,255,255,.88);
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:10px 12px;
  text-align:left;
  color:#182d3a;
  cursor:pointer;
  overflow:hidden;
  box-shadow:0 10px 25px rgba(7,20,31,.055);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease,background .28s ease;
}
.xray-control::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:linear-gradient(180deg,#1fc7b6,#6887ff);
  transform:scaleY(0);
  transition:transform .32s cubic-bezier(.2,.85,.2,1);
}
.xray-control:hover{
  transform:translateX(4px);
  border-color:rgba(31,199,182,.28);
}
.xray-control.is-active{
  background:#102331;
  color:#fff;
  border-color:#102331;
  box-shadow:0 18px 38px rgba(16,35,49,.2);
  transform:translateX(4px);
}
.xray-control.is-active::before{
  transform:scaleY(1);
}
.xray-control-number{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:12px;
  background:#eaf6f4;
  color:#087b70;
  font-size:.72rem;
  font-weight:950;
  letter-spacing:.06em;
}
.xray-control.is-active .xray-control-number{
  background:rgba(126,243,229,.13);
  color:#8af5e8;
}
.xray-control-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.xray-control-copy strong{
  font-size:.97rem;
  line-height:1.15;
  font-weight:950;
}
.xray-control-copy small{
  color:#667782;
  font-size:.75rem;
  line-height:1.45;
  font-weight:700;
}
.xray-control.is-active .xray-control-copy small{
  color:rgba(231,242,248,.72);
}
.xray-control-state{
  grid-column:2;
  width:max-content;
  padding:4px 7px;
  border-radius:999px;
  background:#f0f4f6;
  color:#6e808b;
  font-size:.56rem;
  font-weight:950;
  letter-spacing:.105em;
}
.xray-control.is-active .xray-control-state{
  background:rgba(255,255,255,.08);
  color:#9edfd8;
}
.xray-stage{
  position:relative;
  min-width:0;
  min-height:650px;
  padding:34px 34px 24px;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  background:
    radial-gradient(circle at 50% 25%,rgba(31,199,182,.12),transparent 34%),
    linear-gradient(145deg,#0c1b28 0%,#132a3b 54%,#102230 100%);
  overflow:hidden;
}
.xray-stage-grid{
  position:absolute;
  inset:0;
  opacity:.28;
  background:
    linear-gradient(rgba(143,172,193,.13) 1px,transparent 1px),
    linear-gradient(90deg,rgba(143,172,193,.13) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(180deg,#000,rgba(0,0,0,.55) 70%,transparent);
  pointer-events:none;
}
.xray-device-zone{
  position:relative;
  z-index:2;
  min-height:500px;
  display:grid;
  place-items:center;
  padding:16px 10px 10px;
}
.xray-device{
  --device-width:min(100%,680px);
  --device-ratio:16/10;
  position:relative;
  width:var(--device-width);
  aspect-ratio:var(--device-ratio);
  border-radius:24px;
  padding:9px;
  background:linear-gradient(145deg,#34485c,#172533 58%,#0d1822);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 30px 66px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.18);
  transition:width .72s cubic-bezier(.2,.8,.2,1),aspect-ratio .72s cubic-bezier(.2,.8,.2,1),border-radius .5s ease,transform .5s ease;
  overflow:hidden;
}
.xray-device[data-device="tablet"]{
  --device-width:min(76%,480px);
  --device-ratio:4/3;
  border-radius:28px;
}
.xray-device[data-device="mobile"]{
  --device-width:min(42%,250px);
  --device-ratio:9/16;
  border-radius:32px;
}
.xray-device-top{
  height:10%;
  min-height:28px;
  padding:0 9px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:10px;
  color:#b8cad5;
}
.xray-device-dots{
  display:flex;
  gap:4px;
}
.xray-device-dots i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#7e94a3;
}
.xray-device-dots i:nth-child(1){background:#ff8676}
.xray-device-dots i:nth-child(2){background:#f5bd4f}
.xray-device-dots i:nth-child(3){background:#55d5c6}
.xray-device-address{
  justify-self:center;
  width:min(62%,250px);
  min-height:20px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:.5rem;
  font-weight:800;
  letter-spacing:.04em;
}
.xray-device-address span{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#63decf;
  box-shadow:0 0 8px rgba(99,222,207,.7);
}
.xray-device-status{
  font-size:.46rem;
  letter-spacing:.08em;
  font-weight:950;
  color:#75d9ce;
}
.xray-screen{
  position:relative;
  width:100%;
  height:90%;
  border-radius:16px;
  overflow:hidden;
  background:#f5f8fa;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.15),inset 0 0 24px rgba(15,35,50,.08);
}
.xray-site-preview{
  position:absolute;
  inset:0;
  padding:4.5% 5%;
  display:grid;
  grid-template-rows:auto 1.18fr .52fr .75fr;
  gap:4.5%;
  background:linear-gradient(180deg,#fbfdff,#edf4f6);
  transition:filter .45s ease,opacity .45s ease;
}
.xray-site-nav{
  display:flex;
  align-items:center;
  gap:4%;
  min-width:0;
}
.xray-site-logo{
  width:24px;
  height:24px;
  border-radius:8px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#1fc7b6,#6689ff);
  color:#fff;
  font-size:.62rem;
  font-weight:950;
  box-shadow:0 6px 14px rgba(31,199,182,.23);
}
.xray-site-nav i{
  width:9%;
  height:5px;
  border-radius:99px;
  background:#cbd8de;
}
.xray-site-nav i:first-of-type{margin-left:auto}
.xray-site-nav b{
  padding:6px 8px;
  border-radius:7px;
  background:#112938;
  color:#fff;
  font-size:.38rem;
  letter-spacing:.05em;
}
.xray-site-hero{
  position:relative;
  overflow:hidden;
  border-radius:15px;
  padding:6%;
  display:grid;
  grid-template-columns:1.12fr .88fr;
  align-items:center;
  gap:4%;
  background:linear-gradient(135deg,#10293a,#175266 62%,#20a697 145%);
  color:#fff;
  box-shadow:0 12px 25px rgba(20,42,57,.14);
}
.xray-site-copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}
.xray-site-copy small{
  color:#82eee2;
  font-size:.4rem;
  letter-spacing:.1em;
  font-weight:950;
}
.xray-site-copy strong{
  max-width:95%;
  font-size:clamp(.68rem,1.5vw,1.1rem);
  line-height:1.05;
  letter-spacing:-.035em;
}
.xray-site-copy span{
  max-width:95%;
  color:rgba(255,255,255,.69);
  font-size:.42rem;
  line-height:1.4;
}
.xray-site-copy b{
  margin-top:2px;
  padding:6px 8px;
  border-radius:7px;
  background:#f5c158;
  color:#132839;
  font-size:.38rem;
  letter-spacing:.04em;
}
.xray-site-art{
  position:relative;
  justify-self:center;
  width:min(90%,150px);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#9cf8eb 0 11%,#4bd5dc 12% 35%,#5f80f0 36% 64%,#293f8e 65% 100%);
  box-shadow:0 0 40px rgba(82,216,218,.34);
}
.xray-site-art span,
.xray-site-art i,
.xray-site-art b{
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.5);
}
.xray-site-art span{inset:12%}
.xray-site-art i{inset:27%}
.xray-site-art b{width:12%;aspect-ratio:1;left:19%;top:24%;background:#fff;border:0;box-shadow:0 0 14px #fff}
.xray-site-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:3%;
}
.xray-site-cards>span{
  padding:7%;
  border-radius:10px;
  background:#fff;
  box-shadow:0 6px 14px rgba(23,45,59,.07);
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:8%;
}
.xray-site-cards i{
  width:17px;
  height:17px;
  border-radius:6px;
  background:linear-gradient(135deg,#36cfbd,#738dff);
}
.xray-site-cards b{
  width:72%;
  height:5px;
  border-radius:99px;
  background:#cbd8df;
}
.xray-site-contact{
  padding:4% 5%;
  border-radius:12px;
  background:#fff;
  display:grid;
  grid-template-columns:1fr .8fr;
  gap:5%;
  box-shadow:0 7px 16px rgba(23,45,59,.06);
}
.xray-site-contact>div:first-child{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
}
.xray-site-contact small{font-size:.35rem;color:#0d9488;font-weight:950;letter-spacing:.09em}
.xray-site-contact strong{font-size:.55rem;line-height:1.15;color:#263f4d}
.xray-site-contact>div:first-child span{width:62%;height:4px;border-radius:99px;background:#d7e1e6}
.xray-mini-form{
  display:grid;
  gap:4px;
  align-content:center;
}
.xray-mini-form i{height:7px;border-radius:4px;background:#edf2f4;border:1px solid #dce6ea}
.xray-mini-form b{height:12px;border-radius:5px;background:#1fc7b6;color:#0c302d;font-size:.3rem;display:grid;place-items:center}
.xray-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  visibility:hidden;
  transition:opacity .42s ease,visibility .42s ease;
}
.xray-lab[data-mode="responsive"] .xray-responsive-layer,
.xray-lab[data-mode="content"] .xray-content-layer,
.xray-lab[data-mode="contact"] .xray-contact-layer,
.xray-lab[data-mode="tech"] .xray-tech-layer{
  opacity:1;
  visibility:visible;
}
.xray-lab[data-mode="tech"] .xray-site-preview{
  filter:grayscale(.5) brightness(.66) saturate(.55);
}
.xray-ruler{
  position:absolute;
  color:rgba(41,119,134,.8);
}
.ruler-top{
  left:7%;right:7%;top:5%;height:9px;
  border-top:1px solid currentColor;
  background:repeating-linear-gradient(90deg,currentColor 0 1px,transparent 1px 18px);
}
.ruler-side{
  top:8%;bottom:8%;right:3%;width:9px;
  border-right:1px solid currentColor;
  background:repeating-linear-gradient(180deg,currentColor 0 1px,transparent 1px 18px);
}
.xray-viewport-badge{
  position:absolute;
  right:5%;
  top:8%;
  padding:7px 9px;
  border-radius:9px;
  background:rgba(8,27,38,.86);
  color:#fff;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1px 6px;
  align-items:center;
  backdrop-filter:blur(7px);
}
.xray-viewport-badge i{grid-row:1/3;width:7px;height:7px;border-radius:50%;background:#62dfd0;box-shadow:0 0 8px #62dfd0}
.xray-viewport-badge strong{font-size:.38rem;letter-spacing:.07em}
.xray-viewport-badge small{font-size:.34rem;color:#9fb7c4;font-weight:850}
.xray-corner{
  position:absolute;
  width:18px;
  height:18px;
  border-color:#35bbae;
  border-style:solid;
}
.corner-a{left:3%;top:4%;border-width:2px 0 0 2px}
.corner-b{right:3%;top:4%;border-width:2px 2px 0 0}
.corner-c{left:3%;bottom:4%;border-width:0 0 2px 2px}
.corner-d{right:3%;bottom:4%;border-width:0 2px 2px 0}
.xray-content-layer{
  background:rgba(8,24,34,.08);
}
.xray-content-focus{
  position:absolute;
  border:1px solid rgba(31,199,182,.95);
  border-radius:7px;
  box-shadow:0 0 0 999px rgba(6,18,27,.14),0 0 18px rgba(31,199,182,.24);
  animation:xrayFocusPulse 3s ease-in-out infinite;
}
.xray-content-focus span{
  position:absolute;
  left:0;
  bottom:calc(100% + 4px);
  padding:3px 5px;
  border-radius:4px;
  background:#123542;
  color:#8ef5e9;
  font-size:.3rem;
  letter-spacing:.07em;
  font-weight:950;
  white-space:nowrap;
}
.focus-title{left:8%;top:24%;width:35%;height:14%}
.focus-copy{left:8%;top:39%;width:32%;height:10%;animation-delay:.35s}
.focus-cta{left:8%;top:51%;width:17%;height:10%;animation-delay:.7s}
.focus-services{left:5%;right:5%;top:65%;height:13%;animation-delay:1.05s}
.xray-content-guide{
  position:absolute;
  background:linear-gradient(90deg,transparent,rgba(31,199,182,.75),transparent);
}
.guide-a{left:4%;right:4%;top:63%;height:1px}
.guide-b{top:4%;bottom:4%;left:48%;width:1px;background:linear-gradient(180deg,transparent,rgba(31,199,182,.45),transparent)}
.xray-contact-layer{
  background:rgba(4,19,28,.07);
}
.xray-contact-path{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
}
.xray-contact-path path{
  fill:none;
  stroke:#22cbb9;
  stroke-width:1.25;
  stroke-linecap:round;
  stroke-dasharray:4 3;
  filter:drop-shadow(0 0 5px rgba(34,203,185,.7));
  animation:xrayRoute 2.8s linear infinite;
}
.xray-contact-dot{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#f5bd4f;
  box-shadow:0 0 0 6px rgba(245,189,79,.16),0 0 14px rgba(245,189,79,.7);
}
.dot-start{left:29%;top:40%}
.dot-end{left:78%;top:82%;background:#34d2bf;box-shadow:0 0 0 6px rgba(52,210,191,.16),0 0 14px rgba(52,210,191,.7)}
.xray-contact-toast{
  position:absolute;
  right:4%;
  bottom:5%;
  min-width:180px;
  padding:9px 10px;
  border-radius:11px;
  background:rgba(14,39,51,.94);
  color:#fff;
  display:flex;
  align-items:center;
  gap:9px;
  box-shadow:0 12px 28px rgba(0,0,0,.24);
  animation:xrayToastIn 3.2s ease-in-out infinite;
}
.xray-contact-toast>span{
  width:24px;
  height:24px;
  border-radius:8px;
  background:#1fc7b6;
  color:#062a28;
  display:grid;
  place-items:center;
  font-size:.68rem;
  font-weight:950;
}
.xray-contact-toast div{display:flex;flex-direction:column;gap:2px}
.xray-contact-toast strong{font-size:.54rem}
.xray-contact-toast small{font-size:.42rem;color:#aac0cc;font-weight:750}
.xray-tech-layer{
  background:rgba(5,19,29,.64);
}
.xray-tech-blueprint{
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(102,178,194,.16) 1px,transparent 1px),
    linear-gradient(90deg,rgba(102,178,194,.16) 1px,transparent 1px);
  background-size:22px 22px;
  mask-image:radial-gradient(circle at 50% 50%,#000,rgba(0,0,0,.74) 62%,transparent 95%);
}
.xray-tech-blueprint::before,
.xray-tech-blueprint::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  background:rgba(84,225,210,.35);
  transform:translate(-50%,-50%);
}
.xray-tech-blueprint::before{width:72%;height:1px}
.xray-tech-blueprint::after{height:72%;width:1px}
.xray-tech-core{
  position:absolute;
  left:50%;
  top:50%;
  width:94px;
  height:94px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:2px;
  color:#fff;
  background:radial-gradient(circle,#173f4e,#0b2633 68%);
  border:1px solid rgba(101,236,222,.58);
  box-shadow:0 0 0 11px rgba(31,199,182,.08),0 0 38px rgba(31,199,182,.23);
  animation:xrayCoreFloat 4.2s ease-in-out infinite;
}
.xray-tech-core span{width:8px;height:8px;border-radius:50%;background:#70eadc;box-shadow:0 0 10px #70eadc}
.xray-tech-core b{font-size:.68rem;letter-spacing:.1em}
.xray-tech-core small{font-size:.34rem;letter-spacing:.08em;color:#91aebc;font-weight:900}
.xray-tech-node{
  position:absolute;
  min-width:112px;
  padding:7px 9px 7px 28px;
  border-radius:10px;
  background:rgba(15,43,55,.88);
  border:1px solid rgba(105,226,213,.26);
  color:#fff;
  display:flex;
  flex-direction:column;
  gap:1px;
  box-shadow:0 9px 20px rgba(0,0,0,.16);
}
.xray-tech-node::after{
  content:"";
  position:absolute;
  top:50%;
  width:70px;
  height:1px;
  background:linear-gradient(90deg,rgba(96,228,214,.8),transparent);
}
.xray-tech-node i{
  position:absolute;
  left:10px;
  top:50%;
  width:9px;
  height:9px;
  transform:translateY(-50%);
  border-radius:3px;
  background:#36cbbb;
  box-shadow:0 0 10px rgba(54,203,187,.68);
}
.xray-tech-node strong{font-size:.45rem;letter-spacing:.06em}
.xray-tech-node small{font-size:.36rem;color:#9eb7c3;font-weight:750}
.node-seo{left:7%;top:16%}
.node-seo::after,.node-safe::after{left:100%}
.node-speed{right:7%;top:17%}
.node-speed::after,.node-mobile::after{right:100%;transform:rotate(180deg)}
.node-safe{left:8%;bottom:15%}
.node-mobile{right:8%;bottom:14%}
.xray-scan-line{
  position:absolute;
  z-index:20;
  left:0;
  right:0;
  top:-8%;
  height:8%;
  background:linear-gradient(180deg,transparent,rgba(104,234,220,.2),rgba(104,234,220,.52),transparent);
  filter:blur(.3px);
  opacity:0;
  pointer-events:none;
}
.xray-lab[data-mode="content"] .xray-scan-line,
.xray-lab[data-mode="tech"] .xray-scan-line{
  opacity:1;
  animation:xrayScan 4.4s ease-in-out infinite;
}
.xray-info{
  position:relative;
  z-index:3;
  min-height:96px;
  margin-top:12px;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.1);
  color:#fff;
  display:grid;
  grid-template-columns:46px 1fr;
  gap:13px;
  align-items:center;
  backdrop-filter:blur(10px);
}
.xray-info-icon{
  width:46px;
  height:46px;
  border-radius:15px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,rgba(31,199,182,.24),rgba(103,135,255,.2));
  border:1px solid rgba(126,243,229,.18);
  color:#8af5e8;
  font-size:1.25rem;
  font-weight:900;
}
.xray-info>div{
  min-width:0;
}
.xray-info small{
  display:block;
  margin-bottom:3px;
  color:#77dfd3;
  font-size:.57rem;
  font-weight:950;
  letter-spacing:.1em;
}
.xray-info strong{
  display:block;
  font-size:.98rem;
  line-height:1.2;
}
.xray-info p{
  margin:4px 0 0;
  color:#b8cbd6;
  font-size:.76rem;
  line-height:1.5;
}
.xray-device[data-device="tablet"] .xray-site-preview{padding:5%;grid-template-rows:auto 1.22fr .56fr .74fr}
.xray-device[data-device="tablet"] .xray-site-nav i:nth-of-type(3){display:none}
.xray-device[data-device="tablet"] .xray-site-copy strong{font-size:.92rem}
.xray-device[data-device="mobile"] .xray-device-top{padding-inline:6px;grid-template-columns:auto 1fr}
.xray-device[data-device="mobile"] .xray-device-status{display:none}
.xray-device[data-device="mobile"] .xray-device-address{width:78%;font-size:.38rem}
.xray-device[data-device="mobile"] .xray-site-preview{padding:7%;grid-template-rows:auto 1.25fr .7fr .82fr;gap:4%}
.xray-device[data-device="mobile"] .xray-site-nav i{display:none}
.xray-device[data-device="mobile"] .xray-site-nav b{margin-left:auto;font-size:.28rem;padding:4px 5px}
.xray-device[data-device="mobile"] .xray-site-logo{width:19px;height:19px;border-radius:6px}
.xray-device[data-device="mobile"] .xray-site-hero{grid-template-columns:1fr;padding:9%;}
.xray-device[data-device="mobile"] .xray-site-art{position:absolute;width:65px;right:-15px;bottom:-14px;opacity:.7}
.xray-device[data-device="mobile"] .xray-site-copy{gap:4px}
.xray-device[data-device="mobile"] .xray-site-copy strong{font-size:.64rem;max-width:88%}
.xray-device[data-device="mobile"] .xray-site-copy span{font-size:.32rem;max-width:82%}
.xray-device[data-device="mobile"] .xray-site-copy b{font-size:.28rem;padding:4px 5px}
.xray-device[data-device="mobile"] .xray-site-cards{grid-template-columns:1fr;gap:4px}
.xray-device[data-device="mobile"] .xray-site-cards>span{padding:4%;grid-template-columns:auto 1fr}
.xray-device[data-device="mobile"] .xray-site-cards i{width:11px;height:11px;border-radius:4px}
.xray-device[data-device="mobile"] .xray-site-contact{grid-template-columns:1fr;padding:6%;gap:5px}
.xray-device[data-device="mobile"] .xray-site-contact strong{font-size:.42rem}
.xray-device[data-device="mobile"] .xray-mini-form i:nth-child(2){display:none}
.xray-device[data-device="mobile"] .xray-viewport-badge{right:7%;top:6%;padding:5px 6px}
.xray-device[data-device="mobile"] .xray-viewport-badge strong{font-size:.28rem}
.xray-device[data-device="mobile"] .xray-viewport-badge small{font-size:.25rem}
@keyframes xrayLivePulse{0%{transform:scale(.65);opacity:.8}80%,100%{transform:scale(1.55);opacity:0}}
@keyframes xrayFocusPulse{0%,100%{border-color:rgba(31,199,182,.62)}50%{border-color:rgba(126,243,229,1)}}
@keyframes xrayRoute{to{stroke-dashoffset:-28}}
@keyframes xrayToastIn{0%,18%{transform:translateY(12px);opacity:0}35%,78%{transform:none;opacity:1}100%{transform:translateY(-5px);opacity:0}}
@keyframes xrayCoreFloat{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-53%) scale(1.025)}}
@keyframes xrayScan{0%,12%{top:-8%;opacity:0}24%{opacity:1}82%{opacity:1}100%{top:100%;opacity:0}}
@media (max-width:980px){
  .xray-layout{grid-template-columns:1fr;min-height:0}
  .xray-controls{
    grid-template-columns:repeat(2,minmax(0,1fr));
    border-right:0;
    border-bottom:1px solid rgba(7,20,31,.08);
    padding:16px;
  }
  .xray-control{min-height:98px}
  .xray-stage{min-height:620px}
  .xray-device-zone{min-height:470px}
}
@media (max-width:680px){
  .xray-lab{border-radius:26px}
  .xray-toolbar{padding:13px 14px;min-height:68px}
  .xray-toolbar-title strong{font-size:.68rem}
  .xray-toolbar-title small{font-size:.66rem}
  .xray-replay{padding:0 11px;font-size:.68rem}
  .xray-controls{grid-template-columns:1fr;gap:9px;padding:13px}
  .xray-control{
    min-height:82px;
    padding:13px;
    grid-template-columns:31px 1fr auto;
    align-items:center;
  }
  .xray-control:hover,.xray-control.is-active{transform:none}
  .xray-control-number{width:31px;height:31px}
  .xray-control-copy small{display:none}
  .xray-control-state{grid-column:3;grid-row:1}
  .xray-stage{padding:20px 13px 15px;min-height:500px}
  .xray-device-zone{min-height:365px;padding:4px 0}
  .xray-device{--device-width:min(100%,500px)}
  .xray-device[data-device="tablet"]{--device-width:min(79%,370px)}
  .xray-device[data-device="mobile"]{--device-width:min(48%,210px)}
  .xray-device-top{min-height:23px}
  .xray-device-status{display:none}
  .xray-contact-toast{min-width:142px;right:3%;padding:7px}
  .xray-contact-toast>span{width:20px;height:20px}
  .xray-contact-toast strong{font-size:.44rem}
  .xray-contact-toast small{font-size:.34rem}
  .xray-tech-node{min-width:88px;padding:6px 7px 6px 24px}
  .xray-tech-node strong{font-size:.36rem}
  .xray-tech-node small{font-size:.29rem}
  .xray-tech-node::after{width:40px}
  .xray-tech-core{width:76px;height:76px}
  .xray-info{grid-template-columns:40px 1fr;padding:12px;min-height:88px}
  .xray-info-icon{width:40px;height:40px;border-radius:13px}
  .xray-info strong{font-size:.86rem}
  .xray-info p{font-size:.68rem}
}
@media (max-width:430px){
  .xray-toolbar-title small{display:none}
  .xray-replay{font-size:0;width:40px;padding:0}
  .xray-replay span{font-size:1rem}
  .xray-stage{min-height:470px}
  .xray-device-zone{min-height:335px}
  .xray-device{border-radius:18px;padding:6px}
  .xray-device[data-device="mobile"]{border-radius:24px}
  .xray-device-address{font-size:.36rem}
  .xray-site-copy strong{font-size:.64rem}
  .xray-info{grid-template-columns:36px 1fr;gap:10px}
  .xray-info-icon{width:36px;height:36px}
  .xray-info p{display:none}
  .xray-tech-node small{display:none}
  .xray-tech-node{min-width:74px}
}
@media (prefers-reduced-motion:reduce){
  .xray-live-dot::after,.xray-content-focus,.xray-contact-path path,.xray-contact-toast,.xray-tech-core,.xray-scan-line{animation:none!important}
  .xray-device{transition:none!important}
}


/* Patch 18: friendlier Weboldal-bemutató + premium real-business mockup */
.xray-site-preview{
  padding:3.8% 4.4%;
  grid-template-rows:auto 1.24fr .55fr .72fr;
  gap:3.7%;
  background:
    radial-gradient(circle at 84% 16%,rgba(224,180,104,.16),transparent 29%),
    linear-gradient(180deg,#fffdf9 0%,#f6f1e8 100%);
}
.xray-site-nav{
  gap:2.2%;
}
.xray-site-logo{
  width:27px;
  height:27px;
  border-radius:50% 50% 45% 55%;
  background:linear-gradient(145deg,#234b3d,#d09a4a);
  color:#fff8e8;
  font-family:Georgia,serif;
  font-size:.72rem;
  box-shadow:0 6px 16px rgba(35,75,61,.2);
}
.xray-site-brand{
  display:flex;
  flex-direction:column;
  line-height:.88;
  color:#25483b;
}
.xray-site-brand strong{
  font-family:Georgia,serif;
  font-size:.53rem;
  letter-spacing:.08em;
}
.xray-site-brand small{
  margin-top:3px;
  color:#b17b35;
  font-size:.26rem;
  font-weight:900;
  letter-spacing:.12em;
}
.xray-site-menu{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:7px;
}
.xray-site-menu i{
  width:23px;
  height:4px;
  margin:0!important;
  border-radius:99px;
  background:#d8d1c4;
}
.xray-site-nav>b{
  margin-left:1%;
  padding:6px 9px;
  border-radius:999px;
  background:#25483b;
  color:#fff9ed;
  box-shadow:0 6px 14px rgba(37,72,59,.18);
}
.xray-site-hero{
  padding:5.4%;
  grid-template-columns:1.04fr .96fr;
  gap:5%;
  background:
    radial-gradient(circle at 16% 18%,rgba(248,218,162,.16),transparent 26%),
    linear-gradient(135deg,#17382f 0%,#285c4c 68%,#976b31 155%);
  box-shadow:0 13px 30px rgba(35,65,53,.17);
}
.xray-site-copy{
  gap:5px;
}
.xray-site-copy small{
  color:#f0ca83;
  font-size:.34rem;
  letter-spacing:.115em;
}
.xray-site-copy strong{
  max-width:100%;
  font-family:Georgia,serif;
  font-size:clamp(.72rem,1.58vw,1.17rem);
  line-height:1.02;
  letter-spacing:-.025em;
  text-wrap:balance;
}
.xray-site-copy span{
  max-width:96%;
  color:rgba(255,250,238,.76);
  font-size:.39rem;
  line-height:1.45;
}
.xray-site-copy b{
  padding:6px 9px;
  border-radius:999px;
  background:#f0c675;
  color:#17382f;
  box-shadow:0 5px 13px rgba(0,0,0,.12);
}
.xray-site-art{
  position:relative;
  justify-self:stretch;
  width:100%;
  height:100%;
  min-height:86px;
  aspect-ratio:auto;
  border-radius:16px;
  overflow:hidden;
  background:
    linear-gradient(180deg,transparent 45%,rgba(20,42,34,.54)),
    url('../images/background-01-1000.webp') center 34%/cover no-repeat;
  border:2px solid rgba(255,255,255,.18);
  box-shadow:0 12px 25px rgba(0,0,0,.22);
}
.xray-site-art::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(125deg,rgba(255,255,255,.14),transparent 38%);
  pointer-events:none;
}
.xray-site-art>span,
.xray-site-art>i,
.xray-site-art>b{
  display:none!important;
}
.xray-photo-badge{
  position:absolute;
  z-index:2;
  left:8%;
  bottom:8%;
  padding:5px 7px;
  border-radius:8px;
  display:flex;
  flex-direction:column;
  gap:1px;
  background:rgba(255,253,247,.92);
  color:#24483b;
  box-shadow:0 6px 14px rgba(0,0,0,.16);
}
.xray-photo-badge strong{font-size:.43rem;line-height:1}
.xray-photo-badge small{font-size:.28rem;color:#8a6435;font-weight:850}
.xray-site-cards{
  gap:2.2%;
}
.xray-site-cards>span{
  padding:5.5% 6%;
  border:1px solid rgba(78,92,76,.08);
  border-radius:11px;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;
  column-gap:7%;
  row-gap:2px;
  background:rgba(255,255,255,.94);
  box-shadow:0 6px 16px rgba(58,62,45,.07);
}
.xray-site-cards i{
  grid-row:1/3;
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#f5e8ce;
  color:#694c28;
  font-style:normal;
  font-size:.68rem;
}
.xray-site-cards b{
  width:auto;
  height:auto;
  border-radius:0;
  background:none;
  color:#29483c;
  font-size:.39rem;
  line-height:1.1;
}
.xray-site-cards small{
  color:#8e8172;
  font-size:.28rem;
  line-height:1.1;
  font-weight:750;
}
.xray-site-contact{
  padding:3.7% 4.5%;
  background:linear-gradient(135deg,#fff,#faf4e8);
  border:1px solid rgba(79,83,61,.07);
  grid-template-columns:1.15fr .85fr;
}
.xray-site-contact small{color:#a26f2f}
.xray-site-contact strong{
  color:#29483c;
  font-family:Georgia,serif;
  font-size:.58rem;
}
.xray-site-contact>div:first-child span{
  width:auto;
  height:auto;
  background:none;
  color:#877a69;
  font-size:.29rem;
  line-height:1.25;
}
.xray-mini-form i{
  background:#fff;
  border-color:#e4dacb;
}
.xray-mini-form b{
  background:#25483b;
  color:#fff8e8;
  border-radius:999px;
}
.xray-content-focus span{
  max-width:190px;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:.28rem;
  background:#16483f;
  color:#b8fff5;
}
.xray-tech-layer{
  background:rgba(8,27,30,.69);
}
.xray-tech-core{
  width:108px;
  height:108px;
  gap:3px;
  background:radial-gradient(circle,#245548,#102f2d 69%);
  border-color:rgba(126,243,229,.7);
}
.xray-tech-core b{
  max-width:78px;
  text-align:center;
  font-size:.46rem;
  line-height:1.13;
  letter-spacing:.055em;
}
.xray-tech-core small{
  font-size:.29rem;
  color:#b0d9d3;
}
.xray-tech-node{
  min-width:128px;
  background:rgba(18,56,54,.92);
  border-color:rgba(115,224,210,.33);
}
.xray-tech-node i{
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#6de2d3;
  color:#123b36;
}
.xray-tech-node i::after{
  content:"✓";
  font-size:.45rem;
  font-style:normal;
  font-weight:950;
}
.xray-tech-node strong{
  font-size:.42rem;
  letter-spacing:.035em;
}
.xray-tech-node small{
  color:#b1cfca;
}
.xray-info small{
  letter-spacing:.07em;
}
@media (max-width:980px){
  .xray-control-copy strong{font-size:.91rem}
}
@media (max-width:680px){
  .xray-control{min-height:86px}
  .xray-control-copy strong{font-size:.88rem;line-height:1.18}
  .xray-site-brand strong{font-size:.46rem}
  .xray-site-brand small{font-size:.22rem}
  .xray-site-menu{display:none}
  .xray-site-nav>b{margin-left:auto}
  .xray-tech-node{min-width:104px}
  .xray-tech-core{width:84px;height:84px}
  .xray-tech-core b{max-width:62px;font-size:.36rem}
  .xray-tech-core small{font-size:.23rem}
}
@media (max-width:430px){
  .xray-site-copy small{font-size:.25rem}
  .xray-site-copy strong{font-size:.61rem}
  .xray-site-copy span{font-size:.29rem}
  .xray-site-copy b{font-size:.25rem}
  .xray-site-art{min-height:62px;border-radius:10px}
  .xray-photo-badge{padding:3px 4px;border-radius:5px}
  .xray-photo-badge strong{font-size:.3rem}
  .xray-photo-badge small{font-size:.2rem}
  .xray-site-cards i{width:15px;height:15px;font-size:.42rem;border-radius:5px}
  .xray-site-cards b{font-size:.29rem}
  .xray-site-cards small{font-size:.22rem}
  .xray-content-focus span{font-size:.22rem;max-width:118px}
}
.xray-device[data-device="mobile"] .xray-site-brand strong{font-size:.34rem}
.xray-device[data-device="mobile"] .xray-site-brand small{font-size:.18rem}
.xray-device[data-device="mobile"] .xray-site-hero{grid-template-columns:1fr;padding:9%}
.xray-device[data-device="mobile"] .xray-site-art{
  position:absolute;
  width:72px;
  height:84px;
  min-height:0;
  right:-10px;
  bottom:-10px;
  opacity:.72;
  border-radius:12px;
}
.xray-device[data-device="mobile"] .xray-site-copy strong{max-width:78%}
.xray-device[data-device="mobile"] .xray-site-copy span{max-width:72%}
.xray-device[data-device="mobile"] .xray-site-cards>span{padding:3.5% 4%}
.xray-device[data-device="mobile"] .xray-site-cards i{width:13px;height:13px;font-size:.38rem}
.xray-device[data-device="mobile"] .xray-site-cards b{font-size:.28rem}
.xray-device[data-device="mobile"] .xray-site-cards small{font-size:.2rem}
.xray-device[data-device="mobile"] .xray-site-contact>div:first-child span{font-size:.21rem}


/* Patch 18b: understandable step-by-step message highlighting */
.xray-lab[data-mode="content"] .xray-content-focus{
  opacity:.12;
  animation:xrayBenefitSpot 8s ease-in-out infinite!important;
}
.xray-lab[data-mode="content"] .focus-title{animation-delay:0s!important}
.xray-lab[data-mode="content"] .focus-copy{animation-delay:-6s!important}
.xray-lab[data-mode="content"] .focus-cta{animation-delay:-4s!important}
.xray-lab[data-mode="content"] .focus-services{animation-delay:-2s!important}
@keyframes xrayBenefitSpot{
  0%,18%{opacity:1;transform:scale(1)}
  23%,96%{opacity:.12;transform:scale(.985)}
  100%{opacity:1;transform:scale(1)}
}
@media (prefers-reduced-motion:reduce){
  .xray-lab[data-mode="content"] .xray-content-focus{opacity:1!important;animation:none!important}
}


/* Patch 19: clearer section separation inside xray site preview for desktop/tablet */
.xray-site-preview{
  grid-template-rows:auto 1.2fr .6fr .82fr;
  gap:3.8%;
}
.xray-site-nav,
.xray-site-hero,
.xray-site-cards,
.xray-site-contact{
  position:relative;
  overflow:visible;
}
.xray-site-nav{
  padding:10px 12px 9px;
  border-radius:12px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(63,84,71,.10);
  box-shadow:0 7px 16px rgba(31,49,59,.06);
}
.xray-site-nav::before,
.xray-site-hero::before,
.xray-site-cards::before,
.xray-site-contact::before{
  position:absolute;
  left:12px;
  top:-9px;
  padding:4px 7px;
  border-radius:999px;
  font-size:.28rem;
  font-weight:900;
  letter-spacing:.1em;
  line-height:1;
  color:#23483b;
  background:linear-gradient(135deg,#fffdf8,#f4e4bf);
  border:1px solid rgba(161,118,55,.18);
  box-shadow:0 5px 12px rgba(28,42,32,.08);
}
.xray-site-nav::before{content:"MENÜ";}
.xray-site-hero::before{content:"NYITÓRÉSZ";}
.xray-site-cards::before{content:"KÍNÁLAT";}
.xray-site-contact::before{content:"KAPCSOLAT";}
.xray-site-hero{
  margin-top:2px;
  border:1px solid rgba(255,255,255,.15);
}
.xray-site-cards{
  padding:14px 12px 10px;
  border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(247,250,252,.96));
  border:1px solid rgba(63,84,71,.08);
  box-shadow:0 7px 16px rgba(31,49,59,.05);
}
.xray-site-contact{
  border:1px solid rgba(79,83,61,.10);
  box-shadow:0 9px 18px rgba(31,49,59,.06);
}
.xray-device[data-device="tablet"] .xray-site-preview{
  grid-template-rows:auto 1.18fr .66fr .82fr;
  gap:3.6%;
}
.xray-device[data-device="tablet"] .xray-site-nav{
  padding:9px 10px 8px;
}
.xray-device[data-device="tablet"] .xray-site-nav::before,
.xray-device[data-device="tablet"] .xray-site-hero::before,
.xray-device[data-device="tablet"] .xray-site-cards::before,
.xray-device[data-device="tablet"] .xray-site-contact::before{
  font-size:.24rem;
  left:10px;
}
.xray-device[data-device="tablet"] .xray-site-cards{
  padding:12px 10px 9px;
}
.xray-device[data-device="mobile"] .xray-site-nav::before,
.xray-device[data-device="mobile"] .xray-site-hero::before,
.xray-device[data-device="mobile"] .xray-site-cards::before,
.xray-device[data-device="mobile"] .xray-site-contact::before{
  display:none;
}
.xray-device[data-device="mobile"] .xray-site-nav{
  padding:6px 7px;
  border-radius:9px;
}
.xray-device[data-device="mobile"] .xray-site-cards{
  padding:4px;
  border-radius:10px;
}


/* Patch 20: content mode now demonstrates clear customer understanding as a before/after journey */
.xray-content-layer{
  overflow:hidden;
  background:linear-gradient(180deg,rgba(7,24,31,.03),rgba(7,24,31,.11));
}
.xray-lab[data-mode="content"] .xray-site-preview{
  animation:xraySiteClarify 6.1s ease-in-out infinite;
}
.xray-content-confusion{
  position:absolute;
  inset:8% 7% 11%;
  z-index:5;
  border-radius:13px;
  background:rgba(238,242,243,.88);
  box-shadow:0 10px 28px rgba(9,24,31,.16);
  animation:xrayConfusionClear 6.1s ease-in-out infinite;
}
.xray-content-confusion>b{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  padding:6px 9px;
  border-radius:999px;
  background:#7f8990;
  color:#fff;
  font-size:.35rem;
  letter-spacing:.08em;
  white-space:nowrap;
}
.confusion-card{
  position:absolute;
  display:grid;
  gap:5px;
  padding:9px;
  border-radius:9px;
  background:#fff;
  border:1px solid #d6dee1;
  box-shadow:0 7px 16px rgba(25,43,52,.09);
}
.confusion-card i{height:4px;border-radius:99px;background:#c9d1d5;}
.confusion-card i:nth-child(2){width:72%}
.confusion-card i:nth-child(3){width:52%}
.confusion-a{left:9%;top:12%;width:32%;transform:rotate(-4deg)}
.confusion-b{right:8%;top:17%;width:30%;transform:rotate(5deg)}
.confusion-c{left:29%;bottom:12%;width:39%;transform:rotate(-2deg)}
.xray-understand-path{
  position:absolute;
  inset:0;
  z-index:7;
  width:100%;
  height:100%;
  overflow:visible;
}
.xray-understand-path path{
  fill:none;
  stroke:#25cbb8;
  stroke-width:1.2;
  stroke-linecap:round;
  stroke-dasharray:4 4;
  filter:drop-shadow(0 0 5px rgba(37,203,184,.45));
  animation:xrayUnderstandRoute 6.1s linear infinite;
}
.xray-understand-dot{
  position:absolute;
  z-index:10;
  width:8px;
  height:8px;
  left:23%;
  top:29%;
  border-radius:50%;
  background:#fff;
  border:2px solid #1fc7b6;
  box-shadow:0 0 0 5px rgba(31,199,182,.16),0 0 12px rgba(31,199,182,.65);
  animation:xrayUnderstandDot 6.1s ease-in-out infinite;
}
.xray-understand-step{
  position:absolute;
  z-index:9;
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:7px;
  min-width:145px;
  padding:7px 9px;
  border-radius:10px;
  background:rgba(255,255,255,.95);
  color:#24453a;
  border:1px solid rgba(31,199,182,.28);
  box-shadow:0 9px 20px rgba(14,40,42,.13);
  opacity:0;
  transform:translateY(8px) scale(.96);
}
.xray-understand-step>i{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#1fc7b6;
  color:#092d2a;
  font-style:normal;
  font-size:.48rem;
  font-weight:950;
}
.xray-understand-step>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.xray-understand-step strong{font-size:.43rem;line-height:1.05}
.xray-understand-step small{font-size:.31rem;color:#72827c;font-weight:750;line-height:1.15}
.understand-offer{left:7%;top:18%;animation:xrayUnderstandStepOne 6.1s ease-in-out infinite}
.understand-reason{left:33%;top:47%;animation:xrayUnderstandStepTwo 6.1s ease-in-out infinite}
.understand-action{right:5%;bottom:10%;animation:xrayUnderstandStepThree 6.1s ease-in-out infinite}
.xray-understand-result{
  position:absolute;
  z-index:11;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) scale(.92);
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:8px;
  min-width:220px;
  padding:10px 12px;
  border-radius:13px;
  background:linear-gradient(135deg,rgba(20,62,54,.96),rgba(25,83,74,.96));
  color:#fff;
  border:1px solid rgba(126,243,229,.34);
  box-shadow:0 14px 30px rgba(8,31,29,.26);
  opacity:0;
  animation:xrayUnderstandResult 6.1s ease-in-out infinite;
}
.xray-understand-result>span{
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#6de2d3;
  color:#123b36;
  font-weight:950;
}
.xray-understand-result>div{display:flex;flex-direction:column;gap:2px}
.xray-understand-result strong{font-size:.49rem}
.xray-understand-result small{font-size:.33rem;color:#bde7e1;font-weight:750}
@keyframes xraySiteClarify{
  0%,18%{filter:blur(2px) grayscale(.55);transform:scale(.985)}
  28%,100%{filter:none;transform:none}
}
@keyframes xrayConfusionClear{
  0%,17%{opacity:1;transform:scale(1)}
  27%,100%{opacity:0;transform:scale(.96);visibility:hidden}
}
@keyframes xrayUnderstandRoute{
  0%,23%{stroke-dashoffset:60;opacity:0}
  31%{opacity:1}
  78%{stroke-dashoffset:0;opacity:1}
  88%,100%{opacity:0}
}
@keyframes xrayUnderstandDot{
  0%,27%{left:23%;top:29%;opacity:0}
  31%{opacity:1}
  46%{left:37%;top:51%}
  64%{left:57%;top:69%}
  79%{left:77%;top:83%;opacity:1}
  87%,100%{left:77%;top:83%;opacity:0}
}
@keyframes xrayUnderstandStepOne{
  0%,25%{opacity:0;transform:translateY(8px) scale(.96)}
  31%,78%{opacity:1;transform:none}
  88%,100%{opacity:0;transform:translateY(-4px)}
}
@keyframes xrayUnderstandStepTwo{
  0%,42%{opacity:0;transform:translateY(8px) scale(.96)}
  48%,78%{opacity:1;transform:none}
  88%,100%{opacity:0;transform:translateY(-4px)}
}
@keyframes xrayUnderstandStepThree{
  0%,59%{opacity:0;transform:translateY(8px) scale(.96)}
  65%,78%{opacity:1;transform:none}
  88%,100%{opacity:0;transform:translateY(-4px)}
}
@keyframes xrayUnderstandResult{
  0%,78%{opacity:0;transform:translate(-50%,-45%) scale(.92)}
  84%,96%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-55%) scale(.98)}
}
@media (max-width:680px){
  .xray-understand-step{min-width:118px;padding:6px 7px;gap:5px}
  .xray-understand-step>i{width:18px;height:18px;font-size:.39rem}
  .xray-understand-step strong{font-size:.34rem}
  .xray-understand-step small{font-size:.25rem}
  .understand-offer{left:4%;top:17%}
  .understand-reason{left:26%;top:47%}
  .understand-action{right:3%;bottom:9%}
  .xray-understand-result{min-width:175px;padding:8px 9px}
  .xray-understand-result strong{font-size:.4rem}
  .xray-understand-result small{font-size:.27rem}
}
@media (max-width:430px){
  .xray-content-confusion{inset:7% 5% 9%}
  .xray-understand-step{min-width:96px;max-width:118px;padding:5px 6px}
  .xray-understand-step small{display:none}
  .understand-offer{left:3%;top:16%}
  .understand-reason{left:25%;top:48%}
  .understand-action{right:2%;bottom:8%}
  .xray-understand-result{min-width:156px}
  .xray-understand-result>span{width:22px;height:22px}
}
@media (prefers-reduced-motion:reduce){
  .xray-lab[data-mode="content"] .xray-site-preview{animation:none!important}
  .xray-content-confusion{display:none!important}
  .xray-understand-path path,.xray-understand-dot{animation:none!important;opacity:0!important}
  .xray-understand-step{animation:none!important;opacity:1!important;transform:none!important}
  .xray-understand-result{display:none!important}
}


/* Patch 21: simple SkyGen benefits relay — replaces the animated website x-ray */
.sgp11-process,
.sgp11-process *{box-sizing:border-box}
.sgp11-process{
  position:relative;
  width:100%;
  padding:clamp(20px,3vw,34px);
  border:1px solid rgba(7,20,31,.1);
  border-radius:32px;
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(246,250,251,.86));
  box-shadow:0 22px 64px rgba(7,20,31,.1);
}
.sgp11-board{
  display:grid;
  grid-template-columns:minmax(280px,.92fr) minmax(320px,1.08fr) minmax(230px,.7fr);
  gap:clamp(16px,2.2vw,26px);
  align-items:stretch;
}
.sgp11-route-card,.sgp11-detail,.sgp11-side-note{
  border:1px solid rgba(7,20,31,.09);
  border-radius:26px;
  background:rgba(255,255,255,.9);
  box-shadow:0 14px 34px rgba(7,20,31,.07);
}
.sgp11-route-card{padding:21px}
.sgp11-route-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.sgp11-route-label,.sgp11-detail-tag{
  display:inline-flex;
  width:fit-content;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(31,199,182,.11);
  border:1px solid rgba(31,199,182,.2);
  color:#0b7068;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.075em;
  text-transform:uppercase;
}
.sgp11-route-top>strong{font-size:.86rem;color:#51636d}
.sgp11-route{position:relative;display:grid;gap:10px;padding-left:7px}
.sgp11-route-line,.sgp11-route-fill{
  position:absolute;
  left:28px;
  top:25px;
  width:3px;
  border-radius:999px;
  pointer-events:none;
}
.sgp11-route-line{bottom:25px;background:rgba(31,199,182,.12)}
.sgp11-route-fill{
  height:var(--sgp11-fill,0%);
  max-height:calc(100% - 50px);
  background:linear-gradient(180deg,var(--teal),var(--gold));
  transition:height .25s ease;
}
.sgp11-route-pulse{
  position:absolute;
  z-index:3;
  left:21px;
  top:var(--sgp11-pulse,20px);
  width:17px;
  height:17px;
  border:4px solid #fff;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 5px rgba(245,189,79,.14);
  transition:top .25s ease;
  pointer-events:none;
}
.sgp11-station{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:38px 1fr;
  gap:12px;
  width:100%;
  min-height:74px;
  padding:12px;
  border:1px solid rgba(7,20,31,.08);
  border-radius:19px;
  background:#f8fbfc;
  color:inherit;
  text-align:left;
  cursor:pointer;
  transition:border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.sgp11-station:hover{transform:translateX(3px);border-color:rgba(31,199,182,.28);background:#fff}
.sgp11-station:focus-visible{outline:3px solid rgba(31,199,182,.3);outline-offset:3px}
.sgp11-station.is-active{
  border-color:rgba(245,189,79,.42);
  background:linear-gradient(135deg,#fff,#fff8e9);
  box-shadow:0 10px 24px rgba(245,189,79,.11);
}
.sgp11-dot{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:13px;
  background:rgba(31,199,182,.12);
  color:#0a746b;
  font-size:.72rem;
  font-weight:950;
}
.sgp11-station.is-active .sgp11-dot{background:rgba(245,189,79,.22);color:#9a650d}
.sgp11-station strong{display:block;margin-top:1px;color:#132a37;font-size:.93rem;line-height:1.18}
.sgp11-station small{display:block;margin-top:4px;color:#657780;font-size:.75rem;line-height:1.38}
.sgp11-detail{position:relative;overflow:hidden;padding:clamp(23px,3vw,32px)}
.sgp11-detail::after{
  content:"";
  position:absolute;
  right:-62px;
  bottom:-72px;
  width:180px;
  height:180px;
  border:30px solid rgba(31,199,182,.055);
  border-radius:50%;
  pointer-events:none;
}
.sgp11-detail h3{position:relative;margin:16px 0 11px;color:#102733;font-size:clamp(1.65rem,2.6vw,2.45rem);line-height:1.03;letter-spacing:-.045em}
.sgp11-detail p{position:relative;margin:0;color:#586d77;font-size:.96rem;line-height:1.7}
.sgp11-output-box{
  position:relative;
  margin:21px 0;
  padding:17px;
  overflow:hidden;
  border-radius:19px;
  background:linear-gradient(135deg,#0d2533,#173a48);
  color:#fff;
}
.sgp11-output-box::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 18%,rgba(31,199,182,.28),transparent 36%);pointer-events:none}
.sgp11-output-box span,.sgp11-output-box strong{position:relative;display:block}
.sgp11-output-box span{color:rgba(255,255,255,.65);font-size:.72rem;font-weight:800}
.sgp11-output-box strong{margin-top:6px;font-size:1rem;line-height:1.35}
.sgp11-checks{position:relative;display:grid;gap:9px;margin:0;padding:0;list-style:none}
.sgp11-checks li{display:flex;align-items:center;gap:9px;color:#425963;font-size:.88rem;font-weight:750}
.sgp11-checks li::before{content:"✓";display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:8px;background:rgba(31,199,182,.12);color:#08776d;font-weight:950}
.sgp11-side-note{padding:24px;background:linear-gradient(155deg,#fffaf0,#f2f8f7)}
.sgp11-side-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--teal);color:#06282d;font-weight:950;box-shadow:0 10px 22px rgba(31,199,182,.2)}
.sgp11-side-note h3{margin:18px 0 10px;color:#17303c;font-size:1.22rem;line-height:1.18;letter-spacing:-.025em}
.sgp11-side-note p{margin:0;color:#62747d;font-size:.88rem;line-height:1.65}
.sgp11-mini-stats{display:grid;gap:9px;margin-top:22px}
.sgp11-mini-stats span{padding:11px 12px;border-radius:14px;background:rgba(255,255,255,.82);border:1px solid rgba(7,20,31,.07);color:#65757d;font-size:.78rem;font-weight:800}
.sgp11-mini-stats strong{margin-right:5px;color:#102733;font-size:1.15rem}
@media (max-width:1040px){.sgp11-board{grid-template-columns:minmax(260px,.9fr) minmax(320px,1.1fr)}.sgp11-side-note{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:start}.sgp11-side-note h3{margin:0 0 7px}.sgp11-side-note p,.sgp11-mini-stats{grid-column:2}.sgp11-mini-stats{grid-template-columns:repeat(2,1fr);margin-top:14px}}
@media (max-width:760px){.sgp11-process{padding:15px;border-radius:24px}.sgp11-board{grid-template-columns:1fr}.sgp11-route-card,.sgp11-detail,.sgp11-side-note{border-radius:21px}.sgp11-side-note{grid-column:auto;display:block}.sgp11-side-note h3{margin-top:16px}.sgp11-side-note p,.sgp11-mini-stats{grid-column:auto}.sgp11-mini-stats{grid-template-columns:1fr}.sgp11-station:hover{transform:none}}
@media (prefers-reduced-motion:reduce){.sgp11-route-fill,.sgp11-route-pulse,.sgp11-station{transition:none!important}}


/* Patch 22: light SkyGen hero + premium dev/game CTA system */
.hero{
  background:
    radial-gradient(circle at 12% 18%,rgba(31,199,182,.20),transparent 31%),
    radial-gradient(circle at 86% 16%,rgba(73,142,255,.17),transparent 30%),
    radial-gradient(circle at 72% 78%,rgba(255,122,24,.12),transparent 28%),
    linear-gradient(135deg,#fbfdff 0%,#f4fbfb 44%,#fffaf3 100%)!important;
  color:#0a1b28!important;
}
.hero::before{
  display:block!important;
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,rgba(255,255,255,.62),transparent 36%,rgba(255,255,255,.24) 61%,transparent 86%);
  pointer-events:none;
}
.hero-copy h1{
  color:#081b2a!important;
  text-shadow:0 12px 36px rgba(38,79,104,.10)!important;
}
.hero-copy .lead{
  color:#506976!important;
}
.hero-bg-grid{
  opacity:.34!important;
  background:
    linear-gradient(rgba(43,91,119,.09) 1px,transparent 1px),
    linear-gradient(90deg,rgba(43,91,119,.09) 1px,transparent 1px)!important;
  mix-blend-mode:multiply;
}
.hero-bg-grid::after{
  background:linear-gradient(115deg,transparent 20%,rgba(36,135,191,.10) 50%,transparent 75%)!important;
}
.hero-bg-blob{mix-blend-mode:multiply!important;opacity:.42!important;filter:blur(34px)!important;}
.hero-bg-blob.blob-a{background:radial-gradient(circle at 30% 30%,rgba(31,199,182,.48),rgba(31,199,182,.13) 45%,transparent 72%)!important;}
.hero-bg-blob.blob-b{background:radial-gradient(circle at 50% 45%,rgba(73,142,255,.38),rgba(73,142,255,.11) 46%,transparent 73%)!important;}
.hero-bg-blob.blob-c{background:radial-gradient(circle at 48% 48%,rgba(245,189,79,.36),rgba(255,107,74,.10) 48%,transparent 75%)!important;}
.hero-bg-glow{
  background:linear-gradient(90deg,transparent,rgba(25,118,171,.22),rgba(255,122,24,.14),transparent)!important;
  box-shadow:0 0 18px rgba(36,135,191,.10)!important;
}
.hero-bg-spark{background:#2d98cf!important;box-shadow:0 0 10px rgba(45,152,207,.28),0 0 22px rgba(31,199,182,.15)!important;opacity:.56!important;}
.hero-bg-spark.spark-b{background:#ff8b38!important;}
.hero-bg-spark::before,.hero-bg-spark::after{background:linear-gradient(90deg,transparent,currentColor,transparent)!important;opacity:.48;}
.hero-orb{opacity:.14!important;filter:blur(42px)!important;}

/* Unified premium SkyGen CTA: moving code-energy border + scan light + tactile hover */
.btn-frame,
.btn-ink,
.btn-paper,
.btn-submit{
  --sg-cta-a:#ff7a18;
  --sg-cta-b:#35bdf4;
  --sg-cta-c:#22c7b4;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border:1px solid transparent!important;
  border-radius:999px!important;
  min-height:54px;
  padding:0 24px!important;
  font-weight:950!important;
  letter-spacing:.015em;
  transform:translateZ(0);
  transition:transform .28s cubic-bezier(.2,.9,.2,1.2),box-shadow .28s ease,filter .28s ease!important;
  animation:sgCtaBorderFlow 4.8s linear infinite;
}
.btn-frame,
.btn-submit{
  color:#fff!important;
  background:
    linear-gradient(135deg,#071522,#102b3e) padding-box,
    linear-gradient(110deg,var(--sg-cta-a),var(--sg-cta-b),var(--sg-cta-c),var(--sg-cta-a)) border-box!important;
  background-size:100% 100%,300% 100%!important;
  box-shadow:0 14px 30px rgba(7,21,34,.18),0 0 0 1px rgba(255,255,255,.04) inset!important;
}
.btn-ink,
.btn-paper{
  color:#0a2231!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(244,250,252,.98)) padding-box,
    linear-gradient(110deg,var(--sg-cta-b),var(--sg-cta-c),var(--sg-cta-a),var(--sg-cta-b)) border-box!important;
  background-size:100% 100%,300% 100%!important;
  box-shadow:0 14px 30px rgba(31,91,120,.12),0 0 0 1px rgba(255,255,255,.72) inset!important;
}
.btn-frame::before,
.btn-ink::before,
.btn-paper::before,
.btn-submit::before{
  content:""!important;
  position:absolute!important;
  inset:-45% -25%!important;
  width:auto!important;
  height:auto!important;
  border:0!important;
  border-radius:0!important;
  opacity:.0!important;
  z-index:-1!important;
  background:linear-gradient(105deg,transparent 37%,rgba(255,255,255,.62) 49%,rgba(255,255,255,.22) 53%,transparent 65%)!important;
  transform:translateX(-60%) rotate(0deg)!important;
  transition:transform .72s cubic-bezier(.18,.8,.2,1),opacity .18s ease!important;
  pointer-events:none;
}
.btn-frame::after,
.btn-ink::after,
.btn-paper::after{
  content:""!important;
  position:absolute!important;
  inset:4px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:999px!important;
  opacity:.8!important;
  transform:none!important;
  pointer-events:none!important;
  z-index:0!important;
}
.btn-ink::after,.btn-paper::after{border-color:rgba(19,79,109,.08)!important;}
.btn-frame > span,
.btn-ink > span,
.btn-paper > span,
.btn-submit > span{
  position:relative!important;
  z-index:2!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:9px!important;
  color:inherit!important;
}
.btn-frame > span::after,
.btn-ink > span::after,
.btn-paper > span::after,
.btn-submit > span::after{
  content:"↗";
  display:inline-block;
  font-size:.94em;
  line-height:1;
  opacity:.76;
  transform:translate3d(0,0,0) rotate(0deg);
  transition:transform .3s cubic-bezier(.2,.9,.2,1.25),opacity .3s ease;
}
.btn-frame:hover,
.btn-frame:focus-visible,
.btn-ink:hover,
.btn-ink:focus-visible,
.btn-paper:hover,
.btn-paper:focus-visible,
.btn-submit:hover,
.btn-submit:focus-visible{
  transform:translateY(-4px) scale(1.018)!important;
  filter:saturate(1.1);
  box-shadow:0 22px 48px rgba(16,54,77,.22),0 0 24px rgba(53,189,244,.15),0 0 34px rgba(255,122,24,.10)!important;
}
.btn-frame:hover::before,
.btn-frame:focus-visible::before,
.btn-ink:hover::before,
.btn-ink:focus-visible::before,
.btn-paper:hover::before,
.btn-paper:focus-visible::before,
.btn-submit:hover::before,
.btn-submit:focus-visible::before{
  opacity:.85!important;
  transform:translateX(62%) rotate(0deg)!important;
}
.btn-frame:hover > span::after,
.btn-frame:focus-visible > span::after,
.btn-ink:hover > span::after,
.btn-ink:focus-visible > span::after,
.btn-paper:hover > span::after,
.btn-paper:focus-visible > span::after,
.btn-submit:hover > span::after,
.btn-submit:focus-visible > span::after{
  opacity:1;
  transform:translate3d(4px,-2px,0) rotate(10deg);
}
.btn-frame:active,.btn-ink:active,.btn-paper:active,.btn-submit:active{transform:translateY(-1px) scale(.975)!important;}
.btn-frame:focus-visible,.btn-ink:focus-visible,.btn-paper:focus-visible,.btn-submit:focus-visible{outline:3px solid rgba(53,189,244,.38)!important;outline-offset:4px!important;}
.nav-action.btn-frame{min-height:46px!important;padding:0 19px!important;box-shadow:0 10px 24px rgba(7,21,34,.16)!important;}
.nav-action.btn-frame:hover,.nav-action.btn-frame:focus-visible{background:linear-gradient(135deg,#071522,#102b3e) padding-box,linear-gradient(110deg,var(--sg-cta-a),var(--sg-cta-b),var(--sg-cta-c),var(--sg-cta-a)) border-box!important;color:#fff!important;}
.btn-submit.is-sent::after{content:" ✓"!important;position:static!important;border:0!important;}

/* Existing showcase CTA gets the same living energy border without losing its orbital effect. */
.sg-button-004{
  background:
    linear-gradient(135deg,#071522,#102b3e) padding-box,
    linear-gradient(110deg,#ff7a18,#35bdf4,#22c7b4,#ff7a18) border-box!important;
  background-size:100% 100%,300% 100%!important;
  animation:sgCtaBorderFlow 4.8s linear infinite!important;
  box-shadow:0 20px 46px rgba(7,21,34,.20),0 0 28px rgba(53,189,244,.08)!important;
}
.sg-button-004:hover,.sg-button-004:focus-visible{box-shadow:0 26px 58px rgba(7,21,34,.23),0 0 32px rgba(53,189,244,.16),0 0 38px rgba(255,122,24,.12)!important;}

@keyframes sgCtaBorderFlow{
  0%{background-position:0 0,0% 50%}
  100%{background-position:0 0,300% 50%}
}
@media (max-width:560px){
  .hero{background:radial-gradient(circle at 18% 16%,rgba(31,199,182,.16),transparent 34%),radial-gradient(circle at 84% 10%,rgba(73,142,255,.14),transparent 31%),linear-gradient(155deg,#fbfdff 0%,#f5fbfb 52%,#fffaf5 100%)!important;}
  .hero-bg-grid{opacity:.25!important;}
  .hero-copy .lead{color:#526b78!important;}
  .hero-actions .btn-frame,.hero-actions .btn-ink{width:100%;max-width:340px;}
  .btn-frame,.btn-ink,.btn-paper,.btn-submit{min-height:52px;padding:0 20px!important;}
}
@media (prefers-reduced-motion:reduce){
  .btn-frame,.btn-ink,.btn-paper,.btn-submit,.sg-button-004{animation:none!important;}
  .btn-frame::before,.btn-ink::before,.btn-paper::before,.btn-submit::before{transition:none!important;}
}


/* Patch 16: more exciting SkyGen hero background with dev/game visual cues */
.hero-bg-animated::before{
  content:"";
  position:absolute;
  inset:-8%;
  pointer-events:none;
  background:
    repeating-linear-gradient(118deg,rgba(53,189,244,.08) 0 2px,transparent 2px 18px),
    linear-gradient(90deg,transparent 0%,rgba(34,199,180,.08) 22%,transparent 46%,rgba(255,122,24,.08) 72%,transparent 100%);
  opacity:.8;
  mask-image:radial-gradient(circle at 58% 44%,rgba(0,0,0,.95),rgba(0,0,0,.78) 38%,rgba(0,0,0,.28) 72%,transparent 100%);
  animation:heroDataStreams 18s linear infinite;
}
.hero-bg-animated::after{
  content:"";
  position:absolute;
  right:8%;
  top:15%;
  width:min(34vw,420px);
  aspect-ratio:1/1;
  border-radius:34px;
  border:1px solid rgba(141,211,255,.14);
  background:
    radial-gradient(circle at 26% 24%,rgba(53,189,244,.18),transparent 34%),
    radial-gradient(circle at 74% 66%,rgba(255,122,24,.14),transparent 30%),
    linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03),0 0 42px rgba(14,33,49,.18);
  transform:rotate(-11deg);
  opacity:.55;
  animation:heroHudFloat 14s ease-in-out infinite;
}
.hero-bg-ring,
.hero-bg-code{
  position:absolute;
  pointer-events:none;
}
.hero-bg-ring{
  border-radius:50%;
  border:1px solid rgba(147,218,255,.22);
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset,0 0 28px rgba(53,189,244,.08);
  opacity:.58;
}
.hero-bg-ring::before,
.hero-bg-ring::after{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:inherit;
  border:1px dashed rgba(255,255,255,.12);
}
.hero-bg-ring::after{
  inset:28px;
  border-style:solid;
  border-color:rgba(34,199,180,.22);
}
.ring-a{
  width:min(22vw,270px);
  aspect-ratio:1/1;
  left:4%;
  bottom:14%;
  animation:heroRingSpinA 22s linear infinite;
}
.ring-b{
  width:min(18vw,220px);
  aspect-ratio:1/1;
  right:20%;
  top:8%;
  opacity:.42;
  animation:heroRingSpinB 18s linear infinite;
}
.hero-bg-code{
  min-width:64px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(135deg,rgba(7,21,34,.55),rgba(16,43,62,.16));
  box-shadow:0 14px 34px rgba(6,17,29,.16),inset 0 0 0 1px rgba(255,255,255,.03);
  color:rgba(230,247,255,.78);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.16em;
  line-height:1;
  text-transform:uppercase;
  backdrop-filter:blur(8px);
}
.code-a{left:10%;top:16%;animation:heroCodeFloatA 8.2s ease-in-out infinite;}
.code-b{right:15%;top:26%;color:rgba(255,213,170,.88);animation:heroCodeFloatB 9.4s ease-in-out infinite;}
.code-c{right:8%;bottom:20%;animation:heroCodeFloatC 8.8s ease-in-out infinite;}
@keyframes heroDataStreams{0%{transform:translate3d(-18px,-10px,0)}100%{transform:translate3d(34px,18px,0)}}
@keyframes heroHudFloat{0%,100%{transform:translate3d(0,0,0) rotate(-11deg)}50%{transform:translate3d(22px,-10px,0) rotate(-8deg)}}
@keyframes heroRingSpinA{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
@keyframes heroRingSpinB{0%{transform:rotate(360deg) scale(.92)}100%{transform:rotate(0deg) scale(1.02)}}
@keyframes heroCodeFloatA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(12px,-10px,0)}}
@keyframes heroCodeFloatB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-10px,12px,0)}}
@keyframes heroCodeFloatC{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-14px,-12px,0)}}
@media (max-width:920px){
  .hero-bg-animated::after{right:-2%;top:20%;width:min(42vw,260px);opacity:.32;}
  .ring-a{left:-8%;bottom:12%;width:min(34vw,220px);}
  .ring-b{right:10%;top:11%;width:min(26vw,160px);}
  .code-a{left:6%;top:14%;}
  .code-b{right:10%;top:19%;}
  .code-c{right:8%;bottom:16%;}
}
@media (max-width:560px){
  .hero-bg-animated::before{opacity:.55;}
  .hero-bg-animated::after{display:none;}
  .hero-bg-ring{opacity:.26;}
  .hero-bg-code{font-size:.62rem;letter-spacing:.12em;padding:7px 10px;box-shadow:0 10px 20px rgba(6,17,29,.10);}
  .code-a{left:6%;top:13%;}
  .code-b{right:6%;top:20%;}
  .code-c{right:4%;bottom:24%;}
}
@media (prefers-reduced-motion:reduce){
  .hero-bg-animated::before,.hero-bg-animated::after,.hero-bg-ring,.hero-bg-code{animation:none!important;}
}


/* Patch 17: full hero redesign — cleaner premium service focus, no game emphasis */
.hero.hero-redesign{
  position:relative;
  min-height:94svh!important;
  padding:144px 0 72px!important;
  background:linear-gradient(180deg,#fffaf4 0%,#f5fbff 42%,#ffffff 100%)!important;
  color:var(--ink)!important;
  overflow:hidden;
}
.hero.hero-redesign::before,
.hero.hero-redesign::after{display:none!important;content:none!important;}
.hero.hero-redesign .hero-bg-animated{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.hero.hero-redesign .hero-layout-premium{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);
  gap:56px;
  align-items:center;
}
.hero.hero-redesign .hero-copy-premium{max-width:700px;}
.hero.hero-redesign .hero-copy-premium .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  padding:12px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.82)!important;
  color:#31566c!important;
  border:1px solid rgba(88,122,146,.16);
  box-shadow:0 14px 32px rgba(12,34,52,.08);
}
.hero.hero-redesign .hero-copy-premium .eyebrow::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,#35bdf4,#22c7b4);
  box-shadow:0 0 0 8px rgba(53,189,244,.10);
}
.hero.hero-redesign .hero-copy-premium h1{
  color:#0c2030!important;
  max-width:12ch;
  text-shadow:none!important;
  letter-spacing:-.055em;
}
.hero.hero-redesign .hero-copy-premium .lead{
  color:#5a7180!important;
  max-width:61ch;
  font-size:1.08rem;
}
.hero-value-list{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:22px 0 28px;
}
.hero-value-list span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(90,113,128,.12);
  box-shadow:0 12px 28px rgba(12,34,52,.06);
  color:#385263;
  font-weight:800;
}
.hero-value-list i{font-style:normal;color:#22c7b4;font-weight:900;}
.hero-proof-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:28px;
}
.hero-proof-row div{
  padding:18px 18px 17px;
  border-radius:24px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(90,113,128,.10);
  box-shadow:0 18px 38px rgba(12,34,52,.07);
  backdrop-filter:blur(8px);
}
.hero-proof-row strong{display:block;font-size:1rem;letter-spacing:-.02em;margin-bottom:6px;color:#10283a;}
.hero-proof-row span{display:block;color:#607685;font-size:.94rem;line-height:1.5;}
.hero.hero-redesign .hero-visual-premium{position:relative;min-height:620px;display:flex;align-items:center;justify-content:center;}
.hero-showcase-shell{position:relative;width:min(100%,620px);padding:28px 0;}
.hero-showcase-browser{
  position:relative;
  border-radius:34px;
  border:1px solid rgba(108,138,160,.16);
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(248,252,255,.88));
  box-shadow:0 28px 80px rgba(15,38,55,.14),0 14px 30px rgba(15,38,55,.08);
  overflow:hidden;
  backdrop-filter:blur(10px);
}
.hero-showcase-browser::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(130deg,rgba(255,255,255,.55),transparent 35%,transparent 68%,rgba(53,189,244,.06));
  pointer-events:none;
}
.hero-showcase-topbar{
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 22px;
  border-bottom:1px solid rgba(112,142,163,.12);
  background:rgba(250,252,255,.88);
}
.hero-showcase-dots{display:flex;gap:7px;}
.hero-showcase-dots span{width:10px;height:10px;border-radius:50%;background:#d8e6ef;}
.hero-showcase-dots span:first-child{background:#ffbda9;}
.hero-showcase-dots span:nth-child(2){background:#ffe3a1;}
.hero-showcase-dots span:nth-child(3){background:#a8efdd;}
.hero-showcase-url{
  flex:1;
  height:38px;
  display:flex;
  align-items:center;
  padding:0 16px;
  border-radius:999px;
  background:#f1f7fb;
  color:#648092;
  font-weight:800;
  font-size:.92rem;
}
.hero-showcase-body{display:grid;grid-template-columns:minmax(0,.96fr) minmax(250px,.9fr);gap:24px;padding:30px;align-items:center;}
.hero-showcase-copy strong{display:block;font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1.03;letter-spacing:-.045em;color:#0d2435;margin:10px 0 14px;}
.hero-showcase-copy p{margin:0 0 18px;color:#607685;line-height:1.7;}
.showcase-kicker{display:inline-block;padding:8px 12px;border-radius:999px;background:#eef8ff;color:#2d7aa4;font-weight:900;font-size:.72rem;letter-spacing:.16em;}
.showcase-chips{display:flex;gap:10px;flex-wrap:wrap;}
.showcase-chips span{padding:8px 11px;border-radius:999px;background:#f7fbff;border:1px solid rgba(112,142,163,.13);color:#496474;font-size:.84rem;font-weight:850;}
.hero-showcase-preview{position:relative;min-height:320px;}
.preview-window.main-window{
  position:relative;
  height:320px;
  border-radius:26px;
  padding:16px;
  background:linear-gradient(180deg,#f9fcff,#edf6fb);
  border:1px solid rgba(112,142,163,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 18px 34px rgba(12,34,52,.07);
}
.preview-window-head{height:18px;width:44%;border-radius:999px;background:linear-gradient(90deg,#d9e7f0,#eff6fb);margin-bottom:14px;}
.preview-hero-strip{height:112px;border-radius:20px;background:linear-gradient(135deg,#10283a,#204f67 54%,#22c7b4);margin-bottom:16px;position:relative;overflow:hidden;}
.preview-hero-strip::after{content:"";position:absolute;inset:auto -16% -44% auto;width:58%;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.35),rgba(255,255,255,0) 70%);}
.preview-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px;}
.preview-card-grid span{height:54px;border-radius:16px;background:#ffffff;border:1px solid rgba(112,142,163,.10);box-shadow:0 10px 18px rgba(12,34,52,.04);}
.preview-content-lines{display:grid;gap:9px;}
.preview-content-lines i{display:block;height:11px;border-radius:999px;background:#d9e6ee;}
.preview-content-lines i:nth-child(1){width:88%;}
.preview-content-lines i:nth-child(2){width:100%;}
.preview-content-lines i:nth-child(3){width:82%;}
.preview-content-lines i:nth-child(4){width:69%;}
.preview-panel{
  position:absolute;
  padding:14px 16px;
  border-radius:20px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(112,142,163,.12);
  box-shadow:0 14px 30px rgba(12,34,52,.08);
  backdrop-filter:blur(8px);
}
.preview-panel b{display:block;color:#15364b;font-size:.92rem;margin-bottom:7px;}
.preview-panel small{display:block;color:#648092;font-size:.82rem;font-weight:700;}
.preview-panel i{display:block;height:9px;border-radius:999px;background:#d8e6ef;margin-top:7px;}
.preview-panel.panel-a{left:-26px;bottom:24px;width:160px;animation:heroCardLiftA 6.6s ease-in-out infinite;}
.preview-panel.panel-a i:nth-child(2){width:100%;}
.preview-panel.panel-a i:nth-child(3){width:72%;}
.preview-panel.panel-b{right:-12px;top:26px;width:170px;animation:heroCardLiftB 7.8s ease-in-out infinite;}
.hero-float-note{
  position:absolute;
  padding:14px 16px;
  border-radius:20px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(112,142,163,.12);
  box-shadow:0 16px 34px rgba(12,34,52,.08);
  backdrop-filter:blur(10px);
}
.hero-float-note strong{display:block;font-size:.92rem;color:#0f2d40;margin-bottom:5px;}
.hero-float-note span{display:block;font-size:.82rem;color:#658091;line-height:1.45;}
.note-a{left:-12px;top:58px;animation:heroNoteFloatA 7.2s ease-in-out infinite;}
.note-b{right:0;bottom:28px;animation:heroNoteFloatB 8.6s ease-in-out infinite;}
.note-c{left:30%;bottom:-8px;animation:heroNoteFloatC 7.8s ease-in-out infinite;}
.hero-premium-aurora,
.hero-premium-wave,
.hero-premium-grid,
.hero-premium-beam,
.hero-premium-pulse,
.hero-premium-dot{position:absolute;pointer-events:none;}
.hero-premium-aurora{filter:blur(30px);opacity:.72;mix-blend-mode:multiply;border-radius:50%;}
.aurora-a{width:34vw;min-width:320px;max-width:560px;aspect-ratio:1/1;left:-10%;top:2%;background:radial-gradient(circle at 50% 50%,rgba(117,202,255,.45),rgba(117,202,255,.08) 46%,transparent 74%);animation:heroAuroraDriftA 18s ease-in-out infinite;}
.aurora-b{width:30vw;min-width:280px;max-width:460px;aspect-ratio:1/1;right:-8%;top:11%;background:radial-gradient(circle at 50% 50%,rgba(255,199,142,.34),rgba(255,199,142,.10) 44%,transparent 75%);animation:heroAuroraDriftB 22s ease-in-out infinite;}
.aurora-c{width:28vw;min-width:260px;max-width:420px;aspect-ratio:1/1;left:24%;bottom:-8%;background:radial-gradient(circle at 50% 50%,rgba(102,232,208,.24),rgba(102,232,208,.08) 46%,transparent 75%);animation:heroAuroraDriftC 20s ease-in-out infinite;}
.hero-premium-wave{border-radius:50%;border:1px solid rgba(103,136,161,.12);background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.42),rgba(255,255,255,0) 68%);}
.wave-a{width:48vw;min-width:460px;max-width:760px;height:460px;right:-16%;bottom:-24%;transform:rotate(18deg);animation:heroWaveDriftA 15s ease-in-out infinite;}
.wave-b{width:36vw;min-width:360px;max-width:620px;height:340px;left:-12%;top:28%;transform:rotate(-14deg);animation:heroWaveDriftB 17s ease-in-out infinite;}
.hero-premium-grid{
  inset:0;
  background:
    linear-gradient(rgba(122,155,177,.10) 1px,transparent 1px),
    linear-gradient(90deg,rgba(122,155,177,.10) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.72) 16%,rgba(0,0,0,.72) 82%,transparent 100%);
  opacity:.52;
  animation:heroGridPan 18s linear infinite;
}
.hero-premium-grid::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.36) 44%,transparent 52%);transform:translateX(-120%);animation:heroGridSweepNew 10.5s ease-in-out infinite;}
.hero-premium-beam{width:44%;height:1px;background:linear-gradient(90deg,transparent,rgba(53,189,244,.28),transparent);box-shadow:0 0 12px rgba(53,189,244,.10);}
.beam-a{left:8%;top:24%;transform:rotate(-10deg);animation:heroBeamFloatA 8s ease-in-out infinite;}
.beam-b{right:3%;bottom:24%;transform:rotate(8deg);animation:heroBeamFloatB 11s ease-in-out infinite;}
.hero-premium-pulse{border-radius:50%;border:1px solid rgba(53,189,244,.16);box-shadow:0 0 0 0 rgba(53,189,244,.08);}
.pulse-a{width:18px;height:18px;left:14%;top:20%;animation:heroPulse 4.8s ease-out infinite;}
.pulse-b{width:14px;height:14px;right:18%;bottom:18%;animation:heroPulse 5.6s ease-out infinite 1.1s;}
.hero-premium-dot{width:8px;height:8px;border-radius:50%;background:#b6d9eb;opacity:.86;box-shadow:0 0 0 10px rgba(182,217,235,.10);}
.dot-a{left:22%;top:14%;animation:heroTinyFloat 6.4s ease-in-out infinite;}
.dot-b{right:24%;top:18%;animation:heroTinyFloat 8.2s ease-in-out infinite 1.3s;}
.dot-c{right:10%;bottom:28%;animation:heroTinyFloat 7.6s ease-in-out infinite .7s;}
@keyframes heroAuroraDriftA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(62px,18px,0)}}
@keyframes heroAuroraDriftB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-54px,18px,0)}}
@keyframes heroAuroraDriftC{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(26px,-26px,0)}}
@keyframes heroWaveDriftA{0%,100%{transform:translate3d(0,0,0) rotate(18deg)}50%{transform:translate3d(-24px,-10px,0) rotate(16deg)}}
@keyframes heroWaveDriftB{0%,100%{transform:translate3d(0,0,0) rotate(-14deg)}50%{transform:translate3d(28px,16px,0) rotate(-11deg)}}
@keyframes heroGridPan{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(20px,16px,0)}}
@keyframes heroGridSweepNew{0%,20%{transform:translateX(-120%);opacity:0}38%,68%{transform:translateX(18%);opacity:1}100%{transform:translateX(130%);opacity:0}}
@keyframes heroBeamFloatA{0%,100%{transform:translateX(0) rotate(-10deg);opacity:.3}50%{transform:translateX(28px) rotate(-8deg);opacity:.8}}
@keyframes heroBeamFloatB{0%,100%{transform:translateX(0) rotate(8deg);opacity:.28}50%{transform:translateX(-30px) rotate(10deg);opacity:.72}}
@keyframes heroPulse{0%{transform:scale(.7);opacity:.7;box-shadow:0 0 0 0 rgba(53,189,244,.16)}70%{transform:scale(1);opacity:0;box-shadow:0 0 0 20px rgba(53,189,244,0)}100%{opacity:0;box-shadow:0 0 0 0 rgba(53,189,244,0)}}
@keyframes heroTinyFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-10px,0)}}
@keyframes heroCardLiftA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-9px,0)}}
@keyframes heroCardLiftB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,9px,0)}}
@keyframes heroNoteFloatA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(8px,-10px,0)}}
@keyframes heroNoteFloatB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-8px,8px,0)}}
@keyframes heroNoteFloatC{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-8px,0)}}
@media (max-width:1100px){
  .hero.hero-redesign .hero-layout-premium{grid-template-columns:minmax(0,1fr) minmax(320px,.92fr);gap:36px;}
  .hero-proof-row{grid-template-columns:1fr;}
  .hero.hero-redesign .hero-copy-premium h1{max-width:13ch;}
  .hero.hero-redesign .hero-visual-premium{min-height:560px;}
  .note-a{left:0;}
}
@media (max-width:920px){
  .hero.hero-redesign{padding:132px 0 56px!important;min-height:auto!important;}
  .hero.hero-redesign .hero-layout-premium{grid-template-columns:1fr;gap:28px;}
  .hero.hero-redesign .hero-copy-premium{max-width:none;}
  .hero.hero-redesign .hero-copy-premium h1{max-width:12.5ch;}
  .hero.hero-redesign .hero-visual-premium{min-height:auto;padding-top:8px;}
  .hero-showcase-shell{width:min(100%,640px);margin:0 auto;}
  .hero-showcase-body{grid-template-columns:1fr;gap:20px;}
  .hero-proof-row{grid-template-columns:1fr 1fr;}
  .wave-a{right:-30%;bottom:-20%;}
  .wave-b{left:-24%;top:20%;}
}
@media (max-width:680px){
  .hero-value-list{display:grid;grid-template-columns:1fr;}
  .hero-proof-row{grid-template-columns:1fr;}
  .hero-showcase-browser{border-radius:28px;}
  .hero-showcase-body{padding:22px;}
  .preview-window.main-window{height:286px;}
  .preview-panel.panel-a{left:-6px;bottom:18px;width:148px;}
  .preview-panel.panel-b{right:-4px;top:18px;width:150px;}
  .hero-float-note{position:static;margin-top:12px;}
  .hero-showcase-shell{padding-bottom:0;}
}
@media (max-width:560px){
  .hero.hero-redesign{padding:118px 0 44px!important;background:linear-gradient(180deg,#fffaf5 0%,#f8fbff 45%,#ffffff 100%)!important;}
  .hero.hero-redesign .hero-copy-premium h1{max-width:none;font-size:clamp(2.55rem,13vw,4.2rem);}
  .hero.hero-redesign .hero-copy-premium .lead{font-size:1rem;}
  .hero.hero-redesign .hero-copy-premium .eyebrow{font-size:.72rem;padding:10px 13px;}
  .hero-showcase-topbar{padding:14px 16px;}
  .hero-showcase-url{height:34px;font-size:.83rem;}
  .hero-showcase-body{padding:18px;}
  .hero-showcase-copy strong{font-size:1.55rem;}
  .preview-window.main-window{height:248px;padding:12px;}
  .preview-hero-strip{height:92px;border-radius:16px;}
  .preview-card-grid span{height:44px;border-radius:14px;}
  .preview-panel.panel-a,.preview-panel.panel-b{font-size:.82rem;}
  .hero-premium-grid{background-size:28px 28px;opacity:.36;}
  .beam-a{top:18%;left:-8%;width:68%;}
  .beam-b{right:-12%;bottom:22%;width:72%;}
}
@media (prefers-reduced-motion:reduce){
  .hero.hero-redesign .hero-bg-animated *,
  .hero.hero-redesign .hero-showcase-shell,
  .hero.hero-redesign .preview-panel,
  .hero.hero-redesign .hero-float-note{animation:none!important;}
}


/* Patch 18: new main palette + refined hero background based on #345793 and #76767e */
:root{
  --teal:#345793;
  --teal-2:#2c4a7e;
  --coral:#76767e;
  --gold:#96a4bf;
  --mist:#eef3fb;
  --paper:#f7f8fb;
  --silver:#d8dde5;
  --muted:#626b76;
  --line:rgba(52,87,147,.14);
  --shadow:0 24px 80px rgba(37,55,84,.13);
}
body{background:var(--paper);}
.section-tint{background:linear-gradient(180deg,#fbfcff 0%,#f0f4fb 100%);}
.scroll-progress span{background:linear-gradient(90deg,#345793,#6b7692,#345793)!important;box-shadow:0 0 24px rgba(52,87,147,.28)!important;}
.brand-mark{background:conic-gradient(from 160deg,#345793,#8e97a8,#76767e,#345793)!important;box-shadow:0 14px 30px rgba(52,87,147,.22)!important;}
.nav-menu>a:hover,.nav-menu>a.active{background:rgba(52,87,147,.10)!important;color:#274777!important;}
.eyebrow{background:rgba(52,87,147,.10)!important;color:#345793!important;}
.eyebrow:before{background:#76767e!important;box-shadow:0 0 0 6px rgba(118,118,126,.12)!important;}
.plan-badge{background:rgba(52,87,147,.10)!important;color:#345793!important;}
.price-card.active .plan-badge{background:rgba(255,255,255,.14)!important;color:#e7edf8!important;}
.pain-grid span{background:rgba(52,87,147,.10)!important;color:#345793!important;}
.price-top span{color:#345793!important;}
.btn-frame,.btn-ink,.btn-paper,.btn-submit{
  --sg-cta-a:#345793;
  --sg-cta-b:#8b95a7;
  --sg-cta-c:#76767e;
}
.hero.hero-redesign{
  background:linear-gradient(180deg,#fafbfd 0%,#f2f5fb 44%,#ffffff 100%)!important;
}
.hero.hero-redesign .hero-copy-premium .eyebrow{
  color:#345793!important;
  border-color:rgba(52,87,147,.14)!important;
  background:rgba(255,255,255,.84)!important;
}
.hero.hero-redesign .hero-copy-premium .eyebrow::before{
  background:linear-gradient(135deg,#345793,#76767e)!important;
  box-shadow:0 0 0 8px rgba(52,87,147,.08)!important;
}
.hero-value-list span{
  color:#445260!important;
  border-color:rgba(52,87,147,.10)!important;
  background:rgba(255,255,255,.80)!important;
}
.hero-value-list i{color:#345793!important;}
.hero-proof-row div{
  border-color:rgba(52,87,147,.10)!important;
  box-shadow:0 18px 38px rgba(37,55,84,.06)!important;
}
.hero-proof-row strong{color:#20364f!important;}
.hero-showcase-browser{
  border-color:rgba(52,87,147,.12)!important;
  box-shadow:0 28px 80px rgba(37,55,84,.12),0 14px 30px rgba(37,55,84,.06)!important;
}
.hero-showcase-browser::before{
  background:linear-gradient(130deg,rgba(255,255,255,.62),transparent 36%,transparent 70%,rgba(52,87,147,.08))!important;
}
.showcase-kicker{background:#eef3fb!important;color:#345793!important;}
.preview-hero-strip{background:linear-gradient(135deg,#294368,#345793 58%,#7c818e)!important;}
.hero-float-note,.preview-panel{
  border-color:rgba(52,87,147,.10)!important;
  box-shadow:0 16px 34px rgba(37,55,84,.07)!important;
}

/* Hero background redesign: elegant dev/web feel, inspired by flowing premium motion, but unique */
.hero-bg-premium{
  background:
    radial-gradient(circle at 12% 18%,rgba(52,87,147,.11),transparent 30%),
    radial-gradient(circle at 88% 12%,rgba(118,118,126,.10),transparent 26%),
    linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0));
}
.hero-bg-premium::before{
  content:"";
  position:absolute;
  inset:-10% -8%;
  background:
    repeating-linear-gradient(90deg,rgba(52,87,147,.07) 0 1px,transparent 1px 84px),
    repeating-linear-gradient(0deg,rgba(118,118,126,.045) 0 1px,transparent 1px 84px);
  mask-image:radial-gradient(circle at 50% 42%,rgba(0,0,0,.92),rgba(0,0,0,.72) 38%,rgba(0,0,0,.18) 78%,transparent 100%);
  opacity:.7;
  animation:heroBlueprintDrift 24s linear infinite;
}
.hero-bg-premium::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(118deg,transparent 8%,rgba(52,87,147,.10) 18%,transparent 30%,transparent 62%,rgba(118,118,126,.08) 72%,transparent 82%),
    linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  opacity:.72;
  animation:heroSweepSoft 14s ease-in-out infinite;
}
.hero-premium-aurora{filter:blur(34px)!important;mix-blend-mode:multiply!important;opacity:.62!important;}
.aurora-a{background:radial-gradient(circle at 50% 50%,rgba(52,87,147,.24),rgba(52,87,147,.08) 46%,transparent 74%)!important;left:-8%!important;top:2%!important;}
.aurora-b{background:radial-gradient(circle at 50% 50%,rgba(118,118,126,.22),rgba(118,118,126,.08) 44%,transparent 75%)!important;right:-6%!important;top:10%!important;}
.aurora-c{background:radial-gradient(circle at 50% 50%,rgba(113,135,175,.18),rgba(113,135,175,.06) 46%,transparent 75%)!important;left:26%!important;bottom:-10%!important;}
.hero-premium-wave{
  border:1px solid rgba(52,87,147,.10)!important;
  background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.46),rgba(255,255,255,0) 68%)!important;
}
.wave-a{right:-10%!important;bottom:-18%!important;}
.wave-b{left:-8%!important;top:30%!important;}
.hero-premium-grid{
  opacity:.42!important;
  background:
    linear-gradient(rgba(52,87,147,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(52,87,147,.08) 1px,transparent 1px)!important;
  background-size:52px 52px!important;
  mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.78) 14%,rgba(0,0,0,.78) 86%,transparent 100%)!important;
  animation:heroGridPanBlue 20s linear infinite!important;
}
.hero-premium-grid::after{
  background:linear-gradient(102deg,transparent 0%,rgba(255,255,255,.52) 46%,transparent 56%)!important;
  animation:heroGridSweepBlue 11s ease-in-out infinite!important;
}
.hero-premium-beam{
  height:2px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,transparent,rgba(52,87,147,.24),rgba(118,118,126,.18),transparent)!important;
  box-shadow:0 0 12px rgba(52,87,147,.08)!important;
}
.beam-a{left:6%!important;top:22%!important;animation:heroBeamFloatBlueA 10s ease-in-out infinite!important;}
.beam-b{right:4%!important;bottom:22%!important;animation:heroBeamFloatBlueB 12s ease-in-out infinite!important;}
.hero-premium-pulse{border-color:rgba(52,87,147,.16)!important;}
.hero-premium-dot{background:#9aa6bc!important;box-shadow:0 0 0 10px rgba(154,166,188,.10)!important;}
@keyframes heroBlueprintDrift{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(32px,18px,0)}}
@keyframes heroSweepSoft{0%,100%{transform:translateX(-4%) translateY(0);opacity:.48}50%{transform:translateX(4%) translateY(-1%);opacity:.82}}
@keyframes heroGridPanBlue{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(26px,18px,0)}}
@keyframes heroGridSweepBlue{0%,20%{transform:translateX(-120%);opacity:0}38%,68%{transform:translateX(20%);opacity:1}100%{transform:translateX(132%);opacity:0}}
@keyframes heroBeamFloatBlueA{0%,100%{transform:translateX(0) rotate(-10deg);opacity:.24}50%{transform:translateX(24px) rotate(-8deg);opacity:.72}}
@keyframes heroBeamFloatBlueB{0%,100%{transform:translateX(0) rotate(8deg);opacity:.20}50%{transform:translateX(-24px) rotate(10deg);opacity:.62}}
@media (max-width:920px){
  .hero-premium-grid{background-size:36px 36px!important;opacity:.34!important;}
  .hero-bg-premium::before{opacity:.52;}
}
@media (max-width:560px){
  .hero-bg-premium::before{opacity:.36;}
  .hero-bg-premium::after{opacity:.56;}
  .hero-premium-grid{background-size:28px 28px!important;opacity:.28!important;}
}
@media (prefers-reduced-motion:reduce){
  .hero-bg-premium::before,.hero-bg-premium::after,.hero-premium-grid,.hero-premium-grid::after,.hero-premium-beam{animation:none!important;}
}


/* Patch 19: lightweight hero background video — intentionally subtle */
.hero.hero-redesign .hero-bg-video{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  opacity:.085;
  filter:saturate(.70) contrast(.86) brightness(1.16);
  mix-blend-mode:multiply;
}
.hero.hero-redesign .hero-bg-premium{z-index:1;opacity:.76;}
.hero.hero-redesign .hero-layout-premium{z-index:2;}
.hero.hero-redesign .hero-bg-premium::after{
  background:
    linear-gradient(180deg,rgba(250,251,253,.42),rgba(247,249,253,.18) 38%,rgba(255,255,255,.34) 100%),
    linear-gradient(118deg,transparent 8%,rgba(52,87,147,.07) 18%,transparent 30%,transparent 62%,rgba(118,118,126,.06) 72%,transparent 82%)!important;
}
@media (max-width:920px){
  .hero.hero-redesign .hero-bg-video{opacity:.065;object-position:58% center;}
}
@media (max-width:560px){
  .hero.hero-redesign .hero-bg-video{opacity:.05;filter:saturate(.62) contrast(.82) brightness(1.2);}
}
@media (prefers-reduced-motion:reduce){
  .hero.hero-redesign .hero-bg-video{display:none!important;}
}


/* Patch 20: replace dull hero video with a richer CSS-only animated hero background */
.hero.hero-redesign{
  background:linear-gradient(180deg,#fbfdff 0%,#f5f8ff 42%,#ffffff 100%)!important;
}
.hero.hero-redesign .hero-bg-premium{
  z-index:1!important;
  opacity:1!important;
  background:
    radial-gradient(circle at 10% 14%,rgba(82,168,255,.16),transparent 26%),
    radial-gradient(circle at 88% 18%,rgba(86,94,235,.14),transparent 24%),
    radial-gradient(circle at 72% 78%,rgba(37,209,201,.12),transparent 22%),
    linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0));
}
.hero.hero-redesign .hero-bg-premium::before{
  content:"";
  position:absolute;
  inset:-10% -14%;
  background:
    radial-gradient(circle at 16% 20%,rgba(52,87,147,.22),rgba(52,87,147,.05) 26%,transparent 42%),
    radial-gradient(circle at 82% 16%,rgba(87,105,255,.18),rgba(87,105,255,.04) 24%,transparent 40%),
    radial-gradient(circle at 76% 72%,rgba(44,214,193,.18),rgba(44,214,193,.04) 24%,transparent 40%),
    radial-gradient(circle at 34% 76%,rgba(255,169,84,.16),rgba(255,169,84,.04) 24%,transparent 38%),
    repeating-linear-gradient(90deg,rgba(52,87,147,.06) 0 1px,transparent 1px 92px),
    repeating-linear-gradient(0deg,rgba(89,145,228,.04) 0 1px,transparent 1px 92px);
  mask-image:radial-gradient(circle at 52% 44%,rgba(0,0,0,.95),rgba(0,0,0,.78) 40%,rgba(0,0,0,.22) 76%,transparent 100%);
  opacity:.88;
  animation:sgHeroBlueprintFlow 26s linear infinite;
}
.hero.hero-redesign .hero-bg-premium::after{
  content:"";
  position:absolute;
  inset:-8%;
  background:
    linear-gradient(118deg,transparent 0%,rgba(73,193,255,.18) 16%,transparent 26%,transparent 58%,rgba(67,220,196,.14) 68%,transparent 78%),
    linear-gradient(102deg,transparent 12%,rgba(255,255,255,.42) 26%,transparent 34%,transparent 72%,rgba(144,125,255,.18) 84%,transparent 94%);
  opacity:.78;
  animation:sgHeroSweepField 14s ease-in-out infinite;
}
.hero.hero-redesign .hero-premium-grid{
  opacity:.48!important;
  background:
    linear-gradient(rgba(79,126,204,.10) 1px,transparent 1px),
    linear-gradient(90deg,rgba(79,126,204,.10) 1px,transparent 1px)!important;
  background-size:50px 50px!important;
  animation:sgHeroGridDrift 18s linear infinite!important;
}
.hero.hero-redesign .hero-premium-grid::after{
  background:linear-gradient(103deg,transparent 0%,rgba(255,255,255,.55) 48%,transparent 56%)!important;
  animation:sgHeroGridSweep 10s ease-in-out infinite!important;
}
.hero.hero-redesign .hero-premium-aurora{
  filter:blur(36px)!important;
  mix-blend-mode:screen!important;
  opacity:.82!important;
}
.hero.hero-redesign .aurora-a{
  width:min(38vw,620px)!important;
  background:radial-gradient(circle at 50% 50%,rgba(70,159,255,.44),rgba(70,159,255,.12) 44%,transparent 72%)!important;
  left:-10%!important;
  top:4%!important;
  animation:sgHeroBlobA 18s ease-in-out infinite!important;
}
.hero.hero-redesign .aurora-b{
  width:min(34vw,520px)!important;
  background:radial-gradient(circle at 50% 50%,rgba(113,102,255,.36),rgba(113,102,255,.11) 42%,transparent 72%)!important;
  right:-8%!important;
  top:10%!important;
  animation:sgHeroBlobB 22s ease-in-out infinite!important;
}
.hero.hero-redesign .aurora-c{
  width:min(30vw,460px)!important;
  background:radial-gradient(circle at 50% 50%,rgba(35,210,197,.34),rgba(35,210,197,.10) 44%,transparent 72%)!important;
  left:30%!important;
  bottom:-8%!important;
  animation:sgHeroBlobC 20s ease-in-out infinite!important;
}
.hero.hero-redesign .hero-premium-wave{
  border:none!important;
  overflow:hidden;
  background:transparent!important;
  box-shadow:none!important;
}
.hero.hero-redesign .hero-premium-wave::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(90deg,rgba(52,87,147,.06),rgba(74,195,255,.16),rgba(35,210,197,.14),rgba(115,101,255,.12),rgba(52,87,147,.06));
  filter:blur(2px);
}
.hero.hero-redesign .hero-premium-wave::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  border:1px solid rgba(103,149,225,.16);
}
.hero.hero-redesign .wave-a{
  width:min(52vw,780px)!important;
  height:220px!important;
  right:-10%!important;
  bottom:4%!important;
  transform:rotate(-11deg)!important;
  opacity:.9;
  animation:sgHeroRibbonA 16s ease-in-out infinite!important;
}
.hero.hero-redesign .wave-b{
  width:min(46vw,680px)!important;
  height:180px!important;
  left:-8%!important;
  top:24%!important;
  transform:rotate(14deg)!important;
  opacity:.82;
  animation:sgHeroRibbonB 18s ease-in-out infinite!important;
}
.hero.hero-redesign .hero-premium-beam{
  height:2px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,transparent,rgba(88,182,255,.28),rgba(53,220,196,.20),transparent)!important;
  box-shadow:0 0 18px rgba(82,168,255,.10)!important;
}
.hero.hero-redesign .beam-a{left:4%!important;top:26%!important;width:58%!important;animation:sgHeroBeamA 9s ease-in-out infinite!important;}
.hero.hero-redesign .beam-b{right:0%!important;bottom:22%!important;width:54%!important;animation:sgHeroBeamB 11s ease-in-out infinite!important;}
.hero.hero-redesign .hero-premium-pulse{border-color:rgba(72,165,255,.18)!important;box-shadow:0 0 0 0 rgba(72,165,255,.12)!important;}
.hero.hero-redesign .pulse-a{left:16%!important;top:19%!important;animation:sgHeroPulse 4.6s ease-out infinite!important;}
.hero.hero-redesign .pulse-b{right:18%!important;bottom:18%!important;animation:sgHeroPulse 5.8s ease-out infinite 1.1s!important;}
.hero.hero-redesign .hero-premium-dot{background:#8fb8ff!important;box-shadow:0 0 0 10px rgba(143,184,255,.11)!important;opacity:.9!important;}
.hero.hero-redesign .dot-a{left:22%!important;top:13%!important;}
.hero.hero-redesign .dot-b{right:24%!important;top:18%!important;}
.hero.hero-redesign .dot-c{right:11%!important;bottom:30%!important;}

@keyframes sgHeroBlueprintFlow{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(34px,18px,0)}}
@keyframes sgHeroSweepField{0%,100%{transform:translate3d(-2%,0,0);opacity:.54}50%{transform:translate3d(3%,-1%,0);opacity:.88}}
@keyframes sgHeroGridDrift{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(22px,16px,0)}}
@keyframes sgHeroGridSweep{0%,18%{transform:translateX(-120%);opacity:0}34%,68%{transform:translateX(14%);opacity:1}100%{transform:translateX(128%);opacity:0}}
@keyframes sgHeroBlobA{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(68px,18px,0) scale(1.06)}}
@keyframes sgHeroBlobB{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-56px,18px,0) scale(1.08)}}
@keyframes sgHeroBlobC{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(24px,-24px,0) scale(1.05)}}
@keyframes sgHeroRibbonA{0%,100%{transform:translate3d(0,0,0) rotate(-11deg)}50%{transform:translate3d(-26px,-14px,0) rotate(-9deg)}}
@keyframes sgHeroRibbonB{0%,100%{transform:translate3d(0,0,0) rotate(14deg)}50%{transform:translate3d(28px,14px,0) rotate(11deg)}}
@keyframes sgHeroBeamA{0%,100%{transform:translateX(0) rotate(-6deg);opacity:.28}50%{transform:translateX(24px) rotate(-4deg);opacity:.74}}
@keyframes sgHeroBeamB{0%,100%{transform:translateX(0) rotate(7deg);opacity:.24}50%{transform:translateX(-28px) rotate(9deg);opacity:.66}}
@keyframes sgHeroPulse{0%{transform:scale(.72);opacity:.8;box-shadow:0 0 0 0 rgba(72,165,255,.14)}72%{transform:scale(1);opacity:0;box-shadow:0 0 0 22px rgba(72,165,255,0)}100%{opacity:0;box-shadow:0 0 0 0 rgba(72,165,255,0)}}

@media (max-width:920px){
  .hero.hero-redesign .hero-bg-premium::before{opacity:.76;}
  .hero.hero-redesign .hero-bg-premium::after{opacity:.62;}
  .hero.hero-redesign .hero-premium-grid{background-size:36px 36px!important;opacity:.36!important;}
  .hero.hero-redesign .wave-a{width:min(74vw,620px)!important;height:170px!important;right:-24%!important;bottom:6%!important;}
  .hero.hero-redesign .wave-b{width:min(68vw,540px)!important;height:150px!important;left:-18%!important;top:28%!important;}
}
@media (max-width:560px){
  .hero.hero-redesign .hero-bg-premium::before{opacity:.56;}
  .hero.hero-redesign .hero-bg-premium::after{opacity:.52;}
  .hero.hero-redesign .hero-premium-grid{background-size:28px 28px!important;opacity:.28!important;}
  .hero.hero-redesign .hero-premium-aurora{opacity:.64!important;}
  .hero.hero-redesign .wave-a{width:92vw!important;height:130px!important;right:-34%!important;bottom:8%!important;}
  .hero.hero-redesign .wave-b{width:86vw!important;height:124px!important;left:-32%!important;top:31%!important;}
  .hero.hero-redesign .beam-a,.hero.hero-redesign .beam-b{width:74%!important;}
}
@media (prefers-reduced-motion:reduce){
  .hero.hero-redesign .hero-bg-premium::before,
  .hero.hero-redesign .hero-bg-premium::after,
  .hero.hero-redesign .hero-premium-grid,
  .hero.hero-redesign .hero-premium-grid::after,
  .hero.hero-redesign .hero-premium-aurora,
  .hero.hero-redesign .hero-premium-wave,
  .hero.hero-redesign .hero-premium-beam,
  .hero.hero-redesign .hero-premium-pulse,
  .hero.hero-redesign .hero-premium-dot{animation:none!important;}
}


/* Patch 21: Video 2 as clearly visible premium hero background */
.hero.hero-redesign{
  background:#f8fbff!important;
}
.hero.hero-redesign .hero-bg-video-v2{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:54% center!important;
  opacity:.72!important;
  filter:saturate(.98) contrast(.94) brightness(1.06)!important;
  mix-blend-mode:normal!important;
  pointer-events:none!important;
}
/* Keep only a light readability layer over the video; let the artwork remain visible. */
.hero.hero-redesign .hero-bg-premium{
  z-index:1!important;
  opacity:1!important;
  background:
    linear-gradient(90deg,rgba(249,252,255,.92) 0%,rgba(249,252,255,.78) 32%,rgba(249,252,255,.40) 55%,rgba(249,252,255,.12) 78%,rgba(249,252,255,.04) 100%),
    linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.04))!important;
}
.hero.hero-redesign .hero-bg-premium::before{
  opacity:.16!important;
  filter:none!important;
}
.hero.hero-redesign .hero-bg-premium::after{
  opacity:.15!important;
}
.hero.hero-redesign .hero-premium-grid{opacity:.10!important;}
.hero.hero-redesign .hero-premium-aurora{opacity:.18!important;}
.hero.hero-redesign .hero-premium-wave{opacity:.12!important;}
.hero.hero-redesign .hero-premium-beam{opacity:.16!important;}
.hero.hero-redesign .hero-premium-pulse,
.hero.hero-redesign .hero-premium-dot{opacity:.18!important;}
.hero.hero-redesign .hero-layout-premium{position:relative;z-index:2!important;}
/* Slightly more glass in the text-side support cards so they stay readable on motion. */
.hero.hero-redesign .hero-copy-premium .eyebrow,
.hero.hero-redesign .hero-value-list span,
.hero.hero-redesign .hero-proof-row div{
  backdrop-filter:blur(10px);
}
@media (max-width:920px){
  .hero.hero-redesign .hero-bg-video-v2{opacity:.64!important;object-position:58% center!important;}
  .hero.hero-redesign .hero-bg-premium{
    background:
      linear-gradient(180deg,rgba(249,252,255,.84) 0%,rgba(249,252,255,.58) 42%,rgba(249,252,255,.28) 72%,rgba(249,252,255,.14) 100%),
      linear-gradient(90deg,rgba(249,252,255,.56),rgba(249,252,255,.12))!important;
  }
}
@media (max-width:560px){
  .hero.hero-redesign .hero-bg-video-v2{opacity:.58!important;object-position:62% center!important;filter:saturate(.94) contrast(.92) brightness(1.08)!important;}
  .hero.hero-redesign .hero-bg-premium{
    background:linear-gradient(180deg,rgba(250,252,255,.80) 0%,rgba(250,252,255,.56) 48%,rgba(250,252,255,.28) 100%)!important;
  }
  .hero.hero-redesign .hero-premium-grid,
  .hero.hero-redesign .hero-premium-wave,
  .hero.hero-redesign .hero-premium-beam{opacity:.07!important;}
}
@media (prefers-reduced-motion:reduce){
  .hero.hero-redesign .hero-bg-video-v2{display:none!important;}
}


/* Patch 22: restore the stronger developer CTA + navbar interaction */
.btn-frame,
.btn-ink,
.btn-paper,
.btn-submit{
  --sg-dev-a:#345793;
  --sg-dev-b:#76767e;
  --sg-dev-c:#9aa8c4;
  overflow:hidden!important;
  border:1px solid transparent!important;
  background-size:100% 100%,320% 100%!important;
  animation:sgDevButtonBorder 4.4s linear infinite!important;
}
.btn-frame,
.btn-submit{
  color:#fff!important;
  background:
    linear-gradient(135deg,#263d64 0%,#345793 56%,#4a5e82 100%) padding-box,
    linear-gradient(105deg,var(--sg-dev-a),#b9c5dc,var(--sg-dev-b),#d7deeb,var(--sg-dev-a)) border-box!important;
  background-size:100% 100%,320% 100%!important;
  box-shadow:0 16px 34px rgba(52,87,147,.24),0 0 0 1px rgba(255,255,255,.05) inset!important;
}
.btn-ink,
.btn-paper{
  color:#27374e!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(244,247,252,.98)) padding-box,
    linear-gradient(105deg,#345793,#aeb9cf,#76767e,#cbd3e1,#345793) border-box!important;
  background-size:100% 100%,320% 100%!important;
  box-shadow:0 15px 32px rgba(52,87,147,.13),0 0 0 1px rgba(255,255,255,.8) inset!important;
}
.btn-frame > span,
.btn-ink > span,
.btn-paper > span,
.btn-submit > span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  position:relative!important;
  z-index:3!important;
}
.btn-frame > span::before,
.btn-ink > span::before,
.btn-paper > span::before,
.btn-submit > span::before{
  content:"<>"!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:34px!important;
  height:26px!important;
  flex:0 0 34px!important;
  border-radius:9px!important;
  border:1px solid rgba(255,255,255,.20)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.05))!important;
  color:#fff!important;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;
  font-size:.76rem!important;
  font-weight:950!important;
  letter-spacing:-.10em!important;
  line-height:1!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 0 16px rgba(199,215,240,.12)!important;
  transform:translateZ(0)!important;
  transition:transform .34s cubic-bezier(.2,.9,.2,1.3),box-shadow .34s ease,background .34s ease!important;
}
.btn-ink > span::before,
.btn-paper > span::before{
  border-color:rgba(52,87,147,.16)!important;
  background:linear-gradient(135deg,#345793,#687792)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(52,87,147,.18)!important;
}
.btn-frame > span::after,
.btn-ink > span::after,
.btn-paper > span::after,
.btn-submit > span::after{
  content:"↗"!important;
  display:inline-block!important;
  margin-left:1px!important;
  font-size:.92em!important;
  line-height:1!important;
  opacity:.78!important;
  transition:transform .32s cubic-bezier(.2,.9,.2,1.35),opacity .3s ease!important;
}
.btn-frame::before,
.btn-ink::before,
.btn-paper::before,
.btn-submit::before{
  content:""!important;
  position:absolute!important;
  inset:-55% -30%!important;
  border:0!important;
  border-radius:0!important;
  background:linear-gradient(108deg,transparent 37%,rgba(255,255,255,.02) 43%,rgba(255,255,255,.74) 50%,rgba(255,255,255,.12) 56%,transparent 64%)!important;
  opacity:0!important;
  transform:translateX(-58%)!important;
  transition:transform .78s cubic-bezier(.18,.8,.2,1),opacity .16s ease!important;
  z-index:1!important;
  pointer-events:none!important;
}
.btn-frame::after,
.btn-ink::after,
.btn-paper::after{
  content:""!important;
  position:absolute!important;
  inset:4px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  opacity:.9!important;
  transform:none!important;
  z-index:1!important;
  pointer-events:none!important;
}
.btn-ink::after,.btn-paper::after{border-color:rgba(52,87,147,.08)!important;}
.btn-frame:hover,
.btn-frame:focus-visible,
.btn-ink:hover,
.btn-ink:focus-visible,
.btn-paper:hover,
.btn-paper:focus-visible,
.btn-submit:hover,
.btn-submit:focus-visible{
  transform:translateY(-4px) scale(1.022)!important;
  filter:saturate(1.08) contrast(1.02)!important;
  box-shadow:0 23px 48px rgba(52,87,147,.24),0 0 26px rgba(97,121,165,.18)!important;
}
.btn-frame:hover::before,
.btn-frame:focus-visible::before,
.btn-ink:hover::before,
.btn-ink:focus-visible::before,
.btn-paper:hover::before,
.btn-paper:focus-visible::before,
.btn-submit:hover::before,
.btn-submit:focus-visible::before{
  opacity:.88!important;
  transform:translateX(62%)!important;
}
.btn-frame:hover > span::before,
.btn-frame:focus-visible > span::before,
.btn-ink:hover > span::before,
.btn-ink:focus-visible > span::before,
.btn-paper:hover > span::before,
.btn-paper:focus-visible > span::before,
.btn-submit:hover > span::before,
.btn-submit:focus-visible > span::before{
  transform:translateY(-1px) rotate(-4deg) scale(1.08)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 0 22px rgba(210,222,244,.30)!important;
}
.btn-frame:hover > span::after,
.btn-frame:focus-visible > span::after,
.btn-ink:hover > span::after,
.btn-ink:focus-visible > span::after,
.btn-paper:hover > span::after,
.btn-paper:focus-visible > span::after,
.btn-submit:hover > span::after,
.btn-submit:focus-visible > span::after{
  opacity:1!important;
  transform:translate3d(4px,-3px,0) rotate(12deg)!important;
}

/* Strong developer-UI hover for the normal navbar links. */
.nav-menu > a:not(.nav-action){
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  color:#36455a!important;
  background:transparent!important;
  transition:color .26s ease,transform .26s ease,background .26s ease,box-shadow .26s ease!important;
}
.nav-menu > a:not(.nav-action)::before{
  content:"";
  position:absolute;
  left:11px;
  right:11px;
  bottom:7px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,transparent,#345793 24%,#9ba8c1 50%,#76767e 76%,transparent);
  background-size:220% 100%;
  opacity:0;
  transform:scaleX(.25);
  transform-origin:center;
  transition:opacity .24s ease,transform .34s cubic-bezier(.2,.9,.2,1);
  animation:sgNavEnergy 2.8s linear infinite;
  z-index:2;
}
.nav-menu > a:not(.nav-action)::after{
  content:"";
  position:absolute;
  inset:4px 3px;
  border-radius:13px;
  background:linear-gradient(120deg,rgba(52,87,147,.10),rgba(255,255,255,.56),rgba(118,118,126,.08));
  opacity:0;
  transform:scale(.92);
  transition:opacity .26s ease,transform .30s cubic-bezier(.2,.9,.2,1);
  z-index:-1;
}
.nav-menu > a:not(.nav-action):hover,
.nav-menu > a:not(.nav-action):focus-visible,
.nav-menu > a:not(.nav-action).active{
  color:#274b83!important;
  transform:translateY(-2px)!important;
  background:transparent!important;
  box-shadow:none!important;
}
.nav-menu > a:not(.nav-action):hover::before,
.nav-menu > a:not(.nav-action):focus-visible::before,
.nav-menu > a:not(.nav-action).active::before{
  opacity:1;
  transform:scaleX(1);
}
.nav-menu > a:not(.nav-action):hover::after,
.nav-menu > a:not(.nav-action):focus-visible::after,
.nav-menu > a:not(.nav-action).active::after{
  opacity:1;
  transform:scale(1);
}
.nav-action.btn-frame{
  min-height:46px!important;
  padding:0 18px!important;
  margin-left:14px!important;
}
.nav-action.btn-frame > span{gap:8px!important;}
.nav-action.btn-frame > span::before{width:30px!important;height:24px!important;flex-basis:30px!important;font-size:.70rem!important;}
.nav-action.btn-frame > span::after{font-size:.84em!important;}
@keyframes sgDevButtonBorder{0%{background-position:0 0,0% 50%}100%{background-position:0 0,320% 50%}}
@keyframes sgNavEnergy{0%{background-position:0% 50%}100%{background-position:220% 50%}}
@media (max-width:920px){
  .nav-menu > a:not(.nav-action){transform:none!important;}
  .nav-menu > a:not(.nav-action)::before{left:16px;right:16px;bottom:6px;}
  .nav-action.btn-frame{margin-left:0!important;margin-top:3px!important;}
}
@media (max-width:560px){
  .btn-frame > span::before,
  .btn-ink > span::before,
  .btn-paper > span::before,
  .btn-submit > span::before{width:31px!important;height:24px!important;flex-basis:31px!important;font-size:.70rem!important;}
}
@media (prefers-reduced-motion:reduce){
  .btn-frame,.btn-ink,.btn-paper,.btn-submit,
  .nav-menu > a:not(.nav-action)::before{animation:none!important;}
}


/* Patch 23: MilkyMix-inspired hero layout refresh + move video background to pricing section */
.home-page .site-header{
  position:absolute!important;
  top:0!important;
  left:0;
  width:100%;
  z-index:140;
  pointer-events:none;
}
.home-page .sky-nav{
  pointer-events:auto;
  width:min(calc(100% - 40px),1220px);
  min-height:auto!important;
  margin:0 auto;
  padding:26px 0 0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  border-radius:0!important;
}
.home-page .site-header.is-scrolled .sky-nav{transform:none!important;background:transparent!important;}
.home-page .brand-logo-wrap{background:transparent!important;box-shadow:none!important;padding:0!important;width:120px;height:auto;}
.home-page .brand-copy small{display:none!important;}
.home-page .brand-copy strong{font-size:1.05rem;color:#2e456e;}
.home-page .nav-menu{gap:16px;align-items:center;}
.home-page .nav-menu > a:not(.nav-action){
  padding:8px 2px!important;
  border-radius:0!important;
  background:none!important;
  color:#4a5265!important;
  font-size:.92rem;
  font-weight:900;
  position:relative;
}
.home-page .nav-menu > a:not(.nav-action)::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-4px;
  height:2px;
  border-radius:999px;
  background:#345793;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .24s ease;
}
.home-page .nav-menu > a:not(.nav-action):hover,
.home-page .nav-menu > a:not(.nav-action).active{color:#345793!important;}
.home-page .nav-menu > a:not(.nav-action):hover::after,
.home-page .nav-menu > a:not(.nav-action).active::after{transform:scaleX(1);}
.home-page .nav-action.btn-frame{
  min-height:44px!important;
  padding:0 18px!important;
  background:#345793!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 12px 28px rgba(52,87,147,.20)!important;
  animation:none!important;
}
.home-page .nav-action.btn-frame::before,
.home-page .nav-action.btn-frame::after,
.home-page .nav-action.btn-frame > span::before,
.home-page .nav-action.btn-frame > span::after{display:none!important;content:none!important;}
.home-page .nav-action.btn-frame:hover,
.home-page .nav-action.btn-frame:focus-visible{background:#76767e!important;color:#fff!important;box-shadow:0 16px 34px rgba(118,118,126,.22)!important;}

.hero.hero-layout-refresh{
  position:relative;
  min-height:860px!important;
  padding:152px 0 150px!important;
  background:linear-gradient(180deg,#fcfdff 0%,#f7f9ff 58%,#ffffff 100%)!important;
  overflow:hidden;
}
.hero.hero-layout-refresh::before,
.hero.hero-layout-refresh::after{display:none!important;content:none!important;}
.hero.hero-layout-refresh .hero-bg-clean{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0;}
.hero.hero-layout-refresh .hero-layout-fresh{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,0.96fr) minmax(360px,1.04fr);
  gap:36px;
  align-items:center;
}
.hero.hero-layout-refresh .hero-copy-fresh{max-width:560px;padding-top:20px;}
.hero.hero-layout-refresh .hero-copy-fresh .eyebrow{
  margin-bottom:22px;
  padding:10px 16px;
  background:rgba(255,255,255,.9)!important;
  color:#345793!important;
  border:1px solid rgba(52,87,147,.12);
  box-shadow:0 12px 28px rgba(52,87,147,.08);
}
.hero.hero-layout-refresh .hero-copy-fresh .eyebrow::before{
  background:#76767e!important;
  box-shadow:0 0 0 6px rgba(118,118,126,.10)!important;
}
.hero.hero-layout-refresh .hero-copy-fresh h1{
  max-width:10.5ch;
  color:#26385d!important;
  font-size:clamp(3.6rem,7vw,6.3rem)!important;
  line-height:.92;
  letter-spacing:-.07em;
  margin-bottom:22px;
  text-shadow:none!important;
}
.hero.hero-layout-refresh .hero-copy-fresh .lead{
  max-width:53ch;
  color:#5c6475!important;
  font-size:1.08rem;
  line-height:1.75;
  margin-bottom:26px;
}
.hero-actions-single{display:flex;align-items:center;gap:14px;margin:0 0 26px!important;}
.btn-hero-primary{
  background:#345793!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 18px 42px rgba(52,87,147,.22)!important;
  animation:none!important;
  min-height:58px!important;
  padding:0 26px!important;
}
.btn-hero-primary::before,
.btn-hero-primary::after,
.btn-hero-primary > span::before,
.btn-hero-primary > span::after{display:none!important;content:none!important;}
.btn-hero-primary:hover,
.btn-hero-primary:focus-visible{background:#76767e!important;color:#fff!important;box-shadow:0 20px 44px rgba(118,118,126,.24)!important;transform:translateY(-2px)!important;}
.hero-inline-points{display:flex;flex-wrap:wrap;gap:12px;}
.hero-inline-points span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 14px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(52,87,147,.10);
  box-shadow:0 14px 28px rgba(52,87,147,.06);
  color:#4e5e73;
  font-weight:850;
}
.hero-inline-points span::before{content:"";width:8px;height:8px;border-radius:50%;background:#345793;box-shadow:0 0 0 5px rgba(52,87,147,.10);}
.hero.hero-layout-refresh .hero-visual-fresh{min-height:560px;display:flex;align-items:center;justify-content:center;}
.hero-visual-stage{position:relative;width:min(100%,670px);height:560px;}
.hero-visual-stage::before{
  content:"";
  position:absolute;
  inset:50px 18px 30px 40px;
  border-radius:42px;
  background:linear-gradient(145deg,#eff4ff 0%,#ffffff 56%,#f4f6fb 100%);
  box-shadow:0 30px 80px rgba(52,87,147,.10), inset 0 0 0 1px rgba(52,87,147,.08);
}
.hero-visual-stage::after{
  content:"";
  position:absolute;
  right:6px;
  top:12px;
  width:190px;
  height:190px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(52,87,147,.12),rgba(52,87,147,0) 70%);
}
.hero-visual-card{
  position:absolute;
  left:58px;
  top:102px;
  width:min(100%,360px);
  padding:34px 30px;
  border-radius:34px;
  background:linear-gradient(180deg,#ffffff 0%,#f7f9ff 100%);
  border:1px solid rgba(52,87,147,.12);
  box-shadow:0 22px 54px rgba(52,87,147,.10);
}
.hero-visual-card .visual-kicker{display:inline-block;margin-bottom:14px;padding:9px 12px;border-radius:999px;background:rgba(52,87,147,.08);color:#345793;font-size:.72rem;font-weight:900;letter-spacing:.16em;}
.hero-visual-card strong{display:block;font-size:clamp(2rem,3vw,2.8rem);line-height:1.04;letter-spacing:-.04em;color:#30456f;margin-bottom:12px;}
.hero-visual-card small{display:block;color:#6a7281;font-size:.98rem;line-height:1.7;}
.hero-visual-pill{
  position:absolute;
  display:inline-flex;
  align-items:center;
  min-height:60px;
  padding:0 18px;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(52,87,147,.10);
  box-shadow:0 18px 36px rgba(52,87,147,.08);
  color:#44566e;
  font-weight:900;
}
.pill-a{right:28px;top:138px;}
.pill-b{right:10px;top:224px;}
.pill-c{left:124px;bottom:56px;}
.hero-clean-shape,
.hero-clean-orb{position:absolute;pointer-events:none;}
.hero-clean-shape{
  border-radius:52px;
  background:linear-gradient(135deg,rgba(52,87,147,.12),rgba(118,118,126,.06));
  filter:blur(.2px);
}
.shape-a{right:-40px;top:104px;width:380px;height:300px;border-radius:120px 40px 120px 40px;opacity:.58;}
.shape-b{left:-80px;bottom:138px;width:280px;height:180px;border-radius:120px;opacity:.34;}
.shape-c{right:220px;bottom:60px;width:220px;height:120px;border-radius:60px;opacity:.26;}
.hero-clean-orb{border-radius:50%;filter:blur(24px);opacity:.36;}
.orb-a{width:230px;height:230px;right:180px;top:110px;background:rgba(52,87,147,.18);}
.orb-b{width:180px;height:180px;right:24px;bottom:70px;background:rgba(118,118,126,.16);}
.hero-wave-divider{position:absolute;left:0;right:0;bottom:-1px;height:132px;line-height:0;z-index:3;pointer-events:none;}
.hero-wave-divider svg{display:block;width:100%;height:100%;}

.offer-video-section{position:relative;overflow:hidden;isolation:isolate;}
.offer-video-section .offer-bg-video,
.offer-video-section .offer-video-overlay{position:absolute;inset:0;pointer-events:none;}
.offer-video-section .offer-bg-video{
  width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;
  opacity:.76;filter:saturate(.98) contrast(.95) brightness(1.04);
}
.offer-video-section .offer-video-overlay{
  z-index:1;
  background:linear-gradient(135deg,rgba(248,251,255,.86) 0%,rgba(248,251,255,.78) 28%,rgba(248,251,255,.54) 58%,rgba(248,251,255,.72) 100%);
}
.offer-video-section > .container-wide{position:relative;z-index:2;}
.offer-video-section .offer-copy,
.offer-video-section .price-card{backdrop-filter:blur(8px);}
.offer-video-section .offer-copy{padding:10px 0;}
.offer-video-section .price-card{background:rgba(255,255,255,.84);border-color:rgba(52,87,147,.10);box-shadow:0 18px 55px rgba(52,87,147,.10);} 
.offer-video-section .price-card.active{background:linear-gradient(145deg,rgba(52,87,147,.94),rgba(63,91,140,.88));color:#fff;border-color:rgba(255,255,255,.18);} 
.offer-video-section[data-scroll-blinds]::before{background:repeating-linear-gradient(90deg,rgba(248,251,255,.94) 0 9%, rgba(244,248,255,.92) 9% 10%)!important;}

@media (max-width:1120px){
  .hero.hero-layout-refresh .hero-layout-fresh{grid-template-columns:1fr;gap:22px;}
  .hero.hero-layout-refresh .hero-copy-fresh{max-width:none;}
  .hero.hero-layout-refresh .hero-copy-fresh h1{max-width:11ch;}
  .hero.hero-layout-refresh .hero-visual-fresh{min-height:480px;}
  .hero-visual-stage{height:480px;max-width:640px;margin:0 auto;}
}
@media (max-width:920px){
  .home-page .site-header{top:10px!important;position:fixed!important;}
  .home-page .sky-nav{width:calc(100% - 20px);padding:0!important;min-height:58px!important;}
  .home-page .brand-logo-wrap{width:102px;}
  .home-page .nav-toggle{display:flex;background:#345793;border-radius:16px;box-shadow:none;}
  .home-page .nav-menu{background:rgba(255,255,255,.96)!important;border:1px solid rgba(52,87,147,.10)!important;box-shadow:0 24px 70px rgba(52,87,147,.12)!important;border-radius:22px!important;gap:6px;}
  .home-page .nav-menu > a:not(.nav-action){padding:14px 16px!important;}
  .home-page .nav-menu > a:not(.nav-action)::after{display:none;}
  .home-page .nav-action.btn-frame{width:100%!important;justify-content:center;min-height:52px!important;}
  .hero.hero-layout-refresh{min-height:auto!important;padding:124px 0 110px!important;}
  .hero.hero-layout-refresh .hero-copy-fresh h1{font-size:clamp(3rem,10vw,5rem)!important;max-width:none;}
  .hero-inline-points{gap:10px;}
  .hero-visual-stage{height:430px;}
  .hero-visual-stage::before{inset:48px 10px 18px 18px;}
  .hero-visual-card{left:32px;top:88px;width:min(100%,320px);padding:28px 24px;}
  .pill-a{right:16px;top:124px;}
  .pill-b{right:0;top:202px;}
  .pill-c{left:92px;bottom:34px;}
  .hero-wave-divider{height:108px;}
  .offer-video-section .offer-bg-video{opacity:.66;}
}
@media (max-width:560px){
  .hero.hero-layout-refresh{padding:110px 0 88px!important;}
  .hero.hero-layout-refresh .hero-copy-fresh .lead{font-size:1rem;}
  .btn-hero-primary{width:100%;justify-content:center;}
  .hero-inline-points{display:grid;grid-template-columns:1fr;}
  .hero-visual-fresh{min-height:340px!important;}
  .hero-visual-stage{height:340px;}
  .hero-visual-stage::before{inset:34px 0 0 0;border-radius:34px;}
  .hero-visual-card{left:18px;top:58px;width:calc(100% - 92px);padding:22px 18px;border-radius:24px;}
  .hero-visual-card strong{font-size:1.7rem;}
  .hero-visual-pill{min-height:48px;padding:0 14px;border-radius:18px;font-size:.83rem;}
  .pill-a{right:10px;top:54px;}
  .pill-b{right:0;top:116px;}
  .pill-c{left:56px;bottom:18px;}
  .shape-a{right:-120px;top:130px;width:280px;height:220px;}
  .shape-b{left:-100px;bottom:120px;width:200px;height:120px;}
  .hero-wave-divider{height:88px;}
  .offer-video-section .offer-bg-video{opacity:.58;}
}


/* Patch 24: simplify hero, restore animated CTA, restore premium gold pricing card */
.hero.hero-layout-refresh{
  min-height:780px!important;
}
.hero.hero-layout-refresh .hero-layout-fresh{
  grid-template-columns:1fr!important;
  gap:0!important;
}
.hero.hero-layout-refresh .hero-copy-fresh{
  max-width:760px!important;
  padding-top:36px!important;
}
.hero.hero-layout-refresh .hero-copy-fresh h1{
  max-width:11ch!important;
}
.hero.hero-layout-refresh .hero-copy-fresh .lead{
  max-width:60ch!important;
}
.hero.hero-layout-refresh .hero-visual-fresh,
.hero-visual-stage,
.hero-visual-card,
.hero-visual-pill{
  display:none!important;
}
.hero.hero-layout-refresh .shape-a{right:-90px;top:98px;width:420px;height:310px;opacity:.42;}
.hero.hero-layout-refresh .shape-b{left:-70px;bottom:160px;width:260px;height:160px;opacity:.24;}
.hero.hero-layout-refresh .shape-c{right:170px;bottom:84px;width:260px;height:120px;opacity:.18;}
.hero.hero-layout-refresh .orb-a{right:120px;top:108px;opacity:.28;}
.hero.hero-layout-refresh .orb-b{right:60px;bottom:90px;opacity:.22;}

/* Re-enable the developer CTA animation for the top-right navbar button */
.home-page .nav-action.btn-frame,
.btn-hero-primary{
  border:1px solid transparent!important;
  animation:sgDevButtonBorder 4.4s linear infinite!important;
  background-size:100% 100%,320% 100%!important;
}
.home-page .nav-action.btn-frame{
  background:
    linear-gradient(135deg,#345793 0%,#446294 58%,#55709f 100%) padding-box,
    linear-gradient(105deg,#345793,#c2cbe0,#76767e,#d7deeb,#345793) border-box!important;
}
.home-page .nav-action.btn-frame::before,
.home-page .nav-action.btn-frame::after{display:block!important;content:""!important;}
.home-page .nav-action.btn-frame > span::before{display:inline-flex!important;content:"<>"!important;}
.home-page .nav-action.btn-frame > span::after{display:inline-block!important;content:"↗"!important;}
.home-page .nav-action.btn-frame:hover,
.home-page .nav-action.btn-frame:focus-visible{
  background:
    linear-gradient(135deg,#6d6d75 0%,#76767e 58%,#888892 100%) padding-box,
    linear-gradient(105deg,#345793,#d1d8e8,#76767e,#e6ebf4,#345793) border-box!important;
  color:#fff!important;
}
.home-page .nav-action.btn-frame > span{gap:10px!important;}

/* Re-enable the animated primary CTA while keeping blue base and grey hover */
.btn-hero-primary{
  background:
    linear-gradient(135deg,#345793 0%,#466596 58%,#5671a0 100%) padding-box,
    linear-gradient(105deg,#345793,#c4cde1,#76767e,#d9dfec,#345793) border-box!important;
  color:#fff!important;
  box-shadow:0 18px 42px rgba(52,87,147,.22),0 0 0 1px rgba(255,255,255,.05) inset!important;
}
.btn-hero-primary::before,
.btn-hero-primary::after{display:block!important;content:""!important;}
.btn-hero-primary > span::before{display:inline-flex!important;content:"<>"!important;}
.btn-hero-primary > span::after{display:inline-block!important;content:"↗"!important;}
.btn-hero-primary:hover,
.btn-hero-primary:focus-visible{
  background:
    linear-gradient(135deg,#6c6c75 0%,#76767e 58%,#8a8a92 100%) padding-box,
    linear-gradient(105deg,#345793,#d1d8e8,#76767e,#e6ebf4,#345793) border-box!important;
  color:#fff!important;
  box-shadow:0 20px 44px rgba(118,118,126,.24),0 0 24px rgba(52,87,147,.16)!important;
  transform:translateY(-3px) scale(1.02)!important;
}
.btn-hero-primary > span{gap:10px!important;}

/* Restore the premium gold styling for the 3rd price card even inside the video section */
.offer-video-section .price-card.premium{
  background:linear-gradient(145deg,#19111f 0%,#2d1b31 44%,#8a531a 100%)!important;
  color:#fff!important;
  border-color:rgba(245,189,79,.46)!important;
  box-shadow:0 26px 80px rgba(122,68,23,.24)!important;
}
.offer-video-section .price-card.premium::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  border:1px solid rgba(245,189,79,.46);
  pointer-events:none;
}
.offer-video-section .price-card.premium::after{
  content:"";
  position:absolute;
  right:-52px;
  top:-72px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(245,189,79,.36),transparent 62%);
  pointer-events:none;
}
.offer-video-section .price-card.premium .plan-badge{
  background:rgba(245,189,79,.17)!important;
  color:#ffe6ad!important;
  border:1px solid rgba(245,189,79,.36)!important;
}
.offer-video-section .price-card.premium .price-top span,
.offer-video-section .price-card.premium .price-top small{color:#ffe6ad!important;}
.offer-video-section .price-card.premium .plan-fit,
.offer-video-section .price-card.premium li{color:rgba(255,255,255,.86)!important;}
.offer-video-section .price-card.premium li::before{color:#f5bd4f!important;}
.offer-video-section .price-card.premium .btn-paper{
  background:#ffe6ad!important;
  color:#1a1420!important;
  border-color:rgba(255,255,255,.18)!important;
  box-shadow:0 16px 32px rgba(122,68,23,.18)!important;
}
.offer-video-section .price-card.premium .btn-paper > span,
.offer-video-section .price-card.premium .btn-paper span{color:#1a1420!important;}
.offer-video-section .price-card.premium .btn-paper > span::before{
  background:linear-gradient(135deg,#8a531a,#d5ab53)!important;
  color:#fff!important;
  border-color:rgba(138,83,26,.16)!important;
}

@media (max-width:920px){
  .hero.hero-layout-refresh{padding:126px 0 108px!important;min-height:auto!important;}
  .hero.hero-layout-refresh .hero-copy-fresh{padding-top:14px!important;}
}
@media (max-width:560px){
  .hero.hero-layout-refresh{padding:112px 0 90px!important;}
  .hero.hero-layout-refresh .hero-copy-fresh h1{max-width:none!important;}
  .home-page .nav-action.btn-frame > span::before,
  .btn-hero-primary > span::before{width:30px!important;height:24px!important;flex-basis:30px!important;font-size:.70rem!important;}
}


/* Patch 25: stronger wave divider, unify hero CTA with navbar button, fix price labels */
.hero-wave-divider{
  height:156px!important;
}
.hero-wave-divider svg{
  filter:drop-shadow(0 -8px 18px rgba(52,87,147,.04));
}

/* Make the hero CTA visually identical to the navbar CTA */
.btn-hero-primary{
  min-height:44px!important;
  padding:0 18px!important;
  background:
    linear-gradient(135deg,#345793 0%,#446294 58%,#55709f 100%) padding-box,
    linear-gradient(105deg,#345793,#c2cbe0,#76767e,#d7deeb,#345793) border-box!important;
  color:#fff!important;
  box-shadow:0 12px 28px rgba(52,87,147,.20)!important;
}
.btn-hero-primary:hover,
.btn-hero-primary:focus-visible{
  background:
    linear-gradient(135deg,#6d6d75 0%,#76767e 58%,#888892 100%) padding-box,
    linear-gradient(105deg,#345793,#d1d8e8,#76767e,#e6ebf4,#345793) border-box!important;
  color:#fff!important;
  box-shadow:0 16px 34px rgba(118,118,126,.22)!important;
}

/* Fix first active card small title/readability */
.price-card.active .price-top span,
.offer-video-section .price-card.active .price-top span{
  color:#e7edf8!important;
}
.price-card.active .price-top small,
.offer-video-section .price-card.active .price-top small{
  color:rgba(255,255,255,.88)!important;
}

/* Make second pricing card button match navbar CTA look */
.offer-video-section .price-card.popular .btn-second-plan,
.price-card.popular .btn-second-plan{
  color:#fff!important;
  background:
    linear-gradient(135deg,#345793 0%,#446294 58%,#55709f 100%) padding-box,
    linear-gradient(105deg,#345793,#c2cbe0,#76767e,#d7deeb,#345793) border-box!important;
  border:1px solid transparent!important;
  box-shadow:0 12px 28px rgba(52,87,147,.20)!important;
}
.offer-video-section .price-card.popular .btn-second-plan > span,
.price-card.popular .btn-second-plan > span{color:#fff!important;}
.offer-video-section .price-card.popular .btn-second-plan > span::before,
.price-card.popular .btn-second-plan > span::before{
  display:inline-flex!important;
  content:"<>"!important;
  color:#fff!important;
  background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.05))!important;
  border-color:rgba(255,255,255,.20)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 0 16px rgba(199,215,240,.12)!important;
}
.offer-video-section .price-card.popular .btn-second-plan > span::after,
.price-card.popular .btn-second-plan > span::after{content:"↗"!important;color:#fff!important;}
.offer-video-section .price-card.popular .btn-second-plan:hover,
.offer-video-section .price-card.popular .btn-second-plan:focus-visible,
.price-card.popular .btn-second-plan:hover,
.price-card.popular .btn-second-plan:focus-visible{
  background:
    linear-gradient(135deg,#6d6d75 0%,#76767e 58%,#888892 100%) padding-box,
    linear-gradient(105deg,#345793,#d1d8e8,#76767e,#e6ebf4,#345793) border-box!important;
  color:#fff!important;
  box-shadow:0 16px 34px rgba(118,118,126,.22)!important;
}
.offer-video-section .price-card.popular .btn-second-plan::after,
.price-card.popular .btn-second-plan::after{border-color:rgba(255,255,255,.12)!important;}

@media (max-width:920px){
  .hero-wave-divider{height:132px!important;}
}
@media (max-width:560px){
  .hero-wave-divider{height:108px!important;}
}


/* Patch 26: use converted WebP hero background and finish section with the actual wave edge */
.hero.hero-layout-refresh{
  min-height:840px!important;
  padding:152px 0 185px!important;
  background:
    linear-gradient(90deg,rgba(4,17,66,.76) 0%,rgba(4,17,66,.70) 26%,rgba(4,17,66,.44) 48%,rgba(4,17,66,.12) 72%,rgba(4,17,66,.05) 100%),
    url('../images/hero-wave-tech.webp') center bottom / cover no-repeat!important;
  overflow:hidden;
}
.hero.hero-layout-refresh .hero-bg-clean,
.hero-wave-divider{
  display:none!important;
}
.hero.hero-layout-refresh .hero-layout-fresh{
  position:relative;
  z-index:2;
}
.hero.hero-layout-refresh .hero-copy-fresh{
  max-width:650px!important;
  padding-top:20px!important;
}
.hero.hero-layout-refresh .hero-copy-fresh .eyebrow{
  background:rgba(255,255,255,.12)!important;
  border-color:rgba(255,255,255,.16)!important;
  color:#f3f7ff!important;
  box-shadow:0 12px 28px rgba(2,10,40,.14)!important;
}
.hero.hero-layout-refresh .hero-copy-fresh .eyebrow::before{
  background:#ffb672!important;
  box-shadow:0 0 0 6px rgba(255,182,114,.14)!important;
}
.hero.hero-layout-refresh .hero-copy-fresh h1{
  color:#ffffff!important;
  text-shadow:0 10px 30px rgba(2,10,40,.18)!important;
}
.hero.hero-layout-refresh .hero-copy-fresh .lead{
  color:rgba(241,246,255,.90)!important;
  text-shadow:0 4px 18px rgba(2,10,40,.16)!important;
}
.hero.hero-layout-refresh .hero-inline-points span{
  background:rgba(255,255,255,.10)!important;
  border-color:rgba(255,255,255,.12)!important;
  color:#eef4ff!important;
  box-shadow:0 14px 28px rgba(2,10,40,.10)!important;
  backdrop-filter:blur(8px);
}
.hero.hero-layout-refresh .hero-inline-points span::before{
  background:#7bb6ff!important;
  box-shadow:0 0 0 5px rgba(123,182,255,.16)!important;
}
.home-page .brand-copy strong,
.home-page .nav-menu > a:not(.nav-action){
  color:#eef4ff!important;
  text-shadow:0 2px 12px rgba(2,10,40,.15);
}
.home-page .nav-menu > a:not(.nav-action)::after{
  background:linear-gradient(90deg,transparent,#8ec2ff 24%,#ffffff 50%,#f2b274 76%,transparent)!important;
}
.home-page .nav-menu > a:not(.nav-action):hover,
.home-page .nav-menu > a:not(.nav-action).active{color:#ffffff!important;}

/* keep hero CTA and navbar CTA consistent on the dark hero */
.home-page .nav-action.btn-frame,
.btn-hero-primary{
  box-shadow:0 14px 30px rgba(2,10,40,.22)!important;
}

@media (max-width:1120px){
  .hero.hero-layout-refresh{
    background-position:62% bottom!important;
  }
}
@media (max-width:920px){
  .hero.hero-layout-refresh{
    min-height:auto!important;
    padding:124px 0 138px!important;
    background:
      linear-gradient(180deg,rgba(4,17,66,.44) 0%,rgba(4,17,66,.18) 40%,rgba(4,17,66,.08) 100%),
      url('../images/hero-wave-tech.webp') 66% bottom / cover no-repeat!important;
  }
  .home-page .site-header{top:8px!important;}
}
@media (max-width:560px){
  .hero.hero-layout-refresh{
    padding:112px 0 112px!important;
    background:
      linear-gradient(180deg,rgba(4,17,66,.46) 0%,rgba(4,17,66,.16) 45%,rgba(4,17,66,.06) 100%),
      url('../images/hero-wave-tech.webp') 69% bottom / cover no-repeat!important;
  }
  .hero.hero-layout-refresh .hero-copy-fresh .eyebrow{font-size:.75rem;}
  .hero.hero-layout-refresh .hero-inline-points span{backdrop-filter:none;}
}


/* Patch 27: fix hero CTA hover color + make mobile navigation clearly visible */
.btn-hero-primary:hover,
.btn-hero-primary:focus-visible{
  background:
    linear-gradient(135deg,#294a82 0%,#345793 56%,#4669a5 100%) padding-box,
    linear-gradient(105deg,#8fb9ff,#d6e2f8,#345793,#9cb9eb,#8fb9ff) border-box!important;
  color:#fff!important;
  box-shadow:0 18px 38px rgba(52,87,147,.34),0 0 24px rgba(82,143,235,.20)!important;
  transform:translateY(-3px) scale(1.02)!important;
}

@media (max-width:920px){
  .home-page .sky-nav{
    width:calc(100% - 20px)!important;
    min-height:62px!important;
    padding:7px 9px 7px 11px!important;
    background:rgba(37,61,103,.96)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:18px!important;
    box-shadow:0 12px 30px rgba(2,10,40,.22)!important;
    backdrop-filter:blur(14px)!important;
  }
  .home-page .site-header.is-scrolled .sky-nav{
    background:rgba(37,61,103,.98)!important;
  }
  .home-page .brand-copy strong{
    color:#fff!important;
    text-shadow:none!important;
  }
  .home-page .nav-toggle{
    display:flex!important;
    background:#76767e!important;
    border:1px solid rgba(255,255,255,.20)!important;
    box-shadow:0 8px 18px rgba(0,0,0,.16)!important;
  }
  .home-page .nav-toggle span{
    background:#fff!important;
  }
  .home-page .nav-menu{
    background:rgba(37,61,103,.985)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    box-shadow:0 22px 54px rgba(2,10,40,.28)!important;
    border-radius:18px!important;
  }
  .home-page .nav-menu > a:not(.nav-action){
    color:#fff!important;
    text-shadow:none!important;
    background:transparent!important;
    border-radius:12px!important;
  }
  .home-page .nav-menu > a:not(.nav-action):hover,
  .home-page .nav-menu > a:not(.nav-action).active{
    color:#fff!important;
    background:rgba(255,255,255,.10)!important;
  }
  .home-page .nav-action.btn-frame{
    background:
      linear-gradient(135deg,#456ba9 0%,#345793 58%,#5679b2 100%) padding-box,
      linear-gradient(105deg,#9ec4ff,#d7e2f4,#76767e,#dce6f6,#9ec4ff) border-box!important;
    color:#fff!important;
  }
}


/* Patch 28: eliminate CTA hover washout + stabilize SkyGen brand/logo layout */
/* The generic CTA shine was nearly white at 88% opacity, which made the hero CTA look grey on hover. */
.hero .btn-hero-primary,
.hero .btn-hero-primary:hover,
.hero .btn-hero-primary:focus-visible{
  color:#fff!important;
  background:
    linear-gradient(135deg,#294a82 0%,#345793 54%,#4268a8 100%) padding-box,
    linear-gradient(105deg,#7fb0ff,#bfd3f6,#345793,#86a9e5,#7fb0ff) border-box!important;
  background-size:100% 100%,320% 100%!important;
}
.hero .btn-hero-primary:hover,
.hero .btn-hero-primary:focus-visible{
  background:
    linear-gradient(135deg,#203f73 0%,#2c4f89 50%,#345793 100%) padding-box,
    linear-gradient(105deg,#9bc1ff,#d6e3f8,#5f86c7,#a9c4ed,#9bc1ff) border-box!important;
  box-shadow:0 19px 42px rgba(31,67,122,.38),0 0 22px rgba(82,143,235,.18)!important;
  filter:none!important;
}
.hero .btn-hero-primary::before{
  background:linear-gradient(108deg,transparent 38%,rgba(122,174,255,.02) 44%,rgba(161,198,255,.26) 50%,rgba(91,146,233,.08) 56%,transparent 64%)!important;
  opacity:0!important;
}
.hero .btn-hero-primary:hover::before,
.hero .btn-hero-primary:focus-visible::before{
  opacity:.42!important;
  transform:translateX(62%)!important;
}
.hero .btn-hero-primary::after{
  border-color:rgba(184,210,250,.18)!important;
}
.hero .btn-hero-primary:hover > span::before,
.hero .btn-hero-primary:focus-visible > span::before{
  background:linear-gradient(135deg,#426cac,#345793)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.07) inset,0 0 18px rgba(111,165,250,.20)!important;
}

/* Keep the brand from shrinking/wrapping and distorting in the navigation. */
.home-page .brand{
  flex:0 0 auto!important;
  min-width:max-content!important;
  white-space:nowrap!important;
  overflow:visible!important;
}
.home-page .brand-logo-wrap{
  flex:0 0 120px!important;
  width:120px!important;
  height:48px!important;
  min-width:120px!important;
  overflow:visible!important;
}
.home-page .brand-logo-img{
  display:block!important;
  width:112px!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  flex:none!important;
}
.home-page .brand-copy{
  flex:0 0 auto!important;
  min-width:max-content!important;
  width:auto!important;
  white-space:nowrap!important;
  overflow:visible!important;
}
.home-page .brand-copy strong{
  display:block!important;
  white-space:nowrap!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  line-height:1!important;
}

/* Before the hamburger breakpoint, the extra text can safely disappear instead of forcing a broken logo row. */
@media (min-width:921px) and (max-width:1080px){
  .home-page .brand-copy{display:none!important;}
}
@media (max-width:920px){
  .home-page .brand{
    min-width:0!important;
    max-width:calc(100% - 60px)!important;
  }
  .home-page .brand-logo-wrap{
    flex:0 0 102px!important;
    width:102px!important;
    min-width:102px!important;
    height:44px!important;
  }
  .home-page .brand-logo-img{
    width:100px!important;
    height:auto!important;
  }
  .home-page .brand-copy{display:none!important;}
}
@media (max-width:560px){
  .home-page .brand-logo-wrap{
    flex-basis:94px!important;
    width:94px!important;
    min-width:94px!important;
    height:42px!important;
  }
  .home-page .brand-logo-img{width:92px!important;}
}


/* Patch 29: new hero background, exact logo asset, and final CTA/default-hover behavior */
/* Header should show only the actual uploaded logo mark, without the redundant text breaking next to it. */
.site-header .brand-copy{
  display:none!important;
}
.home-page .brand,
.site-header .brand{
  min-width:0!important;
}
.home-page .brand-logo-wrap,
.site-header .brand-logo-wrap{
  background:transparent!important;
  box-shadow:none!important;
  border-radius:0!important;
  width:188px!important;
  min-width:188px!important;
  height:62px!important;
  padding:0!important;
  overflow:visible!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
}
.home-page .brand-logo-img,
.site-header .brand-logo-img{
  width:188px!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.footer-brand .brand-logo-wrap{
  width:176px!important;
  height:58px!important;
  background:transparent!important;
  box-shadow:none!important;
}
.footer-brand .brand-logo-img{width:172px!important;height:auto!important;}

/* New hero background image */
.hero.hero-layout-refresh{
  background:
    linear-gradient(90deg,rgba(4,17,66,.72) 0%,rgba(4,17,66,.64) 26%,rgba(4,17,66,.36) 48%,rgba(4,17,66,.10) 72%,rgba(4,17,66,.04) 100%),
    url('../images/hero-wave-tech.webp') center bottom / cover no-repeat!important;
}
@media (max-width:920px){
  .hero.hero-layout-refresh{
    background:
      linear-gradient(180deg,rgba(4,17,66,.46) 0%,rgba(4,17,66,.18) 42%,rgba(4,17,66,.08) 100%),
      url('../images/hero-wave-tech.webp') 66% bottom / cover no-repeat!important;
  }
  .site-header .brand-logo-wrap{width:158px!important;min-width:158px!important;height:54px!important;}
  .site-header .brand-logo-img{width:158px!important;}
}
@media (max-width:560px){
  .site-header .brand-logo-wrap{width:144px!important;min-width:144px!important;height:50px!important;}
  .site-header .brand-logo-img{width:144px!important;}
  .footer-brand .brand-logo-wrap{width:152px!important;height:52px!important;}
  .footer-brand .brand-logo-img{width:148px!important;}
}

/* CTA: default blue, hover grey. Keep this stronger than older conflicting patches. */
.hero .btn-hero-primary,
.hero a.btn-hero-primary,
.hero .btn-frame.btn-hero-primary{
  color:#fff!important;
  background:
    linear-gradient(135deg,#2d4f89 0%,#345793 56%,#4771b0 100%) padding-box,
    linear-gradient(105deg,#8db5ff,#d2def5,#345793,#97b6e7,#8db5ff) border-box!important;
  background-size:100% 100%,320% 100%!important;
  box-shadow:0 14px 32px rgba(28,56,104,.28)!important;
}
.hero .btn-hero-primary:hover,
.hero .btn-hero-primary:focus-visible,
.hero a.btn-hero-primary:hover,
.hero a.btn-hero-primary:focus-visible,
.hero .btn-frame.btn-hero-primary:hover,
.hero .btn-frame.btn-hero-primary:focus-visible{
  color:#fff!important;
  background:
    linear-gradient(135deg,#666871 0%,#76767e 58%,#8b8d95 100%) padding-box,
    linear-gradient(105deg,#c8d8f6,#e6edf9,#8c93a4,#d8e0f0,#c8d8f6) border-box!important;
  box-shadow:0 18px 38px rgba(83,86,95,.26),0 0 16px rgba(124,133,149,.14)!important;
}
.hero .btn-hero-primary::before,
.hero a.btn-hero-primary::before,
.hero .btn-frame.btn-hero-primary::before{
  opacity:0!important;
  background:linear-gradient(108deg,transparent 40%,rgba(129,172,240,.06) 47%,rgba(255,255,255,.22) 50%,rgba(154,169,200,.06) 53%,transparent 60%)!important;
}
.hero .btn-hero-primary:hover::before,
.hero .btn-hero-primary:focus-visible::before,
.hero a.btn-hero-primary:hover::before,
.hero a.btn-hero-primary:focus-visible::before,
.hero .btn-frame.btn-hero-primary:hover::before,
.hero .btn-frame.btn-hero-primary:focus-visible::before{
  opacity:.30!important;
  transform:translateX(60%)!important;
}
.hero .btn-hero-primary:hover > span::before,
.hero .btn-hero-primary:focus-visible > span::before,
.hero a.btn-hero-primary:hover > span::before,
.hero a.btn-hero-primary:focus-visible > span::before,
.hero .btn-frame.btn-hero-primary:hover > span::before,
.hero .btn-frame.btn-hero-primary:focus-visible > span::before{
  background:linear-gradient(135deg,#7b7d85,#76767e)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 0 14px rgba(156,160,170,.14)!important;
}


/* Patch 30: mobile hero readability over image background */
@media (max-width:920px){
  .hero.hero-layout-refresh{
    background:
      linear-gradient(180deg,rgba(3,14,53,.78) 0%,rgba(4,17,66,.70) 42%,rgba(4,17,66,.48) 72%,rgba(4,17,66,.24) 100%),
      url('../images/hero-wave-tech.webp') 68% bottom / cover no-repeat!important;
  }
  .hero.hero-layout-refresh .hero-copy-fresh h1{
    color:#fff!important;
    text-shadow:0 4px 20px rgba(0,0,0,.34)!important;
  }
  .hero.hero-layout-refresh .hero-copy-fresh .lead{
    color:rgba(255,255,255,.94)!important;
    text-shadow:0 3px 14px rgba(0,0,0,.28)!important;
  }
  .hero.hero-layout-refresh .hero-copy-fresh .eyebrow{
    color:#fff!important;
    background:rgba(7,26,78,.54)!important;
    border-color:rgba(255,255,255,.20)!important;
    box-shadow:0 10px 24px rgba(0,0,0,.16)!important;
  }
  .hero.hero-layout-refresh .hero-inline-points span{
    color:#fff!important;
    background:rgba(5,22,68,.54)!important;
    border-color:rgba(255,255,255,.16)!important;
    box-shadow:0 10px 24px rgba(0,0,0,.14)!important;
  }
}
@media (max-width:560px){
  .hero.hero-layout-refresh{
    background:
      linear-gradient(180deg,rgba(3,14,53,.84) 0%,rgba(4,17,66,.76) 44%,rgba(4,17,66,.56) 72%,rgba(4,17,66,.30) 100%),
      url('../images/hero-wave-tech.webp') 70% bottom / cover no-repeat!important;
  }
}


/* Patch 30: hero-wave continuity for section 2 + move network video to section 3 */
/* The bottom of the current hero background is approx. rgb(241,241,241), so continue it seamlessly. */
.pain-wave-continuation{
  position:relative;
  background:#f1f1f1!important;
  color:#26354d!important;
  overflow:hidden;
}
.pain-wave-continuation .impression-intro h2{
  color:#26354d!important;
  text-shadow:none!important;
}
.pain-wave-continuation .impression-intro .seo-sales-intro{
  color:#606a78!important;
}
.pain-wave-continuation .eyebrow{
  color:#345793!important;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(52,87,147,.12)!important;
  box-shadow:0 12px 26px rgba(45,61,88,.06)!important;
  backdrop-filter:none!important;
}
.pain-wave-continuation .eyebrow::before{
  background:#76767e!important;
  box-shadow:0 0 0 6px rgba(118,118,126,.10)!important;
}
.pain-wave-continuation[data-scroll-blinds]::before{
  background:repeating-linear-gradient(90deg,#f1f1f1 0 9%,#ececec 9% 10%)!important;
}

/* The former section-2 video now belongs to section 3. */
.solution-video-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#07141f!important;
  color:#fff;
}
.solution-video-section .solution-bg-video,
.solution-video-section .solution-video-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
.solution-video-section .solution-bg-video{
  z-index:0;
  object-fit:cover;
  object-position:center center;
  filter:saturate(.96) contrast(1.04);
}
.solution-video-section .solution-video-overlay{
  z-index:1;
  background:
    linear-gradient(90deg,rgba(5,15,25,.90) 0%,rgba(5,15,25,.78) 48%,rgba(5,15,25,.68) 100%),
    linear-gradient(180deg,rgba(5,15,25,.24),rgba(5,15,25,.58));
}
.solution-video-section > .container-wide{
  position:relative;
  z-index:2;
}
.solution-video-section .section-heading h2{
  color:#fff!important;
  text-shadow:0 12px 34px rgba(0,0,0,.25);
}
.solution-video-section .section-heading p{
  color:rgba(239,245,250,.86)!important;
}
.solution-video-section .section-heading .eyebrow{
  color:#e7eefc!important;
  background:rgba(52,87,147,.30)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.16)!important;
  backdrop-filter:blur(10px);
}
.solution-video-section .section-heading .eyebrow::before{
  background:#f0a45f!important;
  box-shadow:0 0 0 6px rgba(240,164,95,.14)!important;
}
/* Keep the interactive benefit program readable as a light glass card over the video. */
.solution-video-section .sgp11-process{
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(246,249,253,.88))!important;
  border-color:rgba(255,255,255,.20)!important;
  box-shadow:0 26px 70px rgba(0,0,0,.24)!important;
  backdrop-filter:blur(10px);
}
.solution-video-section[data-scroll-blinds]::before{
  background:repeating-linear-gradient(90deg,#07141f 0 9%,#102839 9% 10%)!important;
}
@media (max-width:760px){
  .solution-video-section .solution-bg-video{object-position:58% center;}
  .solution-video-section .solution-video-overlay{
    background:linear-gradient(180deg,rgba(5,15,25,.86),rgba(5,15,25,.74));
  }
  .pain-wave-continuation{background:#f1f1f1!important;}
}
@media (prefers-reduced-motion:reduce){
  .solution-video-section .solution-bg-video{display:none!important;}
  .solution-video-section{
    background:
      linear-gradient(rgba(5,15,25,.80),rgba(5,15,25,.82)),
      url('../images/skygen-network-poster.webp') center/cover no-repeat!important;
  }
}

/* Patch 33: deterministic CTA text color + true three-column desktop navbar alignment */
/*
   Desktop navbar uses a real 3-column grid instead of absolute top:50% positioning.
   This avoids the old vertical offset caused by the navbar's 26px top-only padding.
*/
@media (min-width:921px){
  .home-page .sky-nav{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
    align-items:center!important;
    justify-content:stretch!important;
    column-gap:22px!important;
  }
  .home-page .brand{
    grid-column:1!important;
    grid-row:1!important;
    justify-self:start!important;
    align-self:center!important;
    position:static!important;
    transform:none!important;
  }
  .home-page .nav-menu{
    display:contents!important;
  }
  .home-page .nav-links-center{
    grid-column:2!important;
    grid-row:1!important;
    position:static!important;
    transform:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    align-self:center!important;
    gap:16px!important;
    margin:0!important;
    padding:0!important;
    white-space:nowrap!important;
  }
  .home-page .nav-links-center > a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:44px!important;
    padding:0 2px!important;
    margin:0!important;
    line-height:1!important;
    position:relative!important;
    border-radius:0!important;
    background:transparent!important;
    color:#eef4ff!important;
    font-size:.92rem!important;
    font-weight:900!important;
    text-align:center!important;
    white-space:nowrap!important;
  }
  .home-page .nav-links-center > a::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:4px;
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg,transparent,#8ec2ff 24%,#fff 50%,#f2b274 76%,transparent);
    transform:scaleX(0);
    transform-origin:center;
    transition:transform .24s ease;
  }
  .home-page .nav-links-center > a:hover,
  .home-page .nav-links-center > a:focus-visible,
  .home-page .nav-links-center > a.active{
    color:#fff!important;
  }
  .home-page .nav-links-center > a:hover::after,
  .home-page .nav-links-center > a:focus-visible::after,
  .home-page .nav-links-center > a.active::after{
    transform:scaleX(1);
  }
  .home-page .nav-action.btn-frame{
    grid-column:3!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    margin:0!important;
  }
}

/* The visible hero CTA label is isolated from the decorative <> and arrow pseudo-elements. */
.hero .btn-hero-primary .hero-cta-label,
.hero .btn-hero-primary:hover .hero-cta-label,
.hero .btn-hero-primary:focus-visible .hero-cta-label,
.hero .btn-hero-primary:active .hero-cta-label{
  display:inline!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  text-decoration:none!important;
  text-shadow:none!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  font:inherit!important;
  font-weight:950!important;
  line-height:1!important;
}
.hero .btn-hero-primary > span{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

@media (max-width:920px){
  /* Restore the existing dropdown behavior; desktop display:contents must not leak into mobile. */
  .home-page .nav-menu{
    display:grid!important;
  }
  .home-page .nav-links-center{
    position:static!important;
    transform:none!important;
    display:grid!important;
    gap:6px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .home-page .nav-links-center > a{
    width:100%!important;
    padding:14px 16px!important;
    color:#fff!important;
    border-radius:14px!important;
  }
  .home-page .nav-links-center > a:hover,
  .home-page .nav-links-center > a:focus-visible,
  .home-page .nav-links-center > a.active{
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
  }
  .home-page .nav-links-center > a::before,
  .home-page .nav-links-center > a::after{
    display:none!important;
  }
}

/* Patch 34: desktop-only hero copy width/left alignment refinement */
@media (min-width:1121px){
  .hero.hero-layout-refresh .hero-layout-fresh.container-wide{
    width:min(calc(100% - 96px),1480px)!important;
    margin-inline:auto!important;
  }
  .hero.hero-layout-refresh .hero-copy-fresh{
    max-width:760px!important;
    width:100%!important;
  }
  .hero.hero-layout-refresh .hero-copy-fresh .lead{
    max-width:68ch!important;
  }
}



/* Patch 35: desktop-only heading breathing room; mobile typography remains unchanged */
@media (min-width:1121px){
  /* H1: keep the current mobile three-line composition, but let desktop wrap naturally and wider. */
  .hero.hero-layout-refresh .hero-copy-fresh h1{
    max-width:14ch!important;
    letter-spacing:-.045em!important;
  }
  .hero.hero-layout-refresh .hero-copy-fresh h1 br{
    display:none!important;
  }

  /* H2: slightly less compressed characters and wider heading containers on desktop. */
  h2{
    letter-spacing:-.035em!important;
  }
  .section-heading,
  .impression-intro,
  .offer-copy{
    max-width:980px!important;
  }
  .section-heading.center{
    max-width:980px!important;
  }

  /* Two-column text sections get a little more room for their H2 without changing mobile/tablet. */
  .industries-layout,
  .why-layout,
  .faq-layout,
  .contact-layout{
    grid-template-columns:1.04fr .96fr!important;
  }
}


/* Patch 36: make the 2nd section background more premium with a subtle moving effect */
.pain-wave-continuation{
  isolation:isolate;
}
.pain-wave-continuation > .container-wide,
.pain-wave-continuation .impression-section-inner{
  position:relative;
  z-index:2;
}
.pain-wave-continuation::after{
  content:"";
  position:absolute;
  inset:-8% -6%;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 12% 22%,rgba(52,87,147,.11),transparent 26%),
    radial-gradient(circle at 84% 18%,rgba(118,118,126,.10),transparent 22%),
    radial-gradient(circle at 78% 84%,rgba(52,87,147,.07),transparent 24%),
    linear-gradient(118deg,transparent 0%,rgba(255,255,255,.28) 18%,transparent 32%,transparent 62%,rgba(255,255,255,.16) 74%,transparent 86%);
  opacity:.82;
  animation:painAmbientFloat 18s ease-in-out infinite;
}
.pain-wave-continuation .impression-section-inner::before{
  content:"";
  position:absolute;
  inset:-28px -24px;
  z-index:-1;
  pointer-events:none;
  border-radius:42px;
  background:
    repeating-linear-gradient(90deg,rgba(52,87,147,.045) 0 1px,transparent 1px 88px),
    repeating-linear-gradient(0deg,rgba(118,118,126,.04) 0 1px,transparent 1px 88px),
    linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0));
  mask-image:radial-gradient(circle at 50% 42%,rgba(0,0,0,.92),rgba(0,0,0,.74) 42%,rgba(0,0,0,.18) 78%,transparent 100%);
  opacity:.65;
  animation:painGridDrift 24s linear infinite;
}
.pain-wave-continuation .impression-section-inner::after{
  content:"";
  position:absolute;
  left:-10%;
  right:-10%;
  top:28px;
  height:240px;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.32),rgba(255,255,255,0) 70%);
  filter:blur(18px);
  opacity:.42;
  animation:painSoftGlow 12s ease-in-out infinite;
}
.pain-wave-continuation[data-scroll-blinds]::before{
  opacity:.68;
}
@keyframes painAmbientFloat{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(18px,-10px,0) scale(1.02)}
}
@keyframes painGridDrift{
  0%{transform:translate3d(0,0,0)}
  100%{transform:translate3d(24px,16px,0)}
}
@keyframes painSoftGlow{
  0%,100%{transform:translate3d(0,0,0);opacity:.34}
  50%{transform:translate3d(0,-8px,0);opacity:.52}
}
@media (max-width:920px){
  .pain-wave-continuation::after{opacity:.68;}
  .pain-wave-continuation .impression-section-inner::before{inset:-18px -12px;opacity:.48;}
  .pain-wave-continuation .impression-section-inner::after{height:180px;opacity:.28;}
}
@media (max-width:560px){
  .pain-wave-continuation::after{opacity:.58;}
  .pain-wave-continuation .impression-section-inner::before{display:none;}
  .pain-wave-continuation .impression-section-inner::after{display:none;}
}
@media (prefers-reduced-motion:reduce){
  .pain-wave-continuation::after,
  .pain-wave-continuation .impression-section-inner::before,
  .pain-wave-continuation .impression-section-inner::after{
    animation:none!important;
  }
}

/* Pricing CTA isolation: same first-card appearance, hero-style grey hover.
   This class is intentionally independent from .btn-ink so legacy global button
   patches and pseudo-elements cannot override the pricing hover state. */
.btn-price-choice{
  --price-btn-blue:#345793;
  --price-btn-grey:#76767e;
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:54px;
  padding:0 24px;
  border:1px solid transparent;
  border-radius:999px;
  overflow:hidden;
  cursor:pointer;
  white-space:nowrap;
  font:inherit;
  font-weight:950;
  letter-spacing:.015em;
  color:#27374e;
  background:
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(244,247,252,.98)) padding-box,
    linear-gradient(105deg,#345793,#aeb9cf,#76767e,#cbd3e1,#345793) border-box;
  background-size:100% 100%,320% 100%;
  box-shadow:0 15px 32px rgba(52,87,147,.13),0 0 0 1px rgba(255,255,255,.8) inset;
  transform:translateZ(0);
  transition:transform .28s cubic-bezier(.2,.9,.2,1.2),box-shadow .28s ease,color .28s ease,background .28s ease,filter .28s ease;
  animation:sgDevButtonBorder 4.4s linear infinite;
}
.btn-price-choice > span{
  position:relative;
  z-index:3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:inherit;
  transition:color .28s ease;
}
.btn-price-choice > span::before{
  content:"<>";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:26px;
  flex:0 0 34px;
  border-radius:9px;
  border:1px solid rgba(52,87,147,.16);
  background:linear-gradient(135deg,#345793,#687792);
  color:#fff;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.76rem;
  font-weight:950;
  letter-spacing:-.10em;
  line-height:1;
  box-shadow:0 7px 18px rgba(52,87,147,.18);
  transition:transform .34s cubic-bezier(.2,.9,.2,1.3),box-shadow .34s ease,background .34s ease;
}
.btn-price-choice > span::after{
  content:"↗";
  display:inline-block;
  margin-left:1px;
  font-size:.92em;
  line-height:1;
  opacity:.78;
  transition:transform .32s cubic-bezier(.2,.9,.2,1.35),opacity .3s ease;
}
.btn-price-choice::before{
  content:"";
  position:absolute;
  inset:-55% -30%;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(108deg,transparent 37%,rgba(255,255,255,.02) 43%,rgba(255,255,255,.62) 50%,rgba(255,255,255,.10) 56%,transparent 64%);
  opacity:0;
  transform:translateX(-58%);
  transition:transform .78s cubic-bezier(.18,.8,.2,1),opacity .16s ease;
}
.btn-price-choice::after{
  content:"";
  position:absolute;
  inset:4px;
  z-index:1;
  pointer-events:none;
  border:1px solid rgba(52,87,147,.08);
  border-radius:999px;
  opacity:.9;
}
.btn-price-choice:hover,
.btn-price-choice:focus-visible{
  color:#fff;
  background:
    linear-gradient(135deg,#666871 0%,#76767e 58%,#8b8d95 100%) padding-box,
    linear-gradient(105deg,#c8d8f6,#e6edf9,#8c93a4,#d8e0f0,#c8d8f6) border-box;
  background-size:100% 100%,320% 100%;
  transform:translateY(-3px) scale(1.02);
  filter:saturate(1.04);
  box-shadow:0 20px 44px rgba(118,118,126,.24),0 0 24px rgba(52,87,147,.16);
}
.btn-price-choice:hover::before,
.btn-price-choice:focus-visible::before{
  opacity:.42;
  transform:translateX(62%);
}
.btn-price-choice:hover::after,
.btn-price-choice:focus-visible::after{
  border-color:rgba(255,255,255,.12);
}
.btn-price-choice:hover > span,
.btn-price-choice:focus-visible > span{
  color:#fff;
}
.btn-price-choice:hover > span::before,
.btn-price-choice:focus-visible > span::before{
  background:linear-gradient(135deg,#7b7d85,#76767e);
  border-color:rgba(255,255,255,.12);
  transform:translateY(-1px) rotate(-4deg) scale(1.08);
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 0 14px rgba(156,160,170,.14);
}
.btn-price-choice:hover > span::after,
.btn-price-choice:focus-visible > span::after{
  opacity:1;
  transform:translate3d(4px,-3px,0) rotate(12deg);
}
.btn-price-choice:active{
  transform:translateY(-1px) scale(.975);
}
.btn-price-choice:focus-visible{
  outline:3px solid rgba(118,118,126,.30);
  outline-offset:4px;
}
@media (max-width:560px){
  .btn-price-choice{width:100%;min-height:54px;}
}
@media (prefers-reduced-motion:reduce){
  .btn-price-choice{animation:none;transition:none;}
  .btn-price-choice::before,
  .btn-price-choice > span::before,
  .btn-price-choice > span::after{transition:none;}
}



/* SkyGen audience section refresh — scoped to #kinek */
.home-page #kinek{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 92% 12%,rgba(52,87,147,.13),transparent 28%),
    radial-gradient(circle at 7% 88%,rgba(118,118,126,.10),transparent 26%),
    linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%);
}
.home-page #kinek::before{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  right:-210px;
  top:18%;
  border-radius:50%;
  border:1px solid rgba(52,87,147,.12);
  box-shadow:0 0 0 44px rgba(52,87,147,.025),0 0 0 92px rgba(52,87,147,.018);
  pointer-events:none;
  z-index:-1;
}
.home-page #kinek::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.34;
  background-image:linear-gradient(rgba(52,87,147,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(52,87,147,.045) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 78%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 78%,transparent 100%);
}
.home-page #kinek .audience-layout{
  position:relative;
  z-index:1;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important;
  gap:48px!important;
  align-items:start;
}
.home-page #kinek .audience-panel{
  position:sticky;
  top:112px;
  max-width:none;
  padding:38px 38px 34px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:34px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 88% 10%,rgba(255,255,255,.16),transparent 24%),
    linear-gradient(145deg,#294a82 0%,#345793 58%,#687792 100%);
  box-shadow:0 28px 70px rgba(38,58,91,.22);
}
.home-page #kinek .audience-panel::before{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-72px;
  bottom:-82px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(255,255,255,.04),0 0 0 58px rgba(255,255,255,.025);
  pointer-events:none;
}
.home-page #kinek .audience-panel .eyebrow{
  position:relative;
  z-index:1;
  color:#fff!important;
  background:rgba(255,255,255,.12)!important;
  border:1px solid rgba(255,255,255,.13);
}
.home-page #kinek .audience-panel .eyebrow::before{
  background:#d8e1f1!important;
  box-shadow:0 0 0 6px rgba(255,255,255,.09)!important;
}
.home-page #kinek .audience-panel h2{
  position:relative;
  z-index:1;
  color:#fff;
  font-size:clamp(2.35rem,4.55vw,4rem);
  line-height:.98;
  margin-bottom:22px;
}
.home-page #kinek .audience-panel p{
  position:relative;
  z-index:1;
  margin-bottom:0;
  color:rgba(255,255,255,.78);
  font-size:1.04rem;
  line-height:1.72;
}
.home-page #kinek .audience-chips{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:26px;
}
.home-page #kinek .audience-chips span{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  background:rgba(255,255,255,.09);
  color:rgba(255,255,255,.9);
  font-size:.78rem;
  font-weight:850;
  letter-spacing:.02em;
  backdrop-filter:blur(8px);
}
.home-page #kinek .audience-right{
  display:grid;
  gap:18px;
  min-width:0;
}
.home-page #kinek .audience-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.home-page #kinek .industry-card{
  --mx:-160px;
  --my:-160px;
  position:relative;
  isolation:isolate;
  min-height:104px;
  padding:18px 18px;
  display:flex;
  align-items:center;
  gap:15px;
  overflow:hidden;
  border:1px solid rgba(52,87,147,.12);
  border-radius:24px;
  background:rgba(255,255,255,.82);
  box-shadow:0 14px 34px rgba(32,50,78,.075);
  backdrop-filter:blur(10px);
  transition:transform .32s cubic-bezier(.2,.8,.2,1),border-color .32s ease,box-shadow .32s ease,background .32s ease;
}
.home-page #kinek .industry-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(220px circle at var(--mx) var(--my),rgba(52,87,147,.16),transparent 68%);
  transition:opacity .28s ease;
}
.home-page #kinek .industry-card:hover{
  transform:translateY(-4px);
  border-color:rgba(52,87,147,.28);
  background:rgba(255,255,255,.94);
  box-shadow:0 20px 42px rgba(35,55,88,.13);
}
.home-page #kinek .industry-card:hover::before{opacity:1;}
.home-page #kinek .industry-icon{
  flex:0 0 48px;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:1px solid rgba(52,87,147,.10);
  border-radius:16px;
  color:#345793;
  background:linear-gradient(145deg,#f5f8fd,#e9eff8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .32s cubic-bezier(.2,.8,.2,1),background .32s ease,color .32s ease;
}
.home-page #kinek .industry-icon svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.home-page #kinek .industry-name{
  position:relative;
  z-index:1;
  color:#16263c;
  font-size:1rem;
  font-weight:900;
  line-height:1.25;
  letter-spacing:-.015em;
}
.home-page #kinek .industry-card:hover .industry-icon{
  transform:translateY(-2px) rotate(-3deg);
  color:#fff;
  background:linear-gradient(145deg,#345793,#506b9b);
}
.home-page #kinek .industry-wide{
  grid-column:1/-1;
  min-height:98px;
  color:#fff;
  border-color:rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 78% 20%,rgba(255,255,255,.13),transparent 24%),
    linear-gradient(135deg,#2d4f89 0%,#345793 56%,#6f7481 100%);
  box-shadow:0 18px 44px rgba(43,65,103,.18);
}
.home-page #kinek .industry-wide::before{
  background:radial-gradient(260px circle at var(--mx) var(--my),rgba(255,255,255,.19),transparent 70%);
}
.home-page #kinek .industry-wide:hover{
  border-color:rgba(255,255,255,.22);
  background:
    radial-gradient(circle at 78% 20%,rgba(255,255,255,.16),transparent 25%),
    linear-gradient(135deg,#29497f 0%,#345793 54%,#76767e 100%);
}
.home-page #kinek .industry-wide .industry-name{color:#fff;font-size:1.04rem;}
.home-page #kinek .industry-wide .industry-icon{
  color:#fff;
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.14);
  box-shadow:none;
}
.home-page #kinek .industry-wide:hover .industry-icon{background:rgba(255,255,255,.18);}
.home-page #kinek .industry-plus{
  margin-left:auto;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  background:rgba(255,255,255,.10);
  color:#fff;
  font-size:1.25rem;
  font-weight:500;
  transition:transform .32s cubic-bezier(.2,.8,.2,1),background .32s ease;
}
.home-page #kinek .industry-wide:hover .industry-plus{
  transform:rotate(90deg);
  background:rgba(255,255,255,.16);
}
.home-page #kinek .audience-close{
  margin:0;
  padding:17px 18px;
  display:flex;
  align-items:flex-start;
  gap:12px;
  border:1px solid rgba(52,87,147,.11);
  border-radius:22px;
  background:rgba(255,255,255,.66);
  box-shadow:0 12px 28px rgba(35,55,88,.055);
  color:#526171;
  font-size:.94rem;
  font-weight:700;
  line-height:1.55;
  backdrop-filter:blur(9px);
}
.home-page #kinek .audience-close-icon{
  flex:0 0 28px;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  margin-top:1px;
  border-radius:10px;
  background:rgba(52,87,147,.10);
  color:#345793;
  font-size:.88rem;
  font-weight:950;
}
@media (max-width:1120px){
  .home-page #kinek .audience-layout{grid-template-columns:1fr!important;gap:28px!important;}
  .home-page #kinek .audience-panel{position:relative;top:auto;}
}
@media (max-width:720px){
  .home-page #kinek .audience-panel{padding:30px 28px;border-radius:29px;}
  .home-page #kinek .audience-grid{gap:12px;}
  .home-page #kinek .industry-card{min-height:96px;padding:16px;border-radius:22px;}
}
@media (max-width:560px){
  .home-page #kinek .audience-panel{padding:26px 22px 24px;border-radius:26px;}
  .home-page #kinek .audience-panel h2{font-size:clamp(2rem,11vw,3rem);}
  .home-page #kinek .audience-panel p{font-size:.98rem;}
  .home-page #kinek .audience-chips{gap:7px;margin-top:22px;}
  .home-page #kinek .audience-chips span{font-size:.72rem;padding-inline:10px;}
  .home-page #kinek .audience-grid{grid-template-columns:1fr;}
  .home-page #kinek .industry-wide{grid-column:auto;}
  .home-page #kinek .industry-card{min-height:88px;}
  .home-page #kinek .industry-icon{flex-basis:44px;width:44px;height:44px;border-radius:14px;}
  .home-page #kinek .industry-icon svg{width:22px;height:22px;}
  .home-page #kinek .audience-close{padding:15px 16px;border-radius:20px;font-size:.9rem;}
}
@media (prefers-reduced-motion:reduce){
  .home-page #kinek .industry-card,
  .home-page #kinek .industry-icon,
  .home-page #kinek .industry-plus{transition:none!important;}
  .home-page #kinek .industry-card:hover{transform:none;}
  .home-page #kinek .industry-card:hover .industry-icon{transform:none;}
  .home-page #kinek .industry-wide:hover .industry-plus{transform:none;}
}


/* Patch 38: "Miért ilyen kedvező?" – KontírPop about-inspired image composition, SkyGen styling */
.why-about{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#e7ebf1;
}
.why-about::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 8% 12%,rgba(52,87,147,.12),transparent 25%),
    radial-gradient(circle at 92% 88%,rgba(118,118,126,.11),transparent 24%),
    linear-gradient(128deg,rgba(255,255,255,.46),transparent 34%,rgba(255,255,255,.18) 68%,transparent);
}
[data-scroll-blinds].why-about::before{
  background:repeating-linear-gradient(90deg,#e7ebf1 0 9%,#dfe4ec 9% 10%);
}
.why-about-grid{
  display:grid;
  grid-template-columns:minmax(0,.98fr) minmax(380px,.82fr);
  align-items:center;
  gap:clamp(64px,9vw,132px);
}
.why-about-visual{
  position:relative;
  margin:0;
  padding:clamp(24px,3.4vw,44px);
  min-width:0;
}
.why-about-image-frame{
  position:relative;
  z-index:2;
  overflow:hidden;
  aspect-ratio:4 / 4.25;
  border:3px solid #345793;
  border-radius:30% 70% 52% 48% / 42% 38% 62% 58%;
  box-shadow:14px 14px 0 #345793,0 26px 70px rgba(31,48,80,.16);
  background:#cfd6e1;
}
.why-about-image-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transition:transform .75s cubic-bezier(.2,.8,.2,1),filter .75s ease;
}
.why-about-visual:hover .why-about-image-frame img{
  transform:scale(1.025);
  filter:saturate(1.03) contrast(1.02);
}
.why-about-shape{
  position:absolute;
  z-index:1;
  pointer-events:none;
  border:3px solid #345793;
}
.why-about-shape-blue{
  top:0;
  right:0;
  width:clamp(132px,14vw,190px);
  aspect-ratio:1;
  border-radius:50%;
  background:#345793;
  box-shadow:0 18px 42px rgba(52,87,147,.18);
}
.why-about-shape-gray{
  left:0;
  bottom:3px;
  width:clamp(175px,18vw,250px);
  height:clamp(88px,9vw,126px);
  border-radius:999px;
  background:#76767e;
  transform:rotate(-14deg);
  box-shadow:0 18px 42px rgba(63,64,73,.14);
}
.why-about-label{
  position:absolute;
  z-index:3;
  right:2px;
  bottom:clamp(30px,4vw,54px);
  width:clamp(138px,14vw,168px);
  padding:18px 14px 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  color:#fff;
  background:#76767e;
  border:3px solid #345793;
  border-radius:22px;
  box-shadow:6px 6px 0 #345793,0 16px 32px rgba(32,43,66,.16);
  text-align:center;
  transform:rotate(6deg);
}
.why-about-label strong{
  font-size:clamp(1.18rem,2vw,1.55rem);
  line-height:1;
  letter-spacing:-.035em;
}
.why-about-label span{
  font-size:.66rem;
  font-weight:900;
  line-height:1.25;
  letter-spacing:.075em;
  text-transform:uppercase;
  opacity:.88;
}
.why-about-copy{
  max-width:680px;
}
.why-about-copy h2{
  margin-bottom:26px;
}
.why-about-copy > p{
  max-width:62ch;
  line-height:1.78;
}
.why-about-copy > p:first-of-type{
  color:#24334c;
  font-size:clamp(1.08rem,1.6vw,1.28rem);
  font-weight:760;
  line-height:1.62;
}
.why-about-copy > p + p{
  margin-top:18px;
  color:#596273;
}
.why-about .eyebrow{
  background:rgba(52,87,147,.12);
  color:#345793;
}
@media (max-width:1120px){
  .why-about-grid{
    grid-template-columns:1fr;
    gap:54px;
  }
  .why-about-visual{
    width:min(88%,680px);
    margin-inline:auto;
  }
  .why-about-copy{
    max-width:780px;
  }
}
@media (max-width:620px){
  .why-about-visual{
    width:100%;
    padding:24px 18px 32px 24px;
  }
  .why-about-image-frame{
    aspect-ratio:4 / 4.45;
    border-radius:28% 72% 50% 50% / 39% 39% 61% 61%;
    box-shadow:10px 10px 0 #345793,0 20px 50px rgba(31,48,80,.14);
  }
  .why-about-shape-blue{
    width:118px;
  }
  .why-about-shape-gray{
    width:154px;
    height:80px;
  }
  .why-about-label{
    right:0;
    bottom:30px;
    width:132px;
    padding:15px 11px 14px;
    border-radius:18px;
    box-shadow:5px 5px 0 #345793;
  }
  .why-about-copy > p:first-of-type{
    font-size:1.04rem;
  }
}
@media (prefers-reduced-motion:reduce){
  .why-about-image-frame img{
    transition:none!important;
    transform:none!important;
  }
}

/* Patch 39: desktop breathing room for audience + why-about sections */
@media (min-width:1121px){
  .home-page #kinek .audience-layout{
    width:min(calc(100% - 64px),1320px);
    grid-template-columns:minmax(0,.90fr) minmax(0,1.10fr)!important;
    gap:clamp(72px,6.2vw,96px)!important;
  }

  .why-about-grid{
    width:min(calc(100% - 64px),1320px);
    grid-template-columns:minmax(0,.98fr) minmax(380px,.82fr);
    gap:clamp(92px,7.5vw,124px);
  }
}

/* Patch 40: FAQ explorer — search + category rail + accordion, inspired by the supplied reference composition */
.faq-explorer{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#f6f8fb;
}
.faq-explorer::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 8% 15%,rgba(52,87,147,.08),transparent 26%),
    radial-gradient(circle at 90% 76%,rgba(118,118,126,.08),transparent 24%);
}
[data-scroll-blinds].faq-explorer::before{
  background:repeating-linear-gradient(90deg,#f6f8fb 0 9%,#eef2f7 9% 10%);
}
.faq-explorer-wrap{display:grid;gap:clamp(34px,4.5vw,58px);}
.faq-explorer-heading{max-width:100%!important;}
.faq-explorer-heading h2{max-width:820px;margin-bottom:28px;}
.faq-showcase-image{
  width:min(100%,920px);
  margin:0;
  overflow:hidden;
  border:1px solid rgba(52,87,147,.14);
  border-radius:30px;
  background:#10243f;
  box-shadow:0 26px 70px rgba(29,48,79,.15);
}
.faq-showcase-image img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4 / 3;
  object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .7s ease;
}
.faq-showcase-image:hover img{transform:scale(1.012);filter:saturate(1.025);}
.faq-browser{
  position:relative;
  overflow:visible;
  border:1px solid rgba(52,87,147,.13);
  border-radius:32px;
  background:rgba(255,255,255,.90);
  box-shadow:0 26px 74px rgba(35,55,88,.11);
  backdrop-filter:blur(12px);
}
.faq-browser-topbar{
  display:flex;
  align-items:center;
  gap:22px;
  justify-content:space-between;
  padding:24px 26px;
  border-bottom:1px solid rgba(52,87,147,.10);
}
.faq-search{
  position:relative;
  flex:1 1 560px;
  max-width:720px;
}
.faq-search svg{
  position:absolute;
  left:17px;
  top:50%;
  width:20px;
  height:20px;
  transform:translateY(-50%);
  fill:none;
  stroke:#345793;
  stroke-width:1.8;
  stroke-linecap:round;
  pointer-events:none;
}
.faq-search input{
  width:100%;
  min-height:54px;
  padding:0 18px 0 50px;
  border:1px solid rgba(52,87,147,.14);
  border-radius:16px;
  outline:none;
  background:#f3f6fb;
  color:#17263d;
  font:inherit;
  font-weight:700;
  transition:border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
.faq-search input::placeholder{color:#8490a1;font-weight:650;}
.faq-search input:focus{
  border-color:rgba(52,87,147,.48);
  background:#fff;
  box-shadow:0 0 0 5px rgba(52,87,147,.09);
}
.faq-help-chip{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:11px;
  padding:10px 15px 10px 10px;
  border:1px solid rgba(52,87,147,.12);
  border-radius:16px;
  background:#fff;
  box-shadow:0 12px 30px rgba(35,55,88,.08);
}
.faq-help-chip>span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#345793;
  color:#fff;
  font-size:1.05rem;
  font-weight:950;
}
.faq-help-chip div{display:grid;gap:2px;line-height:1.1;}
.faq-help-chip strong{color:#1a2940;font-size:.88rem;}
.faq-help-chip small{color:#778394;font-size:.72rem;font-weight:750;}
.faq-browser-body{
  display:grid;
  grid-template-columns:minmax(210px,.32fr) minmax(0,1fr);
  min-height:430px;
}
.faq-categories{
  padding:25px 18px 25px 20px;
  border-right:1px solid rgba(52,87,147,.10);
  background:linear-gradient(180deg,rgba(242,246,251,.88),rgba(248,250,253,.68));
}
.faq-categories button{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 14px;
  border:0;
  border-radius:13px;
  background:transparent;
  color:#4f5d70;
  text-align:left;
  font:inherit;
  font-size:.9rem;
  font-weight:800;
  cursor:pointer;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.faq-categories button+button{margin-top:3px;}
.faq-categories button:hover{background:rgba(52,87,147,.07);color:#294a82;}
.faq-categories button.is-active{
  background:rgba(52,87,147,.11);
  color:#2f5595;
}
.faq-categories button.is-active::before{
  content:"";
  width:3px;
  height:22px;
  margin-left:-14px;
  margin-right:-1px;
  border-radius:99px;
  background:#345793;
}
.faq-categories b{
  margin-left:auto;
  color:inherit;
  font-size:.78rem;
  font-weight:950;
}
.faq-results{padding:26px;min-width:0;}
.faq-list-explorer{gap:10px;}
.faq-list-explorer details{
  padding:0!important;
  overflow:hidden;
  border:1px solid rgba(52,87,147,.11)!important;
  border-radius:15px!important;
  background:#fff!important;
  box-shadow:0 8px 24px rgba(31,48,80,.045)!important;
  transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease;
}
.faq-list-explorer details:hover{
  border-color:rgba(52,87,147,.22)!important;
  box-shadow:0 11px 28px rgba(31,48,80,.075)!important;
}
.faq-list-explorer details[open]{
  border-color:rgba(52,87,147,.24)!important;
  box-shadow:0 13px 32px rgba(31,48,80,.08)!important;
}
.faq-list-explorer details[hidden]{display:none!important;}
.faq-list-explorer summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:60px;
  padding:17px 18px 17px 20px;
  color:#17263d;
  font-size:.98rem;
  font-weight:900;
  cursor:pointer;
  user-select:none;
}
.faq-list-explorer summary::-webkit-details-marker{display:none;}
.faq-list-explorer details[open] summary{color:#2f5595;}
.faq-toggle{
  position:relative;
  flex:0 0 28px;
  width:28px;
  height:28px;
  border-radius:9px;
  background:#f1f5fb;
  transition:background .22s ease,transform .22s ease;
}
.faq-toggle::before,.faq-toggle::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:11px;
  height:2px;
  border-radius:99px;
  background:#345793;
  transform:translate(-50%,-50%);
  transition:transform .22s ease;
}
.faq-toggle::after{transform:translate(-50%,-50%) rotate(90deg);}
.faq-list-explorer details[open] .faq-toggle{background:rgba(52,87,147,.11);}
.faq-list-explorer details[open] .faq-toggle::after{transform:translate(-50%,-50%) rotate(0deg);}
.faq-list-explorer p{
  margin:0!important;
  padding:0 20px 20px;
  color:#5f6d7e!important;
  line-height:1.72!important;
  max-width:78ch;
}
.faq-empty{
  margin:0;
  padding:38px 20px;
  border:1px dashed rgba(52,87,147,.22);
  border-radius:16px;
  color:#687789;
  background:#f8fafd;
  text-align:center;
  font-weight:800;
}
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
@media (min-width:1121px){
  .faq-explorer-wrap{width:min(calc(100% - 64px),1320px)!important;}
}
@media (max-width:860px){
  .faq-browser-body{grid-template-columns:1fr;}
  .faq-categories{
    display:flex;
    gap:8px;
    overflow-x:auto;
    padding:16px 18px;
    border-right:0;
    border-bottom:1px solid rgba(52,87,147,.10);
    scrollbar-width:thin;
  }
  .faq-categories button{
    flex:0 0 auto;
    width:auto;
    white-space:nowrap;
    background:#fff;
    border:1px solid rgba(52,87,147,.10);
  }
  .faq-categories button+button{margin-top:0;}
  .faq-categories button.is-active::before{display:none;}
}
@media (max-width:640px){
  .faq-explorer-heading h2{margin-bottom:22px;}
  .faq-showcase-image{border-radius:22px;}
  .faq-browser{border-radius:24px;}
  .faq-browser-topbar{padding:16px;}
  .faq-help-chip{display:none;}
  .faq-search{flex-basis:100%;}
  .faq-search input{min-height:50px;border-radius:14px;}
  .faq-results{padding:16px;}
  .faq-list-explorer summary{min-height:58px;padding:15px 14px 15px 16px;font-size:.93rem;}
  .faq-list-explorer p{padding:0 16px 17px;font-size:.92rem;}
}
@media (prefers-reduced-motion:reduce){
  .faq-showcase-image img,.faq-categories button,.faq-list-explorer details,.faq-toggle,.faq-toggle::before,.faq-toggle::after{transition:none!important;}
  .faq-showcase-image:hover img{transform:none!important;}
}

/* SkyGen footer rebuild – Huspont layout logic, SkyGen content */
.site-footer.sky-footer{
  position:relative;
  padding:0;
  color:rgba(255,255,255,.66);
  background:
    radial-gradient(circle at 12% 4%,rgba(52,87,147,.34),transparent 32%),
    linear-gradient(135deg,#06111f 0%,#0a1a2d 55%,#101827 100%);
  overflow:hidden;
}
.site-footer.sky-footer::before{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:-170px;
  top:-210px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:50%;
  box-shadow:0 0 0 52px rgba(255,255,255,.018),0 0 0 108px rgba(52,87,147,.035);
  pointer-events:none;
}
.sky-footer__top{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.35fr .68fr .82fr .92fr;
  gap:54px;
  padding-top:76px;
  padding-bottom:62px;
}
.sky-footer__brand{min-width:0;}
.sky-footer__brand .footer-brand{width:max-content;max-width:100%;}
.sky-footer__brand .footer-brand .brand-copy strong{color:#fff;}
.sky-footer__brand .footer-brand .brand-copy small{color:rgba(255,255,255,.54);}
.sky-footer__brand > p{
  max-width:360px;
  margin:22px 0;
  color:rgba(255,255,255,.61);
  font-size:.88rem;
  line-height:1.72;
}
.sky-footer__socials{display:flex;align-items:center;gap:9px;}
.sky-footer__social{
  display:grid;
  place-items:center;
  width:39px;
  height:39px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:10px;
  background:rgba(255,255,255,.065);
  transition:transform .22s ease,background-color .22s ease,border-color .22s ease;
}
.sky-footer__social img{width:17px;height:17px;object-fit:contain;filter:brightness(0) invert(1);opacity:.9;}
.sky-footer__social:hover{transform:translateY(-2px);background:#345793;border-color:rgba(255,255,255,.18);}
.sky-footer__column{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  min-width:0;
}
.sky-footer__column h2{
  margin:5px 0 14px;
  color:#fff;
  font-size:.92rem;
  line-height:1.2;
  letter-spacing:0;
}
.sky-footer__column a,
.sky-footer__column span,
.sky-footer__column button{
  color:rgba(255,255,255,.62);
  font-size:.79rem;
  line-height:1.45;
  transition:color .2s ease,transform .2s ease;
}
.sky-footer__column a:hover,
.sky-footer__column a:focus-visible,
.sky-footer__column button:hover,
.sky-footer__column button:focus-visible{
  color:#fff;
}
.sky-footer__column a:hover{transform:translateX(2px);}
.sky-footer__contact .sky-footer__contact-cta{
  margin-bottom:3px;
  color:#fff;
  font-size:1rem;
  font-weight:900;
}
.sky-footer__bottom{
  position:relative;
  z-index:1;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-top:1px solid rgba(255,255,255,.09);
}
.sky-footer__bottom p,
.sky-footer__bottom nav{
  display:flex;
  align-items:center;
  gap:18px;
  margin:0;
  color:rgba(255,255,255,.52);
  font-size:.72rem;
}
.sky-footer__bottom nav{flex-wrap:wrap;}
.sky-footer__bottom a,
.sky-footer__bottom button{color:inherit;}
.sky-footer__bottom button{
  appearance:none;
  padding:0;
  border:0;
  background:none;
  cursor:pointer;
  font:inherit;
}
.sky-footer__bottom a:hover,
.sky-footer__bottom a:focus-visible,
.sky-footer__bottom button:hover,
.sky-footer__bottom button:focus-visible{color:#fff;}

@media (max-width:1080px){
  .sky-footer__top{grid-template-columns:1.25fr .72fr .85fr;gap:38px;}
  .sky-footer__contact{
    grid-column:1 / -1;
    flex-flow:row wrap;
    align-items:center;
    gap:10px 24px;
    padding-top:27px;
    border-top:1px solid rgba(255,255,255,.08);
  }
  .sky-footer__contact h2{flex:0 0 100%;}
}
@media (max-width:720px){
  .sky-footer__top{grid-template-columns:1fr 1fr;gap:42px 24px;padding-top:60px;padding-bottom:48px;}
  .sky-footer__brand{grid-column:1 / -1;}
  .sky-footer__brand > p{max-width:500px;}
  .sky-footer__contact{grid-column:1 / -1;flex-direction:column;align-items:flex-start;gap:10px;}
  .sky-footer__bottom{padding:22px 0;min-height:0;flex-direction:column;align-items:flex-start;justify-content:center;}
}
@media (max-width:560px){
  .sky-footer__top{grid-template-columns:1fr;gap:32px;padding-top:52px;}
  .sky-footer__brand,.sky-footer__contact{grid-column:auto;}
  .sky-footer__column{padding-top:0;}
  .sky-footer__contact{padding-top:28px;}
  .sky-footer__bottom nav{gap:12px 16px;}
  .site-footer.sky-footer{padding-bottom:76px;}
}
@media (prefers-reduced-motion:reduce){
  .sky-footer__social,.sky-footer__column a{transition:none!important;transform:none!important;}
}


/* Catalog selection carried into the homepage contact form. */
.contact-selection[hidden]{display:none!important}
.contact-selection{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:13px;align-items:center;padding:13px 14px;border:1px solid rgba(255,255,255,.18);border-radius:18px;background:rgba(255,255,255,.11);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.contact-selection__icon{display:grid;width:44px;height:44px;place-items:center;border-radius:13px;background:#345793;color:#fff;font-weight:950;box-shadow:0 10px 26px rgba(52,87,147,.24)}
.contact-selection__copy{display:grid;min-width:0}
.contact-selection__copy small{color:rgba(255,255,255,.52);font-size:.62rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.contact-selection__copy strong{overflow:hidden;margin-top:1px;color:#fff;font-size:.92rem;text-overflow:ellipsis;white-space:nowrap}
.contact-selection__copy span{margin-top:2px;color:rgba(255,255,255,.62);font-size:.7rem}
.contact-selection__actions{display:flex;align-items:center;gap:8px}
.contact-selection__actions a,.contact-selection__actions button{border:0;background:transparent;color:#d9e5fb;font:inherit;font-size:.68rem;font-weight:900;text-decoration:none;cursor:pointer}
.contact-selection__actions a:hover,.contact-selection__actions button:hover{color:#fff}
@media(max-width:620px){.contact-selection{grid-template-columns:40px 1fr}.contact-selection__icon{width:40px;height:40px}.contact-selection__actions{grid-column:2;justify-content:flex-start}.contact-selection__copy span{white-space:normal}}


/* Patch 36: footer social icon rendering hardening */
.sky-footer__social img{display:block!important;width:18px!important;height:18px!important;object-fit:contain!important;filter:none!important;opacity:1!important;}
\n\n/* SKYGEN HOMEPAGE CONTACT HANDOFF v36 */
.contact-next-card{align-content:start}
.contact-next-intro h3{margin:.45rem 0 .7rem;color:#fff;font-size:clamp(1.35rem,2.2vw,1.8rem);line-height:1.15;letter-spacing:-.025em}
.contact-next-intro p{margin:0;color:rgba(255,255,255,.72);line-height:1.7}
.contact-next-steps{display:grid;gap:12px}
.contact-next-step{display:grid;grid-template-columns:46px minmax(0,1fr);gap:14px;align-items:start;padding:15px 16px;border:1px solid rgba(255,255,255,.13);border-radius:18px;background:rgba(255,255,255,.07)}
.contact-next-step>b{display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:rgba(52,87,147,.92);color:#fff;font-size:.78rem;letter-spacing:.06em;box-shadow:0 10px 26px rgba(0,0,0,.16)}
.contact-next-step>span{display:grid;gap:4px;padding-top:2px}
.contact-next-step strong{color:#fff;font-size:.94rem}
.contact-next-step small{color:rgba(255,255,255,.64);font-size:.78rem;line-height:1.5}
.contact-next-cta{display:flex;align-items:center;justify-content:center;text-decoration:none;text-align:center}
.contact-next-note{margin:0;text-align:center;color:rgba(255,255,255,.58)!important;font-size:.76rem;line-height:1.55}
@media (max-width:560px){.contact-next-step{grid-template-columns:40px minmax(0,1fr);padding:13px}.contact-next-step>b{width:38px;height:38px}.contact-next-card{gap:12px}}


/* Patch 38: visually distinguish the separate Bérelhető weboldalak page in the navbar */
@media (min-width:921px){
  .home-page .nav-links-center > a.nav-catalog-link{
    min-height:40px!important;
    padding:0 14px!important;
    border:1px solid rgba(174,207,255,.68)!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.07)!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.03),0 8px 24px rgba(5,18,34,.10)!important;
    transition:background-color .24s ease,border-color .24s ease,box-shadow .24s ease,transform .24s ease,color .24s ease!important;
  }
  .home-page .nav-links-center > a.nav-catalog-link::after{display:none!important;content:none!important;}
  .home-page .nav-links-center > a.nav-catalog-link:hover,
  .home-page .nav-links-center > a.nav-catalog-link:focus-visible{
    background:#76767e!important;
    border-color:#76767e!important;
    color:#fff!important;
    transform:translateY(-2px)!important;
    box-shadow:0 12px 28px rgba(118,118,126,.30)!important;
  }
}
@media (max-width:920px){
  .home-page .nav-links-center > a.nav-catalog-link{
    margin-top:5px!important;
    border:1px solid #345793!important;
    border-radius:999px!important;
    background:#345793!important;
    color:#fff!important;
    box-shadow:0 8px 20px rgba(52,87,147,.22)!important;
    transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease,color .22s ease!important;
  }
  .home-page .nav-links-center > a.nav-catalog-link:hover,
  .home-page .nav-links-center > a.nav-catalog-link:focus-visible{
    background:#76767e!important;
    border-color:#76767e!important;
    color:#fff!important;
    box-shadow:0 10px 24px rgba(118,118,126,.25)!important;
  }
}


/* SKYGEN SEO FINAL: semantic footer headings */
.sky-footer__heading{
  margin:5px 0 14px;
  color:#fff;
  font-size:.92rem;
  line-height:1.2;
  letter-spacing:0;
  font-weight:700;
}
@media (max-width:1080px){
  .sky-footer__contact .sky-footer__heading{flex:0 0 100%;}
}


/* Patch 41: premium rent-or-buy pricing + optional SkyGen Care */
.price-purchase{margin:4px 0 20px;padding:17px 18px;border-radius:20px;background:rgba(52,87,147,.07);border:1px solid rgba(52,87,147,.12);display:grid;gap:3px;}
.price-purchase>span{font-size:.72rem;font-weight:950;letter-spacing:.08em;text-transform:uppercase;color:#345793;}
.price-purchase>strong{font-size:clamp(1.55rem,2.5vw,2.15rem);line-height:1.05;letter-spacing:-.045em;color:#182846;}
.price-purchase>small{font-weight:750;color:#687486;line-height:1.45;}
.price-card.active .price-purchase{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.16);}
.price-card.active .price-purchase>span{color:#dce7fa;}.price-card.active .price-purchase>strong{color:#fff;}.price-card.active .price-purchase>small{color:rgba(255,255,255,.72);}
.offer-video-section .price-card.premium .price-purchase{background:rgba(245,189,79,.10);border-color:rgba(245,189,79,.28);}
.offer-video-section .price-card.premium .price-purchase>span{color:#ffe6ad;}.offer-video-section .price-card.premium .price-purchase>strong{color:#fff;}.offer-video-section .price-card.premium .price-purchase>small{color:rgba(255,255,255,.72);}
.price-card__cta-stack{display:grid;gap:10px;margin-top:auto;}
.price-card__cta-stack .btn-price-choice{width:100%;text-decoration:none;}
.price-buy-link{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 18px;border-radius:999px;border:1px solid rgba(52,87,147,.20);background:rgba(255,255,255,.46);color:#345793;font-weight:950;transition:transform .2s ease,background .2s ease,border-color .2s ease;}
.price-buy-link:hover,.price-buy-link:focus-visible{transform:translateY(-2px);background:#fff;border-color:rgba(52,87,147,.38);outline:none;}
.price-card.active .price-buy-link{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff;}
.price-card.active .price-buy-link:hover,.price-card.active .price-buy-link:focus-visible{background:rgba(255,255,255,.16);}
.offer-video-section .price-card.premium .price-buy-link{background:rgba(245,189,79,.12);border-color:rgba(245,189,79,.38);color:#ffe6ad;}
.offer-video-section .price-card.premium .price-buy-link:hover,.offer-video-section .price-card.premium .price-buy-link:focus-visible{background:rgba(245,189,79,.20);}
.care-plan{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:26px;margin-top:6px;padding:28px;border-radius:30px;background:rgba(255,255,255,.91);border:1px solid rgba(52,87,147,.13);box-shadow:0 22px 70px rgba(25,43,77,.12);backdrop-filter:blur(10px);}
.care-plan__main{padding:6px 8px 6px 4px;}.care-plan__eyebrow{display:inline-flex;margin-bottom:10px;padding:7px 10px;border-radius:999px;background:rgba(52,87,147,.09);color:#345793;font-size:.7rem;font-weight:950;letter-spacing:.075em;text-transform:uppercase;}.care-plan h3{font-size:clamp(1.8rem,3vw,2.55rem);margin-bottom:10px;color:#182846;}.care-plan__lead{margin-bottom:16px!important;color:#59677a!important;line-height:1.65!important;}.care-plan__price{display:flex;align-items:baseline;gap:8px;margin-bottom:10px;}.care-plan__price strong{font-size:clamp(2.25rem,4vw,3.5rem);letter-spacing:-.06em;color:#345793;}.care-plan__price span{font-weight:900;color:#687486;}.care-plan__clarity{margin:0!important;padding:11px 13px;border-radius:14px;background:#eef3fb;color:#314a73!important;font-weight:850;line-height:1.5!important;}
.care-plan__details{padding:20px 22px;border-radius:23px;background:#f6f8fc;border:1px solid rgba(52,87,147,.08);}.care-plan__details>strong{display:block;margin-bottom:12px;color:#182846;font-size:1.04rem;}.care-plan__details ul{margin:0 0 14px;padding:0;list-style:none;display:grid;gap:9px;}.care-plan__details li{position:relative;padding-left:24px;color:#526079;line-height:1.45;}.care-plan__details li:before{content:'✓';position:absolute;left:0;color:#345793;font-weight:950;}.care-plan__details p{margin:0!important;color:#748095!important;font-size:.85rem;line-height:1.6!important;}
@media(max-width:820px){.care-plan{grid-template-columns:1fr;padding:22px;}.price-purchase>strong{font-size:1.8rem;}}

/* Patch 42: purchase CTA gets its own premium green hover treatment. */
.price-buy-link{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  transition:transform .28s cubic-bezier(.2,.9,.2,1.2),box-shadow .28s ease,color .28s ease,background .28s ease,border-color .28s ease,filter .28s ease;
}
.price-buy-link::before{
  content:"";
  position:absolute;
  inset:-55% -30%;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(108deg,transparent 37%,rgba(255,255,255,.02) 43%,rgba(255,255,255,.58) 50%,rgba(255,255,255,.10) 56%,transparent 64%);
  opacity:0;
  transform:translateX(-58%);
  transition:transform .78s cubic-bezier(.18,.8,.2,1),opacity .16s ease;
}
.price-buy-link > span{
  display:inline-block;
  transition:transform .32s cubic-bezier(.2,.9,.2,1.35),opacity .3s ease;
}
.price-buy-link:hover,
.price-buy-link:focus-visible,
.price-card.active .price-buy-link:hover,
.price-card.active .price-buy-link:focus-visible,
.offer-video-section .price-card.premium .price-buy-link:hover,
.offer-video-section .price-card.premium .price-buy-link:focus-visible{
  color:#fff;
  background:linear-gradient(135deg,#218957 0%,#2fa66a 56%,#45b979 100%);
  border-color:rgba(33,137,87,.88);
  transform:translateY(-3px) scale(1.02);
  filter:saturate(1.05);
  box-shadow:0 20px 42px rgba(33,137,87,.24),0 0 22px rgba(47,166,106,.18);
  outline:none;
}
.price-buy-link:hover::before,
.price-buy-link:focus-visible::before{
  opacity:.38;
  transform:translateX(62%);
}
.price-buy-link:hover > span,
.price-buy-link:focus-visible > span{
  opacity:1;
  transform:translate3d(4px,-2px,0) rotate(8deg);
}
.price-buy-link:active{
  transform:translateY(-1px) scale(.975);
}
.price-buy-link:focus-visible{
  outline:3px solid rgba(47,166,106,.28);
  outline-offset:4px;
}
@media (prefers-reduced-motion:reduce){
  .price-buy-link,
  .price-buy-link::before,
  .price-buy-link > span{transition:none;}
}
