@font-face{font-family:SHIK;src:url("../fonts/BloggerSans.woff2") format("woff2"),url("../fonts/BloggerSans.woff") format("woff");font-weight:400;font-display:swap}
@font-face{font-family:SHIK;src:url("../fonts/BloggerSans-Medium.woff2") format("woff2"),url("../fonts/BloggerSans-Medium.woff") format("woff");font-weight:500;font-display:swap}
@font-face{font-family:SHIK;src:url("../fonts/BloggerSans-Bold.woff2") format("woff2"),url("../fonts/BloggerSans-Bold.woff") format("woff");font-weight:700;font-display:swap}
:root{color-scheme:dark;--ink:#061526;--text:#f5f8f7;--muted:#b6c9ca;--accent:#45e887;--rule:#315750;--gutter:clamp(20px,4vw,56px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-color:var(--rule) var(--ink)}
body{margin:0;background:var(--ink);background-image:url("../images/dots.png"),radial-gradient(circle at left bottom,#154a3e 0%,#061526 60%);background-position:center bottom,center;background-size:min(100%,1722px) auto,cover;background-repeat:no-repeat;background-attachment:fixed;font:400 17px/1.55 SHIK,sans-serif;color:var(--text)}
[hidden]{display:none!important}
img{display:block;max-width:100%;height:auto}
a{color:var(--accent);text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{color:#a1f4be}
button{font:inherit;cursor:pointer}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px;border-radius:2px}
::selection{background:var(--accent);color:var(--ink)}
h1,h2,h3,p,ul,ol,blockquote{margin:0}
h1,h2,h3{font-weight:700;line-height:1.15;text-wrap:balance}
h1,h2{text-transform:uppercase;letter-spacing:.055em}
h1{font-size:clamp(2rem,4.1vw,3.5rem)}
h2{font-size:clamp(1.75rem,3vw,2.5rem)}
h3{font-size:1.25rem}
p{max-width:72ch}
ul{list-style:none;padding:0}
section[id],.legacy-anchor{scroll-margin-top:7rem}
.wrap{width:100%;max-width:1280px;margin-inline:auto;padding-inline:var(--gutter);min-width:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:fixed;inset:12px auto auto 12px;z-index:100;padding:12px 20px;background:var(--accent);color:var(--ink);transform:translateY(-200%)}
.skip-link:focus{transform:none}
.site-header{position:sticky;top:0;z-index:20;background:var(--ink);border-bottom:1px solid #1c3a3e}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:80px;position:relative}
.site-logo{display:block;flex:0 0 auto}
.site-logo img{width:170px}
.site-navigation{display:flex;align-items:center;justify-content:flex-end;gap:18px;min-width:0}
.site-navigation__links,.site-navigation__social{display:flex;align-items:center;gap:18px}
.site-navigation a{font-size:14px;font-weight:500;letter-spacing:.035em;text-transform:uppercase;text-decoration:none;color:var(--text);white-space:nowrap}
.site-navigation a:hover{color:var(--accent)}
.site-navigation .related-site{color:#ffee99}
.site-navigation__social{gap:12px}
.site-navigation__social a{display:grid;place-items:center;min-width:44px;min-height:44px}
.language-switch{display:flex;align-items:center;gap:10px;border:1px solid var(--rule);padding:6px 10px;font-size:14px;font-weight:500}
.language-switch span{color:var(--accent)}
.menu-toggle,.menu-close{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 12px;background:transparent;border:1px solid var(--rule);color:var(--text)}
.header-back{font-size:16px;display:inline-flex;align-items:center;min-height:44px}
.hero{padding-block:clamp(40px,7vw,96px) 48px;text-align:center}
.hero h1{margin-inline:auto}
.hero__subtitle{font-size:clamp(1.125rem,2.1vw,1.75rem);line-height:1.4;letter-spacing:.07em;text-transform:uppercase;margin:16px auto 0}
.actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:28px}
.actions--start{justify-content:flex-start}
.button{display:inline-flex;justify-content:center;align-items:center;min-height:48px;padding:14px 28px;border:1px solid var(--accent);border-radius:999px;background:var(--accent);color:var(--ink);font-weight:500;text-decoration:none;line-height:1.25;text-align:center}
.button:hover{background:#a1f4be;border-color:#a1f4be;color:var(--ink)}
.button--outline{background:transparent;color:var(--text)}
.button--outline:hover{background:#123d35;color:var(--text)}
.button:focus-visible{outline-offset:5px}
.text-link{display:inline-flex;align-items:center;min-height:44px}
.hero-tools{margin-top:40px}
.hero-tools h2{font-size:16px;letter-spacing:.06em;font-weight:500}
.tool-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:24px;text-align:left}
.tool-list li{display:flex;align-items:flex-start;gap:12px;min-width:0}
.tool-list img{width:40px;flex:0 0 40px}
.tool-list h3{font-size:16px;text-transform:uppercase;letter-spacing:.04em;font-weight:500}
.tool-list p{color:var(--muted);font-size:15px;line-height:1.35;margin-top:5px;overflow-wrap:anywhere}
.content-section{position:relative;padding-block:56px}
.content-section h2+.section-intro,.content-section h2+.intro{margin-top:18px}
.section-intro{color:var(--muted)}
.intro{font-size:clamp(1.125rem,2vw,1.5rem);line-height:1.5;max-width:65ch}
.task-list{display:flex;flex-wrap:wrap;gap:24px;margin-top:28px}
.task-list li{flex:1 1 170px;border-top:1px solid var(--accent);padding-top:16px;font-weight:500;font-size:20px;line-height:1.35}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:36px;row-gap:40px;margin-top:32px}
.project{min-width:0;padding-bottom:24px;border-bottom:1px solid var(--rule)}
.project__logo{display:flex;align-items:center;justify-content:center;min-height:110px;background:#fff;padding:18px;margin-bottom:20px;border-radius:5px}
.project__logo img{width:auto;max-width:80%;max-height:74px;object-fit:contain}
.project h3{font-weight:500}
.project p{margin-top:8px;color:var(--muted);font-size:17px;overflow-wrap:anywhere}
.project a,.review a{display:inline-flex;align-items:center;margin-top:14px;font-size:16px;min-height:44px}
.review-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;row-gap:36px;margin-top:32px}
.review{display:flex;align-items:flex-start;gap:22px;min-width:0;padding-bottom:30px;border-bottom:1px solid var(--rule)}
.review__letter{width:96px;flex:0 0 96px;border-radius:3px}
.review__content{min-width:0}
.review h3{font-weight:500}
.review blockquote{margin-top:10px;color:var(--muted)}
.contact__email{display:inline-block;margin-top:16px;font-size:clamp(1.5rem,3vw,2rem);overflow-wrap:anywhere;max-width:100%}
.site-footer{border-top:1px solid var(--rule);padding-block:24px;color:var(--muted);font-size:14px}
.demo{padding-block:56px 80px}
.demo>.intro{margin-top:24px}
.demo>.section-intro{margin-top:12px}
.funnel-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:40px;padding:0;list-style-position:inside}
.funnel-steps li{padding-top:20px;border-top:1px solid var(--accent);min-width:0}
.funnel-steps li::marker{color:var(--accent);font-weight:500}
.funnel-steps img{margin-block:16px}
.funnel-steps h2{font-size:24px;letter-spacing:.025em;text-transform:none}
.funnel-steps p{margin-top:12px;color:var(--muted)}
@media(min-width:48rem){.tool-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:70rem){.tool-list{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:70rem){
 .site-header__inner{flex-wrap:wrap;gap:16px;padding-block:14px;min-height:76px}
 .site-logo img{width:162px}
 .site-navigation{flex:1 0 100%;flex-wrap:wrap;justify-content:flex-start;padding-block:12px;gap:20px}
 .site-navigation__links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:4px 16px}
 .site-navigation a{display:flex;align-items:center;min-height:44px;font-size:16px;white-space:normal}
 .site-navigation .related-site{color:var(--accent)}
 .site-navigation__social a{width:44px}
 .is-menu-ready .site-navigation{position:absolute;inset:100% 0 auto;background:var(--accent);padding:20px var(--gutter) 24px;max-height:calc(100vh - 76px);max-height:calc(100dvh - 76px);overflow-y:auto;border-bottom:1px solid #1a664b}
 .is-menu-ready .site-navigation a,.is-menu-ready .site-navigation .related-site{color:var(--ink)}
 .is-menu-ready .site-navigation a:hover{text-decoration:underline}
 .is-menu-ready .site-navigation a:focus-visible,.menu-close:focus-visible{outline-color:var(--ink)}
 .is-menu-ready .site-navigation__social{background:var(--ink);padding-inline:8px}
 .menu-close{color:var(--ink);border-color:var(--ink);margin-inline-start:auto}
 .language-switch{background:var(--ink)}
 .is-menu-ready .language-switch a{color:var(--text)}
 .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
 .review-list{grid-template-columns:1fr}
 .review__letter{width:110px;flex-basis:110px}
}
@media(max-width:40rem){
 body{background-image:none}
 .hero{padding-top:32px}
 .hero h1{letter-spacing:.045em}
 .hero__subtitle{letter-spacing:.065em}
 .hero .actions{gap:12px;margin-top:24px}
 .button{padding:13px 20px}
 .hero-tools{margin-top:32px}
 .tool-list{gap:24px 16px}
 .tool-list li{gap:8px}
 .tool-list img{width:32px;flex-basis:32px}
 .tool-list p{font-size:14px}
 .content-section{padding-block:40px}
 .project-grid{grid-template-columns:1fr;gap:32px}
 .project__logo{justify-content:flex-start;min-height:100px}
 .project__logo img{max-width:75%;max-height:64px}
 .review{gap:16px}
 .review__letter{width:72px;flex-basis:72px}
 .task-list{gap:20px}
 .task-list li{flex-basis:100%}
 .funnel-steps{grid-template-columns:1fr;gap:32px}
 .demo{padding-block:36px 56px}
 .header-back{max-width:14ch;font-size:14px;line-height:1.3}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(forced-colors:active){.button,.menu-toggle,.menu-close{border:1px solid ButtonText}.project__logo{background:Canvas}}
