:root{--ivory:#F5EDE0;--warm-white:#FFFCF8;--sand:#E8D8BB;--anthracite:#2B2B2B;--anthracite-2:#202523;--text:#202420;--muted:#59615A;--green:#1E7A4B;--green-dark:#095737;--action:#1E7A4B;--gold:#B49562;--line:rgba(43,43,43,.11);--line-light:rgba(255,255,255,.16);--shadow-sm:0 12px 36px rgba(33,28,20,.08);--shadow-md:0 24px 70px rgba(33,28,20,.12);--shadow-lg:0 34px 100px rgba(13,27,20,.22);--radius-sm:16px;--radius:26px;--radius-lg:40px;--container:1240px;--header-h:84px;--ease:cubic-bezier(.2,.75,.25,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;color:var(--text);background:var(--ivory-2);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 8% 4%,rgba(169,137,90,.12),transparent 24%),radial-gradient(circle at 92% 8%,rgba(30,122,75,.09),transparent 20%),linear-gradient(180deg,var(--ivory) 0%,var(--ivory-2) 54%,#fff 100%)}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{color:inherit}
.container{width:min(calc(100% - 40px),var(--container));margin-inline:auto}
.section-pad{padding:clamp(84px,9vw,132px) 0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:18px;top:-80px;z-index:200;background:var(--anthracite);color:#fff;padding:12px 16px;border-radius:12px}
.skip-link:focus{top:18px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid rgba(9,87,55,.38);outline-offset:3px}
.icon-svg{width:1.2em;height:1.2em;flex:none}
.site-header{position:sticky;top:0;z-index:100;padding:12px 0;transition:padding .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease)}
.site-header::before{content:"";position:absolute;inset:0;background:rgba(245,240,231,.78);backdrop-filter:blur(18px);border-bottom:1px solid transparent;z-index:-1}
.site-header.compact{padding:6px 0;box-shadow:0 8px 30px rgba(30,25,18,.06)}
.site-header.compact::before{border-color:var(--line)}
.header-inner{min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:13px;flex:none}.brand-image{gap:0;max-width:min(440px,48vw)}.brand-logo{display:block;height:52px;max-width:100%}.brand-logo-footer{width:min(100%,420px);border-radius:18px;box-shadow:0 16px 44px rgba(0,0,0,.14)}
.main-nav{display:flex;align-items:center;gap:23px}
.main-nav>a{font-size:13px;color:#485149;font-weight:750}
.main-nav>a:hover{color:var(--anthracite)}
.nav-actions{display:flex;gap:9px;margin-left:5px}
.menu-toggle{display:none;width:48px;height:48px;border-radius:15px;border:1px solid var(--line);background:var(--warm-white);align-items:center;justify-content:center}
.menu-toggle svg{width:22px;height:22px}
.menu-close{display:none}
.menu-toggle[aria-expanded="true"] .menu-open{display:none}
.menu-toggle[aria-expanded="true"] .menu-close{display:block}
.btn{padding:0 20px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;font-size:13px;font-weight:850;letter-spacing:-.01em;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease),color .25s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--action);color:#fff;box-shadow:0 14px 30px rgba(9,87,55,.24)}
.btn-primary:hover{background:var(--action-hover)}
.btn-secondary{background:var(--warm-white);border-color:var(--line)}
.btn-link{padding-inline:5px;background:transparent;color:var(--anthracite)}
.btn-cream{background:var(--ivory-2);color:var(--anthracite)}
.btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.25)}
.btn-outline-light:hover{background:rgba(255,255,255,.08)}
.eyebrow,.section-kicker{margin:0 0 16px;color:var(--green-dark);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.16em}
.section-kicker.light{color:#BDE6CD}
.hero{padding-top:72px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:.94fr 1.06fr;gap:clamp(40px,6vw,86px)}
.hero-copy h1{margin:0;font-size:clamp(50px,6.3vw,86px);line-height:.94;letter-spacing:-.066em;max-width:760px}
.hero-copy h1 em{font-style:normal;color:var(--green-dark)}
.hero-lead{max-width:680px;margin:25px 0 0;font-size:clamp(18px,1.7vw,22px);color:var(--muted)}
.hero-lines{display:flex;flex-wrap:wrap;gap:8px 20px;margin:26px 0 30px;font-weight:850}
.hero-lines span{position:relative}
.hero-lines span:not(:last-child)::after{content:"";position:absolute;width:4px;height:4px;background:var(--gold);border-radius:50%;right:-13px;top:50%}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.first-product{margin-top:34px;padding-top:25px;border-top:1px solid var(--line);display:flex;align-items:center;gap:15px;max-width:570px}
.first-product strong,.first-product small{display:block}
.first-product strong{font-size:14px}
.first-product small{color:var(--muted);font-size:12px;margin-top:2px}
.hero-showcase{position:relative;min-height:670px;perspective:1400px}
.device{position:absolute;background:#2B2B2B;border:8px solid #2B2B2B;box-shadow:var(--shadow-lg);overflow:hidden;transition:transform .45s var(--ease)}
.device img{width:100%;height:100%;object-fit:cover;object-position:top}
.browser-bar{height:30px;padding:0 12px;display:flex;align-items:center;gap:6px;background:#ece6db;color:#5f625d;font-size:10px}
.browser-bar i{width:7px;height:7px;border-radius:50%;background:#b2aba0}
.browser-bar span{margin-left:5px}
.showcase-label{position:absolute;z-index:8;top:0;right:2%;padding:11px 15px;border-radius:999px;background:rgba(255,252,248,.96);border:1px solid rgba(43,43,43,.1);box-shadow:var(--shadow-sm);font-size:11px;font-weight:850}
.dev-note{position:absolute;right:2%;bottom:0;margin:0;color:var(--muted);font-size:11px;font-weight:750}
.section-heading h2,.about-title h2,.faq-grid h2{margin:0;font-size:clamp(38px,5.1vw,66px);line-height:.98;letter-spacing:-.058em}
.issues{background:var(--anthracite);color:#fff}
.section-heading{max-width:850px;margin-bottom:55px}
.section-heading.centered{text-align:center;margin-inline:auto}
.section-heading h2{margin-bottom:18px}
.section-heading>p:last-child{margin:0;color:var(--muted);font-size:18px}
.issues .section-heading>p:last-child{color:rgba(255,255,255,.68)}
.issues-layout{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.issue-feature{min-height:330px;padding:30px;border:1px solid var(--line-light);border-radius:var(--radius);display:flex;flex-direction:column;justify-content:space-between;background:#233329}
.issue-feature:nth-child(2){background:#f0e8da;color:var(--anthracite)}
.issue-feature:nth-child(3){background:#1E7A4B}
.icon-box{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;background:rgba(255,255,255,.09);color:#a5e9c3}
.issue-feature:nth-child(2) .icon-box{background:#e1d5c2;color:#6a5637}
.issue-feature h3{margin:5px 0 8px;font-size:27px;letter-spacing:-.04em}
.issue-feature p{margin:0;color:rgba(255,255,255,.65)}
.issue-feature:nth-child(2) p{color:#62645e}
.issue-feature .number{font-size:11px!important;color:var(--gold)!important;font-weight:900;letter-spacing:.13em}
.issue-secondary{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line-light);border-radius:var(--radius);overflow:hidden;margin-top:4px}
.issue-secondary>div{padding:25px;border-right:1px solid var(--line-light)}
.issue-secondary>div:last-child{border-right:0}
.issue-secondary svg{color:#7de1aa}
.issue-secondary h3{margin:18px 0 6px}
.issue-secondary p{margin:0;color:rgba(255,255,255,.62)}
.croki-intro{background:var(--ivory)}
.croki-shell{display:grid;grid-template-columns:.78fr 1.22fr;min-height:690px;border-radius:var(--radius-lg);overflow:hidden;background:linear-gradient(145deg,#095737,#1E7A4B);box-shadow:var(--shadow-md)}
.croki-copy{padding:clamp(40px,6vw,80px);color:#fff;display:flex;flex-direction:column}
.croki-copy h2{margin:23px 0 0;font-size:clamp(42px,5vw,68px);line-height:.96;letter-spacing:-.055em}
.croki-subtitle{font-size:22px!important;font-weight:800;color:#d9f3e5!important}
.croki-copy p{color:rgba(255,255,255,.78);font-size:17px}
.signature{padding-top:18px;border-top:1px solid rgba(255,255,255,.18);font-size:13px!important;font-weight:800!important}
.croki-copy .btn{align-self:flex-start;margin-top:14px}
.croki-visual{position:relative;background:#e9e1d4;padding:45px 0 45px 45px;overflow:hidden}
.product-frame{height:100%;border-radius:28px 0 0 28px;overflow:hidden;border:8px solid #1a1d1a;border-right:0;box-shadow:var(--shadow-lg)}
.product-frame img{width:100%;height:100%;object-fit:cover;object-position:center top}
.icon-box.dark{background:var(--anthracite);color:#fff}
.immersive{background:#fff}
.shot{margin:0}
.shot-window{background:#1a1d1a;padding:7px;border-radius:25px;overflow:hidden;box-shadow:var(--shadow-md)}
.shot-window img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top;border-radius:18px}
.darkbar{background:#232622;color:#d9ddd8}
.shot figcaption{padding:17px 4px 0;display:flex;justify-content:space-between;gap:30px}
.shot figcaption strong{font-size:17px}
.shot figcaption span{color:var(--muted);font-size:14px;max-width:520px}
.development-caption{text-align:center;color:var(--muted);font-size:12px;margin:30px 0 0}
.journey{background:#F2E8D7}
.journey-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.journey-steps li{position:relative;min-width:0}
.journey-steps>li>span{display:block;margin-bottom:10px;color:var(--gold);font-size:11px;font-weight:900}
.journey-steps li>div{min-height:260px;padding:22px;border-radius:22px;background:rgba(255,255,255,.72);border:1px solid rgba(25,27,25,.09)}
.journey-steps li svg{color:var(--green-dark)}
.journey-steps h3{font-size:18px;line-height:1.12;margin:26px 0 9px;letter-spacing:-.03em}
.journey-steps p{font-size:13px;margin:0;color:var(--muted)}
.benefit-line{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:25px}
.benefit-line span{padding:9px 13px;border:1px solid var(--line);border-radius:999px;background:var(--warm-white);font-size:12px;font-weight:800}
.professional{background:linear-gradient(135deg,#133727 0%, #2B2B2B 100%);color:#fff;overflow:hidden}
.professional-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(45px,7vw,90px);align-items:center}
.professional-media{position:relative;min-height:650px}
.pro-browser{position:absolute;left:0;top:0;width:86%;border:7px solid #101210;border-radius:25px;overflow:hidden;box-shadow:0 35px 80px rgba(0,0,0,.32);transform:rotate(-2deg)}
.pro-browser img{width:100%}
.professional-copy h2{margin:0 0 20px;font-size:clamp(42px,5.2vw,68px);line-height:.96;letter-spacing:-.058em}
.professional-copy>p{color:rgba(255,255,255,.7);font-size:17px}
.pro-list{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;margin:28px 0}
.pro-list span{font-size:13px;font-weight:750;color:#e4e6e2}
.pro-list span::before{content:"✓";color:#84e9b3;margin-right:8px}
.pro-actions{display:flex;flex-wrap:wrap;gap:11px}
.method{background:var(--ivory)}
.about{background:#fff}
.about-shell{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,9vw,130px);padding:clamp(40px,6vw,78px);border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(145deg,#fbf8f2,#f0e7da)}
.about-copy>p{font-size:18px;color:#4f534d;margin-top:0}
.conversion{background:var(--ivory)}
.contact-shell{max-width:1050px;margin-inline:auto;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--warm-white);box-shadow:var(--shadow-md);overflow:hidden}
.form-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:10px;background:#e8dfd2;gap:7px}
.form-tabs button{min-height:58px;padding:10px 16px;border:0;border-radius:17px;background:transparent;font-weight:850;cursor:pointer}
.form-tabs button[aria-selected="true"]{background:var(--warm-white);box-shadow:var(--shadow-sm);color:var(--green-dark)}
.forms-area{padding:clamp(26px,5vw,56px)}
.contact-form{animation:form-in .35s var(--ease)}
@keyframes form-in{from{opacity:0;transform:translateY(8px)}
to{opacity:1;transform:none}
}
.form-intro{display:flex;gap:15px;align-items:center;margin-bottom:30px}
.form-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:var(--green-soft);color:var(--green-dark)}
.form-intro h3{margin:0 0 3px;font-size:27px;letter-spacing:-.04em}
.form-intro p{margin:0;color:var(--muted)}
.field-grid{display:grid;gap:18px}
.field-grid.two{grid-template-columns:1fr 1fr}
.field{margin-bottom:18px}
.field label{display:block;margin-bottom:7px;font-size:13px;font-weight:800}
.field label span{color:var(--muted);font-weight:600}
.field input,.field select,.field textarea{width:100%;border:1px solid #ccc3b6;background:#fff;border-radius:14px;padding:13px 14px;color:var(--text);transition:border .2s,box-shadow .2s}
.field input,.field select{min-height:50px}
.field textarea{resize:vertical;min-height:105px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(30,122,75,.11);outline:0}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#aa3f3f}
.field-error{display:block;color:#9d3535;font-size:12px;min-height:18px;margin-top:5px}
.consent{display:flex;align-items:flex-start;gap:10px;color:var(--muted);font-size:12px;margin:8px 0 22px}
.consent input{width:18px;height:18px;margin-top:1px;accent-color:var(--green)}
.honeypot{position:absolute!important;left:-9999px!important}
.submit-btn[disabled]{opacity:.65;cursor:wait}
.form-status{min-height:24px;font-size:13px}
.form-status.success{color:var(--green-dark)}
.form-status.error{color:#9d3535}
.contact-note{display:flex;gap:14px;padding:24px 30px;background:#f0e8dc;border-top:1px solid var(--line)}
.contact-note>span{color:var(--green-dark)}
.contact-note strong{display:block}
.contact-note p{margin:4px 0 0;color:var(--muted)}
.contact-note a{text-decoration:underline}
.faq{background:#fff}
.faq-grid{display:grid;grid-template-columns:.68fr 1.32fr;gap:clamp(50px,8vw,120px)}
.faq-grid>div:first-child>p:last-child{color:var(--muted)}
.faq-list{border-top:1px solid var(--line)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{list-style:none;padding:22px 40px 22px 0;font-weight:850;cursor:pointer;position:relative}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";position:absolute;right:5px;top:19px;font-size:24px;color:var(--green-dark)}
.faq-list details[open] summary::after{content:"−"}
.faq-list details p{margin:0;padding:0 50px 24px 0;color:var(--muted)}
.faq-list a{text-decoration:underline}
.final-cta{background:#fff;padding-top:20px}
.final-shell{padding:clamp(38px,6vw,70px);border-radius:var(--radius-lg);background:linear-gradient(145deg,#095737,#1E7A4B);color:#fff;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;box-shadow:var(--shadow-md)}
.final-shell h2{margin:0 0 12px;font-size:clamp(44px,5.5vw,72px);line-height:.95;letter-spacing:-.06em}
.final-shell p{margin:0;color:rgba(255,255,255,.76);max-width:700px;font-size:17px}
.final-actions{display:flex;flex-wrap:wrap;gap:11px;flex:none}
.site-footer{background:linear-gradient(180deg,#063e28 0%, #095737 100%);color:rgba(255,255,255,.7);padding:65px 0 25px}
.footer-grid{display:grid;grid-template-columns:1.4fr .65fr .8fr .8fr;gap:35px}
.footer-brand>p{max-width:420px}
.croki-footer{margin-top:20px}
.croki-footer small{color:rgba(255,255,255,.5)}
.footer-grid h2{margin:0 0 15px;color:#fff;font-size:14px}
.footer-grid>div>a,.footer-link{display:block;margin:8px 0;color:rgba(255,255,255,.68);font-size:13px}
.footer-link{border:0;background:transparent;padding:0;cursor:pointer;text-align:left}
.footer-grid a:hover,.footer-link:hover{color:#fff}
.footer-bottom{display:flex;justify-content:space-between;gap:25px;margin-top:45px;padding-top:20px;border-top:1px solid rgba(255,255,255,.09);font-size:12px}
.cookie-dialog{max-width:620px;border:0;border-radius:28px;padding:0;box-shadow:var(--shadow-lg);background:var(--warm-white)}
.cookie-dialog::backdrop{background:rgba(15,17,15,.66);backdrop-filter:blur(4px)}
.cookie-dialog form{padding:36px;position:relative}
.cookie-dialog h2{font-size:34px;line-height:1.04;letter-spacing:-.045em}
.cookie-dialog p{color:var(--muted)}
.dialog-close{position:absolute;right:17px;top:17px;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer}
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-reveal].is-visible{opacity:1;transform:none}

@media (hover:hover) and (pointer:fine){.issue-feature{transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.issue-feature:hover{transform:translateY(-5px)}
.device:hover{z-index:12;transform:translateY(-5px) rotate(0deg)}
}

@media(max-width:1180px){.main-nav{gap:15px}
.main-nav>a{display:none}
.hero-grid,.professional-grid{grid-template-columns:1fr}
.hero-showcase{min-height:700px;max-width:900px;width:100%;margin-inline:auto}
.issues-layout{grid-template-columns:1fr 1fr}
.issue-secondary{grid-template-columns:1fr 1fr}
.issue-secondary>div:nth-child(2){border-right:0}
.issue-secondary>div:nth-child(-n/**/+2){border-bottom:1px solid var(--line-light)}
.croki-shell{grid-template-columns:1fr}
.croki-visual{min-height:620px}
.professional-media{min-height:720px}
.journey-steps{grid-template-columns:repeat(4,1fr)}
.footer-grid{grid-template-columns:1.2fr 1fr 1fr}
.footer-grid>div:last-child{grid-column:2}
}

@media(max-width:850px){.container{width:min(calc(100% - 28px),var(--container))}
.menu-toggle{display:flex}
.main-nav{display:none;position:absolute;left:14px;right:14px;top:78px;flex-direction:column;align-items:stretch;padding:20px;background:var(--warm-white);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-md)}
.main-nav.open{display:flex}
.main-nav>a{display:block;padding:9px 5px}
.nav-actions{margin:10px 0 0;display:grid}
.hero{padding-top:40px}
.hero-grid{gap:45px}
.hero-copy h1{font-size:clamp(48px,12vw,72px)}
.hero-showcase{min-height:575px}
.showcase-label{top:-15px}
.about-shell,.faq-grid{grid-template-columns:1fr}
.issues-layout{grid-template-columns:1fr}
.issue-secondary{grid-template-columns:1fr 1fr}
.croki-visual{min-height:520px}
.journey-steps{grid-template-columns:repeat(2,1fr)}
.professional-media{min-height:610px}
.form-tabs{grid-template-columns:1fr}
.field-grid.two{grid-template-columns:1fr}
.final-shell{align-items:flex-start;flex-direction:column}
.footer-grid{grid-template-columns:1fr 1fr}
.footer-grid>div:last-child{grid-column:auto}
}

@media(max-width:580px){:root{--radius-lg:30px}
.section-pad{padding:74px 0}
.hero-lines{display:grid}
.hero-lines span:not(:last-child)::after{display:none}
.hero-actions{align-items:stretch;flex-direction:column}
.btn{width:100%}
.hero-showcase{min-height:440px}
.showcase-label{font-size:9px;right:0}
.dev-note{font-size:9px}
.issues .section-heading h2,.professional-copy h2{font-size:42px}
.issue-secondary{grid-template-columns:1fr}
.issue-secondary>div{border-right:0;border-bottom:1px solid var(--line-light)}
.issue-secondary>div:last-child{border-bottom:0}
.croki-copy{padding:38px 26px}
.croki-visual{padding:25px 0 25px 20px;min-height:400px}
.shot figcaption{display:block}
.shot figcaption span{display:block;margin-top:5px}
.journey-steps{grid-template-columns:1fr}
.journey-steps li>div{min-height:auto}
.professional-media{min-height:430px}
.pro-browser{width:94%}
.pro-list{grid-template-columns:1fr}
.pro-actions{display:grid}
.about-shell{padding:32px 24px}
.forms-area{padding:26px 20px}
.contact-note{padding:22px 20px}
.footer-grid{grid-template-columns:1fr}
.footer-bottom{display:block}
.footer-bottom span{display:block;margin-top:7px}
.cookie-dialog{width:calc(100% - 24px)}
.cookie-dialog form{padding:30px 23px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
[data-reveal]{opacity:1;transform:none}
}
.legal-main{padding:70px 0 100px}
.legal-card{max-width:900px;padding:clamp(28px,5vw,58px);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--warm-white);box-shadow:var(--shadow-md)}
.legal-card h1{margin:0 0 12px;font-size:clamp(48px,6vw,74px);line-height:.95;letter-spacing:-.06em}
.legal-card h2{margin:34px 0 9px;font-size:24px;letter-spacing:-.035em}
.legal-card p,.legal-card li{color:var(--muted)}
.legal-card a{text-decoration:underline;color:var(--green-dark)}
.legal-update{font-size:13px}
.simple-footer{padding:25px 0;background:var(--green-dark);color:rgba(255,255,255,.78);font-size:12px}
.not-found{min-height:100vh;display:grid;place-items:center;text-align:center;padding:40px}
.not-found h1{margin:20px 0 10px;font-size:clamp(50px,8vw,90px);letter-spacing:-.065em}
.not-found p{color:var(--muted);margin-bottom:25px}
section[id]{
  scroll-margin-top:108px;
}
.hero.section-pad{
  padding-top:64px;
  padding-bottom:82px;
}
.hero .container{
  width:min(calc(100% - 48px),1320px);
}
.hero-grid{
  grid-template-columns:1.04fr .96fr;
  gap:clamp(38px,4.6vw,66px);
}
.hero-copy h1{
  max-width:720px;
  font-size:clamp(48px,5.35vw,78px);
  line-height:.955;
  text-wrap:balance;
}
.hero-copy h1 span,
.hero-copy h1 em{
  display:block;
}
.hero-lead{
  margin-top:22px;
  max-width:640px;
}
.hero-lines{
  margin:22px 0 26px;
}
.first-product{
  margin-top:28px;
  padding-top:21px;
}
.hero-showcase{
  min-height:548px;
}
.dev-note{
  bottom:-2px;
}
.conviction.section-pad{
  padding-top:94px;
  padding-bottom:100px;
}
.section-pad{
  padding-top:clamp(76px,7.4vw,108px);
  padding-bottom:clamp(76px,7.4vw,108px);
}
.issues.section-pad{
  padding-top:96px;
  padding-bottom:104px;
}
.issues .section-heading{
  margin-bottom:46px;
}
.croki-intro.section-pad{
  padding-top:104px;
  padding-bottom:104px;
}
.croki-shell{
  min-height:630px;
}
.croki-visual{
  padding-top:36px;
  padding-bottom:36px;
}
.immersive.section-pad{
  padding-top:102px;
}
.site-header::before{
  background:rgba(245,240,231,.91);
}
.site-header.compact::before{
  background:rgba(245,240,231,.96);
}

@media (max-width:1180px) and (min-width:851px){.menu-toggle{
    display:flex;
  }
.main-nav{
    display:none;
    position:absolute;
    left:20px;
    right:20px;
    top:78px;
    flex-direction:column;
    align-items:stretch;
    padding:20px;
    background:var(--warm-white);
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:var(--shadow-md);
  }
.main-nav.open{
    display:flex;
  }
.main-nav>a{
    display:block;
    padding:9px 5px;
  }
.nav-actions{
    margin:10px 0 0;
    display:grid;
  }
.hero-grid{
    grid-template-columns:1fr;
  }
.hero-showcase{
    min-height:610px;
    max-width:920px;
    width:100%;
    margin-inline:auto;
  }
}

@media (max-width:850px){.hero .container{
    width:min(calc(100% - 28px),var(--container));
  }
.hero.section-pad{
    padding-top:38px;
    padding-bottom:72px;
  }
.hero-copy h1{
    max-width:760px;
    font-size:clamp(46px,11vw,68px);
  }
.hero-showcase{
    min-height:540px;
  }
}

@media (max-width:580px){.hero-copy h1{
    font-size:clamp(42px,12.7vw,58px);
    line-height:.98;
  }
.hero-showcase{
    min-height:420px;
  }
.showcase-label{
    top:-8px;
    max-width:210px;
    text-align:center;
  }
.conviction.section-pad{
    padding-top:76px;
    padding-bottom:78px;
  }
}
.croki-inline-logo{width:70px;display:inline-flex;align-items:center;flex:none}
.croki-inline-logo img{width:100%;height:auto}
.croki-wordmark-image{width:min(330px,78%);height:auto;margin:0 0 22px}
.croki-footer{display:flex;align-items:center;gap:12px;margin-top:26px}
.croki-footer img{width:68px;height:auto}
.croki-footer small{color:rgba(255,255,255,.52)}

@media(max-width:850px){.croki-wordmark-image{width:min(270px,78%)}
}

@media(max-width:580px){.croki-inline-logo{width:62px}
}
.pro-browser-large{position:relative;left:auto;top:auto;right:auto;bottom:auto;width:100%;max-width:860px;transform:none}
.pro-browser-large img{display:block}





@media(max-width:580px){
.showcase-label{position:static;align-self:flex-start}
}
html,body{max-width:100%;overflow-x:clip}
body{color:#20221f}
.btn{min-width:44px;min-height:50px}
.btn:active{transform:translateY(0) scale(.985)}
.btn[disabled]{opacity:.62;cursor:not-allowed;transform:none;box-shadow:none}
.main-nav>a,.site-footer a{min-height:38px;display:inline-flex;align-items:center}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:#08764b;outline-width:3px;outline-offset:4px}
.consent a,.contact-note a,.legal-card a{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.form-status{min-height:28px;margin-top:14px;font-weight:750}
.form-status.success{color:#08764b}
.form-status.error{color:#a3342f}
.form-status a{display:inline-flex;margin-top:10px;text-decoration:underline;text-underline-offset:3px}
.submit-btn.is-loading svg{animation:form-spin .8s linear infinite}
.submit-btn.is-success{background:#08764b}
@keyframes form-spin{to{transform:rotate(360deg)}
}
.contact-note{background:#edf4ef}
.resources-page{background:var(--ivory-2)}
.resources-hero{padding-top:clamp(60px,7vw,94px)}
.resources-hero-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(34px,6vw,84px);align-items:center}
.resources-hero h1{margin:0 0 22px;font-size:clamp(46px,6vw,78px);line-height:.96;letter-spacing:-.062em;max-width:760px}
.resources-hero p:not(.eyebrow){font-size:clamp(18px,1.7vw,22px);color:var(--muted);max-width:660px}
.resources-hero-visual{margin:0;padding:18px;border-radius:30px;background:#ede3d4;box-shadow:var(--shadow-lg)}
.resources-hero-visual img{width:100%;border-radius:20px}
.resources-hero-visual figcaption{padding:14px 6px 2px;color:var(--muted);font-size:13px;font-weight:750}
.campaign-resources{background:#fff}
.resource-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:start}
.resource-poster{margin:0;padding:14px;border-radius:26px;background:var(--warm-white);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.resource-poster img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:18px}
.resource-poster figcaption{padding:14px 4px 2px;font-weight:850}
.draft-supports{background:var(--ivory)}
.draft-support-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.draft-support{position:relative;padding:24px;border:1px solid var(--line);border-radius:32px;background:#fff;box-shadow:var(--shadow-sm);display:grid;grid-template-columns:minmax(190px,.72fr) minmax(0,1fr);gap:28px;align-items:center}
.draft-support img{width:100%;max-height:520px;object-fit:contain;border-radius:18px;background:#eee5d7}
.draft-support h3{margin:0 0 12px;font-size:clamp(25px,2.4vw,34px);line-height:1.08;letter-spacing:-.04em}
.draft-support p:not(.section-kicker){margin:0;color:var(--muted)}
.draft-badge{position:absolute;top:38px;left:38px;z-index:2;padding:8px 11px;border-radius:999px;background:#095737;color:#fff;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.1em}

@media(max-width:1180px){.resources-hero-grid{grid-template-columns:1fr}
.resource-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
.draft-support{grid-template-columns:minmax(180px,.65fr) minmax(0,1fr)}
}

@media(max-width:850px){.container{width:min(calc(100% - 28px),var(--container))}
.hero-grid,.croki-shell,.professional-grid,.about-shell,.faq-grid{grid-template-columns:minmax(0,1fr)!important}
.issues-layout{grid-template-columns:minmax(0,1fr)}
.issue-secondary{grid-template-columns:minmax(0,1fr)}
.issue-secondary>div{border-right:0;border-bottom:1px solid var(--line-light)}
.issue-secondary>div:last-child{border-bottom:0}
.resource-gallery{grid-template-columns:minmax(0,1fr)}
.draft-support-grid{grid-template-columns:minmax(0,1fr)}
.draft-support{grid-template-columns:minmax(0,1fr)}
.draft-support img{max-height:470px}
.form-tabs{grid-template-columns:minmax(0,1fr)}
.field-grid.two{grid-template-columns:minmax(0,1fr)}
.hero-actions,.pro-actions,.final-actions{align-items:stretch}
.hero-actions .btn,.pro-actions .btn,.final-actions .btn{width:100%}
}

@media(max-width:580px){:root{--radius-lg:28px}
.container{width:min(calc(100% - 22px),var(--container))}
.section-pad{padding-top:68px;padding-bottom:68px}
.hero-copy h1,.resources-hero h1{font-size:clamp(40px,12.5vw,54px);overflow-wrap:anywhere}
.hero-lines{display:grid;gap:8px}
.hero-lines span::after{display:none!important}
.resource-poster{padding:10px}
.draft-support{padding:18px}
.draft-badge{top:28px;left:28px}
.contact-shell{padding:16px}
.contact-form{padding:24px 18px}
}

@media(max-width:360px){.container{width:min(calc(100% - 16px),var(--container))}
.menu-toggle{width:46px;height:46px}
.hero-copy h1,.resources-hero h1{font-size:39px}
.btn{padding-inline:16px}
}

@media(prefers-reduced-motion:reduce){.submit-btn.is-loading svg{animation:none}
}

@media(max-width:580px){.hero-copy h1{font-size:clamp(38px,10.7vw,46px);line-height:.99}
.hero.section-pad{padding-top:34px;padding-bottom:58px}
.section-pad{padding-top:60px;padding-bottom:60px}
}

@media(max-width:360px){.hero-copy h1{font-size:37px}
}
:root{
  --fts-green-dark:#095737;
  --fts-green:#1E7A4B;
  --fts-ivory:#F5EDE0;
  --fts-sand:#E8D8BB;
  --fts-anthracite:#2B2B2B;
  --fts-white:#FFFCF8;
  --croki-green:#109B65;
  --croki-green-dark:#08764B;
  --croki-cream:#F4ECD9;
  --ivory:var(--fts-ivory);
  --ivory-2:#FBF7EF;
  --warm-white:var(--fts-white);
  --sand:var(--fts-sand);
  --anthracite:var(--fts-anthracite);
  --green:var(--fts-green);
  --green-dark:var(--fts-green-dark);
  --action:var(--fts-green);
  --action-hover:#0F633D;
  --green-soft:#DBE9E0;
}
body{background:#FBF7EF;color:#202420}
body::before{
  background:
    radial-gradient(circle at 7% 3%,rgba(232,216,187,.46),transparent 25%),
    radial-gradient(circle at 93% 8%,rgba(30,122,75,.08),transparent 20%),
    linear-gradient(180deg,#F5EDE0 0%,#FBF7EF 54%,#fff 100%);
}
.site-header{background:#F5EDE0}
.site-header::before,.site-header.compact::before{background:#F5EDE0;border-color:rgba(43,43,43,.08);backdrop-filter:none}
.brand-image{max-width:min(410px,43vw)}
.brand-logo{height:56px;width:auto;object-fit:contain}
.site-header.compact .brand-logo{height:49px}
.main-nav>a{color:#3F4740}
.main-nav>a:hover,.main-nav>a[aria-current="true"]{color:var(--fts-green-dark)}
.btn-primary{background:var(--fts-green);box-shadow:0 14px 30px rgba(9,87,55,.23)}
.btn-primary:hover{background:var(--fts-green-dark)}
.hero-copy h1 em,.eyebrow,.section-kicker{color:var(--fts-green-dark)}
.hero::before{content:"";position:absolute;right:-7vw;top:5%;width:min(34vw,490px);aspect-ratio:1;background:url("../images/fts-logo-symbol.webp") center/contain no-repeat;opacity:.035;pointer-events:none}
.issues{background:linear-gradient(145deg,#252826 0%,#2B2B2B 56%,#183426 100%)}
.issue-feature:nth-child(3){background:var(--fts-green)}
.issue-secondary svg{color:#7BC79B}
.croki-intro{--green:var(--croki-green);--green-dark:var(--croki-green-dark);background:#F7F1E7}
.croki-shell{background:linear-gradient(145deg,var(--croki-green-dark),var(--croki-green))}
.croki-copy .section-kicker.light{color:#BFEBD1}
.croki-copy .croki-subtitle{color:#DDF7E8!important}
.immersive,.journey{--green:var(--croki-green);--green-dark:var(--croki-green-dark)}
.immersive .section-kicker,.journey .section-kicker{color:var(--croki-green-dark)}
.journey{background:#F1E7D7}
.journey-steps li svg{color:var(--croki-green-dark)}
.journey-steps>li>span{color:#9A7646}
.professional{
  --green:var(--croki-green);
  --green-dark:var(--croki-green-dark);
  background:linear-gradient(135deg,#073D2A 0%,#17231E 48%,#2B2B2B 100%);
}
.professional .section-kicker.light{color:#A9E8C5}
.pro-list span::before{color:#7DE6AD}
.professional .btn-cream{color:#173328}
.method,.about,.conversion,.faq,.final-cta{--green:var(--fts-green);--green-dark:var(--fts-green-dark)}
.final-shell{background:linear-gradient(145deg,var(--fts-green-dark),var(--fts-green))}
.site-footer{background:var(--fts-green-dark);color:rgba(255,255,255,.79)}
.brand-image-footer{display:block;max-width:430px}
.brand-logo-footer{height:auto;width:100%;border-radius:0;box-shadow:none}
.croki-footer{padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
.croki-footer img{background:#F8F1E5;border-radius:16px;padding:9px 11px}
.croki-footer small{color:rgba(255,255,255,.65)}
.simple-footer{background:var(--fts-green-dark)}
.not-found-mark{background:#F5EDE0;border-radius:26px;padding:8px}

@media(max-width:1180px){.brand-image{max-width:min(360px,48vw)}}
@media(max-width:850px){
  .brand-image{max-width:min(300px,66vw)}
  .brand-logo{height:47px}
  .site-header.compact .brand-logo{height:43px}
  .hero::before{width:70vw;right:-30vw;top:8%}
}
@media(max-width:580px){
  .brand-image{max-width:min(248px,68vw)}
  .brand-logo,.site-header.compact .brand-logo{height:40px}
  .brand-image-footer{max-width:100%}
}
.croki-shell{
  grid-template-columns:minmax(360px,.84fr) minmax(0,1.16fr);
  min-height:0;
  align-items:stretch;
}
.croki-copy{
  justify-content:center;
  padding:clamp(46px,5.4vw,72px);
}
.croki-visual-balanced{
  position:relative;
  display:grid;
  grid-template-rows:auto auto auto;
  align-content:center;
  gap:20px;
  padding:clamp(26px,3vw,42px);
  overflow:hidden;
  background:
    radial-gradient(circle at 92% 5%,rgba(8,118,75,.10),transparent 26%),
    linear-gradient(145deg,#F3EBDD 0%,#EDE2D1 100%);
}
.croki-visual-balanced::before{
  content:"";
  position:absolute;
  width:260px;
  aspect-ratio:1;
  right:-110px;
  bottom:-125px;
  border-radius:50%;
  border:1px solid rgba(8,118,75,.12);
  box-shadow:0 0 0 34px rgba(8,118,75,.035),0 0 0 68px rgba(8,118,75,.025);
  pointer-events:none;
}
.product-frame-croki{
  position:relative;
  z-index:1;
  width:100%;
  max-width:840px;
  height:auto;
  margin-inline:auto;
  overflow:hidden;
  border:1px solid rgba(43,43,43,.10);
  border-radius:26px;
  background:#F7EFE3;
  box-shadow:0 24px 62px rgba(36,30,22,.14);
}
.product-frame-croki img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center;
}
.croki-benefits-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  padding:0 2px;
}
.croki-benefits-head>span{
  color:var(--croki-green-dark);
  font-size:12px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.croki-benefits-head>small{
  max-width:390px;
  color:#5B625C;
  font-size:13px;
  line-height:1.45;
  text-align:right;
}
.croki-benefits-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.croki-benefit{
  min-width:0;
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  align-items:center;
  gap:13px;
  padding:15px 16px;
  border:1px solid rgba(8,118,75,.14);
  border-radius:18px;
  background:rgba(255,252,248,.84);
  box-shadow:0 10px 28px rgba(45,36,25,.055);
}
.croki-benefit-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:14px;
  color:var(--croki-green-dark);
  background:rgba(8,118,75,.09);
}
.croki-benefit-icon .icon-svg{
  width:21px;
  height:21px;
}
.croki-benefit strong{
  display:block;
  color:#1F2923;
  font-size:14px;
  line-height:1.2;
}
.croki-benefit small{
  display:block;
  margin-top:4px;
  color:#626A64;
  font-size:12px;
  line-height:1.42;
}

@media(max-width:1180px){
  .croki-shell{grid-template-columns:1fr}
  .croki-copy{padding:52px clamp(30px,7vw,72px)}
  .croki-visual-balanced{padding:34px clamp(24px,6vw,58px) 42px}
  .product-frame-croki{max-width:900px}
}
@media(max-width:720px){
  .croki-benefits-head{align-items:flex-start;flex-direction:column;gap:7px}
  .croki-benefits-head>small{max-width:none;text-align:left}
  .croki-benefits-grid{grid-template-columns:1fr 1fr}
  .croki-benefit{grid-template-columns:40px minmax(0,1fr);padding:14px}
  .croki-benefit-icon{width:40px;height:40px}
}
@media(max-width:580px){
  .croki-copy{padding:40px 25px}
  .croki-visual-balanced{gap:16px;padding:20px 16px 24px}
  .product-frame-croki{border-radius:20px}
  .croki-benefits-grid{grid-template-columns:1fr;gap:9px}
  .croki-benefit{padding:13px 14px;border-radius:16px}
  .croki-benefit small{font-size:11.5px}
  .croki-visual-balanced::before{display:none}
}
:root{--fts-green:#07563A;--croki-panel:#08764B;--sage:#9CAF91;--beige-signature:#D9C39A}
.hero{min-height:auto;padding-top:clamp(110px,10vw,150px);padding-bottom:clamp(70px,7vw,105px)}
.hero h1{font-size:clamp(46px,5.4vw,76px);line-height:.94;max-width:760px}.hero-lead{max-width:700px}.hero-grid{align-items:center}
.project-status{background:var(--warm-white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.project-status-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.project-status article{padding:27px 24px;min-height:148px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:7px}.project-status article:last-child{border-right:0}
.project-status span{font-size:10px;font-weight:900;letter-spacing:.16em;color:var(--green)}.project-status strong{font-size:16px;color:var(--anthracite)}.project-status small{font-size:13px;line-height:1.55;color:var(--muted)}
.method-merged{background:linear-gradient(180deg,#fff 0%,var(--ivory-2) 100%)}
.method-merged-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(50px,8vw,110px);align-items:start}
.method-merged-intro{position:sticky;top:130px}.method-merged-intro h2{font-size:clamp(48px,5vw,76px);line-height:.98;max-width:620px}.method-merged-intro>p{font-size:20px;line-height:1.6;color:var(--muted);max-width:620px}.method-merged-intro blockquote{margin:34px 0 0;padding:22px 24px;border-left:3px solid var(--green);background:var(--green-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-weight:800;color:var(--green-dark)}
.method-merged-steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.method-merged-steps li{display:grid;grid-template-columns:56px 1fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}.method-merged-steps li>span{font-size:11px;font-weight:900;color:var(--gold);letter-spacing:.12em}.method-merged-steps h3{font-size:24px;margin:0 0 8px}.method-merged-steps p{margin:0;color:var(--muted);line-height:1.6}.method-merged-steps small{display:block;margin-top:10px;color:var(--green-dark);font-weight:800;font-size:13px}
.issue-secondary>div{padding:24px 22px;min-height:195px}.issue-secondary h3{font-size:18px}.issue-secondary p{font-size:14px;line-height:1.55}
.croki-copy{background:var(--croki-panel)}.croki-copy>p:not(.section-kicker):not(.croki-subtitle):not(.signature){color:rgba(255,255,255,.92)}.croki-copy .signature{color:#fff}.croki-benefit small{font-size:13px;line-height:1.45}.croki-intro{padding-bottom:clamp(80px,8vw,115px)}.immersive figcaption span{font-size:14px;line-height:1.55}
.journey-steps-four{grid-template-columns:repeat(4,1fr)}.journey-steps-four li{min-height:315px}.benefit-line-compact{grid-template-columns:repeat(4,1fr)}
.pro-trust{margin:22px 0 0;padding:16px 18px;border:1px solid rgba(255,255,255,.16);border-radius:16px;color:rgba(255,255,255,.78);font-size:14px;line-height:1.55}
.about-shell-extended{align-items:start}.about-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:30px 0}.about-facts span{padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--warm-white)}.about-facts strong,.about-facts small{display:block}.about-facts strong{font-size:14px;color:var(--green-dark);margin-bottom:6px}.about-facts small{font-size:13px;color:var(--muted);line-height:1.45}.about-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.form-tabs{gap:8px}.form-tabs button{font-size:13px;min-height:48px;padding:11px 16px}.contact-note p{font-size:13px;line-height:1.55}
.site-footer .footer-link{font-size:14px}
@media(max-width:980px){.project-status-grid{grid-template-columns:repeat(2,1fr)}.project-status article:nth-child(2){border-right:0}.project-status article:nth-child(-n+2){border-bottom:1px solid var(--line)}.method-merged-grid{grid-template-columns:1fr;gap:45px}.method-merged-intro{position:static}.journey-steps-four{grid-template-columns:repeat(2,1fr)}.about-facts{grid-template-columns:1fr}}
@media(max-width:680px){.hero{padding-top:105px;padding-bottom:55px}.hero h1{font-size:clamp(42px,13vw,58px)}.hero-actions{gap:10px}.project-status-grid{grid-template-columns:1fr}.project-status article{min-height:0;padding:19px 0;border-right:0!important;border-bottom:1px solid var(--line)}.project-status article:last-child{border-bottom:0}.method-merged{padding-top:70px;padding-bottom:70px}.method-merged-intro h2{font-size:45px}.method-merged-intro>p{font-size:17px}.method-merged-steps li{grid-template-columns:38px 1fr;padding:22px 0;gap:14px}.issues{padding-top:72px;padding-bottom:72px}.issues-layout{gap:14px}.issue-feature{min-height:auto;padding:24px 22px}.issue-secondary{grid-template-columns:repeat(2,1fr)}.issue-secondary>div{min-height:178px;padding:19px 16px}.issue-secondary h3{font-size:15px}.issue-secondary p{font-size:13px}.croki-intro{padding-top:72px;padding-bottom:72px}.croki-copy{padding:34px 24px}.croki-benefits-grid{grid-template-columns:1fr}.immersive{padding-top:72px;padding-bottom:72px}.journey{padding-top:72px;padding-bottom:72px}.journey-steps-four{grid-template-columns:1fr}.journey-steps-four li{min-height:0;padding:24px}.benefit-line-compact{grid-template-columns:repeat(2,1fr)}.professional{padding-top:72px;padding-bottom:72px}.about{padding-top:72px;padding-bottom:72px}.about-actions{align-items:stretch}.about-actions .btn{width:100%;justify-content:center}.conversion{padding-top:72px;padding-bottom:72px}.form-tabs{display:grid;grid-template-columns:1fr}.form-tabs button{text-align:left;justify-content:flex-start}.faq{padding-top:72px;padding-bottom:72px}.final-cta{padding-top:55px;padding-bottom:55px}}
@media(max-width:390px){.issue-secondary{grid-template-columns:1fr}.issue-secondary>div{min-height:0}.benefit-line-compact{grid-template-columns:1fr}.method-merged-intro h2{font-size:40px}}

.company-page .resources-hero h1{font-size:clamp(48px,5.8vw,82px);line-height:.96}.company-status{margin-top:35px;border:1px solid var(--line);border-radius:28px;overflow:hidden}.media-kit{background:var(--warm-white)}.media-kit-grid{display:grid;grid-template-columns:1.35fr 1.35fr .8fr;gap:18px;margin:35px 0}.media-kit-grid article{padding:28px;border:1px solid var(--line);border-radius:26px;background:#fff;display:flex;flex-direction:column;justify-content:flex-end;min-height:270px}.media-kit-grid img{width:100%;height:auto;object-fit:contain;max-height:145px}.media-kit-grid h3{margin:24px 0 6px}.media-kit-grid p{margin:0;color:var(--muted)}.media-kit-grid .media-dark{background:var(--green-dark);color:#fff}.media-kit-grid .media-dark p{color:rgba(255,255,255,.72)}.media-kit-grid .media-symbol{max-width:135px;margin:auto}.media-copy-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:0 0 28px}.media-copy-grid article{padding:26px;border-radius:22px;background:var(--ivory);border:1px solid var(--line)}.media-copy-grid p{line-height:1.65}.media-copy-grid p:last-child{margin-bottom:0}@media(max-width:850px){.media-kit-grid{grid-template-columns:1fr}.media-copy-grid{grid-template-columns:1fr}.company-page .resources-hero h1{font-size:52px}}@media(max-width:520px){.company-page .resources-hero h1{font-size:42px}.media-kit-grid article{min-height:220px;padding:22px}}
picture{display:block}

.hero-showcase-proof{min-height:650px;isolation:isolate}
.hero-showcase-proof .showcase-label{top:7px;right:0}
.proof-window{position:absolute;overflow:hidden;border:7px solid #202523;background:#202523;box-shadow:var(--shadow-lg);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.proof-window picture,.proof-window img{display:block;width:100%;height:auto}
.proof-window-client{left:0;top:62px;width:88%;border-radius:25px;transform:rotate(-1.25deg)}
.proof-window-pro{right:0;bottom:72px;width:61%;z-index:3;border-radius:22px;transform:rotate(1.15deg)}
.hero-showcase-proof:hover .proof-window-client{transform:rotate(-.5deg) translateY(-4px)}
.hero-showcase-proof:hover .proof-window-pro{transform:rotate(.4deg) translateY(-6px)}
.hero-showcase-proof .dev-note{right:0;bottom:22px;max-width:520px;text-align:right}

.product-frame-croki picture,.product-frame-croki img{width:100%;height:auto}

.client-evidence-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.75fr);gap:24px;align-items:start}
.client-evidence-grid figure{margin:0;min-width:0}
.client-evidence-main .shot-window,.client-evidence-list .phone-screen-frame{overflow:hidden;background:#202523;border:7px solid #202523;box-shadow:var(--shadow-md)}
.client-evidence-main .shot-window{border-radius:27px}
.client-evidence-list .phone-screen-frame{border-radius:31px;max-width:430px;margin-inline:auto}
.client-evidence-grid picture,.client-evidence-grid img{display:block;width:100%;height:auto}
.client-evidence-grid figcaption{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1fr);gap:18px;padding:18px 4px 0}
.client-evidence-grid figcaption strong{font-size:17px;line-height:1.3}
.client-evidence-grid figcaption span{color:var(--muted);font-size:14px;line-height:1.55}
.client-evidence-list figcaption{grid-template-columns:1fr;padding-inline:10px}

.professional-grid-gallery{grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);align-items:center;gap:clamp(42px,6vw,82px)}
.professional-grid-gallery .professional-media{min-height:0}
.pro-gallery{min-width:0}
.pro-gallery-tabs{display:flex;gap:8px;margin:0 0 15px;padding:6px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.055);width:max-content;max-width:100%}
.pro-gallery-tabs button{min-height:42px;padding:0 17px;border:0;border-radius:999px;background:transparent;color:rgba(255,255,255,.72);font-size:12px;font-weight:850;cursor:pointer;transition:background .22s var(--ease),color .22s var(--ease),transform .22s var(--ease)}
.pro-gallery-tabs button:hover{color:#fff}
.pro-gallery-tabs button[aria-selected="true"]{background:var(--croki-green);color:#fff;box-shadow:0 10px 26px rgba(0,0,0,.16)}
.pro-gallery-tabs button:active{transform:scale(.98)}
.pro-gallery-stage{position:relative}
.pro-gallery-stage figure{margin:0}
.pro-gallery-stage figure[hidden]{display:none}
.pro-gallery-stage .pro-browser{overflow:hidden;border:7px solid #121713;border-radius:27px;background:#121713;box-shadow:0 28px 76px rgba(0,0,0,.32)}
.pro-gallery-stage picture,.pro-gallery-stage img{display:block;width:100%;height:auto}
.pro-gallery-stage figcaption{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:18px;padding:17px 5px 0}
.pro-gallery-stage figcaption strong{color:#fff;font-size:16px;line-height:1.35}
.pro-gallery-stage figcaption span{color:rgba(255,255,255,.66);font-size:13px;line-height:1.55}
.pro-panel-entering{animation:proPanelIn .42s cubic-bezier(.22,1,.36,1) both}
@keyframes proPanelIn{from{opacity:0;transform:translateY(12px) scale(.99)}to{opacity:1;transform:none}}

.product-captures{background:linear-gradient(180deg,var(--ivory-2),#fff)}
.product-captures-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.product-captures-grid figure{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--warm-white);box-shadow:var(--shadow-sm)}
.product-captures-grid picture,.product-captures-grid img{display:block;width:100%;height:auto}
.product-captures-grid figcaption{padding:15px 18px;color:var(--green-dark);font-size:13px;font-weight:850}

@media(max-width:1100px){
  .professional-grid-gallery{grid-template-columns:1fr;gap:46px}
  .professional-grid-gallery .professional-media{order:2}
  .professional-grid-gallery .professional-copy{order:1}
}
@media(max-width:980px){
  .hero-showcase-proof{width:min(100%,900px);min-height:660px;margin-inline:auto}
  .client-evidence-grid{grid-template-columns:minmax(0,1.45fr) minmax(250px,.75fr)}
  .product-captures-grid{grid-template-columns:1fr 1fr}
  .product-captures-grid figure:last-child{grid-column:1/-1}
}
@media(max-width:720px){
  .hero-showcase-proof{display:flex;flex-direction:column;gap:14px;min-height:0;margin-top:28px}
  .hero-showcase-proof .showcase-label,.hero-showcase-proof .dev-note,.proof-window{position:relative;inset:auto;transform:none!important}
  .hero-showcase-proof .showcase-label{align-self:flex-start;max-width:100%;font-size:10px}
  .proof-window-client{width:100%;border-width:5px;border-radius:19px}
  .proof-window-pro{width:86%;align-self:flex-end;border-width:5px;border-radius:18px}
  .hero-showcase-proof .dev-note{max-width:none;text-align:left;font-size:11.5px;line-height:1.5}
  .client-evidence-grid{grid-template-columns:1fr;gap:34px}
  .client-evidence-list .phone-screen-frame{max-width:520px}
  .client-evidence-grid figcaption,.pro-gallery-stage figcaption{grid-template-columns:1fr;gap:5px}
  .pro-gallery-tabs{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}
  .pro-gallery-tabs button{padding-inline:10px}
  .pro-gallery-stage .pro-browser{border-width:5px;border-radius:20px}
  .product-captures-grid{grid-template-columns:1fr}
  .product-captures-grid figure:last-child{grid-column:auto}
}
@media(max-width:440px){
  .proof-window-pro{width:94%}
  .pro-gallery-tabs button{font-size:11px;min-height:40px}
  .client-evidence-main .shot-window,.client-evidence-list .phone-screen-frame{border-width:5px;border-radius:20px}
}
@media(prefers-reduced-motion:reduce){.pro-panel-entering{animation:none}}

:root {
  --motion-fast: 180ms;
  --motion-medium: 420ms;
  --motion-slow: 760ms;
  --motion-slower: 980ms;
  --motion-distance-small: 12px;
  --motion-distance-medium: 26px;
  --motion-distance-large: 42px;
  --parallax-x: 0px;
  --parallax-y: 0px;
  --ease-premium: cubic-bezier(.22, 1, .36, 1);
  --ease-smooth: cubic-bezier(.4, 0, .2, 1);
  --ease-out-soft: cubic-bezier(.16, 1, .3, 1);
}
[data-reveal] {
  opacity: 1;
  transform: none;
  filter: none;
  clip-path: none;
  transition: none;
}

html.motion-ready [data-reveal].motion-pending {
  opacity: 0;
  transition:
    opacity var(--motion-slow) var(--ease-premium) var(--reveal-delay, 0ms),
    transform var(--motion-slow) var(--ease-premium) var(--reveal-delay, 0ms),
    filter var(--motion-slow) var(--ease-premium) var(--reveal-delay, 0ms),
    clip-path var(--motion-slower) var(--ease-out-soft) var(--reveal-delay, 0ms);
}

html.motion-ready [data-reveal="fade-up"].motion-pending,
html.motion-ready [data-reveal=""].motion-pending,
html.motion-ready [data-reveal]:not([data-reveal]).motion-pending {
  transform: translate3d(0, var(--motion-distance-medium), 0);
}

html.motion-ready [data-reveal="fade-down"].motion-pending {
  transform: translate3d(0, calc(var(--motion-distance-medium) * -1), 0);
}

html.motion-ready [data-reveal="fade-left"].motion-pending {
  transform: translate3d(var(--motion-distance-medium), 0, 0);
}

html.motion-ready [data-reveal="fade-right"].motion-pending {
  transform: translate3d(calc(var(--motion-distance-medium) * -1), 0, 0);
}

html.motion-ready [data-reveal="scale-in"].motion-pending {
  transform: scale(.972) translate3d(0, var(--motion-distance-small), 0);
}

html.motion-ready [data-reveal="blur-in"].motion-pending {
  transform: translate3d(0, var(--motion-distance-small), 0);
  filter: blur(5px);
}

html.motion-ready [data-reveal="mask-up"].motion-pending {
  transform: translate3d(0, var(--motion-distance-medium), 0);
  clip-path: inset(0 0 100% 0 round 2px);
}

html.motion-ready [data-reveal].motion-pending.is-visible {
  opacity: 1;
  transform: none;
  filter: none;
  clip-path: inset(0 0 0 0 round 0);
}
.scroll-progress {
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  z-index: 250;
  pointer-events: none;
  overflow: hidden;
}

.scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, var(--green-dark), var(--green));
  transform: scaleX(var(--scroll-progress, 0));
  transform-origin: left center;
  will-change: transform;
}
html.motion-ready [data-page-intro] {
  opacity: 0;
  transition:
    opacity var(--motion-slow) var(--ease-premium),
    transform var(--motion-slow) var(--ease-premium),
    clip-path var(--motion-slower) var(--ease-out-soft);
}

html.motion-ready [data-page-intro="header"] {
  transform: translate3d(0, -14px, 0);
}

html.motion-ready [data-page-intro="eyebrow"],
html.motion-ready [data-page-intro="lead"],
html.motion-ready [data-page-intro="benefits"],
html.motion-ready [data-page-intro="actions"],
html.motion-ready [data-page-intro="product"] {
  transform: translate3d(0, 18px, 0);
}

html.motion-ready [data-page-intro="title-1"],
html.motion-ready [data-page-intro="title-2"] {
  transform: translate3d(0, 105%, 0);
  clip-path: inset(0 0 100% 0);
}

html.motion-ready [data-page-intro="visual"] {
  transform: translate3d(0, 18px, 0) scale(.975);
}

html.motion-ready.page-entered [data-page-intro] {
  opacity: 1;
  transform: none;
  clip-path: inset(0 0 0 0);
}

html.motion-ready.page-entered [data-page-intro="header"] { transition-delay: 20ms; }
html.motion-ready.page-entered [data-page-intro="eyebrow"] { transition-delay: 100ms; }
html.motion-ready.page-entered [data-page-intro="title-1"] { transition-delay: 170ms; }
html.motion-ready.page-entered [data-page-intro="title-2"] { transition-delay: 260ms; }
html.motion-ready.page-entered [data-page-intro="lead"] { transition-delay: 390ms; }
html.motion-ready.page-entered [data-page-intro="benefits"] { transition-delay: 480ms; }
html.motion-ready.page-entered [data-page-intro="actions"] { transition-delay: 570ms; }
html.motion-ready.page-entered [data-page-intro="product"] { transition-delay: 650ms; }
html.motion-ready.page-entered [data-page-intro="visual"] { transition-delay: 320ms; }
.site-header {
  will-change: transform;
  transition:
    transform var(--motion-medium) var(--ease-premium),
    padding var(--motion-medium) var(--ease-premium),
    background var(--motion-medium) var(--ease-smooth),
    box-shadow var(--motion-medium) var(--ease-smooth);
}

.site-header.header-hidden {
  transform: translate3d(0, calc(-100% - 8px), 0);
}

.main-nav > a {
  position: relative;
  transition: color var(--motion-fast) var(--ease-smooth);
}

.main-nav > a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -7px;
  height: 2px;
  border-radius: 999px;
  background: var(--green-dark);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform var(--motion-medium) var(--ease-premium);
}

.main-nav > a:hover::after,
.main-nav > a:focus-visible::after,
.main-nav > a.is-active::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.main-nav > a.is-active { color: var(--anthracite); }

.menu-toggle {
  transition:
    transform var(--motion-fast) var(--ease-premium),
    background var(--motion-fast) var(--ease-smooth),
    border-color var(--motion-fast) var(--ease-smooth);
}

.menu-toggle:active { transform: scale(.96); }
.menu-toggle svg { transition: transform var(--motion-medium) var(--ease-premium), opacity var(--motion-fast) ease; }
.menu-toggle[aria-expanded="true"] .menu-close { transform: rotate(180deg); }

body.menu-open { overflow: hidden; }
.btn {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition:
    transform var(--motion-fast) var(--ease-premium),
    box-shadow var(--motion-medium) var(--ease-premium),
    background-color var(--motion-medium) var(--ease-smooth),
    color var(--motion-medium) var(--ease-smooth),
    border-color var(--motion-medium) var(--ease-smooth);
}

.btn::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(255,255,255,.11);
  transform: translateX(-102%);
  transition: transform var(--motion-medium) var(--ease-premium);
}

.btn:hover::before { transform: translateX(0); }
.btn svg { transition: transform var(--motion-medium) var(--ease-premium); }
.btn:hover svg { transform: translateX(4px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn:disabled { opacity: .56; cursor: not-allowed; transform: none; }
.btn.is-loading { cursor: wait; }
.btn.is-loading svg { animation: motion-spin .85s linear infinite; }

@keyframes motion-spin { to { transform: rotate(1turn); } }

[data-magnetic] {
  --magnetic-x: 0px;
  --magnetic-y: 0px;
  translate: var(--magnetic-x) var(--magnetic-y);
}
.hero { position: relative; overflow: clip; }
.hero-showcase { perspective: 1200px; }
.hero-showcase .device,
[data-parallax] {
  transform: translate3d(
    var(--parallax-x, 0px),
    calc(var(--parallax-y, 0px) + var(--parallax-scroll-y, 0px)),
    0
  );
  transition: transform var(--motion-medium) var(--ease-out-soft);
  will-change: transform;
}

.showcase-label {
  animation: motion-float-label 7s ease-in-out 1.6s infinite alternate;
}

@keyframes motion-float-label {
  from { translate: 0 0; }
  to { translate: 0 -5px; }
}
.section-kicker,
.eyebrow {
  position: relative;
}

.section-kicker::after,
.eyebrow::after {
  content: "";
  display: block;
  width: 42px;
  height: 2px;
  margin-top: 10px;
  border-radius: 999px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--motion-slow) var(--ease-premium) .18s;
}

.is-visible .section-kicker::after,
.is-visible.eyebrow::after,
.page-entered .eyebrow::after { transform: scaleX(1); }

[data-title-reveal="section"] {
  text-wrap: balance;
}
@media (hover: hover) and (pointer: fine) {
  .shot-window,
  .pro-browser {
    transition:
      transform var(--motion-medium) var(--ease-premium),
      box-shadow var(--motion-medium) var(--ease-premium),
      border-color var(--motion-medium) var(--ease-smooth);
  }
  .shot-window:hover,
  .pro-browser:hover { transform: translateY(-4px) scale(1.008); box-shadow: 0 28px 70px rgba(26,22,17,.16); }

  .issue-feature {
    transition:
      transform var(--motion-medium) var(--ease-premium),
      border-color var(--motion-medium) var(--ease-smooth),
      box-shadow var(--motion-medium) var(--ease-premium),
      background-color var(--motion-medium) var(--ease-smooth);
  }

  .issue-feature:hover { transform: translateY(-4px); }
}

[data-mockup] { position: relative; }
[data-mockup]::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 34%, rgba(255,255,255,.16) 49%, transparent 64%);
  transform: translateX(-120%);
  transition: transform 900ms var(--ease-premium);
  mix-blend-mode: screen;
}

@media (hover:hover) and (pointer:fine) {
  [data-mockup]:hover::after { transform: translateX(120%); }
}
[data-issue-card] {
  position: relative;
}

[data-issue-card]::after {
  content: "";
  position: absolute;
  inset: auto 22px 0 22px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: var(--green);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--motion-slow) var(--ease-premium);
}

[data-issue-card].is-current::after { transform: scaleX(1); }
.croki-intro { position: relative; overflow: clip; }
.croki-intro::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: min(82vw, 1100px);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--green), transparent);
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  transition: transform 1100ms var(--ease-premium);
}

.croki-intro.croki-is-visible::before { transform: translateX(-50%) scaleX(1); }

[data-logo-reveal] {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 900ms var(--ease-out-soft) .12s;
}

.croki-is-visible [data-logo-reveal] { clip-path: inset(0 0 0 0); }
.journey-steps { position: relative; --journey-progress: 0; }
.journey-steps::before,
.journey-steps::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 29px;
  height: 2px;
  border-radius: 999px;
  pointer-events: none;
}

.journey-steps::before { background: rgba(20,21,19,.12); }
.journey-steps::after {
  background: var(--green);
  transform: scaleX(var(--journey-progress));
  transform-origin: left center;
  transition: transform 100ms linear;
}

.journey-steps > li > span {
  position: relative;
  z-index: 2;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--warm-white);
  border: 1px solid var(--line);
  transition:
    background var(--motion-medium) var(--ease-smooth),
    color var(--motion-medium) var(--ease-smooth),
    transform var(--motion-medium) var(--ease-premium);
}

.journey-steps li.is-current > span,
.journey-steps li.is-past > span {
  background: var(--green-dark);
  color: #fff;
  transform: scale(1.05);
}

.journey-steps li > div {
  transition:
    transform var(--motion-medium) var(--ease-premium),
    border-color var(--motion-medium) var(--ease-smooth),
    box-shadow var(--motion-medium) var(--ease-premium);
}

.journey-steps li.is-current > div {
  transform: translateY(-4px);
  border-color: rgba(8,118,75,.28);
  box-shadow: 0 18px 45px rgba(30,25,18,.08);
}
.pro-list span {
  transition: color var(--motion-fast) ease, transform var(--motion-medium) var(--ease-premium);
}
.pro-list span.is-visible { transform: none; }

.form-tabs button {
  transition:
    transform var(--motion-fast) var(--ease-premium),
    color var(--motion-fast) ease,
    background-color var(--motion-medium) var(--ease-smooth),
    box-shadow var(--motion-medium) var(--ease-premium);
}
.form-tabs button:hover { transform: translateY(-1px); }
.form-tabs button:active { transform: scale(.985); }

.contact-form.form-entering {
  animation: motion-form-in var(--motion-medium) var(--ease-premium) both;
}
@keyframes motion-form-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

.field input,
.field select,
.field textarea {
  transition:
    border-color var(--motion-fast) ease,
    box-shadow var(--motion-fast) ease,
    background-color var(--motion-fast) ease,
    transform var(--motion-fast) var(--ease-premium);
}
.field input:focus,
.field select:focus,
.field textarea:focus { transform: translateY(-1px); }
.field.invalid { animation: motion-field-error 260ms var(--ease-smooth); }
@keyframes motion-field-error {
  0%, 100% { transform: translateX(0); }
  35% { transform: translateX(-4px); }
  70% { transform: translateX(3px); }
}
.form-status { transition: opacity var(--motion-fast) ease, transform var(--motion-fast) var(--ease-premium); }
.form-status:empty { opacity: 0; transform: translateY(-3px); }
.faq-list details { overflow: clip; }
.faq-list summary::after {
  content: "+" !important;
  transition: transform var(--motion-medium) var(--ease-premium), color var(--motion-fast) ease;
  transform-origin: center;
}
.faq-list details[open] summary::after { transform: rotate(45deg); color: var(--green); }
.faq-list details > p {
  overflow: hidden;
  will-change: height, opacity;
}
.faq-list summary:hover { color: var(--green-dark); }
.final-shell {
  position: relative;
  overflow: clip;
}
.final-shell::before {
  content: "";
  position: absolute;
  width: 460px;
  height: 460px;
  right: -230px;
  top: -240px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.15);
  transform: scale(.6);
  opacity: 0;
  transition: transform 1100ms var(--ease-premium), opacity 800ms ease;
}
.final-shell.is-visible::before { transform: scale(1); opacity: 1; }
.site-footer a,
.footer-link {
  position: relative;
}
.site-footer a:not(.brand)::after,
.footer-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -3px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--motion-medium) var(--ease-premium);
}
.site-footer a:hover::after,
.site-footer a:focus-visible::after,
.footer-link:hover::after,
.footer-link:focus-visible::after { transform: scaleX(1); transform-origin: left; }

.back-to-top {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 90;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: var(--anthracite);
  color: #fff;
  box-shadow: 0 14px 34px rgba(20,21,19,.18);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px) scale(.94);
  transition:
    opacity var(--motion-medium) ease,
    visibility var(--motion-medium) ease,
    transform var(--motion-medium) var(--ease-premium),
    background var(--motion-fast) ease;
}
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.back-to-top:hover { background: var(--green-dark); transform: translateY(-3px); }
.back-to-top:active { transform: scale(.96); }
@media (max-width: 1180px) {
  .main-nav.open {
    animation: motion-menu-in var(--motion-medium) var(--ease-premium) both;
    transform-origin: top center;
  }
  .main-nav.open > a,
  .main-nav.open .nav-actions {
    opacity: 0;
    transform: translateY(8px);
    animation: motion-menu-link var(--motion-medium) var(--ease-premium) forwards;
  }
  .main-nav.open > a:nth-child(1) { animation-delay: 40ms; }
  .main-nav.open > a:nth-child(2) { animation-delay: 70ms; }
  .main-nav.open > a:nth-child(3) { animation-delay: 100ms; }
  .main-nav.open > a:nth-child(4) { animation-delay: 130ms; }
  .main-nav.open > a:nth-child(5) { animation-delay: 160ms; }
  .main-nav.open > a:nth-child(6) { animation-delay: 190ms; }
  .main-nav.open .nav-actions { animation-delay: 220ms; }
  @keyframes motion-menu-in { from { opacity: 0; transform: translateY(-8px) scale(.985); } to { opacity: 1; transform: none; } }
  @keyframes motion-menu-link { to { opacity: 1; transform: none; } }
}

@media (max-width: 850px), (pointer: coarse) {
  :root {
    --motion-distance-small: 8px;
    --motion-distance-medium: 16px;
    --motion-distance-large: 24px;
    --motion-slow: 620ms;
    --motion-slower: 760ms;
  }

  [data-parallax] { transform: none !important; transition: none; }
  [data-magnetic] { translate: none !important; }
  .showcase-label { animation: none; }
  .back-to-top { right: 14px; bottom: 14px; width: 46px; height: 46px; }

  .journey-steps::before,
  .journey-steps::after {
    left: 17px;
    right: auto;
    top: 0;
    bottom: 0;
    width: 2px;
    height: auto;
    transform-origin: top center;
  }
  .journey-steps::after { transform: scaleY(var(--journey-progress)); }
  .journey-steps li { padding-left: 52px; }
  .journey-steps > li > span { position: absolute; left: 0; top: 0; }
}

@media (max-width: 580px) {
  .scroll-progress { height: 2px; }
  html.motion-ready [data-reveal].motion-pending {
    transition-duration: 560ms;
  }
  .back-to-top { border-radius: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
  }
  [data-reveal],
  [data-page-intro],
  [data-logo-reveal] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
  }
  [data-parallax],
  [data-magnetic] {
    transform: none !important;
    translate: none !important;
  }
  .showcase-label { animation: none !important; }
}
html, body { max-width: 100%; }
body { overflow-x: clip; }

@media (max-width: 850px) {
  .hero-grid,
  .professional-grid,
  .about-shell,
  .faq-grid,
  .croki-shell {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .hero-grid > *,
  .professional-grid > *,
  .about-shell > *,
  .faq-grid > *,
  .croki-shell > * {
    min-width: 0;
    max-width: 100%;
  }

  .professional-copy,
  .faq-list {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  html.motion-ready [data-reveal="fade-left"].motion-pending,
  html.motion-ready [data-reveal="fade-right"].motion-pending {
    transform: translate3d(0, var(--motion-distance-medium), 0);
  }
}
[data-magnetic]{--magnetic-x:0px!important;--magnetic-y:0px!important}.js [data-parallax]{transform:translate3d(0,var(--parallax-y,0),0) rotate(var(--parallax-r,0));transition:transform 180ms var(--ease-premium)}@media(max-width:980px),(pointer:coarse){[data-parallax]{transform:none!important}}:root{--text-small:13px}.browser-bar,.showcase-label,.dev-note,.first-product small,.project-status small,.product-captures-grid figcaption,.pro-gallery-tabs button,.pro-gallery-stage figcaption span,.client-evidence-grid figcaption span{font-size:var(--text-small)}@media(max-width:720px){.section-pad{padding-block:72px}.hero{padding-top:96px}.hero-lead{font-size:18px}.contact-note p,.consent span{font-size:13px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}
/* V15 — corrections sûres sans altérer la direction artistique V13 */
:root{--parallax-r:0deg;--parallax-scroll-y:0px;--reveal-delay:0ms;--scroll-progress:0}
html{min-width:320px}
a,button,[role="tab"],summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
input,select,textarea{accent-color:var(--green-dark)}
button[aria-busy="true"],form[aria-busy="true"]{cursor:progress}
.contact-form[aria-busy="true"] .field-grid,.contact-form[aria-busy="true"] .field,.contact-form[aria-busy="true"] .consent{opacity:.78}
.footer-brand a,.legal-card a,.simple-footer a,.contact-note a{overflow-wrap:anywhere}
.noscript-note{margin:18px 0 0;padding:15px 17px;border:1px solid var(--line);border-radius:14px;background:var(--warm-white);color:var(--muted);font-size:14px}
@media print{.site-header,.scroll-progress,.back-to-top,.final-cta,.site-footer,.simple-footer,.cookie-dialog,.menu-toggle{display:none!important}body{background:#fff!important;color:#000!important}.section-pad{padding-block:28px!important}a{text-decoration:underline!important}}


/* ==========================================================================\n   V16 — refinements issus des audits, sans refonte ni suppression agressive\n   ========================================================================== */
.anchor-alias{display:block;position:relative;top:-110px;visibility:hidden}
.client-journey-inline{margin-top:clamp(48px,6vw,78px);padding-top:clamp(38px,5vw,62px);border-top:1px solid var(--line)}
.client-journey-heading{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:22px 48px;align-items:end;margin-bottom:32px}
.client-journey-heading .section-kicker{grid-column:1/-1;margin-bottom:-4px}
.client-journey-heading h3{margin:0;font-size:clamp(34px,4vw,54px);line-height:1;letter-spacing:-.05em;max-width:700px}
.client-journey-heading>p{margin:0;color:var(--muted);font-size:17px;max-width:560px}
.journey-steps-inline{margin-top:0}
.journey-steps-inline li{min-height:0}
.journey-steps-inline li>div{min-height:245px}
.pro-onboarding{margin:28px 0 24px;padding:22px;border:1px solid rgba(255,255,255,.16);border-radius:22px;background:rgba(255,255,255,.055)}
.pro-onboarding h3{margin:0 0 17px;font-size:19px;color:#fff}
.pro-onboarding ol{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.pro-onboarding li{display:grid;grid-template-columns:30px 1fr;gap:11px;align-items:start}
.pro-onboarding li>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.11);color:#bfead1;font-size:10px;font-weight:900;letter-spacing:.08em}
.pro-onboarding strong,.pro-onboarding small{display:block}
.pro-onboarding strong{font-size:14px;color:#fff;margin-bottom:3px}
.pro-onboarding small{font-size:13px;line-height:1.48;color:rgba(255,255,255,.68)}
.founder-card{margin:28px 0;padding:24px;border:1px solid rgba(7,86,58,.14);border-radius:22px;background:rgba(255,255,255,.7);box-shadow:0 18px 44px rgba(22,45,34,.06)}
.founder-card>span,.founder-card>strong,.founder-card>p{display:block}
.founder-card>span{margin-bottom:8px;color:var(--fts-green-dark);font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.founder-card>strong{font-size:19px;color:var(--anthracite);letter-spacing:-.025em}
.founder-card>p{margin:9px 0 0!important;font-size:15px!important;line-height:1.6;color:var(--muted)!important}
.founder-card-company{background:var(--warm-white)}
.consent{font-size:14px;line-height:1.5;gap:12px}
.consent input{width:22px;height:22px;min-width:22px;margin-top:0}
.pro-gallery-tabs button{min-height:44px}
.main-nav>a,.site-footer a,.footer-link{min-height:44px}
.site-footer a,.footer-link{display:inline-flex;align-items:center}
.form-tabs button{min-height:52px}
.faq-list summary{min-height:64px;display:flex;align-items:center}

@media(max-width:980px){
  .client-journey-heading{grid-template-columns:1fr;gap:14px}
  .client-journey-heading .section-kicker{grid-column:auto}
}
@media(max-width:720px){
  .hero{padding-top:84px!important;padding-bottom:46px!important}
  .hero-grid{gap:32px!important}
  .hero-copy h1{font-size:clamp(38px,10.8vw,48px)!important;line-height:.98!important}
  .hero-lead{font-size:16.5px!important;line-height:1.55;margin-top:18px}
  .hero-lines{display:flex!important;flex-wrap:wrap;gap:7px 14px!important;margin:18px 0 22px!important;font-size:13px}
  .hero-showcase{min-height:390px!important}
  .first-product{margin-top:20px}
  .project-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .project-status article{padding:18px 14px!important;border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}
  .project-status article:nth-child(2n){border-right:0!important}
  .project-status article:nth-last-child(-n+2){border-bottom:0!important}
  .project-status strong{font-size:14px}
  .project-status small{font-size:12px;line-height:1.4}
  .client-journey-inline{margin-top:42px;padding-top:36px}
  .client-journey-heading h3{font-size:36px}
  .client-journey-heading>p{font-size:16px}
  .journey-steps-inline{grid-template-columns:1fr 1fr!important;gap:12px}
  .journey-steps-inline li>div{min-height:210px;padding:20px}
  .journey-steps-inline h3{font-size:17px}
  .journey-steps-inline p{font-size:13px}
  .professional-copy h2{font-size:40px!important}
  .pro-list{grid-template-columns:1fr 1fr}
  .founder-card{padding:21px}
  .faq-grid{gap:34px}
}
@media(max-width:430px){
  .hero-copy h1{font-size:clamp(36px,10.6vw,43px)!important}
  .hero-showcase{min-height:350px!important}
  .project-status-grid{grid-template-columns:1fr!important}
  .project-status article{border-right:0!important;border-bottom:1px solid var(--line)!important}
  .project-status article:last-child{border-bottom:0!important}
  .journey-steps-inline{grid-template-columns:1fr!important}
  .journey-steps-inline li>div{min-height:0}
  .pro-list{grid-template-columns:1fr}
  .client-journey-heading h3{font-size:33px}
}

/* V16.1 — optimisation mobile éditoriale */
@media(max-width:720px){
  .section-pad{padding-block:64px!important}
  .proof-window-pro{display:none!important}
  .hero-showcase-proof{gap:10px!important}
  .hero-showcase-proof .dev-note{margin-top:2px}
  .project-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .project-status article{min-height:156px!important}
  .journey-steps-inline{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .journey-steps-inline li>div{min-height:205px;padding:18px 16px}
  .journey-steps-inline h3{margin-top:18px}
  .about-shell{gap:24px!important}
  .about-title h2{font-size:clamp(34px,9.5vw,40px)!important;line-height:1!important}
  .about-copy>p{font-size:16px!important;line-height:1.58}
  .founder-card{margin:22px 0;padding:20px}
  .founder-card>strong{font-size:17px}
  .founder-card>p{font-size:14px!important}
  .about-facts{margin:22px 0}
  .faq-list summary{min-height:58px;padding-block:18px}
}
@media(max-width:350px){
  .project-status article{padding:16px 10px!important}
  .project-status strong{font-size:13px}
  .project-status small{font-size:11.5px}
  .journey-steps-inline li>div{padding:16px 13px;min-height:220px}
  .journey-steps-inline h3{font-size:15px}
  .journey-steps-inline p{font-size:12px}
}
@media(max-width:720px){
  .company-status{grid-template-columns:1fr!important}
  .company-status article{min-height:0!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.12)!important;padding:20px!important}
  .company-status article:last-child{border-bottom:0!important}
}
