:root{
  --primary:#1454e8;
  --primary-2:#2f72ff;
  --primary-deep:#0a2f8f;
  --sky:#dcecff;
  --sky-2:#eff6ff;
  --mint:#8ce5cf;
  --mint-soft:#e7fbf6;
  --amber:#ffbf66;
  --amber-soft:#fff4df;
  --coral:#ff7c75;
  --rose:#e13487;
  --ink:#111827;
  --ink-2:#1f2937;
  --graphite:#25272b;
  --muted:#5f6878;
  --line:#dce3ef;
  --line-strong:#c6d1e2;
  --paper:#fff;
  --cloud:#f5f7fb;
  --cloud-blue:#edf4ff;
  --dark:#17191d;
  --dark-2:#23262b;
  --on-dark:#f8fafc;
  --font:"Manrope","Inter",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --container:1200px;
  --wide:1440px;
  --header-h:76px;
  --section:92px;
  --r-sm:8px;
  --r-md:14px;
  --r-lg:22px;
  --r-xl:32px;
  --shadow:0 12px 38px rgba(25,45,85,.10);
  --shadow-soft:0 6px 20px rgba(25,45,85,.08);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
body{font-family:var(--font);color:var(--ink);background:var(--paper);font-size:16px;line-height:1.48;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
a:hover{color:var(--primary)}
img{display:block;max-width:100%;height:auto}
button,input,textarea,select{font:inherit;color:inherit}
button{border:0;background:none}
ul{list-style:none}
.container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
.container-wide{width:min(calc(100% - 48px),var(--wide));margin-inline:auto}
.section{padding:var(--section) 0;position:relative;scroll-margin-top:calc(var(--header-h) + 20px)}
.section-cloud{background:var(--cloud)}
.section-blue{background:linear-gradient(145deg,#eef5ff 0%,#f8fbff 55%,#effaf7 100%)}
.section-amber{background:linear-gradient(145deg,#fff9ef 0%,#fff 70%)}
.section-dark{background:var(--dark);color:var(--on-dark)}
.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--primary);font-size:13px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin-bottom:14px}
.eyebrow::before{content:"";width:26px;height:2px;background:currentColor;border-radius:99px}
.display-xxl{font-size:clamp(40px,5vw,68px);font-weight:520;line-height:1.02;letter-spacing:-.035em}
.display-xl{font-size:clamp(36px,4.2vw,56px);font-weight:540;line-height:1.05;letter-spacing:-.03em}
.display-lg{font-size:clamp(31px,3.35vw,46px);font-weight:540;line-height:1.08;letter-spacing:-.025em}
.display-md{font-size:clamp(26px,2.6vw,36px);font-weight:600;line-height:1.13;letter-spacing:-.02em}
.display-sm{font-size:clamp(22px,2vw,28px);font-weight:650;line-height:1.18}
.display-xs{font-size:20px;font-weight:650;line-height:1.2}
.body-lg{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--muted)}
.body-md{font-size:16px;line-height:1.55;color:var(--muted)}
.caption{font-size:14px;line-height:1.5;color:var(--muted)}
.section-head{max-width:770px;margin-bottom:42px}
.section-head.center{text-align:center;margin-inline:auto}
.section-head p{margin-top:14px}
.skip-link{position:fixed;left:12px;top:-60px;z-index:9999;background:#fff;padding:12px 16px;border:2px solid var(--primary);border-radius:8px}
.skip-link:focus{top:12px}

/* Header */
.site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(207,217,233,.82);transition:box-shadow .2s ease}
.site-header.scrolled{box-shadow:0 8px 28px rgba(20,42,83,.08)}
.nav-bar{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{display:inline-flex;align-items:center;gap:12px;min-width:max-content;color:var(--ink)}
.logo:hover{color:var(--ink)}
.logo-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(145deg,var(--primary),#0739b9);color:#fff;font-size:14px;font-weight:800;letter-spacing:.02em;box-shadow:0 8px 18px rgba(20,84,232,.22)}
.logo-text{font-size:20px;font-weight:750;line-height:1;letter-spacing:-.02em}
.logo-text span{display:block;margin-top:5px;font-size:11px;font-weight:500;color:var(--muted);letter-spacing:0}
.nav-links{display:flex;align-items:center;gap:29px;margin-left:auto}
.nav-links a{font-size:15px;font-weight:600;color:var(--ink-2);position:relative;padding:27px 0 24px}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:18px;height:2px;background:var(--primary);transition:right .2s ease}
.nav-links a:hover::after,.nav-links a.active::after{right:0}
.nav-links a.active{color:var(--primary)}
.nav-actions{display:flex;align-items:center;gap:15px}
.nav-phone{font-size:14px;font-weight:700;white-space:nowrap}
.burger{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:10px;align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer}
.burger span{width:19px;height:2px;background:var(--ink);border-radius:99px;transition:.2s}
.mobile-nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);padding:16px 24px 24px;box-shadow:var(--shadow)}
.mobile-nav.open{display:grid;gap:4px}
.mobile-nav a{padding:12px 8px;font-weight:600}

/* buttons */
.btn{min-height:48px;padding:13px 22px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.055em;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease,border-color .18s ease;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-sm{min-height:42px;padding:10px 17px}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;box-shadow:0 10px 22px rgba(20,84,232,.2)}
.btn-primary:hover{color:#fff;box-shadow:0 14px 28px rgba(20,84,232,.3)}
.btn-outline{border-color:var(--primary);color:var(--primary);background:#fff}
.btn-outline:hover{background:var(--sky-2)}
.btn-ghost{border-color:var(--line-strong);background:rgba(255,255,255,.65);color:var(--ink)}
.btn-dark{background:var(--dark);color:#fff}
.btn-dark:hover{color:#fff;background:#07090c}
.btn-text{display:inline-flex;align-items:center;gap:8px;color:var(--primary);font-weight:750;font-size:14px}
.btn-text::after{content:"→";transition:transform .2s ease}
.btn-text:hover::after{transform:translateX(4px)}

/* hero */
.hero{padding:34px 0 58px;background:radial-gradient(circle at 84% 20%,rgba(105,174,255,.17),transparent 29%),linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.hero-frame{min-height:min(690px,calc(100svh - var(--header-h) - 58px));border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;display:grid;grid-template-columns:1.08fr .92fr;background:#fff;box-shadow:var(--shadow);position:relative}
.hero-frame::before,.hero-frame::after{content:"";position:absolute;width:22px;height:54%;top:23%;background:var(--primary);z-index:3}
.hero-frame::before{left:0;clip-path:polygon(0 0,100% 11%,100% 89%,0 100%)}
.hero-frame::after{right:0;clip-path:polygon(0 11%,100% 0,100% 100%,0 89%)}
.hero-copy{padding:clamp(42px,5vw,78px);display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2}
.hero-copy .lead{max-width:660px;margin-top:22px}
.hero-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:28px;margin-bottom:26px}
.hero-trust-item{font-size:13px;line-height:1.35;display:flex;align-items:flex-start;gap:8px;color:var(--ink-2);font-weight:600}
.hero-trust-item svg{flex:0 0 auto;color:var(--primary);margin-top:1px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-note{margin-top:15px;font-size:12px;color:var(--muted)}
.hero-visual{position:relative;overflow:hidden;background:var(--cloud-blue);min-height:480px}
.hero-visual img{width:100%;height:100%;object-fit:cover}
.hero-badge{position:absolute;left:32px;bottom:28px;max-width:260px;padding:18px 20px;background:rgba(255,255,255,.93);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.8);border-radius:16px;box-shadow:var(--shadow-soft)}
.hero-badge strong{display:block;font-size:15px;margin-bottom:5px}
.hero-badge span{font-size:12px;color:var(--muted)}

/* audience */
.audience-intro{display:grid;grid-template-columns:.78fr 1.22fr;gap:64px;align-items:end;margin-bottom:34px}
.audience-intro .section-head{margin:0}
.audience-hint{padding:19px 21px;border-left:3px solid var(--primary);background:#fff;border-radius:0 14px 14px 0;color:var(--muted);box-shadow:var(--shadow-soft)}
.audience-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.audience-card{position:relative;min-height:280px;padding:24px;border-radius:20px;border:1px solid var(--line);background:#fff;cursor:pointer;overflow:hidden;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;text-align:left}
.audience-card::before{content:"";position:absolute;right:-42px;top:-42px;width:140px;height:140px;border-radius:50%;background:var(--accent-soft,var(--sky-2));transition:transform .25s ease}
.audience-card:hover,.audience-card:focus-visible{transform:translateY(-7px);box-shadow:0 18px 45px rgba(23,45,88,.13);border-color:var(--accent,var(--primary));outline:none}
.audience-card:hover::before{transform:scale(1.2)}
.audience-card.shop{--accent:#1d65ed;--accent-soft:#e7f0ff}
.audience-card.service{--accent:#0eaa8f;--accent-soft:#e5fbf6}
.audience-card.build{--accent:#f1932b;--accent-soft:#fff0dc}
.audience-card.industry{--accent:#5f6b85;--accent-soft:#edf0f5}
.audience-card.farm{--accent:#39a95d;--accent-soft:#e7f8ec}
.audience-card.other{--accent:#d83b87;--accent-soft:#fdeaf3}
.audience-icon{position:relative;z-index:2;width:58px;height:58px;border-radius:16px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;margin-bottom:28px}
.audience-card h3{position:relative;z-index:2;font-size:21px;line-height:1.22;margin-bottom:12px}
.audience-card p{position:relative;z-index:2;color:var(--muted);font-size:14px;line-height:1.5}
.audience-tags{position:relative;z-index:2;display:flex;gap:7px;flex-wrap:wrap;margin-top:16px}
.audience-tags span{font-size:11px;font-weight:700;padding:6px 9px;background:var(--accent-soft);color:var(--accent);border-radius:999px}
.audience-action{position:absolute;left:24px;right:24px;bottom:20px;z-index:3;display:flex;justify-content:space-between;align-items:center;color:var(--accent);font-size:13px;font-weight:800}
.audience-action span:last-child{font-size:20px}

/* dynamic solutions */
.solution-panel{display:none;margin-top:30px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow);overflow:hidden}
.solution-panel.active{display:grid;grid-template-columns:.8fr 1.2fr;animation:panelIn .35s ease}
@keyframes panelIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.solution-visual{padding:42px;background:linear-gradient(145deg,var(--solution-soft,#eaf2ff),#fff);position:relative;min-height:340px;display:flex;flex-direction:column;justify-content:space-between}
.solution-symbol{width:82px;height:82px;border-radius:24px;background:var(--solution-color,var(--primary));color:#fff;display:grid;place-items:center;box-shadow:0 18px 32px color-mix(in srgb,var(--solution-color,var(--primary)) 25%,transparent)}
.solution-visual small{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--solution-color,var(--primary))}
.solution-visual h3{font-size:clamp(28px,3vw,42px);line-height:1.08;margin-top:10px}
.solution-copy{padding:42px}
.solution-copy>p{color:var(--muted);max-width:650px;margin-bottom:22px}
.solution-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:22px 0 28px}
.solution-list li{padding:15px;border:1px solid var(--line);border-radius:12px;font-size:14px;font-weight:650;display:flex;gap:9px;align-items:flex-start}
.solution-list li::before{content:"✓";color:var(--solution-color,var(--primary));font-weight:900}
.solution-result{padding:17px 19px;background:var(--cloud);border-radius:14px;border-left:4px solid var(--solution-color,var(--primary));margin-bottom:24px}
.solution-result strong{display:block;margin-bottom:4px}
.solution-result span{font-size:14px;color:var(--muted)}
.solution-actions{display:flex;gap:11px;flex-wrap:wrap}

/* how it works */
.flow-grid{display:grid;grid-template-columns:.83fr 1.17fr;gap:52px;align-items:center}
.flow-copy .body-lg{margin-top:18px;max-width:610px}
.flow-points{display:grid;gap:14px;margin-top:28px}
.flow-point{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--line);background:#fff;border-radius:14px;transition:.2s}
.flow-point:hover{transform:translateX(5px);border-color:#abc5f8}
.flow-point .num{width:46px;height:46px;border-radius:13px;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800}
.flow-point strong{display:block;font-size:16px}
.flow-point span{font-size:13px;color:var(--muted)}
.flow-diagram{position:relative;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,#fff,#eef7ff);padding:38px;min-height:430px;display:flex;align-items:center;box-shadow:var(--shadow-soft);overflow:hidden}
.flow-diagram::after{content:"";position:absolute;inset:auto -80px -110px auto;width:300px;height:300px;border-radius:50%;background:rgba(140,229,207,.18)}
.flow-chain{display:grid;grid-template-columns:1fr 58px 1fr 58px 1fr;width:100%;align-items:center;position:relative;z-index:2}
.flow-node{aspect-ratio:1;border:2px solid var(--primary);border-radius:26px;background:#fff;display:grid;place-items:center;text-align:center;padding:18px;color:var(--primary);box-shadow:0 12px 26px rgba(20,84,232,.13);transition:.25s}
.flow-node:hover{transform:translateY(-7px) rotate(-1deg)}
.flow-node svg{margin-bottom:10px}
.flow-node strong{font-size:14px;color:var(--ink)}
.flow-arrow{height:2px;background:linear-gradient(90deg,var(--primary),var(--mint));position:relative}
.flow-arrow::after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:8px;border-top:2px solid var(--primary);border-right:2px solid var(--primary);transform:rotate(45deg)}

/* process */
.process-shell{border-radius:28px;background:radial-gradient(circle at 80% 80%,rgba(140,229,207,.13),transparent 34%),linear-gradient(140deg,#302d28,#1d2023 65%);color:#f8fafc;overflow:hidden;border:1px solid #3b3e43;box-shadow:0 22px 60px rgba(0,0,0,.18)}
.process-top{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;padding:48px 44px 36px;border-bottom:1px solid rgba(255,255,255,.09)}
.process-top .eyebrow{color:var(--amber)}
.process-top p{color:#bbbcc1;max-width:520px;align-self:center}
.process-track{position:relative;display:grid;grid-template-columns:repeat(6,1fr);padding:34px 28px 46px;gap:12px}
.process-track::before{content:"";position:absolute;left:43px;right:43px;top:51%;height:2px;background:linear-gradient(90deg,var(--amber),#f8cf86 45%,var(--mint) 70%,#65dcca)}
.process-step{position:relative;min-height:290px;display:flex;flex-direction:column;align-items:center;z-index:2}
.process-card{width:100%;min-height:145px;padding:18px;border:1px solid rgba(255,255,255,.1);background:rgba(12,14,16,.66);border-radius:16px;box-shadow:0 12px 24px rgba(0,0,0,.16)}
.process-step:nth-child(even){justify-content:flex-end}
.process-step:nth-child(even) .process-card{order:2}
.process-dot{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--amber);color:#111;font-size:12px;font-weight:900;border:7px solid #202225;flex:0 0 auto;margin:15px 0}
.process-step:nth-child(n+4) .process-dot{background:var(--mint)}
.process-card h3{font-size:18px;margin-bottom:7px}
.process-card p{font-size:12px;color:#b7b8bd;line-height:1.45}
.process-output{display:block;margin-top:11px;color:var(--amber);text-transform:uppercase;font-size:10px;font-weight:800;letter-spacing:.07em}
.process-step:nth-child(n+4) .process-output{color:var(--mint)}

/* cases */
.cases-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:38px}
.cases-head .section-head{margin:0}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;width:100%}
.case-card{border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden;transition:transform .22s ease,box-shadow .22s ease;display:flex;flex-direction:column}
.case-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.case-cover{height:225px;position:relative;display:flex;align-items:center;justify-content:center;color:#fff;text-align:center;padding:24px;overflow:hidden}
.case-cover::after{content:"";position:absolute;inset:auto -40px -90px auto;width:210px;height:210px;border:1px solid rgba(255,255,255,.25);border-radius:50%}
.case-cover.clean{background:linear-gradient(135deg,#0db7d2,#357af2)}
.case-cover.skt{background:linear-gradient(135deg,#4c596d,#1d293b)}
.case-cover.faberlic{background:linear-gradient(135deg,#e83d91,#c91f6e)}
.case-cover svg{margin:auto auto 14px;position:relative;z-index:2}
.case-cover strong{display:block;font-size:22px;position:relative;z-index:2}
.case-cover span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;opacity:.8;margin-top:5px;position:relative;z-index:2}
.case-badge{position:absolute;top:16px;left:16px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--ink);font-size:10px;font-weight:800;text-transform:uppercase;z-index:3}
.case-body{padding:23px;display:flex;flex-direction:column;flex:1}
.case-body h3{font-size:21px;margin-bottom:10px}
.case-body>p{font-size:14px;color:var(--muted);line-height:1.55}
.case-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:17px}
.case-tags span{font-size:10px;padding:5px 8px;border:1px solid var(--line);background:#f8fafc;border-radius:5px;color:#476078}
.case-details{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease;margin-top:0}
.case-details-inner{overflow:hidden}
.case-details-content{padding-top:17px;margin-top:17px;border-top:1px solid var(--line);display:grid;gap:8px;font-size:13px;color:var(--muted)}
.case-card.expanded .case-details{grid-template-rows:1fr}
.case-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;padding-top:18px;margin-top:auto}
.case-toggle{color:var(--primary);font-size:13px;font-weight:800;cursor:pointer}

/* quiz */
.quiz-shell{display:grid;grid-template-columns:1.18fr .82fr;min-height:610px;border:1px solid var(--line);border-radius:24px;background:#fff;overflow:hidden;box-shadow:var(--shadow)}
.quiz-main{padding:34px}
.quiz-side{background:var(--dark);color:#fff;padding:34px;display:flex;flex-direction:column}
.quiz-progress{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:28px}
.quiz-progress span{height:4px;background:#e1e5eb;border-radius:99px;transition:.2s}
.quiz-progress span.active,.quiz-progress span.done{background:var(--primary)}
.quiz-step{display:none;animation:stepIn .25s ease}
.quiz-step.active{display:block}
@keyframes stepIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.quiz-step h3{font-size:24px;margin-bottom:5px}
.quiz-step>p{color:var(--muted);font-size:14px;margin-bottom:20px}
.quiz-options{display:grid;gap:10px}
.quiz-option{width:100%;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;text-align:left;display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;cursor:pointer;transition:.18s}
.quiz-option:hover{border-color:#9ab7f5;background:#f8fbff}
.quiz-option.selected{border-color:var(--primary);background:#eef4ff;box-shadow:0 0 0 1px var(--primary) inset}
.quiz-option-icon{width:42px;height:42px;border-radius:11px;background:var(--cloud);display:grid;place-items:center}
.quiz-option strong{display:block;font-size:14px}
.quiz-option small{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.quiz-option::after{content:"";width:16px;height:16px;border:1px solid var(--line-strong);border-radius:50%}
.quiz-option.selected::after{border:5px solid var(--primary)}
.quiz-nav{display:flex;justify-content:space-between;gap:12px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.quiz-side h3{font-size:20px;margin-bottom:5px}
.quiz-side>p{font-size:12px;color:#aeb3bc;margin-bottom:22px}
.quiz-summary{border:1px solid #3d4046;border-radius:13px;overflow:hidden}
.quiz-row{display:flex;justify-content:space-between;gap:16px;padding:11px 13px;border-bottom:1px solid #373a3f;font-size:12px}
.quiz-row:last-child{border-bottom:0}
.quiz-row span:first-child{color:#a4a7ae}
.quiz-row strong{text-align:right;font-size:12px}
.quiz-estimate{margin-top:auto;padding-top:25px}
.quiz-estimate small{display:block;color:#8e9299;text-transform:uppercase;font-size:10px;font-weight:800;letter-spacing:.08em;margin-bottom:6px}
.quiz-estimate strong{font-size:26px}
.quiz-estimate p{font-size:11px;color:#969aa2;margin-top:6px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field{display:grid;gap:6px}
.field.full{grid-column:1/-1}
.field label{font-size:11px;font-weight:800;color:var(--muted)}
.field input,.field textarea,.field select{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;outline:none}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(20,84,232,.11)}
.field textarea{min-height:82px;resize:vertical}
.quiz-success{display:none;padding:35px;border-radius:18px;background:var(--mint-soft);text-align:center}
.quiz-success.active{display:block}
.prefill-note{display:none;padding:12px 14px;background:var(--mint-soft);border:1px solid #b6eedf;border-radius:12px;margin-bottom:16px;font-size:13px;color:#167c68}
.prefill-note.show{display:block}

/* about mini */
.about-mini{display:grid;grid-template-columns:.82fr 1.18fr;gap:42px;align-items:center}
.about-photo{position:relative;border-radius:24px;overflow:hidden;min-height:430px;box-shadow:var(--shadow)}
.about-photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.about-copy p{margin-top:14px;color:var(--muted)}
.about-points{display:grid;gap:11px;margin-top:24px}
.about-point{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start}
.about-point i{width:38px;height:38px;border-radius:11px;background:var(--sky-2);color:var(--primary);display:grid;place-items:center;font-style:normal;font-weight:900}
.about-point strong{display:block;font-size:14px}
.about-point span{font-size:13px;color:var(--muted)}

/* pricing */
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.price-card{border:1px solid var(--line);border-radius:20px;background:#fff;padding:27px;display:flex;flex-direction:column;position:relative;box-shadow:var(--shadow-soft)}
.price-card.featured{border:2px solid var(--primary);transform:translateY(-8px)}
.price-badge{position:absolute;top:-13px;left:24px;background:var(--primary);color:#fff;font-size:10px;font-weight:900;text-transform:uppercase;padding:6px 11px;border-radius:5px}
.price-card .tier{font-size:12px;font-weight:800;text-transform:uppercase;color:var(--muted);letter-spacing:.06em}
.price-card h3{margin:8px 0 9px}
.amount{font-size:34px;line-height:1.1;margin-bottom:8px}
.amount span{font-size:11px;color:var(--muted)}
.price-desc{color:var(--muted);font-size:13px;min-height:42px}
.price-section-label{font-size:11px;font-weight:900;text-transform:uppercase;color:var(--primary);margin-top:20px;margin-bottom:8px}
.price-list{display:grid;gap:9px;margin-bottom:24px}
.price-list li{font-size:13px;display:flex;gap:8px;align-items:flex-start}
.price-list li::before{content:"•";color:var(--primary);font-size:20px;line-height:12px}
.price-result{background:var(--cloud);border-radius:12px;padding:13px;margin-top:auto;margin-bottom:17px;font-size:12px;color:var(--muted)}
.price-result strong{display:block;color:var(--ink);margin-bottom:3px}

/* FAQ */
.faq-list{max-width:980px;margin-inline:auto;display:grid;gap:10px}
.faq-item{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 21px;text-align:left;font-weight:700;cursor:pointer}
.faq-q svg{transition:transform .22s ease;flex:0 0 auto}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .27s ease;color:var(--muted)}
.faq-a>div{overflow:hidden;padding:0 21px}
.faq-item.open .faq-a{grid-template-rows:1fr}
.faq-item.open .faq-a>div{padding-bottom:20px}
.faq-item.open .faq-q svg{transform:rotate(180deg)}

/* footer */
.footer{background:#17191c;color:#d4d8df;padding:54px 0 18px}
.footer-main{display:grid;grid-template-columns:1.05fr .9fr 1.2fr;gap:40px;align-items:start}
.footer .logo{color:#fff}
.footer-brand p{font-size:13px;line-height:1.6;color:#aeb4bd;margin-top:16px;max-width:320px}
.footer-links-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:25px}
.footer-col h4{font-size:12px;color:#fff;text-transform:uppercase;letter-spacing:.07em;margin-bottom:13px}
.footer-col a{display:block;font-size:13px;color:#b7bdc6;padding:5px 0}
.footer-col a:hover{color:#fff}
.footer-map{border-radius:16px;overflow:hidden;border:1px solid #34373d;background:#222;height:250px}
.footer-map iframe{width:100%;height:100%;border:0;filter:grayscale(.25) brightness(.85)}
.footer-map-label{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:11px;color:#989ea8}
.footer-bottom{border-top:1px solid #33363b;margin-top:36px;padding-top:17px;display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#949aa3}

/* secondary pages */
.page-hero{padding:70px 0 58px;background:linear-gradient(145deg,var(--cloud-blue),#fff 62%,var(--mint-soft));border-bottom:1px solid var(--line)}
.page-hero .lead{max-width:770px;margin-top:18px}
.breadcrumbs{font-size:12px;color:var(--muted);margin-bottom:18px}
.breadcrumbs a{color:var(--primary)}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.info-card{padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff}
.info-card h3{font-size:19px;margin-bottom:9px}
.info-card p{font-size:14px;color:var(--muted)}
.prose{max-width:820px}
.prose h2{font-size:32px;margin:38px 0 14px}
.prose h3{font-size:22px;margin:27px 0 10px}
.prose p{color:var(--muted);margin:12px 0;line-height:1.68}
.prose ul{display:grid;gap:8px;margin:16px 0}
.prose li{padding-left:20px;position:relative;color:var(--muted)}
.prose li::before{content:"•";position:absolute;left:0;color:var(--primary);font-weight:900}
.term-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.term-card{padding:20px;border:1px solid var(--line);border-radius:15px;background:#fff}
.term-card strong{font-size:16px}
.term-card p{font-size:13px;color:var(--muted);margin-top:7px}
.doc-list{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.doc-item{padding:18px;border:1px solid var(--line);border-radius:13px;background:#fff;display:flex;gap:12px;align-items:center;font-size:13px;font-weight:700}
.doc-item i{font-style:normal;width:38px;height:38px;border-radius:10px;background:var(--sky-2);display:grid;place-items:center;color:var(--primary)}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px}
.contact-card{padding:28px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow-soft)}
.contact-list{display:grid;gap:14px;margin-top:20px}
.contact-item{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:center}
.contact-item i{font-style:normal;width:42px;height:42px;background:var(--sky-2);border-radius:12px;display:grid;place-items:center;color:var(--primary)}
.contact-item span{display:block;font-size:12px;color:var(--muted)}
.contact-item strong{font-size:14px}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.blog-card{border:1px solid var(--line);border-radius:17px;background:#fff;padding:24px}
.blog-card small{font-size:11px;color:var(--primary);text-transform:uppercase;font-weight:800}
.blog-card h3{font-size:20px;margin:13px 0 9px}
.blog-card p{font-size:13px;color:var(--muted)}

/* case detail */
.case-hero{padding:64px 0;background:var(--cloud-blue)}
.case-meta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.case-meta span{font-size:11px;font-weight:800;text-transform:uppercase;color:var(--primary)}
.case-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:34px}
.case-stat{padding:20px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:var(--shadow-soft)}
.case-stat strong{display:block;font-size:27px;color:var(--primary)}
.case-stat span{font-size:11px;color:var(--muted)}
.case-layout{display:grid;grid-template-columns:1fr 360px;gap:46px;align-items:start}
.case-sidebar{position:sticky;top:calc(var(--header-h) + 24px);border:1px solid var(--line);border-radius:18px;padding:24px;background:#fff;box-shadow:var(--shadow-soft)}
.case-sidebar h3{font-size:18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.sidebar-row{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px}
.sidebar-row span:first-child{color:var(--muted)}
.sidebar-row strong{text-align:right}
.case-sidebar .btn{width:100%;margin-top:20px}

/* modal + toast */
.modal{position:fixed;inset:0;background:rgba(5,12,25,.62);z-index:2000;display:none;place-items:center;padding:20px}
.modal.open{display:grid}
.modal-dialog{width:min(100%,560px);background:#fff;border-radius:20px;padding:28px;box-shadow:0 30px 80px rgba(0,0,0,.28);position:relative}
.modal-close{position:absolute;right:16px;top:14px;width:36px;height:36px;border-radius:10px;background:var(--cloud);cursor:pointer;font-size:20px}
.toast{position:fixed;right:20px;bottom:20px;z-index:3000;max-width:360px;padding:14px 18px;background:var(--ink);color:#fff;border-radius:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(15px);pointer-events:none;transition:.25s}
.toast.show{opacity:1;transform:none}
.form-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.submission-success{position:fixed;inset:0;z-index:3200;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.68);backdrop-filter:blur(6px)}
.submission-success.open{display:flex}
.submission-success-card{position:relative;width:min(100%,540px);padding:42px 34px;background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 30px 90px rgba(0,0,0,.3);text-align:center}
.submission-success-card h2{margin:8px 0 12px;font-size:clamp(25px,4vw,34px);line-height:1.15}
.submission-success-card p{margin:8px auto;color:var(--muted);max-width:440px}
.submission-success-card .btn{margin-top:22px}
.submission-success-icon{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 18px;background:var(--mint-soft);color:var(--mint);font-size:30px;font-weight:800}
.submission-success-close{position:absolute;top:12px;right:14px;width:40px;height:40px;border:0;background:transparent;color:var(--muted);font-size:28px;line-height:1;cursor:pointer}
body.submission-open{overflow:hidden}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:none}

/* responsive */
@media(max-width:1150px){
  :root{--container:1050px}
  .nav-links{gap:18px}.nav-phone{display:none}
  .hero-frame{grid-template-columns:1fr .82fr}.hero-copy{padding:46px}
  .audience-grid{grid-template-columns:repeat(2,1fr)}
  .process-track{grid-template-columns:repeat(3,1fr)}
  .process-track::before{display:none}.process-step{min-height:auto}.process-step:nth-child(even){justify-content:initial}.process-step:nth-child(even) .process-card{order:initial}.process-dot{order:-1;margin:0 0 10px}.process-card{min-height:150px}
  .footer-main{grid-template-columns:1fr 1fr}.footer-map-wrap{grid-column:1/-1}
}
@media(max-width:900px){
  :root{--section:74px;--header-h:68px}
  .container,.container-wide{width:min(calc(100% - 32px),var(--container))}
  .nav-links,.nav-actions>.btn,.nav-phone{display:none}.burger{display:flex}
  .hero{padding-top:20px}.hero-frame{display:block;min-height:0}.hero-copy{padding:42px 34px}.hero-trust{grid-template-columns:1fr}.hero-visual{min-height:430px}
  .audience-intro,.flow-grid,.about-mini,.contact-grid,.case-layout{grid-template-columns:1fr;gap:30px}
  .solution-panel.active{grid-template-columns:1fr}.solution-visual{min-height:260px}
  .flow-diagram{min-height:350px}.process-top{grid-template-columns:1fr;gap:15px}
  .case-grid,.pricing-grid,.info-grid,.blog-grid{grid-template-columns:1fr 1fr}.case-grid .case-card:last-child{grid-column:1/-1}
  .quiz-shell{grid-template-columns:1fr}.quiz-side{min-height:320px}.quiz-estimate{margin-top:25px}
  .price-card.featured{transform:none}
  .doc-list{grid-template-columns:1fr 1fr}.case-sidebar{position:static}.case-stats{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  :root{--section:62px;--header-h:64px}
  .container,.container-wide{width:min(calc(100% - 24px),var(--container))}
  .logo-mark{width:38px;height:38px}.logo-text{font-size:18px}.logo-text span{font-size:10px}
  .display-xxl{font-size:38px}.display-lg{font-size:31px}
  .hero-frame{border-radius:20px}.hero-frame::before,.hero-frame::after{display:none}.hero-copy{padding:34px 22px}.hero-visual{min-height:330px}.hero-badge{left:16px;right:16px;bottom:16px;max-width:none}.hero-cta .btn{width:100%}
  .audience-grid,.case-grid,.pricing-grid,.info-grid,.blog-grid,.term-grid,.doc-list{grid-template-columns:1fr}.case-grid .case-card:last-child{grid-column:auto}
  .audience-card{min-height:270px}.solution-copy,.solution-visual{padding:25px}.solution-list{grid-template-columns:1fr}.solution-actions .btn{width:100%}
  .flow-chain{grid-template-columns:1fr;gap:12px}.flow-arrow{width:2px;height:34px;margin:auto}.flow-arrow::after{right:-3px;top:auto;bottom:0;transform:rotate(135deg)}.flow-node{aspect-ratio:auto;min-height:145px}
  .flow-diagram{padding:24px}
  .process-top{padding:34px 24px 28px}.process-track{grid-template-columns:1fr;padding:25px}.process-step{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:start}.process-dot{margin:0}.process-card{min-height:0}.process-step:nth-child(even) .process-card{order:initial}
  .quiz-main,.quiz-side{padding:23px}.quiz-shell{min-height:0;border-radius:18px}.quiz-step h3{font-size:21px}.quiz-option{grid-template-columns:38px 1fr auto;padding:12px}.quiz-option-icon{width:38px;height:38px}.quiz-nav .btn{padding-inline:15px}.form-grid{grid-template-columns:1fr}
  .about-photo{min-height:330px}.footer-main{grid-template-columns:1fr}.footer-links-grid{grid-template-columns:1fr 1fr}.footer-bottom{display:grid}.case-stats{grid-template-columns:1fr 1fr}.case-stat strong{font-size:22px}
  .page-hero{padding:48px 0}.cases-head{display:block}.cases-head .btn{margin-top:20px}
}
@media(max-height:850px) and (min-width:901px){
  :root{--section:72px;--header-h:68px}
  .nav-bar{height:var(--header-h)}
  .hero{padding:22px 0 34px}.hero-frame{min-height:calc(100svh - var(--header-h) - 45px)}.hero-copy{padding:34px 42px}.display-xxl{font-size:clamp(40px,4.3vw,56px)}.hero-copy .lead{margin-top:16px;font-size:17px}.hero-trust{margin:20px 0 20px}.hero-badge{bottom:18px}.hero-visual{min-height:440px}
  .quiz-shell{min-height:540px}.quiz-main,.quiz-side{padding:27px}.quiz-progress{margin-bottom:19px}.quiz-option{padding:11px 13px}.quiz-nav{margin-top:16px;padding-top:15px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
@media(max-width:1050px){
  .nav-links,.nav-phone,.nav-actions>.btn{display:none}
  .burger{display:flex}
}
/* Final overlap and low-height refinements */
.audience-card{padding-bottom:66px;min-height:310px}
.case-cover .case-badge{position:absolute;top:16px;left:16px;display:block;margin:0;opacity:1;padding:6px 10px;z-index:4}
@media(max-height:850px) and (min-width:901px){
  #quiz.section{padding:30px 0}
  #quiz .section-head{margin-bottom:20px}
  #quiz .section-head .eyebrow{margin-bottom:7px}
  #quiz .section-head .display-lg{font-size:34px}
  #quiz .section-head p{margin-top:6px;font-size:14px}
  #quiz .quiz-shell{min-height:488px}
  #quiz .quiz-main,#quiz .quiz-side{padding:20px 22px}
  #quiz .quiz-progress{margin-bottom:14px}
  #quiz .quiz-step h3{font-size:21px}
  #quiz .quiz-step>p{margin-bottom:12px;font-size:12px}
  #quiz .quiz-options{gap:7px}
  #quiz .quiz-option{padding:8px 11px;grid-template-columns:36px 1fr auto;gap:10px}
  #quiz .quiz-option-icon{width:36px;height:36px}
  #quiz .quiz-nav{margin-top:12px;padding-top:12px}
  #quiz .quiz-nav .btn{min-height:42px;padding:10px 18px}
  #quiz .quiz-row{padding:8px 11px}
  #quiz .quiz-estimate{padding-top:16px}
  #quiz .quiz-estimate strong{font-size:22px}
  .page-hero{padding:44px 0 38px}
  .page-hero .display-xl{font-size:42px}
}
@media(max-width:640px){.audience-card{min-height:300px;padding-bottom:64px}}

/* ===== Serious visual system update ===== */
:root{
  --mint:#6f91b3;
  --mint-soft:#edf3f9;
  --amber:#8aa4c0;
  --amber-soft:#f4f7fa;
  --coral:#7890aa;
  --rose:#556b96;
  --r-sm:6px;
  --r-md:10px;
  --r-lg:14px;
  --r-xl:18px;
  --shadow:0 14px 38px rgba(20,42,83,.09);
  --shadow-soft:0 5px 18px rgba(20,42,83,.07);
}
.section-blue{background:linear-gradient(145deg,#edf4ff 0%,#f7faff 58%,#f1f5f9 100%)}
.section-amber,.section-white{background:#fff}
.btn{border-radius:7px}
.logo-mark{border-radius:7px}
.hero-frame,.process-shell{border-radius:18px}
.audience-card,.case-card,.price-card,.faq-item,.info-card,.term-card,.doc-item,.contact-card,.blog-card,.case-stat,.case-sidebar,.modal-dialog,.quiz-shell,.solution-panel,.flow-diagram,.flow-point,.service-fact-card,.wireframe-widget,.inline-form-card,.role-card,.standards-grid article{border-radius:12px}
.hero-badge,.solution-result,.price-result,.quiz-summary,.quiz-option,.quiz-option-icon,.about-point i,.contact-item i,.doc-item i{border-radius:8px}
.audience-icon,.solution-symbol,.flow-node,.process-card{border-radius:10px}
.nav-quick-link{font-size:13px;font-weight:800;color:var(--primary);white-space:nowrap}
.mobile-nav-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.floating-apply{position:fixed;right:22px;bottom:22px;z-index:900;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 18px;background:var(--ink);color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:7px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 14px 34px rgba(17,24,39,.25);transition:.2s}
.floating-apply:hover{color:#fff;background:#05070a;transform:translateY(-2px)}
.consent{display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--muted);font-weight:600}
.consent input{margin-top:3px;accent-color:var(--primary)}
.page-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}

/* Restrained functional accents: differentiation without a playful rainbow */
.audience-card.shop{--accent:#1454e8;--accent-soft:#eaf1ff}
.audience-card.service{--accent:#167aa4;--accent-soft:#eaf5f9}
.audience-card.build{--accent:#4771a8;--accent-soft:#edf2f8}
.audience-card.industry{--accent:#39475b;--accent-soft:#eef1f4}
.audience-card.farm{--accent:#4d748f;--accent-soft:#edf4f7}
.audience-card.other{--accent:#607092;--accent-soft:#f0f2f7}
.case-cover.clean{background:linear-gradient(135deg,#1687b5,#2b63d7)}
.case-cover.skt{background:linear-gradient(135deg,#4a5669,#202b3b)}
.case-cover.faberlic{background:linear-gradient(135deg,#6472a5,#34456f)}
.process-shell{background:radial-gradient(circle at 80% 80%,rgba(72,116,160,.18),transparent 34%),linear-gradient(140deg,#2b2f35,#171a1f 65%)}
.process-top .eyebrow,.process-output,.process-step:nth-child(n+4) .process-output{color:#98b7df}
.process-dot,.process-step:nth-child(n+4) .process-dot{background:#8eb4e2}

/* Services page */
.services-hero{background:linear-gradient(145deg,#eef4ff,#fff 68%)}
.service-jump{position:sticky;top:var(--header-h);z-index:70;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.service-jump .container{display:flex;gap:7px;overflow:auto;padding-top:10px;padding-bottom:10px;scrollbar-width:none}
.service-jump .container::-webkit-scrollbar{display:none}
.service-jump a{flex:0 0 auto;padding:8px 13px;border:1px solid var(--line);border-radius:6px;font-size:12px;font-weight:750;background:#fff}
.service-jump a:hover{border-color:var(--primary);background:var(--sky-2)}
.service-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:64px;align-items:start}
.service-layout.reverse{grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr)}
.service-content>p:not(.body-lg){color:var(--muted);margin-top:16px;line-height:1.72}
.service-explain{margin-top:28px}
.service-explain h3{font-size:20px;margin-bottom:15px}
.check-list{display:grid;gap:11px}
.check-list li{position:relative;padding:14px 16px 14px 40px;border:1px solid var(--line);background:#fff;font-size:14px;color:var(--muted)}
.check-list li::before{content:"✓";position:absolute;left:15px;top:14px;color:var(--primary);font-weight:900}
.check-list strong{color:var(--ink)}
.service-note{margin-top:20px;padding:16px 18px;border-left:3px solid var(--primary);background:var(--sky-2);color:var(--muted);font-size:13px}
.service-note strong{color:var(--ink)}
.service-fact-card{position:sticky;top:calc(var(--header-h) + 74px);padding:26px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-soft)}
.fact-kicker{display:block;color:var(--primary);font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;margin-bottom:15px}
.fact-row{display:flex;justify-content:space-between;gap:24px;padding:14px 0;border-bottom:1px solid var(--line);font-size:13px}
.fact-row span{color:var(--muted)}
.fact-row strong{text-align:right;max-width:190px}
.service-fact-card .btn{width:100%;margin-top:20px}
.service-inline-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:24px}
.interaction-hint{padding:15px 17px;border:1px solid var(--line);background:#fff}
.wireframe-widget{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;padding:18px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-soft)}
.wireframe-canvas{display:grid;gap:9px;padding:14px;background:var(--cloud);border:1px solid var(--line);border-radius:8px}
.wireframe-block{width:100%;padding:16px 13px;border:1px dashed #becbe0;background:#fff;color:#778398;text-align:center;font-size:12px;font-weight:750;cursor:pointer;transition:.18s}
.wireframe-block:hover,.wireframe-block.active{border-color:var(--primary);color:var(--primary);background:#f7faff;box-shadow:inset 3px 0 0 var(--primary)}
.wireframe-info-panel{padding:19px;border:1px solid var(--line);background:#f9fbfd;border-radius:8px}
.wireframe-step{display:block;color:var(--primary);font-size:10px;font-weight:850;letter-spacing:.09em;text-transform:uppercase;margin-bottom:10px}
.wireframe-info-panel h3{font-size:19px;line-height:1.28;margin-bottom:10px}
.wireframe-info-panel p{font-size:13px;line-height:1.62;color:var(--muted)}
.standards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-top:28px}
.standards-grid article{padding:20px;border:1px solid var(--line);background:#fff}
.standards-grid article>span{display:block;color:var(--primary);font-size:11px;font-weight:850;margin-bottom:17px}
.standards-grid h3{font-size:17px;margin-bottom:8px}
.standards-grid p{font-size:13px!important;line-height:1.55!important;margin:0!important;color:var(--muted)}

/* ROI calculator */
.roi-container{display:grid;grid-template-columns:1.05fr .95fr;gap:0;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);overflow:hidden;border-radius:12px}
.roi-calc-panel{padding:48px;display:flex;flex-direction:column;justify-content:center;gap:30px}
.roi-slider-header{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:12px;font-size:14px;font-weight:750}
.roi-slider-header strong{color:var(--primary);font-size:17px;white-space:nowrap}
.roi-slider-group input[type=range]{width:100%;accent-color:var(--primary);cursor:pointer}
.roi-assumptions{display:flex;gap:7px;flex-wrap:wrap;padding:14px 16px;background:var(--cloud);border:1px solid var(--line);font-size:12px;color:var(--muted)}
.roi-assumptions strong{color:var(--ink)}
.roi-results-panel{padding:40px;background:linear-gradient(145deg,#edf4ff,#f7faff);border-left:1px solid var(--line)}
.roi-metrics-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.roi-metric-box,.roi-grand-total,.roi-roi{padding:20px;border:1px solid var(--line);background:#fff;text-align:center}
.roi-metric-box span,.roi-grand-total span,.roi-roi span{display:block;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;margin-bottom:8px}
.roi-metric-box strong{font-size:22px}
.roi-grand-total{margin-top:15px;border-color:#9dbcf7;padding:26px}
.roi-grand-total strong{display:block;color:#0f9f75;font-size:34px}
.roi-roi{margin-top:15px}
.roi-roi strong{display:block;color:#0f9f75;font-size:27px}
.roi-disclaimer{font-size:11px;color:#8190a7;margin-top:16px;line-height:1.55}

/* Inline lead forms */
.lead-cta{padding:86px 0;background:linear-gradient(145deg,#eef4ff,#f8fbff);border-top:1px solid var(--line)}
.lead-cta-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:64px;align-items:center}
.lead-cta-copy .body-lg{margin-top:16px;max-width:720px}
.lead-points{display:grid;gap:13px;margin-top:26px}
.lead-points li{display:flex;gap:11px;align-items:flex-start;font-weight:700;font-size:14px}
.lead-points li::before{content:"✓";color:var(--primary);font-weight:900}
.inline-form-card{padding:30px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-soft)}
.inline-form-card h3{font-size:22px;margin-bottom:20px}
.inline-form-card .btn{width:100%}

/* Cases and GitHub */
.case-grid-rich .case-card{min-height:100%}
.case-proof{display:grid;gap:8px;margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.case-proof>div{display:grid;grid-template-columns:78px 1fr;gap:10px;font-size:11px}
.case-proof span{color:var(--muted);text-transform:uppercase;font-weight:800}
.case-proof strong{font-size:12px;line-height:1.45}
.github-trust{padding:72px 0;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.github-trust-inner{display:grid;grid-template-columns:84px 1fr auto;gap:30px;align-items:center}
.github-mark{width:84px;height:84px;display:grid;place-items:center;border:1px solid var(--line);background:var(--cloud);color:var(--primary);font-size:26px;font-weight:850;border-radius:12px}
.github-trust .body-md{max-width:780px;margin-top:12px}

/* Expanded about */
.about-story{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
.about-story .about-photo{min-height:520px}
.about-story-copy>p{color:var(--muted);line-height:1.72;margin-top:16px}
.about-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
.about-metrics>div{padding:18px;border:1px solid var(--line);background:#fff}
.about-metrics strong{display:block;color:var(--primary);font-size:26px}
.about-metrics span{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.role-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.role-card{padding:28px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-soft)}
.role-card>span{display:block;color:var(--primary);font-size:11px;font-weight:850;margin-bottom:22px}
.role-card h3{font-size:22px;margin-bottom:12px}
.role-card p{color:var(--muted);font-size:14px;line-height:1.65}
.role-card ul{display:grid;gap:9px;margin-top:18px}
.role-card li{font-size:13px;font-weight:650;display:flex;gap:9px}
.role-card li::before{content:"—";color:var(--primary)}
.standards-wide{grid-template-columns:repeat(4,1fr)}
.about-final{display:flex;justify-content:space-between;gap:40px;align-items:center;margin-top:42px;padding:28px;border:1px solid var(--line);background:var(--cloud)}
.about-final p{max-width:760px;margin-top:9px}
.about-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:24px}

/* Low-height desktop refinements */
@media(max-height:850px) and (min-width:901px){
  .service-detail.section{padding:58px 0}
  .service-content .display-lg{font-size:38px}
  .roi-section.section{padding:58px 0}
  .roi-calc-panel{padding:34px 42px;gap:24px}
  .roi-results-panel{padding:30px}
  .lead-cta{padding:62px 0}
}

@media(max-width:1150px){
  .service-layout,.service-layout.reverse{grid-template-columns:1fr .72fr;gap:34px}
  .wireframe-widget{grid-template-columns:1fr}
  .github-trust-inner{grid-template-columns:72px 1fr}.github-trust-inner>.btn{grid-column:2}
  .standards-wide{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .nav-quick-link{display:none}
  .service-jump{top:var(--header-h)}
  .service-layout,.service-layout.reverse,.roi-container,.lead-cta-grid,.about-story{grid-template-columns:1fr}
  .service-fact-card{position:static;order:2}
  .service-layout.reverse .service-fact-card{order:2}
  .roi-results-panel{border-left:0;border-top:1px solid var(--line)}
  .case-grid-rich{grid-template-columns:1fr}
  .case-grid-rich .case-card:last-child{grid-column:auto}
  .github-trust-inner{grid-template-columns:64px 1fr;gap:20px}.github-mark{width:64px;height:64px}.github-trust-inner>.btn{grid-column:1/-1;justify-self:start}
  .role-grid{grid-template-columns:1fr}
  .about-story .about-photo{min-height:420px}
}
@media(max-width:640px){
  .floating-apply{right:12px;bottom:12px;min-height:40px;padding:9px 13px;font-size:10px}
  .mobile-nav-actions{grid-template-columns:1fr}
  .page-hero-actions .btn,.service-inline-actions .btn,.about-actions .btn{width:100%}
  .service-jump .container{width:100%;padding-left:12px;padding-right:12px}
  .service-layout{gap:28px}
  .service-content .display-lg{font-size:30px}
  .standards-grid,.standards-wide,.about-metrics{grid-template-columns:1fr}
  .wireframe-widget{padding:12px}
  .wireframe-info-panel{padding:16px}
  .roi-calc-panel,.roi-results-panel{padding:24px 18px}
  .roi-metrics-grid{grid-template-columns:1fr}
  .roi-grand-total strong{font-size:28px}
  .lead-cta{padding:62px 0}
  .inline-form-card{padding:22px}
  .github-trust{padding:54px 0}.github-trust-inner{grid-template-columns:1fr}.github-mark{width:54px;height:54px}.github-trust-inner>.btn{grid-column:auto;width:100%}
  .about-story .about-photo{min-height:330px}
  .about-final{display:grid;padding:22px}.about-final .btn{width:100%}
  .fact-row{display:grid;gap:5px}.fact-row strong{text-align:left;max-width:none}
}

/* Header fit for common 1366–1440 px notebook screens */
.nav-links a{white-space:nowrap}
@media(max-width:1400px) and (min-width:1051px){
  .nav-phone{display:none}
  .nav-bar{gap:18px}
  .nav-links{gap:18px}
  .nav-links a{font-size:13px}
}

/* =========================================================
   REF WEB — FINAL STRICT BLUE / BLACK / WHITE DESIGN PASS
   ========================================================= */
:root{
  --primary:#1454e8;
  --primary-2:#2f72ff;
  --primary-deep:#0b2e84;
  --sky:#dce9ff;
  --sky-2:#f1f6ff;
  --ink:#101827;
  --ink-2:#202938;
  --graphite:#20242b;
  --muted:#606b7c;
  --line:#d7e0ee;
  --line-strong:#bcc9dc;
  --paper:#fff;
  --cloud:#f5f7fb;
  --cloud-blue:#eef4ff;
  --dark:#15181d;
  --dark-2:#22262d;
  --header-h:68px;
  --r-sm:2px;
  --r-md:3px;
  --r-lg:4px;
  --r-xl:4px;
}
.section-blue{background:linear-gradient(145deg,#edf4ff 0%,#f8fbff 70%,#fff 100%)}
.section-amber{background:#fff}

/* Strict geometry */
.hero-frame,.process-shell,.audience-card,.case-card,.price-card,.faq-item,.info-card,.term-card,.doc-item,.contact-card,.blog-card,.case-stat,.case-sidebar,.modal-dialog,.quiz-shell,.solution-panel,.flow-diagram,.flow-point,.service-fact-card,.wireframe-widget,.inline-form-card,.role-card,.standards-grid article,.roi-container,.roi-metric-box,.roi-grand-total,.roi-roi,.field input,.field textarea,.field select,.service-jump a,.hero-badge,.solution-result,.price-result,.quiz-summary,.quiz-option,.quiz-option-icon,.about-point i,.contact-item i,.doc-item i,.modal-close,.toast{border-radius:0!important}
.btn,.btn-sm,.burger,.logo-mark,.price-badge,.floating-apply{border-radius:2px!important}
.case-badge{border-radius:2px!important}

/* Compact header */
.nav-bar{height:68px;gap:15px}
.logo{gap:10px}
.logo-mark{width:39px;height:39px;font-size:13px}
.logo-text{font-size:18px}.logo-text span{font-size:10px;margin-top:4px}
.nav-links{gap:19px}
.nav-links a{font-size:13px;padding:24px 0 21px}
.nav-links a::after{bottom:15px}
.nav-actions{gap:10px}
.nav-phone{font-size:12.5px}
.nav-quick-link{font-size:12px;font-weight:800;color:var(--primary)}
.nav-actions .btn-sm{min-height:40px;padding:9px 15px;font-size:11px}

/* Buttons only blue / black / white */
.btn{border-radius:2px;background-image:none}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 10px 24px rgba(20,84,232,.19)}
.btn-primary:hover{background:#0f48cf;box-shadow:0 14px 30px rgba(20,84,232,.28)}
.btn-dark{background:#11151b;color:#fff}
.btn-outline{background:#fff;border-color:var(--primary);color:var(--primary)}
.btn-ghost{background:#fff;border-color:var(--line-strong)}

/* HERO V2 */
.hero-v2{padding:0;background:#fff;border-bottom:1px solid var(--line)}
.hero-v2-grid{min-height:calc(100svh - var(--header-h));display:grid;grid-template-columns:minmax(0,1.02fr) minmax(520px,.98fr);align-items:center;gap:58px;padding:56px 4.2vw 58px;background:linear-gradient(105deg,#fff 0%,#fff 60%,#f5f8fd 100%);position:relative;overflow:hidden}
.hero-v2-copy{position:relative;z-index:3;max-width:780px}
.hero-v2-title{font-size:clamp(56px,5.65vw,90px);font-weight:650;line-height:.99;letter-spacing:-.055em;color:#101820}
.hero-v2-title span{color:var(--primary)}
.hero-v2-lead{max-width:700px;margin-top:30px;font-size:clamp(17px,1.25vw,21px)}
.hero-v2-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.hero-v2-benefits{margin-top:36px;padding-top:26px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.hero-v2-benefits>div{display:flex;gap:10px;align-items:flex-start}
.hero-check{flex:0 0 34px;width:34px;height:34px;display:grid;place-items:center;background:var(--primary);color:#fff;font-weight:900;font-size:17px}
.hero-v2-benefits strong{display:block;font-size:13px;line-height:1.35}
.hero-v2-benefits small{display:block;color:var(--muted);font-size:10.5px;line-height:1.45;margin-top:4px}
.hero-analytics-wrap{position:relative;min-height:600px;display:grid;place-items:center;perspective:1400px;isolation:isolate}
.hero-orbit{position:absolute;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,#dce9ff 0 58%,transparent 59%);border:1px solid #cfddf3;animation:heroOrbit 16s linear infinite;z-index:-1}
.hero-orbit::before,.hero-orbit::after{content:"";position:absolute;background:var(--primary)}
.hero-orbit::before{width:78px;height:78px;left:-20px;top:58px}
.hero-orbit::after{width:52px;height:52px;right:10px;bottom:40px;background:#11151b}
.hero-analytics{width:min(100%,550px);height:370px;cursor:pointer;perspective:1300px;position:relative;z-index:2;outline-offset:7px}
.hero-analytics-inner{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .72s cubic-bezier(.2,.7,.2,1),filter .25s,scale .25s}
.hero-analytics:hover .hero-analytics-inner,.hero-analytics:focus-visible .hero-analytics-inner{scale:1.035;filter:drop-shadow(0 28px 36px rgba(12,31,68,.25));transform:rotateZ(-1.2deg) rotateY(3deg)}
.hero-analytics.is-flipped .hero-analytics-inner{transform:rotateY(180deg)!important}
.analytics-face{position:absolute;inset:0;padding:34px 38px;background:#101e2b;color:#fff;border:1px solid #213b52;backface-visibility:hidden;box-shadow:0 30px 65px rgba(15,34,65,.25);display:flex;flex-direction:column;text-align:left}
.analytics-front{transform:rotateZ(1.6deg)}
.analytics-back{transform:rotateY(180deg) rotateZ(-1deg);background:#11151b}
.analytics-top{display:flex;justify-content:space-between;align-items:center;color:#c8d5e5;font-size:13px}
.analytics-top strong{font-size:17px;color:#fff}
.analytics-chart{height:165px;margin:28px 0 22px;display:flex;align-items:flex-end;gap:18px;border-bottom:1px solid rgba(255,255,255,.22);background:repeating-linear-gradient(to top,transparent 0 39px,rgba(255,255,255,.06) 40px)}
.analytics-chart i{display:block;flex:1;height:0;background:linear-gradient(180deg,#4b86ff,#1454e8);transform-origin:bottom;box-shadow:0 0 22px rgba(47,114,255,.25)}
.hero-analytics.is-visible .analytics-chart i{animation:growBar .85s cubic-bezier(.2,.75,.25,1) forwards;animation-delay:calc(var(--i,0)*.08s)}
.analytics-chart i:nth-child(1){--i:1}.analytics-chart i:nth-child(2){--i:2}.analytics-chart i:nth-child(3){--i:3}.analytics-chart i:nth-child(4){--i:4}.analytics-chart i:nth-child(5){--i:5}.analytics-chart i:nth-child(6){--i:6}.analytics-chart i:nth-child(7){--i:7}
.analytics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.analytics-grid small{display:block;color:#96a9be;font-size:10px;text-transform:uppercase;letter-spacing:.05em}
.analytics-grid strong{display:block;font-size:24px;margin-top:5px}
.analytics-hint{margin-top:auto;padding-top:14px;color:#9fb5cd;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.analytics-back-label{font-size:12px;color:#80a8ff;text-transform:uppercase;font-weight:800;letter-spacing:.08em}
.analytics-pipeline{margin-top:30px;display:grid;gap:14px}
.analytics-pipeline>span{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:14px;border:1px solid #38404c;background:#181d24}
.analytics-pipeline b{grid-row:1/3;font-size:18px;color:#5d91ff}
.analytics-pipeline em{font-style:normal;font-weight:800}
.analytics-pipeline small{color:#9ba8b8;font-size:11px}
.analytics-callout{position:absolute;z-index:4;left:3%;bottom:82px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px rgba(25,45,85,.14);padding:15px 19px;display:flex;gap:12px;align-items:center;animation:calloutFloat 4s ease-in-out infinite}
.analytics-callout>span{font-size:22px;color:var(--primary)}
.analytics-callout strong{display:block;font-size:13px}.analytics-callout small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
@keyframes growBar{to{height:var(--bar)}}
@keyframes heroOrbit{to{transform:rotate(360deg)}}
@keyframes calloutFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* AUDIENCES: tighter and only blue tonal differences */
#audiences{padding:66px 0}
.audience-intro{grid-template-columns:.82fr 1.18fr;gap:38px;margin-bottom:25px;align-items:center}
.audience-hint{padding:18px 22px;background:#fff;border-left:3px solid var(--primary);box-shadow:none}
.audience-grid{gap:15px}
.audience-card{min-height:300px;padding:22px 22px 72px;border-radius:0!important;box-shadow:none}
.audience-card::before{width:102px;height:102px;right:-34px;top:-34px;background:#eaf1ff!important}
.audience-card:hover,.audience-card:focus-visible{transform:translateY(-4px);box-shadow:0 14px 32px rgba(20,52,105,.11);border-color:var(--primary)}
.audience-icon{width:50px;height:50px;border-radius:0!important;background:#edf3ff!important;color:var(--primary)!important}
.audience-card h3{font-size:19px;margin-top:17px}
.audience-card p{font-size:13px;margin-top:8px;line-height:1.5}
.audience-tags{margin-top:14px}.audience-tags span{background:#f0f5ff!important;color:#174da8!important;border-radius:2px!important;font-size:10px}
.audience-action{left:22px;right:22px;bottom:22px;margin-top:0;font-size:12px}

/* HOW V2 */
.how-v2{padding:76px 0;background:#fff}
.how-v2-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:58px;align-items:center}
.how-v2-copy{align-self:center;max-width:580px}
.how-v2-copy p{margin-top:22px}
.how-v2-system{border:1px solid var(--line);padding:34px;background:#f7faff}
.flow-chain-v2{display:grid;grid-template-columns:1fr 52px 1fr 52px 1fr;align-items:center;gap:0}
.flow-chain-v2 .flow-node{min-height:165px;aspect-ratio:auto;border-radius:0!important;background:#fff}
.flow-chain-v2 .flow-node:hover{transform:translateY(-4px);box-shadow:0 12px 25px rgba(20,84,232,.11)}
.flow-points-v2{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}
.flow-points-v2 .flow-point{padding:15px;display:grid;grid-template-columns:34px 1fr;gap:10px;background:#fff}
.flow-points-v2 .flow-point:hover{transform:translateY(-3px)}
.flow-points-v2 .num{width:34px;height:34px;border-radius:0;background:#111827}
.flow-points-v2 strong{font-size:13px}.flow-points-v2 span:not(.num){font-size:10.5px}

/* PROCESS V2 */
.process-v2-section{padding:30px 0 78px;background:#fff}
.process-v2{background:radial-gradient(circle at 82% 80%,rgba(20,84,232,.16),transparent 34%),linear-gradient(145deg,#242931,#12151a 68%);color:#fff;border:1px solid #343b46;padding:52px;overflow:hidden}
.process-v2-head{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:end;padding-bottom:38px;border-bottom:1px solid rgba(255,255,255,.12)}
.process-v2-head .eyebrow{color:#79a5ff}.process-v2-head p{color:#b9c3d1;max-width:530px;font-size:15px}
.process-v2-body{padding-top:48px}
.process-slider-wrap{position:relative;padding:0 28px 48px}
.process-progress-line{position:absolute;left:51px;right:51px;top:26px;height:3px;background:#4b525e}
.process-progress-line span{display:block;width:0;height:100%;background:var(--primary);transition:width .25s ease}
.process-range{position:absolute;left:42px;right:42px;top:13px;width:calc(100% - 84px);height:29px;opacity:0;cursor:grab;z-index:5}
.process-range:active{cursor:grabbing}
.process-markers{display:grid;grid-template-columns:repeat(6,1fr);position:relative;z-index:3}
.process-marker{color:#aeb9c8;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:12px;font-size:11px;font-weight:700;transition:.2s}
.process-marker b{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#242a32;border:5px solid #11151a;color:#b8c5d6;box-shadow:0 0 0 1px #4b5563;transition:.2s}
.process-marker.active{color:#fff}.process-marker.active b{background:var(--primary);color:#fff;box-shadow:0 0 0 7px rgba(20,84,232,.2);transform:scale(1.08)}
.process-marker:hover b{border-color:#1a2029;transform:scale(1.08)}
.process-stage-card{display:grid;grid-template-columns:1.25fr .8fr auto;gap:28px;align-items:center;border:1px solid #3c4654;background:#171b21;padding:25px 28px;min-height:132px}
.process-stage-index{display:block;color:#79a5ff;text-transform:uppercase;font-size:10px;font-weight:800;letter-spacing:.09em}
.process-stage-card h3{font-size:25px;margin:6px 0}.process-stage-card p{color:#aeb9c8;font-size:13px}
.process-stage-result{border-left:1px solid #39424e;padding-left:28px}.process-stage-result small{display:block;color:#91a0b3;text-transform:uppercase;font-size:9px;letter-spacing:.08em}.process-stage-result strong{display:block;margin-top:8px;font-size:14px}
.btn-outline-light{border-color:#657184;color:#fff;background:transparent}.btn-outline-light:hover{background:#fff;color:#111827}
.process-modal{position:fixed;inset:0;z-index:2500;background:rgba(6,9,13,.82);display:none;align-items:center;justify-content:center;padding:30px;backdrop-filter:blur(8px)}
.process-modal.open{display:flex;animation:modalFade .2s ease}
.process-modal-dialog{position:relative;width:min(100%,1120px);max-height:calc(100vh - 60px);overflow:auto;background:#fff;padding:50px;color:var(--ink);border:1px solid var(--line)}
.process-modal-close{position:absolute;right:20px;top:18px;width:42px;height:42px;border:1px solid var(--line);cursor:pointer;font-size:25px;background:#fff}
.process-modal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin:30px 0}
.process-modal-grid>div{background:#fff;padding:28px}.process-modal-grid h3{font-size:14px;margin-bottom:11px;color:var(--primary)}.process-modal-grid p{color:var(--muted)}
@keyframes modalFade{from{opacity:0}to{opacity:1}}

/* QUIZ — restore HP proportions and clarity */
#quiz.section{padding:72px 0;background:#fff}
#quiz .section-head{margin-bottom:32px}
#quiz .section-head .display-lg{font-size:clamp(35px,3vw,47px)}
.quiz-shell{grid-template-columns:minmax(0,1.35fr) minmax(380px,.88fr);min-height:610px;border:1px solid var(--line);background:#fff;box-shadow:0 18px 48px rgba(28,54,99,.08)}
.quiz-main{padding:34px 40px}.quiz-side{padding:34px 38px;min-height:610px;background:#24272d!important;color:#fff}
.quiz-side p{color:#bcc4cf}.quiz-summary{border-color:#444a54;background:#2d3138}
.quiz-row{padding:13px 15px;border-color:#454b55}.quiz-row span{color:#b4bdca}.quiz-row strong{color:#fff}
.quiz-estimate{margin-top:auto}.quiz-estimate small{color:#8ea8d8}.quiz-estimate strong{font-size:28px;color:#fff}
.quiz-progress{height:4px;gap:10px;margin-bottom:27px}.quiz-progress span{height:4px;border-radius:0}
.quiz-step h3{font-size:26px}.quiz-step>p{font-size:14px;margin:7px 0 19px}
.quiz-options{gap:10px}.quiz-option{padding:13px 16px;grid-template-columns:48px 1fr auto;gap:15px;min-height:72px}
.quiz-option:hover{border-color:#8dadf4;background:#f7faff;transform:none}
.quiz-option.selected{border-color:var(--primary);background:#eef4ff}
.quiz-option-icon{width:48px;height:48px;background:#f2f5f9;color:var(--primary);display:grid;place-items:center}
.quiz-option-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.quiz-option strong{font-size:15px}.quiz-option small{font-size:11px;color:var(--muted)}
.quiz-nav{margin-top:19px;padding-top:18px}
.prefill-note{border-radius:0}

/* Packages: intentional hover, no cursor-follow */
.price-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;background:#fff}
.price-card:hover{transform:translateY(-10px) scale(1.018);box-shadow:0 24px 50px rgba(20,52,105,.17);border-color:#8caef7;z-index:3}
.price-card.featured{transform:translateY(-8px)}
.price-card.featured:hover{transform:translateY(-14px) scale(1.025)}

/* Services — no sticky/following panels */
.service-jump{position:static!important;top:auto!important;backdrop-filter:none;background:#fff}
.service-jump .container{padding-top:10px;padding-bottom:10px}
.service-fact-card,.case-sidebar{position:static!important;top:auto!important}
.services-hero{background:linear-gradient(135deg,#eef4ff,#fff 70%)}
.service-detail{padding:82px 0}
.service-layout{grid-template-columns:minmax(0,1.38fr) minmax(390px,.72fr);gap:64px;align-items:start}
.service-content>p{max-width:850px}
.service-fact-card{padding:30px;box-shadow:0 16px 38px rgba(28,54,99,.09)}
.service-fact-card .btn{width:100%}
.wireframe-widget{grid-template-columns:minmax(270px,.9fr) minmax(230px,.75fr);gap:22px;padding:24px;background:#fff;box-shadow:0 16px 38px rgba(28,54,99,.08)}
.wireframe-canvas,.wireframe-info-panel{border-radius:0!important}
.wireframe-block{padding:18px 14px;min-height:76px;border-radius:0!important;background:#fff}
.wireframe-block.active{border:2px solid var(--primary);background:#f1f6ff;color:var(--primary)}
.wireframe-info-panel{padding:24px;background:#f4f7fb;border:1px solid var(--line)}
.standards-grid article{background:#fff}
.roi-section{background:#f1f5fb}
.roi-container{display:grid;grid-template-columns:1.08fr .92fr;border:1px solid var(--line);background:#fff;box-shadow:0 18px 48px rgba(28,54,99,.08);overflow:hidden}
.roi-calc-panel{padding:48px}.roi-results-panel{padding:42px;background:#edf4ff;border-left:1px solid var(--line)}
.roi-slider-group{margin-bottom:38px}.roi-slider-header{font-size:14px;margin-bottom:15px}.roi-slider-header strong{font-size:18px;color:var(--primary)}
.roi-slider-group input[type=range]{appearance:none;height:10px;background:linear-gradient(90deg,var(--primary) 0 var(--range-progress,0%),#d7deea var(--range-progress,0%) 100%);border:1px solid #c3cfdf;outline:none;border-radius:0!important}
.roi-slider-group input[type=range]::-webkit-slider-thumb{appearance:none;width:28px;height:28px;border-radius:50%;background:#fff;border:8px solid var(--primary);box-shadow:0 4px 13px rgba(20,84,232,.24)}
.roi-slider-group input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:7px solid var(--primary)}
.roi-assumptions{padding:18px;border:1px solid var(--line);background:#f7f9fc}
.roi-metrics-grid{gap:14px}.roi-metric-box{padding:25px;background:#fff;border:1px solid var(--line)}
.roi-grand-total{padding:30px;background:#fff;border:2px solid var(--primary);margin:18px 0}.roi-grand-total strong{color:var(--primary)!important;font-size:39px}
.roi-roi{padding:24px;background:#fff;border:1px solid var(--line)}.roi-roi strong{color:var(--primary)!important}
.roi-disclaimer{color:#718096}

/* Contacts */
.contact-grid{align-items:stretch}
.contact-card{padding:34px;border:1px solid var(--line);box-shadow:0 14px 34px rgba(28,54,99,.07)}
.contact-item i{width:52px;height:52px;background:#edf4ff;color:var(--primary);display:grid;place-items:center;font-style:normal}
.contact-item i svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Remove any perceived following behavior */
[data-snap]{scroll-snap-align:none!important}
.floating-apply{display:none!important}

/* Responsive */
@media(max-width:1280px){
  .nav-links{gap:14px}.nav-links a{font-size:12px}.nav-phone{display:none}
  .hero-v2-grid{grid-template-columns:1fr 500px;gap:24px;padding-inline:34px}
  .hero-v2-title{font-size:58px}.hero-v2-benefits{gap:10px}
  .process-v2{padding:42px 34px}
}
@media(max-width:1050px){
  .nav-links{display:none}.burger{display:flex}
  .hero-v2-grid{grid-template-columns:1fr;min-height:auto;padding:58px 34px 40px}
  .hero-v2-copy{max-width:850px}.hero-analytics-wrap{min-height:520px}
  .hero-v2-benefits{grid-template-columns:repeat(3,1fr)}
  .how-v2-grid{grid-template-columns:1fr}.how-v2-copy{max-width:760px}
  .process-v2-head{grid-template-columns:1fr;gap:20px}
  .process-stage-card{grid-template-columns:1fr 1fr}.process-stage-card .btn{grid-column:1/-1;justify-self:start}
  .quiz-shell{grid-template-columns:1fr}.quiz-side{min-height:330px}.quiz-estimate{margin-top:28px}
  .service-layout{grid-template-columns:1fr}.service-fact-card{max-width:none}
  .roi-container{grid-template-columns:1fr}.roi-results-panel{border-left:0;border-top:1px solid var(--line)}
}
@media(max-width:760px){
  :root{--header-h:62px;--section:66px}
  .container,.container-wide{width:min(calc(100% - 28px),var(--container))}
  .nav-bar{height:62px}.logo-mark{width:36px;height:36px}.logo-text{font-size:16px}.nav-quick-link{display:none}
  .hero-v2-grid{padding:42px 20px 30px}.hero-v2-title{font-size:clamp(43px,13vw,60px)}.hero-v2-lead{margin-top:22px}.hero-v2-actions .btn{width:100%}
  .hero-v2-benefits{grid-template-columns:1fr}.hero-analytics-wrap{min-height:440px}.hero-analytics{height:325px}.analytics-face{padding:25px}.analytics-chart{height:135px;gap:10px}.analytics-grid strong{font-size:19px}.hero-orbit{width:340px;height:340px}.analytics-callout{left:0;bottom:25px}
  .audience-intro{grid-template-columns:1fr;gap:20px}.audience-grid{grid-template-columns:1fr}.audience-card{min-height:0}
  .how-v2-system{padding:20px}.flow-chain-v2{grid-template-columns:1fr;gap:10px}.flow-chain-v2 .flow-arrow{width:2px;height:30px}.flow-points-v2{grid-template-columns:1fr}
  .process-v2{padding:34px 18px}.process-v2-head .display-xl{font-size:38px}.process-slider-wrap{overflow-x:auto;padding:0 10px 40px}.process-progress-line,.process-range,.process-markers{min-width:680px}.process-stage-card{grid-template-columns:1fr}.process-stage-result{border-left:0;border-top:1px solid #39424e;padding:18px 0 0}.process-modal-dialog{padding:36px 20px}.process-modal-grid{grid-template-columns:1fr}
  #quiz.section{padding:55px 0}.quiz-main,.quiz-side{padding:24px 18px}.quiz-option{grid-template-columns:44px 1fr;min-height:68px}.quiz-option::after{display:none}.quiz-option-icon{width:44px;height:44px}.quiz-nav{gap:10px}.quiz-nav .btn{padding-inline:14px}
  .wireframe-widget{grid-template-columns:1fr;padding:14px}.service-detail{padding:62px 0}
  .roi-calc-panel,.roi-results-panel{padding:28px 20px}.roi-metrics-grid{grid-template-columns:1fr}.roi-grand-total strong{font-size:32px}
  .pricing-grid{grid-template-columns:1fr}.price-card.featured,.price-card.featured:hover{transform:none}
  .contact-card{padding:25px 20px}
}
@media(max-height:820px) and (min-width:1060px){
  .hero-v2-grid{min-height:auto;padding-top:42px;padding-bottom:42px}.hero-v2-title{font-size:58px}.hero-analytics-wrap{min-height:500px}.hero-analytics{height:335px}.hero-v2-benefits{margin-top:24px;padding-top:20px}.hero-v2-lead{margin-top:20px}.hero-v2-actions{margin-top:24px}
  #quiz.section{padding:50px 0}.quiz-shell{min-height:560px}.quiz-main,.quiz-side{padding-top:27px;padding-bottom:27px}.quiz-option{min-height:62px;padding-top:10px;padding-bottom:10px}.quiz-step>p{margin-bottom:14px}
}

/* final fit corrections */
:root{
  --mint:#4f7ecf;
  --mint-soft:#eef4ff;
  --amber:#6e93d8;
  --amber-soft:#f3f7ff;
  --coral:#3d6fc8;
  --rose:#284d96;
}
.page-hero{background:linear-gradient(145deg,#eef4ff,#fff 72%)}
.hero-v2-actions{gap:9px}
.hero-v2-actions .btn{min-height:46px;padding:11px 16px;font-size:11px}
#landing .service-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:46px}
.wireframe-widget{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);min-width:0}
.wireframe-canvas,.wireframe-info-panel{min-width:0}
@media(max-width:1050px){#landing .service-layout{grid-template-columns:1fr}}
.audience-card{min-height:312px;padding:24px 24px 80px}
.audience-action{left:24px;right:24px;bottom:24px;margin-top:0}
@media(max-width:760px){.audience-card{min-height:0;padding-bottom:62px}}
.process-range{z-index:2}
@media(max-height:900px) and (min-width:1060px){
  .hero-v2-grid{min-height:calc(100svh - var(--header-h));padding-top:34px;padding-bottom:34px}
  .hero-v2-title{font-size:clamp(52px,4.45vw,68px)}
  .hero-v2-lead{margin-top:18px;font-size:17px}
  .hero-v2-actions{margin-top:22px}
  .hero-v2-benefits{margin-top:22px;padding-top:18px}
  .hero-analytics-wrap{min-height:500px}
  .hero-analytics{height:335px}
  .analytics-chart{height:138px;margin:22px 0 18px}
  .analytics-face{padding:28px 32px}
  .analytics-callout{bottom:62px}
}
.case-stat{min-width:0}.case-stat strong{overflow-wrap:anywhere}
@media(max-width:480px){.case-stats{grid-template-columns:1fr}}


/* =========================================================
   REF WEB — enhancement layer (book scroll, cases, accents)
   ========================================================= */

/* Reading progress bar (top of viewport, like a book ribbon) */
.read-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:1200;pointer-events:none}
.read-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--primary),#3b82f6,#38bdf8,var(--primary-2));background-size:220% 100%;box-shadow:0 0 14px rgba(20,84,232,.55);animation:readShine 3.2s linear infinite;transition:width .12s linear}
@keyframes readShine{to{background-position:220% 0}}

/* Chapter navigation — vertical index, fixed on the right */
.chapter-nav{position:fixed;right:16px;top:50%;transform:translateY(-50%);z-index:900;display:flex;flex-direction:column;gap:13px;padding:13px 8px;border-radius:99px;background:rgba(255,255,255,.72);backdrop-filter:blur(10px);border:1px solid rgba(207,217,233,.7);box-shadow:0 12px 34px rgba(20,42,83,.14)}
.chapter-nav a{position:relative;width:11px;height:11px;border-radius:50%;background:#c6d1e2;transition:transform .25s ease,background .25s ease,box-shadow .25s ease;display:block}
.chapter-nav a:hover{background:var(--primary-2);transform:scale(1.3)}
.chapter-nav a.active{background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:0 0 0 4px rgba(20,84,232,.18);transform:scale(1.2)}
.chapter-nav a::after{content:attr(data-label);position:absolute;right:22px;top:50%;transform:translateY(-50%) translateX(6px);white-space:nowrap;background:var(--ink);color:#fff;font-size:11px;font-weight:700;letter-spacing:.03em;padding:5px 9px;border-radius:7px;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.chapter-nav a:hover::after{opacity:1;transform:translateY(-50%) translateX(0)}
@media(max-width:1100px){.chapter-nav{display:none}}

/* Reveal — richer "turning the page" entrances, variants + cascade delay */
.reveal{transition:opacity .72s cubic-bezier(.2,.7,.2,1),transform .72s cubic-bezier(.2,.7,.2,1),filter .72s ease;transition-delay:var(--d,0s);will-change:opacity,transform}
.reveal[data-reveal="left"]{transform:translateX(-48px)}
.reveal[data-reveal="right"]{transform:translateX(48px)}
.reveal[data-reveal="scale"]{transform:scale(.9)}
.reveal[data-reveal="blur"]{transform:translateY(26px);filter:blur(11px)}
.reveal[data-reveal="flip"]{transform:perspective(1000px) rotateX(13deg);transform-origin:top center}
.reveal.visible{filter:none}
[data-stagger]>.reveal{transition-delay:var(--d,0s)}

/* Accent — gradient text + animated marker highlight */
.grad-text{background:linear-gradient(120deg,var(--primary) 0%,#3b82f6 45%,#60a5fa 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-v2-title span{background:linear-gradient(120deg,var(--primary),#3b82f6 55%,#38bdf8);-webkit-background-clip:text;background-clip:text;color:transparent}
.mark{background-image:linear-gradient(90deg,rgba(59,130,246,.32),rgba(34,211,238,.24));background-repeat:no-repeat;background-position:0 86%;background-size:0% .44em;transition:background-size .65s cubic-bezier(.2,.7,.2,1) .15s;padding:0 2px;border-radius:3px}
.reveal.visible .mark,.mark.in{background-size:100% .44em}

/* Animated blue mesh behind hero + soft glow on blue bands */
.hero-v2{position:relative;overflow:hidden}
.hero-v2::before{content:"";position:absolute;top:-22%;right:-8%;width:780px;height:780px;background:radial-gradient(circle at 30% 30%,rgba(59,130,246,.20),transparent 60%),radial-gradient(circle at 70% 65%,rgba(34,211,238,.16),transparent 60%);filter:blur(6px);animation:meshFloat 17s ease-in-out infinite alternate;z-index:0;pointer-events:none}
.hero-v2-grid{position:relative;z-index:1}
@keyframes meshFloat{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-42px,32px) scale(1.13)}}
.section-blue{position:relative;overflow:hidden}
.section-blue::after{content:"";position:absolute;inset:0;background:radial-gradient(900px 380px at 12% 0%,rgba(20,84,232,.10),transparent 60%),radial-gradient(720px 330px at 100% 100%,rgba(56,189,248,.12),transparent 60%);pointer-events:none}
.section-blue>.container{position:relative;z-index:1}

/* Gloss sweep on primary CTA */
.btn-primary{position:relative;overflow:hidden}
.btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 32%,rgba(255,255,255,.4) 50%,transparent 68%);transform:translateX(-130%);transition:transform .65s ease}
.btn-primary:hover::after{transform:translateX(130%)}

/* Section heading: eyebrow line grows when revealed */
.section-head.reveal .eyebrow::before{transform:scaleX(0);transform-origin:left;transition:transform .6s ease .12s}
.section-head.reveal.visible .eyebrow::before{transform:scaleX(1)}

/* ===== Case cards: real photo + darkening hover reveal ===== */
.case-cover{background:#0b1b3a}
.case-cover::after{display:none}
.case-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.03);transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .45s ease}
.case-cover-cap{position:absolute;left:0;right:0;bottom:0;padding:18px 18px 15px;background:linear-gradient(to top,rgba(8,18,40,.88),rgba(8,18,40,.34) 62%,transparent);color:#fff;text-align:left;z-index:3;transition:opacity .35s ease,transform .35s ease}
.case-cover-cap strong{display:block;font-size:18px;letter-spacing:-.01em}
.case-cover-cap span{display:block;font-size:12px;opacity:.84;margin-top:3px;text-transform:none;letter-spacing:0}
.case-cover .case-badge{z-index:4;background:rgba(255,255,255,.92);color:var(--primary-deep);backdrop-filter:blur(4px)}
.case-cover-hover{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;justify-content:center;gap:9px;padding:24px;color:#fff;text-align:left;background:linear-gradient(160deg,rgba(10,31,80,.92),rgba(8,18,40,.96));opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease;pointer-events:none}
.case-cover:hover .case-photo,.case-card:focus-within .case-photo{transform:scale(1.07);filter:brightness(.4) saturate(1.12)}
.case-cover:hover .case-cover-cap,.case-card:focus-within .case-cover-cap{opacity:0;transform:translateY(8px)}
.case-cover:hover .case-cover-hover,.case-card:focus-within .case-cover-hover{opacity:1;transform:none}
.case-cover-hover strong{font-size:clamp(20px,1.9vw,25px);line-height:1.12;letter-spacing:-.02em}
.case-cover-hover p{font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.86)}
.case-cover-hover ul{display:flex;flex-direction:column;gap:7px;margin-top:2px}
.case-cover-hover li{position:relative;padding-left:20px;font-size:13px;font-weight:600;color:#eaf2ff}
.case-cover-hover li::before{content:"";position:absolute;left:0;top:7px;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#60a5fa,#60a5fa)}
.case-cover .case-cover-cta{margin-top:6px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#9ec5ff;opacity:1;display:inline-block}
/* fallback gradients per category (shown while photo loads) */
.case-cover.seo{background:linear-gradient(135deg,#0a2f8f,#2f72ff)}
.case-cover.edu{background:linear-gradient(135deg,#1d4ed8,#1454e8)}
.case-cover.med{background:linear-gradient(135deg,#1e3a8a,#3b82f6)}
.case-cover.build{background:linear-gradient(135deg,#0b2f6b,#1d4ed8)}
.case-cover.ppc{background:linear-gradient(135deg,#13315c,#1f6feb)}
.case-cover.auto{background:linear-gradient(135deg,#111827,#1f6feb)}
.case-cover.beauty{background:linear-gradient(135deg,#0a2f8f,#2f72ff)}
.case-cover.wood{background:linear-gradient(135deg,#3b2410,#0a2f8f)}

/* ===== Pricing / tariffs page ===== */
.pricing-hero{background:linear-gradient(150deg,#0a2f8f 0%,#1454e8 46%,#2f72ff 100%);color:#fff;position:relative;overflow:hidden}
.pricing-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(720px 320px at 85% 8%,rgba(255,255,255,.16),transparent 60%),radial-gradient(620px 300px at 8% 92%,rgba(34,211,238,.24),transparent 60%)}
.pricing-hero .container{position:relative;z-index:1}
.pricing-hero h1{color:#fff}
.pricing-hero p{color:rgba(255,255,255,.88)}
.pricing-hero .eyebrow{color:#bcd6ff}.pricing-hero .eyebrow::before{background:#bcd6ff}
.price-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.price-hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:38px;max-width:780px}
.price-hero-stats div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:14px;padding:16px 18px;backdrop-filter:blur(6px)}
.price-hero-stats strong{display:block;font-size:26px;font-weight:800}
.price-hero-stats span{font-size:13px;color:rgba(255,255,255,.82)}
.compare-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow-soft)}
.compare-table{width:100%;border-collapse:collapse;min-width:700px}
.compare-table th,.compare-table td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line);font-size:14px}
.compare-table thead th{background:var(--cloud-blue);font-weight:800;color:var(--ink-2)}
.compare-table thead th.feat{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff}
.compare-table tbody th{font-weight:700;color:var(--ink-2)}
.compare-table td{color:var(--muted)}
.compare-table td.feat{background:rgba(20,84,232,.05);color:var(--ink);font-weight:700}
.compare-table .yes{color:var(--primary);font-weight:800}
.compare-table .no{color:#bcc6d6}
.compare-table tbody tr:last-child th,.compare-table tbody tr:last-child td{border-bottom:0}
.addons-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.addon-card{border:1px solid var(--line);border-radius:16px;padding:22px;background:#fff;transition:transform .2s ease,box-shadow .2s ease}
.addon-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.addon-card .addon-ico{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:var(--cloud-blue);color:var(--primary);font-size:20px}
.addon-card .addon-price{font-size:22px;font-weight:800;color:var(--primary);margin:10px 0 2px}
.addon-card h3{font-size:17px}
.addon-card p{font-size:14px;color:var(--muted);margin-top:6px}
@media(max-width:900px){.addons-grid{grid-template-columns:1fr}.price-hero-stats{grid-template-columns:1fr}}

/* ===== Polish + bugfixes ===== */
:focus-visible{outline:3px solid rgba(20,84,232,.45);outline-offset:2px;border-radius:6px}
.case-grid{align-items:stretch}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:13px 20px;border-radius:12px;font-size:14px;font-weight:600;box-shadow:0 16px 44px rgba(0,0,0,.28);opacity:0;transition:opacity .3s ease,transform .3s ease;z-index:2000;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(prefers-reduced-motion:reduce){.read-progress span{animation:none}.hero-v2::before{animation:none}.btn-primary::after{display:none}.chapter-nav a::after{transition:none}}
@media(max-width:760px){.case-cover-hover{padding:18px}.case-cover-hover strong{font-size:19px}.case-cover-hover p{font-size:12.5px}.read-progress{height:2px}}


/* =========================================================
   WORDWEB — design system v2 (2-color, fonts, dark, mega,
   pinned scroll, line-art, trust, services, blog, policy)
   ========================================================= */
:root{
  --font-display:var(--font);
  --accent:#1454e8; --accent-2:#2f72ff; --accent-deep:#0a2f8f; --accent-soft:#eef4ff;
  --canvas:var(--paper);
}
h1,h2,h3,.display-xxl,.display-xl,.display-lg,.display-md,.display-sm,.display-xs,.logo-text,.pin-bignum{font-family:var(--font-display)}
.logo-text{letter-spacing:.02em}

/* ---- top utility strip (helps the "even" header feel) ---- */
.utility-strip{background:var(--primary-deep);color:#dbe7ff;font-size:12.5px;height:38px;border-bottom:1px solid rgba(255,255,255,.1)}
.utility-strip .container{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.util-left,.util-right{display:flex;align-items:center;gap:12px}
.util-right a{color:#eaf1ff;font-weight:600}.util-right a:hover{color:#fff}
.util-dot{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.5)}
.util-city{font-weight:600;letter-spacing:.02em}

/* ---- even header row ---- */
.nav-bar{align-items:center}
.logo{align-items:center;height:var(--header-h)}
.logo-mark{display:grid;place-items:center}
.logo-mark svg{display:block}
.logo-text{line-height:1.02}
.logo-text span{margin-top:3px}
.nav-links{align-items:center;height:var(--header-h)}
.nav-links>a,.nav-links .nav-trigger{height:var(--header-h);padding:0;display:inline-flex;align-items:center}
.nav-links>a::after,.nav-links .nav-trigger::after{bottom:16px}
.nav-actions{align-items:center;gap:12px}
.nav-phone{line-height:1}
.btn-sm{min-height:40px}
.theme-toggle{width:40px;height:40px;min-height:40px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;cursor:pointer;color:var(--ink-2);background:var(--paper);transition:.2s}
.theme-toggle:hover{border-color:var(--primary);color:var(--primary)}
.theme-toggle svg{width:18px;height:18px}
.theme-toggle .ic-moon{display:none}
[data-theme="dark"] .theme-toggle .ic-sun{display:none}
[data-theme="dark"] .theme-toggle .ic-moon{display:block}

/* ---- mega menu / dropdown ---- */
.nav-item{position:relative;height:var(--header-h);display:flex;align-items:center}
.nav-trigger{position:relative;gap:5px}
.nav-trigger .chev{width:12px;height:12px;transition:transform .2s}
.nav-item:hover .chev,.nav-item:focus-within .chev{transform:rotate(180deg)}
.mega,.dropdown{position:absolute;top:calc(100% - 6px);left:50%;transform:translateX(-50%) translateY(10px);background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 60px rgba(20,42,83,.18);opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease,visibility .2s;z-index:1100}
.mega{min-width:620px;padding:16px;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.dropdown{min-width:230px;padding:8px;display:flex;flex-direction:column;gap:2px}
.nav-item:hover .mega,.nav-item:hover .dropdown,.nav-item:focus-within .mega,.nav-item:focus-within .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.mega a,.dropdown a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;font-size:14px;font-weight:600;color:var(--ink-2);height:auto}
.mega a::after,.dropdown a::after{display:none}
.mega a:hover,.dropdown a:hover{background:var(--cloud);color:var(--primary)}
.mega-ico{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:var(--cloud-blue);color:var(--primary);flex:0 0 auto}
.mega-ico svg{width:18px;height:18px}
.mega small{display:block;color:var(--muted);font-weight:500;font-size:12px;margin-top:2px}
.mega-promo{grid-column:1/-1;margin-top:6px;padding:14px 16px;border-radius:12px;background:linear-gradient(120deg,var(--primary),var(--primary-2));color:#fff;display:flex;align-items:center;justify-content:space-between;gap:14px}
.mega-promo:hover{background:linear-gradient(120deg,var(--primary-2),var(--primary))}
.mega-promo strong{font-size:14px}.mega-promo span{font-size:12px;opacity:.9}
@media(max-width:1024px){.mega,.dropdown{display:none}}

/* ---- pinned scroll "book chapter" (process) ---- */
.pin-section{padding:0}
.pin-head{padding:var(--section) 0 18px}
.pin-wrap{position:relative;height:360vh}
.pin-stage{position:sticky;top:var(--header-h);height:calc(100vh - var(--header-h));min-height:580px;display:grid;grid-template-columns:1.02fr .98fr;gap:34px;align-items:center;padding:18px 0}
.pin-visual{position:relative;height:78vh;max-height:560px;min-height:360px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(160deg,var(--cloud-blue),var(--cloud));display:grid;place-items:center;overflow:hidden}
.pin-visual svg.route{width:74%;height:auto;max-width:340px}
.route line,.route .seg{stroke:var(--line-strong);stroke-width:3;stroke-linecap:round;transition:stroke .3s}
.route .seg.on{stroke:url(#pinGrad)}
.route circle.node{fill:var(--paper);stroke:var(--line-strong);stroke-width:3;transition:.3s}
.route circle.node.on{fill:var(--primary);stroke:var(--primary)}
.route text{fill:var(--muted);font:700 12px var(--font-display)}
.route text.on{fill:#fff}
.pin-bignum{position:absolute;right:14px;bottom:-46px;font-size:clamp(130px,20vw,250px);font-weight:700;color:rgba(20,84,232,.08);line-height:1}
[data-theme="dark"] .pin-bignum{color:rgba(96,165,246,.12)}
.pin-card{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:32px;box-shadow:var(--shadow-soft)}
.pin-step{color:var(--accent-deep);font-weight:800;letter-spacing:.1em;text-transform:uppercase;font-size:12px}
.pin-card h3{font-size:clamp(24px,3vw,36px);margin:8px 0 10px;line-height:1.08}
.pin-card p{color:var(--muted);line-height:1.6}
.pin-result{margin-top:18px;padding:14px 16px;border-radius:13px;background:var(--accent-soft);border:1px solid rgba(245,158,11,.32)}
.pin-result small{display:block;color:var(--accent-deep);font-weight:800;text-transform:uppercase;letter-spacing:.07em;font-size:11px;margin-bottom:4px}
.pin-result strong{font-size:15px}
.pin-progress{position:absolute;left:0;right:0;bottom:62px;height:5px;background:var(--line);border-radius:99px;overflow:hidden}
.pin-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--primary),var(--accent));transition:width .25s ease}
.pin-dots{position:absolute;left:0;right:0;bottom:20px;display:flex;gap:9px;justify-content:center;flex-wrap:wrap}
.pin-dot{border:1px solid var(--line);background:var(--paper);border-radius:99px;padding:7px 13px;font-size:12px;font-weight:700;color:var(--muted);cursor:pointer;display:flex;gap:7px;align-items:center;transition:.2s}
.pin-dot b{color:var(--primary)}
.pin-dot:hover{border-color:var(--primary)}
.pin-dot.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 8px 18px rgba(20,84,232,.28)}.pin-dot.active b{color:#fff}
@media(max-width:900px){.pin-wrap{height:auto}.pin-stage{position:static;height:auto;min-height:0;grid-template-columns:1fr;gap:18px}.pin-visual{height:auto;min-height:240px}.pin-progress,.pin-dots{position:static;margin-top:14px}.pin-dots{justify-content:flex-start}}

/* ---- line illustration helper (hero motif) ---- */
.line-motif{position:absolute;inset:auto -60px -60px auto;width:420px;height:420px;opacity:.5;pointer-events:none;z-index:0}
.line-motif path,.line-motif circle,.line-motif line{stroke:var(--primary);fill:none;stroke-width:1.4;opacity:.5}
.line-motif .a{stroke:var(--accent)}

/* ---- trust / social proof ---- */
.trust-strip{padding:26px 0;border-bottom:1px solid var(--line);background:var(--paper)}
.trust-strip .trust-row{display:flex;align-items:center;gap:26px;flex-wrap:wrap;justify-content:space-between}
.trust-label{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.logo-wall{display:flex;gap:14px 26px;flex-wrap:wrap;align-items:center}
.logo-wall span{font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--muted);opacity:.7;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:7px;filter:grayscale(1);transition:.2s}
.logo-wall span:hover{opacity:1;color:var(--ink);filter:none}
.logo-wall i{width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,var(--primary),var(--accent));display:inline-block}
.metrics-band{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:30px}
.metric{border:1px solid var(--line);border-radius:16px;padding:20px;background:var(--paper);text-align:center}
.metric strong{display:block;font-family:var(--font-display);font-size:34px;font-weight:700;background:linear-gradient(120deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.metric span{font-size:13px;color:var(--muted)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.testi{border:1px solid var(--line);border-radius:18px;padding:24px;background:var(--paper);display:flex;flex-direction:column;gap:14px}
.testi .stars{color:var(--accent);letter-spacing:2px}
.testi p{color:var(--ink-2);line-height:1.6;flex:1}
.testi .who{display:flex;align-items:center;gap:12px}
.testi .ava{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;display:grid;place-items:center;font-weight:800;font-family:var(--font-display)}
.testi .who b{display:block;font-size:14px}.testi .who small{color:var(--muted);font-size:12px}
@media(max-width:900px){.metrics-band{grid-template-columns:1fr 1fr}.testi-grid{grid-template-columns:1fr}}

/* ---- analytics "example" note ---- */
.analytics-demo{position:absolute;left:18px;bottom:8px;font-size:10px;letter-spacing:.05em;color:var(--muted);z-index:3}

/* ---- case card mobile "details" button ---- */
.case-cover-more{position:absolute;top:14px;right:14px;z-index:6;width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.94);color:var(--primary-deep);display:none;place-items:center;font-weight:800;box-shadow:0 6px 16px rgba(0,0,0,.22);cursor:pointer}
.case-cover-more svg{width:18px;height:18px}
@media(max-width:900px){.case-cover-more{display:grid}}
.case-card.cover-open .case-cover-hover{opacity:1;transform:none;pointer-events:auto}
.case-card.cover-open .case-photo{transform:scale(1.06);filter:brightness(.42) saturate(1.1)}
.case-card.cover-open .case-cover-cap{opacity:0;transform:translateY(8px)}

/* ---- accent usages (2-color identity) ---- */
.price-badge{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#3a2400}
.btn-accent{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#3a2400;box-shadow:0 10px 22px rgba(245,158,11,.28)}
.btn-accent:hover{color:#3a2400}
.eyebrow.accent{color:var(--accent-deep)}.eyebrow.accent::before{background:var(--accent)}
.mark{background-image:linear-gradient(90deg,rgba(20,84,232,.26),rgba(245,158,11,.30))}
.case-cover-hover li::before{background:linear-gradient(135deg,var(--primary),var(--accent))}
.audience-action span:last-child{color:var(--accent)}

/* ---- services reference components ---- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:26px}
.card-list{list-style:none;display:flex;flex-direction:column;gap:9px;margin:0 0 18px}
.card-list li{position:relative;padding-left:24px;color:var(--ink-2);font-size:15px;line-height:1.45}
.card-list li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:3px;background:linear-gradient(135deg,var(--primary),var(--accent))}
.price{color:var(--primary);font-weight:700;font-family:var(--font-display)}
.order-2{order:2}
.desc{color:var(--muted);font-size:14px;margin:6px 0 14px}
.promo-dark{background:linear-gradient(135deg,var(--primary-deep),var(--primary) 70%,var(--accent-deep));color:#fff;border-radius:22px;padding:36px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;position:relative;overflow:hidden}
.promo-dark::after{content:"";position:absolute;right:-40px;top:-40px;width:200px;height:200px;border:1px solid rgba(255,255,255,.18);border-radius:50%}
.promo-dark h2,.promo-dark p{color:#fff}.promo-dark p{opacity:.92;margin-top:6px}
.service-card{display:flex;flex-direction:column}.service-card .btn{margin-top:auto}
.service-card .price{font-size:22px;margin:4px 0 10px}
@media(max-width:900px){.grid-2,.grid-3{grid-template-columns:1fr;gap:22px}.order-2{order:0}}

/* ---- blog + article + policy + guarantees ---- */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.blog-card{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--paper);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.blog-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.blog-thumb{height:168px;display:grid;place-items:center;color:#fff;font-size:34px;position:relative}
.blog-thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(120px 80px at 80% 20%,rgba(255,255,255,.25),transparent 60%)}
.blog-body{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.blog-meta{font-size:11px;color:var(--accent-deep);text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.blog-card h3{font-size:18px;line-height:1.25}
.blog-card p{color:var(--muted);font-size:14px;flex:1}
.article{max-width:760px;margin-inline:auto}
.article .lead{font-size:19px;color:var(--ink-2);line-height:1.6}
.article h2{margin:30px 0 10px;font-size:25px}
.article p{color:var(--ink-2);margin:12px 0;line-height:1.75}
.article ul{margin:12px 0 12px 22px;list-style:disc;color:var(--ink-2);line-height:1.7}
.article .back{display:inline-flex;gap:7px;align-items:center;margin-top:24px;font-weight:700;color:var(--primary)}
.policy-doc{max-width:820px;margin-inline:auto}
.policy-doc h2{margin:28px 0 8px;font-size:22px}
.policy-doc p,.policy-doc li{color:var(--muted);line-height:1.75;margin:8px 0}
.policy-doc ul{margin-left:20px;list-style:disc}
.policy-doc .upd{color:var(--muted);font-size:13px}
.guarantees{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.guarantee-card{border:1px solid var(--line);border-radius:18px;padding:24px;background:var(--paper)}
.guarantee-card .g-ico{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-deep);font-size:22px;margin-bottom:12px}
.guarantee-card h3{font-size:17px;margin-bottom:6px}.guarantee-card p{color:var(--muted);font-size:14px}
@media(max-width:900px){.blog-grid,.guarantees{grid-template-columns:1fr}}

/* ---- footer requisites / policy line ---- */
.footer-req{font-size:12.5px;color:var(--muted);margin-top:10px;line-height:1.6}
.footer a[href*="policy"]{color:inherit}
.consent a{text-decoration:underline;color:var(--primary)}

/* =========================================================
   DARK THEME
   ========================================================= */
[data-theme="dark"]{
  --paper:#0e1117;--cloud:#141a23;--cloud-blue:#13203a;--sky:#16213a;--sky-2:#101a2e;
  --ink:#eef2f8;--ink-2:#d3dbe8;--muted:#97a3b6;--line:#26313f;--line-strong:#364456;
  --primary:#4f93ff;--primary-2:#7db0ff;--primary-deep:#9cc0ff;
  --accent:#4f93ff;--accent-2:#2f72ff;--accent-deep:#9ec3ff;--accent-soft:#14213a;
  --on-dark:#eef2f8;--shadow:0 16px 44px rgba(0,0,0,.5);--shadow-soft:0 8px 24px rgba(0,0,0,.4);
}
[data-theme="dark"] body{background:var(--paper)}
[data-theme="dark"] .utility-strip{background:#080b10;border-bottom-color:var(--line)}
[data-theme="dark"] .site-header{background:rgba(14,17,23,.9);border-bottom-color:rgba(255,255,255,.07)}
[data-theme="dark"] .mobile-nav{background:var(--paper);border-bottom-color:var(--line)}
[data-theme="dark"] .nav-links>a,[data-theme="dark"] .nav-trigger{color:var(--ink-2)}
[data-theme="dark"] .nav-phone{color:var(--ink)}
[data-theme="dark"] .burger{border-color:var(--line)}[data-theme="dark"] .burger span{background:var(--ink)}
[data-theme="dark"] .logo-text{color:var(--ink)}
[data-theme="dark"] .mega,[data-theme="dark"] .dropdown{background:var(--cloud);border-color:var(--line);box-shadow:0 24px 60px rgba(0,0,0,.55)}
[data-theme="dark"] .mega a:hover,[data-theme="dark"] .dropdown a:hover{background:var(--paper)}
[data-theme="dark"] .mega-ico{background:var(--cloud-blue)}
[data-theme="dark"] .btn-outline{background:transparent;border-color:var(--primary-2);color:var(--primary-2)}
[data-theme="dark"] .section-cloud{background:var(--cloud)}
[data-theme="dark"] .section-white{background:var(--paper)}
[data-theme="dark"] .section-blue{background:linear-gradient(145deg,#0c1830,#0e1117 60%,#0c191a)}
[data-theme="dark"] .section-amber{background:linear-gradient(145deg,#1b1407,#0e1117)}
[data-theme="dark"] .page-hero{background:linear-gradient(145deg,#10203c,#0e1117 72%)}
[data-theme="dark"] .hero-v2{background:linear-gradient(180deg,#0c1426,#0e1117)}
[data-theme="dark"] .case-card,[data-theme="dark"] .price-card,[data-theme="dark"] .addon-card,
[data-theme="dark"] .audience-card,[data-theme="dark"] .faq-item,[data-theme="dark"] .info-card,
[data-theme="dark"] .role-card,[data-theme="dark"] .term-card,[data-theme="dark"] .doc-item,
[data-theme="dark"] .contact-card,[data-theme="dark"] .blog-card,[data-theme="dark"] .inline-form-card,
[data-theme="dark"] .quiz-main,[data-theme="dark"] .quiz-side,[data-theme="dark"] .solution-panel,
[data-theme="dark"] .card,[data-theme="dark"] .compare-table,[data-theme="dark"] .modal-dialog,
[data-theme="dark"] .testi,[data-theme="dark"] .metric,[data-theme="dark"] .guarantee-card,
[data-theme="dark"] .pin-card,[data-theme="dark"] .wireframe-widget,[data-theme="dark"] .lead-cta{background:var(--cloud);border-color:var(--line)}
[data-theme="dark"] .case-card:hover,[data-theme="dark"] .price-card:hover{box-shadow:var(--shadow)}
[data-theme="dark"] input,[data-theme="dark"] textarea,[data-theme="dark"] select{background:#0b0f16;border-color:var(--line);color:var(--ink)}
[data-theme="dark"] .chapter-nav{background:rgba(20,26,35,.75);border-color:var(--line)}
[data-theme="dark"] .footer{background:#080b10}
[data-theme="dark"] .breadcrumbs,[data-theme="dark"] .breadcrumbs a{color:var(--muted)}
[data-theme="dark"] .skip-link{background:var(--paper);color:var(--ink)}
[data-theme="dark"] .mark{background-image:linear-gradient(90deg,rgba(79,147,255,.34),rgba(251,191,36,.34))}
[data-theme="dark"] .pin-visual{background:linear-gradient(160deg,#0f1c34,#141a23)}
[data-theme="dark"] .route circle.node{fill:var(--cloud)}
[data-theme="dark"] .analytics-demo{color:#7e8aa0}
[data-theme="dark"] .trust-strip{background:var(--paper);border-bottom-color:var(--line)}




/* ===== process slider: smooth + obviously switchable (restored layout) ===== */
.process-v2{position:relative}
.process-range{-webkit-appearance:none;appearance:none;width:100%;height:30px;background:transparent;cursor:pointer;margin:0}
.process-range::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:rgba(255,255,255,.18)}
.process-range::-moz-range-track{height:3px;border-radius:3px;background:rgba(255,255,255,.18)}
.process-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;margin-top:-11px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-2));border:3px solid #0e1116;box-shadow:0 0 0 4px rgba(79,147,255,.28),0 6px 16px rgba(0,0,0,.4);transition:transform .2s,box-shadow .2s}
.process-range::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-2));border:3px solid #0e1116;box-shadow:0 0 0 4px rgba(79,147,255,.28)}
.process-range:hover::-webkit-slider-thumb,.process-range:active::-webkit-slider-thumb{transform:scale(1.18);box-shadow:0 0 0 7px rgba(79,147,255,.32),0 6px 16px rgba(0,0,0,.45)}
.process-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 7px rgba(79,147,255,.4)}
.process-marker{cursor:pointer;transition:transform .22s cubic-bezier(.16,1,.3,1)}
.process-marker b{position:relative;transition:background .25s,box-shadow .25s,transform .25s}
.process-marker:hover{transform:translateY(-3px)}
.process-marker:hover b{box-shadow:0 0 0 6px rgba(79,147,255,.18)}
.process-marker:not(.active) b:hover{background:#2c3340}
.process-marker.active b{animation:pulse 2.4s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(79,147,255,.5)}50%{box-shadow:0 0 0 9px rgba(79,147,255,0)}}
.process-marker span{transition:color .2s}
.process-marker:hover span{color:#fff}
.process-progress-line span{transition:width .5s cubic-bezier(.16,1,.3,1)}
/* smooth stage-card content swap */
.process-stage-card{transition:border-color .3s,background .3s}
.process-stage-card.is-anim>*{animation:pStage .55s cubic-bezier(.16,1,.3,1) both}
.process-stage-card.is-anim>*:nth-child(2){animation-delay:.06s}
.process-stage-card.is-anim>*:nth-child(3){animation-delay:.12s}
@keyframes pStage{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.process-stage-card .btn{transition:transform .2s,box-shadow .2s,background .2s,color .2s}
.process-v2-hint{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.process-v2-hint svg{animation:nudge 1.8s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
@media(prefers-reduced-motion:reduce){.process-marker.active b,.process-v2-hint svg{animation:none}.process-stage-card.is-anim>*{animation:none}}


/* ============ FIX PACK v3 ============ */
/* 1) ABOUT — stop squeeze / shift */
.about-mini{grid-template-columns:.9fr 1.1fr;gap:48px;align-items:stretch}
.about-mini>.reveal{transform:none!important}
.about-mini>.reveal[data-reveal]{transform:none!important}
.about-photo,.about-copy{min-width:0}
.about-copy{overflow-wrap:anywhere}
.about-photo{min-height:460px}
.about-copy{display:flex;flex-direction:column;justify-content:center}
.about-actions{margin-top:24px}

/* 2) QUIZ — auto height + breathing room */
.quiz-shell{min-height:0;height:auto}
.quiz-main{padding:46px 44px}
.quiz-side{padding:46px 40px;justify-content:flex-start}
.quiz-step{padding:6px 0 2px}
.quiz-step>p{margin-bottom:24px}
.quiz-options{gap:12px;margin-bottom:8px}
.quiz-option{padding:16px 18px}
.quiz-nav{margin-top:30px;padding-top:24px}
.quiz-side .quiz-summary{margin-top:6px}
@media(max-width:760px){.quiz-main,.quiz-side{padding:26px 20px}}

/* 3) PROCESS — breathing + inline expand + arrows */
.process-v2{padding:62px 56px}
.process-v2-head{padding-bottom:46px;gap:56px}
.process-v2-body{padding-top:62px}
.process-slider-wrap{padding:0 28px 66px}
.process-stage-card{position:relative;display:block;padding:32px 132px 32px 34px;min-height:150px;overflow:hidden}
.process-stage-summary{display:block}
.process-stage-detail{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .5s cubic-bezier(.16,1,.3,1),opacity .4s ease,margin-top .4s ease;margin-top:0}
.process-stage-detail>div{overflow:hidden;min-height:0}
.process-stage-card.expanded .process-stage-detail{grid-template-rows:1fr;opacity:1;margin-top:22px}
.process-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.process-detail-grid .pd{border:1px solid #313b48;border-radius:13px;padding:14px 16px;background:rgba(255,255,255,.03)}
.process-detail-grid .pd small{display:block;text-transform:uppercase;letter-spacing:.08em;font-size:10.5px;color:#79a5ff;font-weight:800;margin-bottom:6px}
.process-detail-grid .pd p{color:#cdd6e2;font-size:13px;line-height:1.5;margin:0}
.process-detail-grid .pd-full{grid-column:1/-1}
.process-stage-actions{display:flex;align-items:center;gap:12px;margin-top:22px;flex-wrap:wrap}
.process-stage-nav{position:absolute;top:26px;right:28px;display:flex;gap:8px;z-index:4}
.process-arrow{width:42px;height:42px;border-radius:11px;border:1px solid #3c4654;background:#1d2229;color:#cdd6e2;display:grid;place-items:center;cursor:pointer;transition:.2s}
.process-arrow:hover:not(:disabled){background:var(--primary);border-color:var(--primary);color:#fff;transform:translateY(-2px)}
.process-arrow:disabled{opacity:.3;cursor:not-allowed}
.process-arrow svg{width:18px;height:18px}
.process-stage-card.is-anim .process-stage-summary>*{animation:pStage .5s cubic-bezier(.16,1,.3,1) both}
.process-stage-card.is-anim .process-stage-summary>*:nth-child(2){animation-delay:.05s}
.process-stage-card.is-anim .process-stage-summary>*:nth-child(3){animation-delay:.1s}
@media(max-width:900px){.process-v2{padding:34px 18px}.process-stage-card{padding:24px 20px 70px}.process-stage-nav{top:auto;bottom:18px;right:20px}.process-detail-grid{grid-template-columns:1fr}}

/* Consent checkbox alignment */
.consent{display:flex;align-items:center;gap:10px;line-height:1.4}
.consent input{width:18px;height:18px;margin:0;flex:0 0 auto;accent-color:var(--primary)}
.consent span{display:block}

/* Hero analytics — flip, information and CTA */
.hero-analytics-inner{transition:transform .46s cubic-bezier(.34,1.3,.5,1),filter .25s,scale .25s}
.analytics-back{justify-content:flex-start;gap:0}
.analytics-back-label{margin-bottom:16px}
.analytics-levers{display:grid;gap:11px;margin:0 0 18px}
.analytics-lever{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start;padding:12px 14px;border:1px solid #2a3a4c;border-radius:13px;background:linear-gradient(120deg,#16202c,#101820)}
.analytics-lever i{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),#0a3fb0);color:#fff;font-style:normal;font-weight:800;font-size:15px}
.analytics-lever b{display:block;font-size:14px;color:#eaf2ff}
.analytics-lever small{display:block;color:#9fb0c2;font-size:11.5px;margin-top:3px;line-height:1.4}
.analytics-back-cta{margin-top:auto}
.analytics-back-cta .btn{width:100%;border-color:var(--primary);color:#cfe0ff;background:rgba(20,84,232,.14)}
.analytics-back-cta .btn:hover{background:var(--primary);color:#fff}

/* Audience cards — illustrative vector graphics */
.audience-icon{width:70px;height:70px;border-radius:18px;overflow:hidden}
.audience-icon svg{width:34px;height:34px}
.audience-card .biz-watermark{position:absolute;right:-14px;bottom:-14px;width:148px;height:148px;opacity:.13;color:var(--accent);z-index:0;pointer-events:none;transition:transform .35s cubic-bezier(.16,1,.3,1),opacity .35s}
.audience-card:hover .biz-watermark{transform:scale(1.08) rotate(-3deg);opacity:.2}
.audience-card>*:not(.biz-watermark){position:relative;z-index:2}
.solution-symbol{width:auto;height:auto;min-width:96px;padding:16px;border-radius:22px}
.solution-symbol svg{width:58px;height:58px;display:block}

/* Services — structured icon accents */
.svc-ico-badge{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:13px;margin-bottom:14px;color:#fff;box-shadow:0 12px 24px rgba(20,42,83,.18)}
.svc-ico-badge svg{width:24px;height:24px}
.svc-ico-badge.ico-seo{background:linear-gradient(135deg,#1454e8,#38bdf8)}
.svc-ico-badge.ico-ppc{background:linear-gradient(135deg,#1454e8,#3b82f6)}
.svc-ico-badge.ico-sites{background:linear-gradient(135deg,#1d4ed8,#60a5fa)}
#seo .grid-2>div:first-child,#ppc .grid-2>div.reveal:not(.card){position:relative}
.card--soft{position:relative;border:none!important;background:linear-gradient(160deg,var(--cloud-blue),#fff)!important;box-shadow:var(--shadow-soft);overflow:hidden}
.card--soft::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--primary),var(--accent))}
.card--soft .svc-tick{display:flex;gap:10px;align-items:flex-start;margin:8px 0;color:var(--ink-2);font-size:14px;line-height:1.5}
.card--soft .svc-tick::before{content:"";flex:0 0 auto;width:18px;height:18px;border-radius:6px;background:linear-gradient(135deg,var(--primary),var(--accent));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/12px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/12px no-repeat;margin-top:1px}
.service-card{overflow:hidden}
.service-card h3{position:relative;padding-left:36px}
.service-card h3::before{content:attr(data-n);position:absolute;left:0;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:8px;background:var(--accent-soft);color:var(--accent-deep);font-size:13px;font-weight:800;display:grid;place-items:center;font-family:var(--font-display)}
.service-card .price{padding-left:36px}
.service-card .body-md,.service-card .card-list,.service-card .btn{margin-left:0}
#sites .grid-3{gap:24px}
@media(max-width:900px){.card--soft::before{width:100%;height:4px;bottom:auto}}


/* ============ FIX PACK v4 ============ */
/* utility strip removed */
.utility-strip{display:none!important}
/* hero: breathing + 2 CTAs */
.hero-v2-actions{gap:12px}
.hero-v2-benefits{margin-top:22px}
/* hero card: instant crossfade flip (no 3D delay) + cursor tilt */
.hero-analytics-inner{transform:none!important;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.hero-analytics:hover .hero-analytics-inner,.hero-analytics:focus-visible .hero-analytics-inner{transform:scale(1.03) translateY(-4px)!important;filter:drop-shadow(0 26px 34px rgba(12,31,68,.28))}
.hero-analytics.is-flipped .hero-analytics-inner{transform:scale(1.03) translateY(-4px)!important}
.analytics-face{backface-visibility:visible!important;transition:opacity .34s ease,transform .34s ease}
.analytics-front{opacity:1;transform:rotateZ(1.4deg)}
.analytics-back{opacity:0;transform:rotateZ(-1deg) translateY(10px);pointer-events:none}
.hero-analytics.is-flipped .analytics-front{opacity:0;transform:rotateZ(1.4deg) translateY(-10px);pointer-events:none}
.hero-analytics.is-flipped .analytics-back{opacity:1;transform:rotateZ(-1deg);pointer-events:auto}
/* case cards: NO hover overlay; enlarge + cursor tilt; gray mini-details */
.case-cover-hover{display:none!important}
.case-card{will-change:transform}
.case-card:hover{box-shadow:0 28px 64px rgba(20,42,83,.2)}
.case-card:hover .case-photo{transform:scale(1.07)}
.case-cover{height:210px}
.case-cover-ico{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.92);color:var(--primary-deep);display:grid;place-items:center;z-index:4;box-shadow:0 6px 16px rgba(0,0,0,.18)}
.case-cover-ico svg{width:20px;height:20px}
.case-sub{color:var(--muted);font-size:13px;margin-top:2px}
.case-lines{display:flex;flex-direction:column;gap:5px;margin:12px 0 4px}
.case-lines span{color:var(--muted);font-size:12.5px;line-height:1.45}
.case-footer{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px}
.case-toggle-gray{background:none;border:0;padding:0;color:var(--muted);font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px;transition:color .2s}
.case-toggle-gray:hover{color:var(--ink-2)}
.case-card.expanded .case-lines{color:var(--ink-2)}
.case-cover-more{display:none!important}
/* process: kill the white popup (details already inline) */
.process-modal{display:none!important}
/* quiz: blue icons everywhere + breathing + caps */
.quiz-option-icon{color:var(--primary);background:var(--cloud-blue)}
.quiz-option-icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.quiz-main{padding:50px 48px}
.quiz-side{padding:50px 42px}
.quiz-step h3{text-transform:none}
.quiz-row span{text-transform:capitalize}
.quiz-options{gap:12px}
/* contacts: breathing */
.contact-grid{gap:32px}
.contact-card{padding:34px}
.contact-grid .form-grid{gap:16px}
.page-hero{padding:64px 0 44px}
/* shimmer on ALL buttons */
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 32%,rgba(255,255,255,.45) 50%,transparent 68%);transform:translateX(-130%);transition:transform .6s cubic-bezier(.16,1,.3,1);pointer-events:none}
.btn:hover::after{transform:translateX(130%)}
.btn-outline::after,.btn-ghost::after,.btn-outline-light::after{background:linear-gradient(120deg,transparent 32%,rgba(20,84,232,.16) 50%,transparent 68%)}
@media(max-width:760px){.quiz-main,.quiz-side{padding:30px 22px}.contact-card{padding:24px}}
@media(prefers-reduced-motion:reduce){.btn::after{display:none}}

/* ============ AUDIENCE LAYOUT FIX (flex column, no overlap by design) ============ */
.audience-card{display:flex;flex-direction:column;align-items:stretch;min-height:300px;padding:24px;overflow:hidden}
.audience-card .audience-icon{margin-bottom:18px}
.audience-card h3{margin:0 0 10px}
.audience-card p{margin:0}
.audience-tags{margin:14px 0 0}
.audience-action{position:static;left:auto;right:auto;bottom:auto;margin-top:auto;padding-top:18px}
@media(max-width:760px){.audience-card{min-height:0}}


/* ============ CASE CARDS v5: clean + no freeze + hover lift/border ============ */
.case-cover-hover{display:none!important;pointer-events:none!important}
.case-photo{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.case-card:hover .case-photo{transform:none!important;filter:none!important}
.case-card{transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s,border-color .3s}
.case-card:hover{transform:translateY(-6px) scale(1.012);box-shadow:0 22px 50px rgba(20,42,83,.16);border-color:var(--primary)}
.case-brief{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .45s cubic-bezier(.16,1,.3,1),opacity .35s,margin-top .35s;margin-top:0}
.case-brief>div{overflow:hidden;min-height:0}
.case-card.expanded .case-brief{grid-template-rows:1fr;opacity:1;margin-top:14px}
.case-brief .case-lines,.case-brief .case-proof,.case-brief .case-tags{margin-top:12px}
.case-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;flex-wrap:wrap}
.case-brief-toggle{background:none;border:0;padding:0;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px;transition:color .2s}
.case-brief-toggle:hover{color:var(--ink-2)}
.case-link{color:var(--primary);font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:5px;transition:gap .2s,color .2s}
.case-link:hover{gap:9px;color:var(--primary-2)}
.case-sub{color:var(--muted);font-size:13px;margin-top:2px}


/* ============ CASE CARDS v6 (reference look + freeze-proof) ============ */
.case-cover-hover,.case-cover-more{display:none!important;pointer-events:none!important}
.case-card.cover-open .case-cover-hover{display:none!important;pointer-events:none!important;opacity:0!important}
.case-cover{height:200px;position:relative;overflow:hidden}
.case-cover-ico{position:absolute;top:12px;right:12px;width:38px;height:38px;border-radius:11px;background:#fff;color:var(--primary);display:grid;place-items:center;box-shadow:0 6px 16px rgba(20,42,83,.2);z-index:4}
.case-cover-ico svg{width:20px;height:20px}
.case-badge{z-index:4}
.case-cover-cap{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;flex-direction:column;gap:2px;padding:14px 16px;color:#fff;background:linear-gradient(to top,rgba(8,16,34,.9),rgba(8,16,34,.45) 65%,transparent);box-shadow:0 -8px 24px rgba(8,16,34,.3);transform:translateY(101%);transition:transform .36s cubic-bezier(.16,1,.3,1);pointer-events:none}
.case-cover-cap strong{font-family:var(--font-display);font-size:16px;letter-spacing:-.01em}
.case-cover-cap span{font-size:12px;opacity:.85}
.case-card:hover .case-cover-cap{transform:translateY(0)}
.case-photo{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.case-card:hover .case-photo{transform:scale(1.05)}
.case-card{transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s,border-color .3s}
.case-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(20,42,83,.16);border-color:var(--primary)}
.case-brief{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .42s cubic-bezier(.16,1,.3,1),opacity .32s,margin-top .32s;margin-top:0}
.case-brief>div{overflow:hidden;min-height:0}
.case-card.expanded .case-brief{grid-template-rows:1fr;opacity:1;margin-top:12px}
.case-brief .case-lines{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.case-brief .case-lines span{color:var(--muted);font-size:12.5px;line-height:1.45}
.case-brief .case-lines b{color:var(--ink-2);font-weight:700}
.case-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;flex-wrap:wrap}
.case-brief-toggle{background:none;border:0;padding:0;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px;transition:color .2s}
.case-brief-toggle:hover{color:var(--ink-2)}
.case-link{color:var(--primary);font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:5px;transition:gap .2s,color .2s}
.case-link:hover{gap:9px;color:var(--primary-2)}
.case-sub{color:var(--muted);font-size:13px;margin-top:2px}

/* case card content wrapping (prevents column blow-out) */
.case-card{min-width:0}
.case-body{min-width:0}
.case-body h3,.case-sub,.case-link,.case-brief-toggle,.case-lines span,.case-tags span{overflow-wrap:anywhere;word-break:break-word}
.case-foot{gap:10px 14px}
.case-link{white-space:nowrap}
@media(max-width:760px){.case-grid{grid-template-columns:1fr}.case-grid .case-card:last-child{grid-column:auto}}


/* =========================================================
   WORDWEB CLEAN FINAL — unified Manrope, blue system, compact
   header, open process, filtered cases and auto-height quiz.
   ========================================================= */
:root{
  --font-display:var(--font);
  --accent:#1454e8;--accent-2:#2f72ff;--accent-deep:#0a2f8f;--accent-soft:#eef4ff;
  --mint:#4f7ecf;--mint-soft:#eef4ff;--amber:#6e93d8;--amber-soft:#f3f7ff;--coral:#3d6fc8;--rose:#284d96;
}
html,body,button,input,textarea,select{font-family:var(--font)}
h1,h2,h3,.display-xxl,.display-xl,.display-lg,.display-md,.display-sm,.display-xs,.logo-text,.pin-bignum,.logo-wall span{font-family:var(--font)!important}
.grad-text,.hero-v2-title span{background:linear-gradient(120deg,#0a2f8f,#1454e8 58%,#60a5fa);-webkit-background-clip:text;background-clip:text;color:transparent}
.mark{background-image:linear-gradient(90deg,rgba(20,84,232,.24),rgba(96,165,250,.18))}
.section-amber{background:#fff}

/* centered compact header */
.nav-bar{display:grid;grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr);gap:24px}
.nav-links{justify-self:center;margin-left:0;gap:26px}.logo{justify-self:start}.nav-actions{justify-self:end}
.nav-actions{justify-self:end}
.logo-text{font-family:var(--font)!important;letter-spacing:-.02em;font-weight:800}
.mega,.dropdown{border-radius:8px}
.mega{min-width:600px}
.mega-promo{display:none!important}
.mega-ico{border-radius:6px;font-family:var(--font)}
@media(max-width:1450px){.nav-phone{display:none}.nav-links{gap:22px}}
@media(max-width:1180px){.nav-links{gap:15px}.nav-links a{font-size:12px}.nav-bar{gap:16px}}
@media(max-width:1024px){.nav-links{display:none}.burger{display:flex}}

/* no warm accents outside audience cards */
.svc-ico-badge.ico-seo,.svc-ico-badge.ico-ppc,.svc-ico-badge.ico-sites{background:linear-gradient(135deg,#0a2f8f,#2f72ff)}
.card--soft::before,.pin-progress span,.logo-wall i,.line-motif .a{background:linear-gradient(var(--primary),var(--primary-2));stroke:var(--primary)}
.pin-step{color:var(--primary)}.pin-result{background:var(--cloud-blue);border-color:#bfd2fb}.pin-result small{color:var(--primary-deep)}
[data-theme="dark"] .mark{background-image:linear-gradient(90deg,rgba(79,147,255,.34),rgba(37,99,235,.3))}

/* hero back face never spills out */
.hero-analytics{overflow:hidden;cursor:pointer}
.hero-analytics-inner,.analytics-face{width:100%;height:100%}
.analytics-back{overflow:hidden}
.analytics-back-cta{width:100%;min-width:0}
.analytics-back-cta .btn{width:100%;max-width:100%;min-width:0;white-space:normal}

/* Process details are always visible */
.process-stage-detail{display:block!important;grid-template-rows:1fr!important;opacity:1!important;margin-top:22px!important}
.process-stage-detail>div{overflow:visible}
.process-stage-card{padding:32px 132px 32px 34px;min-height:310px}
.process-stage-actions{margin-top:18px}.process-stage-actions .btn{display:none!important}
.process-detail-grid .pd{border-radius:4px}
.process-arrow{border-radius:4px}
@media(max-width:900px){.process-stage-card{padding:24px 20px 82px;min-height:0}}

/* Cases: no photos, explicit categories, six items before expand */
.case-filters{display:flex;gap:10px;flex-wrap:wrap;margin:-8px 0 28px}
.case-filters button{border:1px solid var(--line-strong);background:#fff;color:var(--ink-2);padding:10px 18px;font-size:13px;font-weight:800;cursor:pointer;transition:.2s}
.case-filters button:hover,.case-filters button.active{background:var(--primary);border-color:var(--primary);color:#fff}
.case-grid-v2{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.case-card-v2{min-width:0;height:100%;display:flex;flex-direction:column;transition:transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s,border-color .28s}
.case-card-v2:hover{transform:translateY(-8px);box-shadow:0 22px 45px rgba(20,42,83,.14);border-color:#a9c0f6}
.case-cover-v2{height:245px;min-height:245px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;color:#fff;padding:28px;background:linear-gradient(135deg,#1454e8,#0a2f8f)}
.case-tone-site{background:linear-gradient(135deg,#1687d2,#1454e8)}
.case-tone-seo{background:linear-gradient(135deg,#0a2f8f,#263f6d)}
.case-tone-context{background:linear-gradient(135deg,#334a78,#1454e8)}
.case-cover-v2 .case-badge{position:absolute;top:20px;left:20px;background:#fff;color:#102044;border-radius:2px;padding:8px 12px;z-index:3}
.case-icon-v2{width:68px;height:68px;display:grid;place-items:center;position:relative;z-index:2;margin-bottom:20px}
.case-icon-v2 svg{width:54px;height:54px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.case-cover-title{text-align:center;position:relative;z-index:2}.case-cover-title strong{display:block;font-size:24px}.case-cover-title span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.05em;opacity:.78;margin-top:5px}
.case-orbit{position:absolute;width:210px;height:210px;border:1px solid rgba(255,255,255,.25);border-radius:50%;right:-60px;bottom:-90px;transition:transform .5s ease}
.case-card-v2:hover .case-orbit{transform:scale(1.2) rotate(20deg)}
.case-card-v2 .case-body{flex:1;display:flex;flex-direction:column;padding:28px}
.case-kind{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--primary);font-weight:800;margin-bottom:8px}
.case-description{font-size:13px;line-height:1.55;color:var(--muted);margin:10px 0 18px}
.case-card-v2 .case-tags{margin-top:auto}.case-card-v2 .case-foot{margin-top:22px}
.case-card-v2 .case-brief{margin-top:12px}.case-card-v2[hidden]{display:none!important}
.case-more-wrap{text-align:center;margin-top:30px}.case-more-wrap [hidden]{display:none}
@media(max-width:1000px){.case-grid-v2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.case-grid-v2{grid-template-columns:1fr}.case-cover-v2{height:220px;min-height:220px}}

/* Quiz: identical geometry on main and dedicated page, natural current-step height */
.quiz-shell{grid-template-columns:minmax(0,1.35fr) minmax(360px,.65fr);align-items:stretch;min-height:0!important;height:auto!important}
.quiz-main{min-height:0;height:auto;padding:38px 34px}
.quiz-side{height:auto;min-height:0;padding:38px 30px;justify-content:flex-start}
.quiz-side .quiz-estimate{margin-top:42px}
.quiz-step{padding:0}.quiz-options{gap:10px}.quiz-option{min-height:74px;padding:14px 16px;border-radius:4px}.quiz-option-icon{border-radius:4px}.quiz-option-icon svg{width:24px;height:24px;fill:none;stroke:var(--primary);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.quiz-summary{border-radius:4px}.prefill-note{border-radius:4px;background:#eef4ff;border-color:#bfd2fb;color:#244f9f}
.quiz-nav{margin-top:24px;padding-top:20px}
@media(max-width:980px){.quiz-shell{grid-template-columns:1fr}.quiz-side .quiz-estimate{margin-top:28px}}

/* About: remove any warm marker/highlight */
#team .mark,.about-story .mark{background:none!important}

/* Strict blue gradients in blog thumbs and decorative components */
.blog-thumb{background:linear-gradient(135deg,#0a2f8f,#2f72ff)!important}

/* Interaction and accessibility pass */
body.nav-open{overflow:hidden}
.burger{position:relative;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease}
.burger:hover,.burger.is-open{background:var(--cloud-blue);border-color:#9fb9ef;box-shadow:0 8px 20px rgba(20,84,232,.12)}
.burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0;transform:scaleX(.25)}
.burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.btn:disabled,.process-stage-nav button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.faq-item{transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.faq-item:hover,.faq-item.open{border-color:#b8c9eb;box-shadow:0 10px 28px rgba(20,42,83,.07)}
.faq-q{transition:color .2s ease,background .2s ease}
.faq-item.open .faq-q{color:var(--primary);background:var(--cloud-blue)}
.field label:not(.consent){transition:color .2s ease}
.field:focus-within label:not(.consent){color:var(--primary)}
.field input,.field textarea,.field select{transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.field input:hover,.field textarea:hover,.field select:hover{border-color:#b6c5dd}
.field input::placeholder,.field textarea::placeholder{color:#929bab}
.quiz-option,.case-filters button,.process-marker{touch-action:manipulation}
.quiz-option[aria-pressed="true"]{box-shadow:0 0 0 2px rgba(20,84,232,.12),0 8px 20px rgba(20,84,232,.08)}
.case-filters button[aria-pressed="true"]{box-shadow:0 8px 18px rgba(20,84,232,.18)}

.modal{
  display:grid;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  backdrop-filter:blur(0);
  transition:opacity .24s ease,visibility .24s ease,backdrop-filter .24s ease;
}
.modal.open{display:grid;opacity:1;visibility:visible;pointer-events:auto;backdrop-filter:blur(5px)}
.modal-dialog{opacity:0;transform:translateY(18px) scale(.98);transition:opacity .24s ease,transform .3s cubic-bezier(.16,1,.3,1)}
.modal.open .modal-dialog{opacity:1;transform:none}
.modal-close{display:grid;place-items:center;transition:background .2s ease,color .2s ease,transform .2s ease}
.modal-close:hover{background:var(--primary);color:#fff;transform:rotate(4deg)}

@media(max-width:1024px){
  .mobile-nav{
    display:grid;
    grid-template-columns:1fr;
    align-content:start;
    gap:4px;
    position:fixed;
    top:var(--header-h);
    left:0;
    right:0;
    bottom:auto;
    height:calc(100dvh - var(--header-h));
    max-height:calc(100dvh - var(--header-h));
    z-index:999;
    padding:18px max(24px,calc((100vw - var(--container))/2)) 28px;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#fff;
    border-top:1px solid var(--line);
    box-shadow:0 24px 60px rgba(20,42,83,.16);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-12px);
    transition:opacity .22s ease,visibility .22s ease,transform .28s cubic-bezier(.16,1,.3,1);
  }
  .mobile-nav.open{display:grid;opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .mobile-nav>a{padding:15px 8px;border-bottom:1px solid #edf1f7;font-size:16px;transition:color .18s ease,padding-left .18s ease,background .18s ease}
  .mobile-nav>a:hover{padding-left:14px;background:var(--cloud-blue);color:var(--primary)}
  .mobile-nav-actions{position:sticky;bottom:-28px;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 22%);padding-top:28px;padding-bottom:2px}
}

@media(max-width:640px){
  .mobile-nav{padding-inline:20px}
  .modal{padding:12px;align-items:end}
  .modal-dialog{width:100%;max-height:calc(100dvh - 24px);overflow-y:auto;padding:26px 20px 22px}
  .modal-close{right:12px;top:10px}
  .toast{bottom:18px;width:calc(100% - 28px);max-width:none}
}

@media(prefers-reduced-motion:reduce){
  .mobile-nav,.modal,.modal-dialog,.burger span{transition:none}
}

/* Performance, hero and compact header pass */
:root{--header-h:64px}
.site-header{
  height:var(--header-h);
  background:rgba(255,255,255,.985);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom-color:#e2e8f2;
}
.site-header.scrolled{box-shadow:0 7px 20px rgba(20,42,83,.075)}
.nav-bar{height:var(--header-h)}
.logo-mark{width:36px;height:36px;box-shadow:none}
.logo-text{font-size:18px}
.logo-text span{margin-top:3px;font-size:10px}
.nav-links a{padding-top:21px;padding-bottom:20px}
.nav-links a::after{bottom:13px}
.btn-sm{min-height:38px;padding:9px 15px}

.read-progress,.chapter-nav{display:none!important}
.hero-v2::before{display:none!important}
.hero-v2-grid{background:linear-gradient(105deg,#fff 0%,#fff 64%,#f7f9fc 100%)}
.hero-orbit,.analytics-callout,.process-marker.active b,.process-v2-hint svg{animation:none!important}
.hero-orbit{background:transparent;border-color:#dbe5f3}
.hero-orbit::before{transform:rotate(8deg)}
.hero-orbit::after{transform:rotate(-8deg)}

.hero-check{
  flex-basis:28px;
  width:28px;
  height:28px;
  background:transparent;
  border:1px solid rgba(20,84,232,.48);
  color:var(--primary);
  font-size:14px;
  font-weight:800;
}
.hero-v2-benefits>div{gap:11px}

.hero-analytics{
  width:min(100%,580px);
  height:410px;
  overflow:visible;
  transition:transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s ease;
  transform-origin:center;
}
.hero-analytics:hover,.hero-analytics:focus-visible{transform:translateY(-6px) scale(1.018)}
.hero-analytics-inner,
.hero-analytics:hover .hero-analytics-inner,
.hero-analytics:focus-visible .hero-analytics-inner,
.hero-analytics.is-flipped .hero-analytics-inner{
  transform:none!important;
  scale:1!important;
  filter:none!important;
}
.analytics-face{
  overflow:hidden;
  padding:30px 34px;
  box-shadow:0 24px 54px rgba(15,34,65,.22);
}
.analytics-front{transform:rotateZ(.45deg)}
.analytics-back{padding:27px 30px;transform:translateY(8px)}
.hero-analytics.is-flipped .analytics-front{transform:translateY(-8px)}
.hero-analytics.is-flipped .analytics-back{transform:none}
.analytics-back-label{margin-bottom:12px}
.analytics-levers{gap:8px;margin-bottom:12px}
.analytics-lever{
  min-height:66px;
  grid-template-columns:34px minmax(0,1fr);
  gap:10px;
  padding:10px 12px;
}
.analytics-lever i{width:34px;height:34px;font-size:14px}
.analytics-lever b{font-size:13px}
.analytics-lever small{font-size:10.5px;line-height:1.3}
.analytics-back-cta{margin-top:auto}
.analytics-back-cta .btn{min-height:44px;padding-block:10px}
.analytics-callout{left:1%;bottom:30px;padding:12px 16px}

/* Saturated blue surfaces always use white foreground */
.btn-primary,
.price-badge,
.pricing-hero,
.pricing-hero h1,
.pricing-hero h2,
.pricing-hero p,
.promo-dark,
.promo-dark h2,
.promo-dark p,
.compare-table thead th.feat,
.mega-promo,
.pin-dot.active,
.process-arrow:hover:not(:disabled),
.case-filters button:hover,
.case-filters button.active,
.case-filters button[aria-pressed="true"]{color:#fff!important}

/* FAQ stays neutral: no blue fill or highlighted container */
.faq-item,
.faq-item:hover,
.faq-item.open{background:#fff;border-color:var(--line);box-shadow:none}
.faq-q,
.faq-item.open .faq-q{background:#fff;color:var(--ink)}
.faq-q:hover{color:var(--primary)}

@media(max-width:1024px){
  :root{--header-h:60px}
  .nav-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}
  .nav-actions{display:flex;gap:8px}
  .nav-actions>.btn{display:inline-flex;min-height:36px;padding:8px 13px;font-size:10px}
  .burger{width:38px;height:38px}
  .logo-mark{width:34px;height:34px}
  .logo-text{font-size:17px}
  .mobile-nav{top:var(--header-h);height:calc(100dvh - var(--header-h));max-height:calc(100dvh - var(--header-h))}
}

@media(max-width:760px){
  .hero-v2-grid{padding-top:34px}
  .hero-analytics-wrap{min-height:570px}
  .hero-analytics{height:430px;width:100%}
  .analytics-face{padding:23px 20px}
  .analytics-back{padding:21px 18px}
  .analytics-levers{gap:7px;margin-bottom:10px}
  .analytics-lever{min-height:64px;padding:9px 10px}
  .analytics-lever small{font-size:10px}
  .analytics-back-cta .btn{font-size:10px}
  .analytics-callout{bottom:12px;left:0}
  .analytics-demo{left:auto;right:0;bottom:0}
  .hero-orbit::before,.hero-orbit::after{display:none}
  .reveal[data-reveal="left"],.reveal[data-reveal="right"]{transform:translateY(16px)}
}

@media(max-width:440px){
  :root{--header-h:58px}
  .nav-bar{gap:7px}
  .logo{gap:8px}
  .logo-mark{width:32px;height:32px}
  .logo-mark svg{width:19px;height:19px}
  .logo-text{font-size:15px}
  .logo-text span{display:none}
  .nav-actions{gap:6px}
  .nav-actions>.btn{min-height:34px;padding:7px 10px;font-size:9px}
  .burger{width:36px;height:36px}
  .mobile-nav{top:var(--header-h);height:calc(100dvh - var(--header-h));max-height:calc(100dvh - var(--header-h))}
}

/* ===== Visual refinement: services, compact process and calm hero motion ===== */
.hero-orbit{
  animation:heroOrbit 24s linear infinite!important;
  transform:translateZ(0);
  will-change:transform;
}
@media(prefers-reduced-motion:reduce){
  .hero-orbit{animation:none!important;will-change:auto}
}

.process-v2{padding:32px 34px}
.process-v2 .display-xl{font-size:clamp(42px,4vw,56px);line-height:1}
.process-v2-head{gap:34px;padding-bottom:22px;align-items:center}
.process-v2-head p{font-size:14px;line-height:1.55}
.process-v2-body{padding-top:24px}
.process-slider-wrap{padding:0 14px 30px}
.process-stage-card{min-height:112px;padding:20px 108px 20px 24px}
.process-stage-nav{top:20px;right:22px}
.process-arrow{width:38px;height:38px;border-radius:8px}
.process-stage-card.expanded .process-stage-detail{margin-top:16px}
.process-stage-actions{margin-top:16px}
.process-detail-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.process-detail-grid .pd{padding:11px 12px}
.process-detail-grid .pd p{font-size:12px;line-height:1.42}
.process-detail-grid .pd-full{grid-column:auto}
@media(max-width:1100px){
  .process-detail-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .process-v2{padding:26px 18px}
  .process-v2 .display-xl{font-size:clamp(36px,10vw,46px)}
  .process-v2-head{padding-bottom:22px}
  .process-v2-body{padding-top:22px}
  .process-slider-wrap{padding:0 8px 28px}
  .process-stage-card{padding:22px 18px 64px;min-height:0}
  .process-stage-nav{top:auto;right:18px;bottom:16px}
  .process-detail-grid{grid-template-columns:1fr}
}

#ppc .grid-2{grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:54px;align-items:center}
#ppc .order-2{align-self:center;padding:32px 34px}
#ppc .order-2 .card-list{margin-bottom:16px}
#ppc .btn-accent{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff!important;
  box-shadow:0 12px 28px rgba(20,84,232,.24);
}
#ppc .btn-accent:hover{
  color:#fff!important;
  box-shadow:0 15px 34px rgba(20,84,232,.32);
}
@media(max-width:900px){
  #ppc .grid-2{grid-template-columns:1fr;gap:26px}
  #ppc .order-2{order:0;padding:25px 22px}
}

.services-dropdown{min-width:250px}

.roi-showcase{
  position:relative;
  overflow:hidden;
  padding:76px 0;
  background:
    radial-gradient(circle at 88% 18%,rgba(107,163,255,.52),transparent 28%),
    linear-gradient(145deg,#123a9f 0%,#1454e8 58%,#276cf4 100%);
  color:#fff;
}
.roi-showcase::before{
  content:"";
  position:absolute;
  width:320px;
  height:320px;
  left:-150px;
  bottom:-210px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:50%;
}
.roi-showcase-head{max-width:820px;margin-bottom:30px}
.roi-showcase-head .eyebrow{color:#cfe0ff}
.roi-showcase-head .eyebrow::before{background:#fff}
.roi-showcase-head h2,
.roi-showcase-head p{color:#fff}
.roi-showcase-head p{max-width:720px;margin-top:12px;color:rgba(255,255,255,.78)}

.roi-container--compact{
  grid-template-columns:1.08fr .92fr;
  border:1px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.98);
  box-shadow:0 24px 60px rgba(5,24,74,.24);
}
.roi-container--compact .roi-calc-panel{
  gap:22px;
  padding:30px 34px;
  background:#fff;
}
.roi-container--compact .roi-slider-group{margin:0}
.roi-slider-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:12px}
.roi-slider-head label{font-size:13px;font-weight:750;color:var(--ink)}
.roi-slider-head strong{font-size:17px;color:var(--primary);white-space:nowrap}
.roi-container--compact .roi-slider-group input[type=range]{height:7px}
.roi-container--compact .roi-slider-group input[type=range]::-webkit-slider-thumb{width:24px;height:24px;border-width:7px}
.roi-assumption{padding:13px 15px;border:1px solid var(--line);background:#f7f9fc;color:var(--muted);font-size:11px;line-height:1.5}
.roi-assumption strong{color:var(--ink)}
.roi-container--compact .roi-results-panel{
  padding:30px;
  border-left:1px solid rgba(255,255,255,.22);
  background:linear-gradient(150deg,#0f3da8,#1454e8);
  color:#fff;
}
.roi-kicker{display:block;margin-bottom:15px;color:#cfe0ff;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.roi-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.roi-container--compact .roi-metric-box,
.roi-container--compact .roi-grand-total,
.roi-container--compact .roi-roi{
  border-color:rgba(255,255,255,.25);
  background:rgba(255,255,255,.10);
  color:#fff;
}
.roi-container--compact .roi-metric-box{padding:18px 14px}
.roi-container--compact .roi-metric-box span,
.roi-container--compact .roi-grand-total span,
.roi-container--compact .roi-roi span{color:rgba(255,255,255,.72)}
.roi-container--compact .roi-metric-box strong{color:#fff;font-size:21px}
.roi-container--compact .roi-grand-total{margin:12px 0;padding:22px}
.roi-container--compact .roi-grand-total strong{color:#fff!important;font-size:31px}
.roi-container--compact .roi-roi{margin:0;padding:18px}
.roi-container--compact .roi-roi strong{color:#fff!important;font-size:24px}
.roi-note{margin-top:14px;color:rgba(255,255,255,.65);font-size:10.5px;line-height:1.5}
@media(max-width:900px){
  .roi-showcase{padding:58px 0}
  .roi-container--compact{grid-template-columns:1fr}
  .roi-container--compact .roi-calc-panel{padding:26px 22px}
  .roi-container--compact .roi-results-panel{padding:26px 22px;border-left:0;border-top:1px solid rgba(255,255,255,.2)}
}
@media(max-width:520px){
  .roi-showcase{padding:48px 0}
  .roi-showcase-head{margin-bottom:24px}
  .roi-slider-head{align-items:flex-start}
  .roi-slider-head label{max-width:68%}
  .roi-metrics{grid-template-columns:1fr}
  .roi-container--compact .roi-grand-total strong{font-size:27px}
}

/* ===== PDF revision: compact pages, portfolio and package details ===== */
:root{--header-h:66px}
.site-header{
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(20px) saturate(145%);
  -webkit-backdrop-filter:blur(20px) saturate(145%);
}
.site-header.scrolled{background:rgba(255,255,255,.94)}
.nav-bar{height:var(--header-h);gap:22px}
.nav-links{gap:23px}
.nav-links a{padding:22px 0 20px;font-size:14px}
.nav-links a::after{bottom:13px}
.logo-mark{width:37px;height:37px}
.logo-text{font-size:18px}
.logo-text span{font-size:10px;margin-top:4px}
.nav-actions .btn-sm{min-height:38px;padding:9px 14px}

/* Main hero: smaller and positioned closer to the header */
.hero-v2-grid{
  min-height:auto;
  grid-template-columns:minmax(0,1.04fr) minmax(470px,.96fr);
  gap:46px;
  padding:42px 4.2vw 34px;
}
.hero-v2-title{font-size:clamp(48px,4.7vw,72px);line-height:1}
.hero-v2-lead{margin-top:19px;font-size:clamp(15px,1.1vw,18px);max-width:650px}
.hero-v2-actions{margin-top:23px}
.hero-v2-benefits{margin-top:23px;padding-top:18px;gap:14px}
.hero-v2-benefits strong{font-size:12px}
.hero-check{
  flex:0 0 28px;
  width:28px;
  height:28px;
  background:transparent!important;
  border:1px solid rgba(20,84,232,.4);
  color:var(--primary)!important;
}
.hero-analytics-wrap{min-height:500px}
.hero-analytics{height:370px;width:min(100%,540px)}
.hero-orbit{z-index:0}
.hero-orbit::before{left:-94px;top:44px}
.hero-orbit::after{right:-92px;bottom:28px}
.analytics-face{padding:25px 28px}
.analytics-back{padding:23px 25px}
.analytics-callout{bottom:32px}

/* Audience cards are now a quick visual chooser */
#audiences{padding:62px 0}
.audience-intro{display:block;margin-bottom:24px}
.audience-intro .section-head{max-width:730px}
.audience-grid{gap:12px}
.audience-card{
  min-height:184px;
  padding:19px 19px 17px;
  border-radius:12px!important;
}
.audience-icon{width:43px;height:43px;margin-bottom:14px!important}
.audience-icon svg{width:23px;height:23px}
.audience-card h3{font-size:16px;margin:0 0 13px;max-width:88%}
.audience-card>p,.audience-tags{display:none}
.audience-action{padding-top:0;margin-top:auto;font-size:10.5px}
.audience-card::before{width:82px;height:82px}

/* Process tabs and subtle floating elements */
.process-v2-section{padding:24px 0 62px}
.process-v2{isolation:isolate;padding:26px 28px}
.process-v2>*{position:relative;z-index:2}
.process-v2::before,.process-v2::after{
  content:"";
  position:absolute;
  z-index:1;
  pointer-events:none;
  border:1px solid rgba(121,165,255,.22);
  animation:processFloat 8s ease-in-out infinite alternate;
}
.process-v2::before{width:116px;height:116px;right:7%;top:7%;transform:rotate(18deg)}
.process-v2::after{width:62px;height:62px;left:4%;bottom:7%;background:rgba(20,84,232,.09);animation-delay:-3s}
@keyframes processFloat{
  from{translate:0 -8px;rotate:-3deg}
  to{translate:15px 10px;rotate:8deg}
}
.process-types{display:flex;gap:7px;flex-wrap:wrap;margin:0 14px 22px}
.process-types button{
  padding:9px 13px;
  border:1px solid #3d4858;
  color:#aeb9c8;
  font-size:10px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
  transition:.2s ease;
}
.process-types button:hover{border-color:#79a5ff;color:#fff}
.process-types button.active{background:var(--primary);border-color:var(--primary);color:#fff}
.process-v2 .display-xl{font-size:clamp(38px,3.5vw,49px)}
.process-v2-head{gap:28px;padding-bottom:18px}
.process-v2-body{padding-top:18px}
.process-types{margin-bottom:16px}
.process-slider-wrap{padding:0 12px 23px}
.process-marker{gap:8px}
.process-marker b{width:44px;height:44px}
.process-progress-line{left:47px;right:47px;top:22px}
.process-range{top:9px}
.process-stage-card{min-height:0;padding:17px 98px 17px 21px}
.process-stage-card h3{font-size:22px}
.process-stage-nav{top:17px;right:18px}
.process-detail-grid .pd{padding:9px 10px}
.process-detail-grid .pd p{font-size:11px}

/* Compact reviews */
.reviews-compact{padding:58px 0}
.reviews-compact .section-head{margin-bottom:26px}
.reviews-compact .testi-grid{gap:12px}
.reviews-compact .testi{min-height:0;padding:20px}
.reviews-compact .testi>p{font-size:13px;line-height:1.55}
.reviews-compact .who{margin-top:18px}
.reviews-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:24px}

/* Footer: map before navigation, reduced vertical footprint */
.footer{padding:42px 0 16px}
.footer-main{
  grid-template-columns:1.05fr 1.2fr .9fr;
  grid-template-areas:"brand map links";
  gap:30px;
}
.footer-brand{grid-area:brand}
.footer-map-wrap{grid-area:map}
.footer-links-grid{grid-area:links}
.footer-map{height:205px}
.footer-brand p{margin-top:11px;line-height:1.48}
.footer-col a{padding:3px 0}
.footer-bottom{margin-top:25px}

/* Services page spacing and calculator */
.services-page-hero{padding:46px 0 50px}
.services-page-hero .display-xl{max-width:1050px;font-size:clamp(39px,4vw,57px)}
.services-page-hero .body-lg{margin-top:14px}
.services-page-hero .page-hero-actions{margin-top:22px}
#seo.section,#ppc.section,#sites.section,#packages.section{padding:62px 0}
#ppc .grid-2{grid-template-columns:minmax(0,1.13fr) minmax(350px,.87fr);gap:72px}
#ppc .order-2{translate:18px 0;padding:25px 27px}
.ppc-summary-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  margin:17px 0 19px;
  border:1px solid var(--line);
  background:var(--line);
}
.ppc-summary-grid span{padding:13px;background:#fff;color:var(--muted);font-size:11px;line-height:1.5}
#sites .section-head{margin-bottom:28px}
#sites .service-card{padding:23px}
#sites .service-card .body-md{font-size:13px}
.roi-showcase{padding:54px 0}
.roi-showcase-head{margin-bottom:23px}
.roi-showcase-head .display-lg{font-size:clamp(32px,3vw,44px)}
.roi-container--compact .roi-calc-panel{padding:25px 29px;gap:17px}
.roi-container--compact .roi-results-panel{padding:24px}
.roi-container--compact .roi-slider-group{margin:0}
.roi-container--compact .roi-metric-box{padding:14px 12px}
.roi-container--compact .roi-grand-total{padding:17px;margin:10px 0}
.roi-container--compact .roi-roi{padding:14px}
#packages .section-head{margin-bottom:28px}
#packages .price-card{padding:22px;min-height:390px}
#packages .price-card .amount{font-size:29px}
#packages .price-card .desc{font-size:13px}
#packages .price-badge{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff}
.service-bottom-cta{padding:50px 0}
.btn-service-pick,.package-white-btn{
  background:#fff;
  color:var(--primary)!important;
  border-color:#fff;
}
.btn-service-pick:hover,.package-white-btn:hover{
  background:transparent;
  color:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);
}

/* Portfolio page: left navigation and irregular image wall */
.cases-hero{
  padding:48px 0 40px;
  color:#fff;
  background:linear-gradient(135deg,#0d2f86,#1454e8 70%,#3278ff);
}
.cases-hero .eyebrow{color:#cfe0ff}
.cases-hero h1{max-width:800px}
.cases-hero p{max-width:650px;margin-top:13px;color:rgba(255,255,255,.74)}
.cases-workspace{padding:32px 0 60px;background:#eef3fa}
.cases-browser{display:grid;grid-template-columns:245px minmax(0,1fr);gap:18px;align-items:start}
.cases-sidebar{
  position:sticky!important;
  top:calc(var(--header-h) + 18px)!important;
  padding:22px;
  border:1px solid #cad6e8;
  background:#fff;
  box-shadow:none;
}
.cases-sidebar-kicker,.cases-side-filters>span,.cases-quick-nav>span{
  display:block;
  margin-bottom:9px;
  color:#7a879b;
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.cases-sidebar h2{font-size:20px}
.cases-side-filters,.cases-quick-nav{display:grid;gap:5px;margin-top:23px}
.cases-side-filters button,.cases-quick-nav a{
  padding:9px 10px;
  border:1px solid transparent;
  text-align:left;
  color:#4f5b6e;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.cases-side-filters button:hover,.cases-side-filters button.active{
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
.cases-quick-nav a:hover{background:#edf3ff;color:var(--primary)}
.cases-found{display:flex;align-items:center;gap:9px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.cases-found strong{font-size:28px;color:var(--primary)}
.cases-found span{font-size:10px;color:var(--muted)}
.portfolio-mosaic{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:150px;
  grid-auto-flow:dense;
  gap:12px;
}
.portfolio-card{
  min-width:0;
  min-height:0;
  border:0;
  border-radius:0!important;
  background:#0b1730;
  overflow:hidden;
}
.portfolio-card:nth-child(1),.portfolio-card:nth-child(6){grid-row:span 3}
.portfolio-card:nth-child(2),.portfolio-card:nth-child(4),.portfolio-card:nth-child(8){grid-row:span 2}
.portfolio-card:nth-child(3),.portfolio-card:nth-child(5),.portfolio-card:nth-child(7),.portfolio-card:nth-child(9){grid-row:span 2}
.portfolio-card:hover{transform:translateY(-4px);border:0}
.portfolio-tile{position:relative;display:block;width:100%;height:100%;overflow:hidden;color:#fff!important}
.portfolio-tile img{width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.16,1,.3,1)}
.portfolio-card:hover img{transform:scale(1.045)!important}
.portfolio-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 34%,rgba(4,12,28,.88) 100%)}
.portfolio-copy{position:absolute;left:18px;right:18px;bottom:17px;color:#fff}
.portfolio-copy small{display:block;margin-bottom:5px;color:#abc9ff;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.portfolio-copy strong{display:block;font-size:19px}
.portfolio-copy>span{display:block;margin-top:3px;color:rgba(255,255,255,.72);font-size:10px}
.portfolio-card[hidden]{display:none!important}
.github-trust{padding:42px 0;background:#fff}
.github-trust-inner{display:grid;grid-template-columns:66px 1fr auto;align-items:center;gap:22px}
.github-mark{width:66px;height:66px;display:grid;place-items:center;background:#eaf1ff;color:var(--primary);font-weight:800}

/* Official reviews page */
.reviews-page-hero{padding:52px 0;background:linear-gradient(145deg,#edf4ff,#fff 72%)}
.reviews-page-hero .body-lg{max-width:760px;margin-top:15px}
.reviews-official-head{display:grid;grid-template-columns:1fr .75fr;gap:36px;align-items:end;margin-bottom:28px}
.reviews-page-list{padding:64px 0}
.reviews-grid--full{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.testimonial-card{
  display:flex;
  flex-direction:column;
  min-height:260px;
  padding:23px;
  border:1px solid var(--line);
  background:#fff;
}
.quote-mark{height:36px;color:var(--primary);font-size:46px;line-height:1}
.testimonial-card>p{color:var(--ink-2);font-size:13px;line-height:1.62}
.testimonial-author{display:flex;align-items:center;gap:11px;margin-top:auto;padding-top:20px}
.testimonial-author>span{width:38px;height:38px;display:grid;place-items:center;background:#eaf1ff;color:var(--primary);font-size:11px;font-weight:800}
.testimonial-author strong,.testimonial-author small{display:block}
.testimonial-author strong{font-size:12px}
.testimonial-author small{color:var(--muted);font-size:10px}
.testimonial-card--action{background:linear-gradient(145deg,#0d3aa8,#1454e8);color:#fff}
.testimonial-card--action .eyebrow,.testimonial-card--action h3,.testimonial-card--action p{color:#fff}
.testimonial-card--action .eyebrow{opacity:.75}
.testimonial-card--action .btn{margin-top:auto}

/* Dedicated package pages */
.package-detail-hero{
  position:relative;
  overflow:hidden;
  padding:56px 0;
  color:#fff;
  background:linear-gradient(135deg,#0c2f8e 0%,#1454e8 58%,#2f72ff 100%);
}
.package-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:58px;align-items:center}
.package-detail-hero .eyebrow,.package-detail-hero h1,.package-detail-hero p{color:#fff}
.package-detail-hero .eyebrow{margin-top:26px;color:#cfe0ff}
.package-detail-hero .body-lg{max-width:690px;color:rgba(255,255,255,.78)}
.package-back{color:rgba(255,255,255,.76);font-size:12px;font-weight:700}
.package-back:hover{color:#fff}
.package-price{margin-top:22px;font-size:30px;font-weight:800}
.package-ghost-btn{border-color:rgba(255,255,255,.52);color:#fff}
.package-ghost-btn:hover{background:rgba(255,255,255,.11);color:#fff}
.package-visual{position:relative;aspect-ratio:1.25;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08)}
.package-visual::before,.package-visual::after,.package-visual span{position:absolute;content:"";border:1px solid rgba(255,255,255,.3)}
.package-visual::before{inset:9% 15% 25% 9%}
.package-visual::after{inset:28% 8% 8% 32%}
.package-visual span:nth-child(1){width:54px;height:54px;right:12%;top:10%;background:#fff}
.package-visual span:nth-child(2){width:82px;height:5px;left:14%;top:22%;background:#76a5ff;border:0}
.package-visual span:nth-child(3){width:35%;height:7px;left:38%;bottom:18%;background:#fff;border:0}
.package-visual strong{position:absolute;left:15%;bottom:13%;font-size:20px}
.package-benefits{padding:64px 0}
.package-benefit-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.package-benefit-list li{padding:17px 18px 17px 48px;background:#fff;position:relative;font-size:13px;font-weight:650}
.package-benefit-list li::before{content:"✓";position:absolute;left:17px;color:var(--primary);font-weight:900}
.package-composition{padding:66px 0}
.package-table-wrap{overflow:auto;border:1px solid var(--line)}
.package-table{width:100%;min-width:760px;border-collapse:collapse;background:#fff}
.package-table th,.package-table td{padding:16px 18px;border-bottom:1px solid var(--line);text-align:left;font-size:12px}
.package-table thead th{background:var(--primary);color:#fff;font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.package-table tbody th{width:18%;color:var(--primary)}
.package-table tbody td{color:var(--muted)}
.package-route{padding:64px 0}
.package-route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.package-route-grid article{min-height:140px;padding:20px;border:1px solid var(--line);background:#fff}
.package-route-grid span{color:var(--primary);font-size:11px;font-weight:800}
.package-route-grid h3{margin-top:22px;font-size:17px}
.package-final{padding:0 0 60px}

@media(max-width:1150px){
  .hero-v2-grid{grid-template-columns:1fr 440px}
  .nav-links{gap:17px}
  .footer-main{grid-template-columns:1fr 1fr;grid-template-areas:"brand links" "map map"}
  .portfolio-mosaic{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  :root{--header-h:60px}
  .hero-v2-grid{grid-template-columns:1fr;padding:34px 24px 28px}
  .hero-analytics-wrap{min-height:500px}
  .audience-grid{grid-template-columns:repeat(2,1fr)}
  .process-types{margin-inline:8px}
  #ppc .grid-2{grid-template-columns:1fr;gap:24px}
  #ppc .order-2{translate:none}
  .ppc-summary-grid{grid-template-columns:1fr}
  .cases-browser{grid-template-columns:1fr}
  .cases-sidebar{position:static!important}
  .cases-side-filters{display:flex;flex-wrap:wrap}
  .cases-quick-nav,.cases-found{display:none}
  .reviews-grid--full{grid-template-columns:1fr 1fr}
  .reviews-official-head,.package-hero-grid{grid-template-columns:1fr}
  .package-visual{max-width:550px;width:100%}
}
@media(max-width:640px){
  .hero-v2-title{font-size:clamp(39px,12vw,52px)}
  .hero-v2-benefits{grid-template-columns:1fr;gap:10px}
  .hero-analytics-wrap{min-height:480px}
  .hero-analytics{height:390px}
  #audiences{padding:48px 0}
  .audience-grid{grid-template-columns:1fr 1fr}
  .audience-card{min-height:170px;padding:16px}
  .audience-action span:first-child{max-width:80%}
  .process-v2-section{padding-bottom:48px}
  .process-types button{flex:1;padding-inline:8px}
  .reviews-actions .btn{width:100%}
  .footer-main{grid-template-columns:1fr;grid-template-areas:"brand" "map" "links"}
  .footer-map{height:190px}
  .portfolio-mosaic{grid-template-columns:1fr;grid-auto-rows:285px}
  .portfolio-card:nth-child(n){grid-row:span 1}
  .github-trust-inner{grid-template-columns:48px 1fr}
  .github-mark{width:48px;height:48px}
  .github-trust-inner .btn{grid-column:1/-1}
  .reviews-grid--full{grid-template-columns:1fr}
  .testimonial-card{min-height:240px}
  .package-detail-hero{padding:43px 0}
  .package-visual{display:none}
  .package-route-grid{grid-template-columns:1fr}
  .package-final .promo-dark{align-items:flex-start}
}

/* =========================================================
   2026-07 visual polish: navigation, motion and case stories
   ========================================================= */
@media(min-width:1025px){
  .nav-bar{
    display:grid;
    grid-template-columns:minmax(210px,1fr) auto minmax(310px,1fr);
    gap:24px;
  }
  .nav-links{justify-self:center;margin:0;gap:31px}
  .nav-actions{justify-self:end}
  .nav-links>a,.nav-links .nav-trigger{white-space:nowrap}
  .dropdown{min-width:272px;padding:12px;align-items:stretch}
  .services-dropdown{min-width:300px}
  .dropdown a{width:100%;padding:13px 17px;justify-content:flex-start}
}

/* Static analytics object with a digital, product-like motion layer */
.hero-analytics{cursor:default;pointer-events:none;overflow:visible;animation:heroCardBreath 5.6s ease-in-out infinite}
.hero-analytics-inner,
.hero-analytics:hover .hero-analytics-inner,
.hero-analytics:focus-visible .hero-analytics-inner{transform:none!important;scale:1!important;filter:drop-shadow(0 27px 38px rgba(12,31,68,.2))}
.hero-orbit{animation:heroOrbit 18s linear infinite!important;will-change:transform}
.hero-orbit::before{animation:orbitSquare 8s ease-in-out infinite}
.hero-orbit::after{animation:orbitSquare 6.5s ease-in-out -2s infinite reverse}
.analytics-digital-layer{position:absolute;inset:-34px;z-index:-1;pointer-events:none}
.analytics-digital-layer i{position:absolute;width:9px;height:9px;border-radius:50%;background:#77a5ff;box-shadow:0 0 0 6px rgba(20,84,232,.08);animation:digitalNode 3.2s ease-in-out infinite}
.analytics-digital-layer i::after{content:"";position:absolute;left:8px;top:4px;width:72px;height:1px;background:linear-gradient(90deg,#77a5ff,transparent);transform-origin:left}
.analytics-digital-layer i:nth-child(1){left:4%;top:5%}
.analytics-digital-layer i:nth-child(2){right:0;top:20%;animation-delay:-.6s}
.analytics-digital-layer i:nth-child(2)::after{left:auto;right:8px;transform:rotate(180deg)}
.analytics-digital-layer i:nth-child(3){left:-2%;top:58%;animation-delay:-1.2s}
.analytics-digital-layer i:nth-child(4){right:2%;bottom:7%;animation-delay:-1.8s}
.analytics-digital-layer i:nth-child(4)::after{left:auto;right:8px;transform:rotate(180deg)}
.analytics-digital-layer i:nth-child(5){left:27%;bottom:-1%;animation-delay:-2.4s}
.analytics-digital-layer i:nth-child(6){right:25%;top:-2%;animation-delay:-3s}
.hero-analytics-wrap::before,.hero-analytics-wrap::after{position:absolute;z-index:3;color:rgba(20,84,232,.55);font:800 16px/1 monospace;letter-spacing:.12em;animation:codeFloat 4s ease-in-out infinite;pointer-events:none}
.hero-analytics-wrap::before{content:"</>";left:5%;top:15%}
.hero-analytics-wrap::after{content:"{ 01 }";right:3%;bottom:14%;animation-delay:-2s}
@keyframes heroCardBreath{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes orbitSquare{0%,100%{transform:rotate(8deg) scale(1)}50%{transform:rotate(28deg) scale(.88)}}
@keyframes digitalNode{0%,100%{opacity:.35;transform:scale(.7)}50%{opacity:1;transform:scale(1.15)}}
@keyframes codeFloat{0%,100%{translate:0 0;opacity:.35}50%{translate:0 -9px;opacity:.9}}

/* Business spheres: useful microcopy and a clearer affordance */
.audience-card{min-height:205px}
.audience-card>p{display:block;margin:0 0 13px;max-width:91%;font-size:11.5px;line-height:1.45;color:var(--muted)}
.audience-action{width:100%;align-items:center}
.audience-action span:last-child{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:#fff;font-size:18px;font-weight:800;box-shadow:0 7px 16px rgba(20,84,232,.23);transition:transform .22s,box-shadow .22s}
.audience-card:hover .audience-action span:last-child{transform:translateX(3px) rotate(-8deg);box-shadow:0 9px 23px rgba(20,84,232,.32)}
.solution-visual{isolation:isolate;overflow:hidden;background:#103da4;color:#fff;padding:34px}
.solution-image{position:absolute;inset:0;z-index:-2;background-image:linear-gradient(180deg,rgba(6,30,91,.2),rgba(5,24,74,.88)),var(--solution-image);background-size:cover;background-position:center;filter:saturate(.72) contrast(1.05);transform:scale(1.06);animation:solutionImageMove 12s ease-in-out infinite alternate}
.solution-visual::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(120deg,rgba(20,84,232,.36),transparent 58%);pointer-events:none}
.solution-visual-copy{position:relative;margin-top:auto}
.solution-visual small{color:#c9dafe}
.solution-visual h3{color:#fff;max-width:430px}
@keyframes solutionImageMove{from{transform:scale(1.06) translate3d(-1%,0,0)}to{transform:scale(1.14) translate3d(2%,-1%,0)}}

/* Process line, animated states and outlined geometry */
.process-progress-line{left:8.333%;right:8.333%;overflow:visible}
.process-progress-line span{position:relative}
.process-progress-line span::after{content:"";position:absolute;right:-5px;top:-4px;width:11px;height:11px;border-radius:50%;background:#80aaff;box-shadow:0 0 0 8px rgba(20,84,232,.16);opacity:0;transition:opacity .2s}
.process-progress-line span:not([style*="width: 0"])::after{opacity:1}
.process-marker.passed b{background:#103da4;border-color:#3777ff;color:#fff}
.process-marker.active b{background:linear-gradient(135deg,#1454e8,#3980ff);box-shadow:0 0 0 9px rgba(20,84,232,.15);animation:markerLiquid .55s cubic-bezier(.2,.9,.3,1)}
.process-marker.active b::after{content:"";position:absolute;inset:3px;border:1px solid rgba(255,255,255,.32);border-radius:50%}
.process-v2-head::before{content:"";position:absolute;width:72px;height:72px;border:1px solid rgba(121,165,255,.18);right:27%;top:-3%;transform:rotate(42deg);animation:processFloat 7s ease-in-out infinite alternate}
.process-v2-body::after{content:"";position:absolute;pointer-events:none;inset:0;background-image:linear-gradient(rgba(121,165,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(121,165,255,.035) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(90deg,transparent,#000 35%,transparent);z-index:-1}
.process-stage-card{transition:opacity .24s ease,transform .34s cubic-bezier(.16,1,.3,1)}
.process-v2[data-motion="next"] .process-stage-card.is-anim{animation:stageNext .45s cubic-bezier(.16,1,.3,1)}
.process-v2[data-motion="prev"] .process-stage-card.is-anim{animation:stagePrev .45s cubic-bezier(.16,1,.3,1)}
@keyframes markerLiquid{0%{transform:scale(.74) rotate(-12deg);border-radius:42% 58% 62% 38%}65%{transform:scale(1.08) rotate(3deg);border-radius:57% 43% 45% 55%}100%{transform:scale(1);border-radius:50%}}
@keyframes stageNext{from{opacity:.25;transform:translateX(28px) scale(.985)}to{opacity:1;transform:none}}
@keyframes stagePrev{from{opacity:.25;transform:translateX(-28px) scale(.985)}to{opacity:1;transform:none}}

/* Service outcome stacks and three ROWS for PPC summary */
.service-outcome-stack{display:grid;gap:12px;align-self:center}
.service-outcome-stack article{position:relative;padding:22px 23px 22px 63px;border:1px solid var(--line);border-radius:19px;background:var(--paper);box-shadow:0 12px 30px rgba(20,52,105,.055);transition:transform .22s,border-color .22s}
.service-outcome-stack article::before{display:none}
.service-outcome-stack article>span{position:absolute;left:20px;top:20px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--cloud-blue);color:var(--primary);font-size:10px;font-weight:800}
.service-outcome-stack article:hover{transform:translateX(-5px);border-color:#8eb1ff}
.service-outcome-stack h3{font-size:16px;margin:0 0 7px}
.service-outcome-stack p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
#ppc .order-2{translate:none;padding:0;background:transparent;border:0;box-shadow:none}
.ppc-summary-grid{grid-template-columns:1fr!important;gap:8px!important;background:transparent!important;border:0!important;margin:20px 0}
.ppc-summary-grid span{display:block;padding:11px 14px 11px 39px!important;min-height:0!important;border:1px solid var(--line)!important;background:var(--paper);position:relative;line-height:1.42}
.ppc-summary-grid span::before{content:"";position:absolute;left:15px;top:17px;width:8px;height:8px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 5px var(--cloud-blue)}

/* Package cards use their full height; decorative layers never block buttons */
.pricing-grid{align-items:stretch}
.price-card{min-height:490px}
.price-card .card-list{margin-bottom:22px}
.price-card .btn{margin-top:auto;width:100%}
.promo-dark::after,.package-detail-hero::before,.package-detail-hero::after,.package-visual::before,.package-visual::after{pointer-events:none}
.promo-dark>*{position:relative;z-index:2}
.btn-service-pick,.package-white-btn,.promo-dark .btn,.package-detail-hero .btn{position:relative;z-index:5;pointer-events:auto;touch-action:manipulation}
.btn-service-pick:active,.package-white-btn:active,.promo-dark .btn:active,.package-detail-hero .btn:active{transform:translateY(1px) scale(.98)}
.package-visual{padding:9%;display:grid;place-items:center;overflow:hidden}
.package-visual::before,.package-visual::after{display:none}
.package-browser{position:relative;width:86%;height:75%;border:1px solid rgba(255,255,255,.55);background:rgba(9,45,147,.2);box-shadow:0 24px 45px rgba(1,24,94,.24);animation:browserFloat 5s ease-in-out infinite}
.package-visual span{position:static!important;inset:auto!important;width:auto!important;height:auto!important;border:0!important;background:transparent!important}
.package-browser-top{height:11%;display:flex;align-items:center;gap:6px;padding:0 10px;border-bottom:1px solid rgba(255,255,255,.32)}
.package-browser-top i{width:5px;height:5px;border-radius:50%;background:#fff;opacity:.75}
.package-browser-hero{height:45%;padding:9%;display:flex;flex-direction:column;gap:9px;border-bottom:1px solid rgba(255,255,255,.2)}
.package-browser-hero b{width:55%;height:7px;background:#fff}
.package-visual .package-browser-hero span{display:block;width:78%!important;height:4px!important;background:rgba(255,255,255,.42)!important}
.package-visual .package-browser-hero span:nth-child(3){width:62%!important}
.package-browser-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:8%}
.package-browser-grid i{height:35px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08)}
.package-browser-action{position:absolute;left:9%;bottom:8%;width:29%;height:8px;background:#fff}
.package-signal{position:absolute;right:3%;bottom:3%;width:98px;padding:13px;background:#fff;color:#1454e8;box-shadow:0 16px 34px rgba(3,23,78,.25)}
.package-signal i{display:inline-block;width:6px;margin-right:3px;background:#1454e8;transform-origin:bottom;animation:signalBars 1.7s ease-in-out infinite}
.package-signal i:nth-child(1){height:11px}.package-signal i:nth-child(2){height:19px;animation-delay:-.35s}.package-signal i:nth-child(3){height:27px;animation-delay:-.7s}
.package-signal span{display:block;margin-top:8px;font-size:9px;font-weight:800;letter-spacing:.08em}
@keyframes browserFloat{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-9px) rotate(.5deg)}}
@keyframes signalBars{0%,100%{transform:scaleY(.55);opacity:.55}50%{transform:scaleY(1);opacity:1}}

/* Cases listing begins with the actual menu, not another blue billboard */
.cases-workspace{padding-top:36px}
.cases-sidebar{top:calc(var(--header-h) + 22px)}
.portfolio-tile{height:100%}

/* Full case stories */
.case-study-hero{position:relative;padding:72px 0 62px;background:linear-gradient(125deg,#0a328f,#1454e8 62%,#3478ff);color:#fff;overflow:hidden}
.case-study-hero::after{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(255,255,255,.22);border-radius:50%;right:-110px;top:-170px;animation:heroOrbit 18s linear infinite}
.case-study-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);gap:62px;align-items:center}
.case-study-hero .eyebrow,.case-study-hero .body-lg{color:#dce7ff}
.case-study-hero h1{max-width:760px;margin:16px 0}
.case-study-hero .body-lg{max-width:700px}
.case-study-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}
.case-study-cover{position:relative;min-height:420px;border:1px solid rgba(255,255,255,.32);padding:28px;background:rgba(255,255,255,.08);box-shadow:0 28px 70px rgba(3,22,77,.35)}
.case-study-cover img{width:100%;height:100%;min-height:362px;object-fit:cover;filter:saturate(.82);box-shadow:0 20px 44px rgba(3,22,77,.24)}
.case-study-cover::before{content:"PROJECT / 01";position:absolute;z-index:2;top:13px;right:20px;font-size:9px;font-weight:800;letter-spacing:.15em}
.case-metrics{padding:0;transform:translateY(-1px);background:#fff}
.case-metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--line)}
.case-metric{padding:28px 30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.case-metric strong{display:block;color:var(--primary);font-size:clamp(29px,3vw,43px);line-height:1}
.case-metric span{display:block;margin-top:8px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.case-story{padding:78px 0}
.case-story-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}
.case-story-copy p{color:var(--muted);line-height:1.7}
.case-route{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-self:center}
.case-route::before{content:"";position:absolute;left:10%;right:10%;top:33px;height:2px;background:linear-gradient(90deg,#1454e8,#74a5ff);transform-origin:left;animation:routeDraw 2.8s ease-in-out infinite alternate}
.case-route article{position:relative;z-index:1;padding:17px;background:var(--paper);border:1px solid var(--line);min-height:156px}
.case-route b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:#fff;font-size:11px;box-shadow:0 0 0 7px var(--paper)}
.case-route h3{font-size:15px;margin:24px 0 7px}
.case-route p{font-size:12px;color:var(--muted);line-height:1.5}
@keyframes routeDraw{from{transform:scaleX(.12);opacity:.45}to{transform:scaleX(1);opacity:1}}
.case-screens{padding:72px 0;background:var(--cloud)}
.case-screens-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:27px}
.case-screens-head p{max-width:600px;color:var(--muted)}
.screen-gallery{display:grid;grid-template-columns:1.25fr .75fr .75fr;gap:14px}
.screen-placeholder{position:relative;min-height:360px;display:flex;flex-direction:column;justify-content:flex-end;padding:25px;border:1px solid #aac1ef;background:linear-gradient(150deg,#edf3ff,#dce8ff);overflow:hidden}
.screen-placeholder:nth-child(2),.screen-placeholder:nth-child(3){min-height:300px}
.screen-placeholder::before{content:"";position:absolute;inset:12%;border:1px solid rgba(20,84,232,.25);background-image:linear-gradient(rgba(20,84,232,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(20,84,232,.08) 1px,transparent 1px);background-size:28px 28px}
.screen-placeholder span,.screen-placeholder small{position:relative;z-index:1}
.screen-placeholder span{font-size:18px;font-weight:800}
.screen-placeholder small{margin-top:4px;color:var(--muted)}
.case-analysis{padding:76px 0}
.case-analysis-grid{display:grid;grid-template-columns:.65fr 1.35fr;gap:65px}
.case-data-table{border:1px solid var(--line)}
.case-data-row{display:grid;grid-template-columns:.75fr 1.25fr 1fr;border-bottom:1px solid var(--line)}
.case-data-row:last-child{border-bottom:0}
.case-data-row>*{padding:17px 19px;border-right:1px solid var(--line)}
.case-data-row>*:last-child{border-right:0}
.case-data-row.head{background:#0e1724;color:#fff;font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.case-data-row:not(.head){font-size:13px;color:var(--muted)}
.case-data-row:not(.head) strong{color:var(--ink)}
.case-final{padding:0 0 76px}
.case-final .promo-dark{border-radius:22px}

/* Contact details need breathing room between symbol and text */
.contact-list{display:grid;gap:13px}
.contact-item{grid-template-columns:56px 1fr;gap:22px;padding:13px 15px;border:1px solid transparent;transition:border-color .2s,background .2s}
.contact-item:hover{border-color:var(--line);background:var(--cloud)}
.contact-item strong{display:block;margin-top:4px}

@media(max-width:1024px){
  .case-study-grid,.case-story-grid,.case-analysis-grid{grid-template-columns:1fr}
  .case-study-cover{min-height:360px}
  .screen-gallery{grid-template-columns:1fr 1fr}
  .screen-placeholder:first-child{grid-column:1/-1}
}
@media(max-width:640px){
  .hero-analytics-wrap::before,.hero-analytics-wrap::after{display:none}
  .hero-analytics{animation-duration:6.5s}
  .audience-card{min-height:206px}
  .audience-card>p{font-size:10.5px}
  .solution-visual{min-height:300px}
  .process-progress-line{left:47px;right:47px}
  .price-card{min-height:0}
  .case-study-hero{padding:46px 0}
  .case-study-grid{gap:30px}
  .case-study-cover{min-height:270px;padding:16px}
  .case-study-cover img{min-height:238px}
  .case-metrics-grid{grid-template-columns:1fr}
  .case-metric{padding:20px}
  .case-story,.case-screens,.case-analysis{padding:52px 0}
  .case-route{grid-template-columns:1fr}
  .case-route::before{left:16px;right:auto;top:12%;bottom:12%;width:2px;height:auto}
  .screen-gallery{grid-template-columns:1fr}
  .screen-placeholder:first-child{grid-column:auto}
  .screen-placeholder{min-height:270px!important}
  .case-data-table{overflow-x:auto}
  .case-data-row{min-width:570px}
}

/* Company, business, knowledge and data pages */
.company-hero,.business-hero,.knowledge-hero,.policy-hero{position:relative;overflow:hidden;background:linear-gradient(125deg,#0a328f,#1454e8 60%,#3379ff);color:#fff}
.company-hero,.business-hero{padding:72px 0}
.company-hero::before,.business-hero::before,.knowledge-hero::before,.policy-hero::before{content:"";position:absolute;width:430px;height:430px;border:1px solid rgba(255,255,255,.16);border-radius:50%;right:-160px;top:-230px;animation:heroOrbit 20s linear infinite}
.company-hero-grid,.business-hero-grid,.knowledge-hero-grid,.policy-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.company-hero .breadcrumbs,.business-hero .breadcrumbs,.knowledge-hero .breadcrumbs,.policy-hero .breadcrumbs{color:#ccdcff}
.company-hero .breadcrumbs a,.business-hero .breadcrumbs a,.knowledge-hero .breadcrumbs a,.policy-hero .breadcrumbs a{color:#fff}
.company-hero .eyebrow,.business-hero .eyebrow,.knowledge-hero .eyebrow,.policy-hero .eyebrow{color:#dbe7ff}
.company-hero h1,.business-hero h1,.knowledge-hero h1,.policy-hero h1{margin:14px 0;max-width:820px}
.company-hero .body-lg,.business-hero .body-lg,.knowledge-hero .body-lg,.policy-hero .body-lg{color:#dce7ff;max-width:720px}
.agency-live-board{height:390px;border:1px solid rgba(255,255,255,.34);background:rgba(255,255,255,.08);backdrop-filter:blur(8px);box-shadow:0 30px 70px rgba(3,23,79,.28)}
.board-top{height:48px;padding:0 18px;display:flex;gap:7px;align-items:center;border-bottom:1px solid rgba(255,255,255,.22);font-size:9px;font-weight:800;letter-spacing:.14em}
.board-top span{margin-right:auto}.board-top i{width:7px;height:7px;border-radius:50%;background:#fff;opacity:.5}
.board-canvas{position:relative;height:342px}
.board-canvas svg{position:absolute;inset:8%;width:84%;height:84%;fill:none;stroke:rgba(255,255,255,.42);stroke-width:1.5;stroke-dasharray:6 8}
.board-canvas path:first-child{animation:boardRoute 7s linear infinite}.board-canvas path:last-child{animation:boardRoute 8s linear -3s infinite reverse}
.board-node{position:absolute;z-index:2;padding:10px 13px;border:1px solid rgba(255,255,255,.45);background:#1248c5;font-size:10px;font-weight:800;box-shadow:0 12px 25px rgba(3,23,79,.22);animation:nodeFloat 5s ease-in-out infinite}
.board-node.n1{left:8%;top:13%}.board-node.n2{left:40%;top:33%;animation-delay:-1s}.board-node.n3{right:9%;top:10%;animation-delay:-2s}.board-node.n4{right:16%;bottom:14%;animation-delay:-3s}
@keyframes boardRoute{to{stroke-dashoffset:-90}}
@keyframes nodeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.agency-story{padding:84px 0}
.agency-story-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:70px;align-items:center}
.agency-photo{height:610px;overflow:hidden;border-radius:28px;box-shadow:0 32px 70px rgba(20,52,105,.18)}
.agency-photo img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.agency-photo:hover img{transform:scale(1.025)}
.agency-story-grid article>p{color:var(--muted);line-height:1.7}
.agency-principles{display:grid;grid-template-columns:1fr 1fr;margin-top:28px;border:1px solid var(--line)}
.agency-principles span{position:relative;padding:17px 17px 17px 43px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:12px;font-weight:800}
.agency-principles span:nth-child(2n){border-right:0}.agency-principles span:nth-last-child(-n+2){border-bottom:0}
.agency-principles span::before{content:"✓";position:absolute;left:17px;color:var(--primary);font-size:16px}
.agency-capabilities{padding:78px 0;background:#0e1724;color:#fff;overflow:hidden}
.agency-capabilities .eyebrow{color:#78a6ff}
.capability-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #344053}
.capability-grid article{position:relative;min-height:260px;padding:27px;border-right:1px solid #344053;overflow:hidden}
.capability-grid article:last-child{border-right:0}
.capability-grid article::after{content:"";position:absolute;width:110px;height:110px;border:1px solid rgba(121,165,255,.2);right:-38px;bottom:-42px;transform:rotate(30deg);transition:transform .5s}
.capability-grid article:hover::after{transform:rotate(75deg) scale(1.15)}
.capability-grid b{color:#79a5ff;font-size:12px}.capability-grid h3{margin:58px 0 10px;font-size:20px}.capability-grid p{color:#aeb9c8;font-size:13px;line-height:1.6}
.agency-flow-section{padding:72px 0;background:var(--cloud)}
.agency-flow-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px;align-items:center}
.agency-flow{display:flex;align-items:center;padding:28px;border:1px solid var(--line);background:var(--paper);overflow:hidden}
.agency-flow span{flex:0 0 auto;padding:13px 15px;background:var(--primary);color:#fff;font-size:11px;font-weight:800}
.agency-flow i{position:relative;display:block;flex:1;height:2px;background:#bcd0f4;overflow:hidden}
.agency-flow i::after{content:"";position:absolute;left:-35%;top:0;width:35%;height:100%;background:#1454e8;animation:flowSignal 2.4s linear infinite}
.agency-flow i:nth-of-type(2)::after{animation-delay:-.8s}.agency-flow i:nth-of-type(3)::after{animation-delay:-1.6s}
@keyframes flowSignal{to{left:110%}}

.business-dashboard{height:390px;padding:28px;border:1px solid rgba(255,255,255,.34);background:rgba(255,255,255,.08);box-shadow:0 30px 70px rgba(3,23,79,.25)}
.dash-head{display:flex;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.2);font-size:9px;font-weight:800;letter-spacing:.14em}.dash-head i{width:8px;height:8px;border-radius:50%;background:#8eb5ff;box-shadow:0 0 0 7px rgba(255,255,255,.08)}
.dash-chart{height:210px;display:flex;align-items:end;gap:16px;padding:30px 8px 16px;border-bottom:1px solid rgba(255,255,255,.2)}
.dash-chart b{flex:1;height:var(--h);background:linear-gradient(#77a6ff,#fff);transform-origin:bottom;animation:dashBar 2.2s cubic-bezier(.16,1,.3,1) infinite alternate}
.dash-chart b:nth-child(2){animation-delay:-.4s}.dash-chart b:nth-child(3){animation-delay:-.8s}.dash-chart b:nth-child(4){animation-delay:-1.2s}.dash-chart b:nth-child(5){animation-delay:-1.6s}
.dash-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding-top:15px}.dash-cards span{padding:11px;border:1px solid rgba(255,255,255,.2);font-size:10px}.dash-cards strong{float:right;color:#bcd3ff}
@keyframes dashBar{from{transform:scaleY(.78);opacity:.65}to{transform:scaleY(1);opacity:1}}
.business-signals{padding:78px 0}.business-signal-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}
.business-signal-grid article{min-height:230px;padding:27px;border-right:1px solid var(--line);transition:background .22s,transform .22s}.business-signal-grid article:last-child{border-right:0}.business-signal-grid article:hover{background:var(--cloud-blue);transform:translateY(-5px)}.business-signal-grid span{color:var(--primary);font-size:11px;font-weight:800}.business-signal-grid h3{font-size:20px;margin:58px 0 9px}.business-signal-grid p{color:var(--muted);font-size:13px;line-height:1.6}
.business-matrix{padding:78px 0;background:var(--cloud)}.business-matrix-grid{display:grid;grid-template-columns:.65fr 1.35fr;gap:65px}.matrix-table{border:1px solid var(--line);background:var(--paper)}.matrix-row{display:grid;grid-template-columns:.85fr 1.15fr 1fr;border-bottom:1px solid var(--line)}.matrix-row:last-child{border-bottom:0}.matrix-row>*{padding:18px;border-right:1px solid var(--line)}.matrix-row>*:last-child{border-right:0}.matrix-row.head{background:#0e1724;color:#fff;text-transform:uppercase;font-size:9px;font-weight:800;letter-spacing:.09em}.matrix-row:not(.head){font-size:13px;color:var(--muted)}.matrix-row strong{color:var(--ink)}
.business-docs{padding:76px 0}.doc-ribbon{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid var(--line)}.doc-ribbon span{position:relative;min-height:110px;padding:58px 15px 15px;border-right:1px solid var(--line);font-size:11px;font-weight:800}.doc-ribbon span:last-child{border-right:0}.doc-ribbon span::before{content:counter(doc);counter-increment:doc;position:absolute;left:15px;top:15px;color:var(--primary);font-size:11px}.doc-ribbon{counter-reset:doc}

.knowledge-hero{padding:66px 0}.knowledge-orbit{position:relative;width:360px;height:360px;border:1px solid rgba(255,255,255,.28);border-radius:50%;justify-self:center;animation:knowledgeSpin 28s linear infinite}.knowledge-orbit::before{content:"";position:absolute;inset:22%;border:1px solid rgba(255,255,255,.22);border-radius:50%}.knowledge-orbit b{position:absolute;inset:34%;display:grid;place-items:center;text-align:center;border-radius:50%;background:#fff;color:#1454e8;font-size:17px;line-height:1.1;animation:knowledgeSpin 28s linear infinite reverse}.knowledge-orbit span{position:absolute;padding:8px 10px;border:1px solid rgba(255,255,255,.35);background:#1248c5;font-size:9px;font-weight:800;letter-spacing:.09em;animation:knowledgeSpin 28s linear infinite reverse}.knowledge-orbit span:nth-child(1){left:2%;top:44%}.knowledge-orbit span:nth-child(2){right:10%;top:12%}.knowledge-orbit span:nth-child(3){right:0;bottom:28%}.knowledge-orbit span:nth-child(4){left:21%;bottom:3%}
@keyframes knowledgeSpin{to{transform:rotate(360deg)}}
.blog-index{padding:72px 0}.blog-index-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}.blog-pulse{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:10px}.blog-pulse i{width:7px;height:7px;border-radius:50%;background:#1454e8;animation:digitalNode 1.8s ease-in-out infinite}.blog-pulse i:nth-child(2){animation-delay:-.6s}.blog-pulse i:nth-child(3){animation-delay:-1.2s}.blog-pulse span{margin-left:7px}
.blog-grid-v2{grid-template-columns:repeat(3,1fr)}.blog-grid-v2 .blog-card{border-radius:16px!important;overflow:hidden;transition:transform .25s,box-shadow .25s}.blog-grid-v2 .blog-card:hover{transform:translateY(-8px);box-shadow:0 24px 48px rgba(20,52,105,.14)}.blog-grid-v2 .blog-thumb{position:relative;height:180px;padding:19px;background:linear-gradient(135deg,#0c3aab,#2670ff);color:#fff;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.blog-grid-v2 .blog-thumb::after{content:"";position:absolute;width:150px;height:150px;border:1px solid rgba(255,255,255,.25);right:-45px;bottom:-70px;transform:rotate(25deg);transition:transform .5s}.blog-grid-v2 .blog-card:hover .blog-thumb::after{transform:rotate(75deg) scale(1.14)}.blog-grid-v2 .blog-thumb span{font-size:10px;font-weight:800}.blog-grid-v2 .blog-thumb b{font-size:18px}.blog-grid-v2 .blog-body{display:flex;flex-direction:column;min-height:260px}.blog-grid-v2 .blog-body .btn-text{margin-top:auto}

.policy-hero{padding:62px 0}.policy-hero-grid{grid-template-columns:1.2fr .8fr}.data-flow{display:flex;align-items:center;justify-content:center;gap:10px;padding:27px;border:1px solid rgba(255,255,255,.32);background:rgba(255,255,255,.08)}.data-flow span{padding:12px;background:#fff;color:#1454e8;font-size:9px;font-weight:800}.data-flow i{font-style:normal;color:#a9c4ff;animation:dataArrow 1.5s ease-in-out infinite}@keyframes dataArrow{50%{transform:translateX(4px);color:#fff}}
.policy-section{padding:68px 0;background:var(--cloud)}.policy-layout{display:grid;grid-template-columns:260px 1fr;gap:25px;align-items:start}.policy-nav{position:sticky;top:calc(var(--header-h) + 22px);display:flex;flex-direction:column;padding:20px;background:#0e1724;color:#fff}.policy-nav span{padding-bottom:13px;margin-bottom:8px;border-bottom:1px solid #344053;color:#79a5ff;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.policy-nav a{padding:9px 5px;color:#b7c2d2;font-size:12px}.policy-nav a:hover{color:#fff;transform:translateX(3px)}.policy-layout .policy-doc{max-width:none;margin:0;padding:42px 50px;background:var(--paper);border:1px solid var(--line);box-shadow:none}.policy-doc h2{scroll-margin-top:calc(var(--header-h) + 24px)}.data-principles{padding:0 0 70px;background:var(--cloud)}.data-principle-grid{display:grid;grid-template-columns:repeat(3,1fr);background:var(--paper);border:1px solid var(--line)}.data-principle-grid article{padding:25px;border-right:1px solid var(--line)}.data-principle-grid article:last-child{border-right:0}.data-principle-grid b{color:var(--primary);font-size:11px}.data-principle-grid h3{margin:22px 0 7px}.data-principle-grid p{color:var(--muted);font-size:13px}

@media(max-width:1024px){
  .company-hero-grid,.business-hero-grid,.knowledge-hero-grid,.policy-hero-grid,.agency-story-grid,.agency-flow-grid,.business-matrix-grid{grid-template-columns:1fr}
  .agency-live-board,.business-dashboard{max-width:680px;width:100%}
  .agency-photo{height:520px}
  .capability-grid,.business-signal-grid{grid-template-columns:1fr 1fr}
  .capability-grid article:nth-child(2),.business-signal-grid article:nth-child(2){border-right:0}
  .capability-grid article:nth-child(-n+2),.business-signal-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .doc-ribbon{grid-template-columns:repeat(3,1fr)}
  .doc-ribbon span:nth-child(3n){border-right:0}.doc-ribbon span:nth-child(-n+3){border-bottom:1px solid var(--line)}
  .blog-grid-v2{grid-template-columns:1fr 1fr}
  .policy-layout{grid-template-columns:1fr}.policy-nav{position:static;display:grid;grid-template-columns:repeat(4,1fr)}.policy-nav span{grid-column:1/-1}
}
@media(max-width:640px){
  .company-hero,.business-hero,.knowledge-hero,.policy-hero{padding:46px 0}
  .agency-live-board,.business-dashboard{height:320px}
  .board-canvas{height:272px}.board-node{font-size:8px}
  .agency-story{padding:54px 0}.agency-photo{height:390px;border-radius:18px}
  .agency-principles{grid-template-columns:1fr}.agency-principles span{border-right:0!important;border-bottom:1px solid var(--line)!important}.agency-principles span:last-child{border-bottom:0!important}
  .capability-grid,.business-signal-grid{grid-template-columns:1fr}.capability-grid article,.business-signal-grid article{border-right:0;border-bottom:1px solid #344053}.business-signal-grid article{border-color:var(--line)}.capability-grid article:last-child,.business-signal-grid article:last-child{border-bottom:0}
  .agency-flow{display:grid;grid-template-columns:1fr}.agency-flow i{width:2px;height:28px;justify-self:center}.agency-flow i::after{left:0;top:-35%;width:100%;height:35%;animation:flowSignalY 2.4s linear infinite}@keyframes flowSignalY{to{top:110%}}
  .dash-chart{height:160px}.dash-cards{grid-template-columns:1fr}
  .matrix-table{overflow-x:auto}.matrix-row{min-width:560px}
  .doc-ribbon{grid-template-columns:1fr 1fr}.doc-ribbon span:nth-child(n){border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.doc-ribbon span:nth-child(2n){border-right:0}.doc-ribbon span:nth-last-child(-n+2){border-bottom:0}
  .knowledge-orbit{width:280px;height:280px}
  .blog-grid-v2{grid-template-columns:1fr}.blog-index-head{align-items:flex-start;flex-direction:column}
  .policy-nav{grid-template-columns:1fr 1fr}.policy-layout .policy-doc{padding:26px 20px}.data-flow{flex-wrap:wrap}.data-principle-grid{grid-template-columns:1fr}.data-principle-grid article{border-right:0;border-bottom:1px solid var(--line)}.data-principle-grid article:last-child{border-bottom:0}
}

/* 2026-07 focused corrections: header baseline, plain PPC copy, sphere photos */
@media(min-width:1025px){
  .site-header .nav-bar{align-items:center}
  .site-header .nav-links{height:var(--header-h);align-items:center}
  .site-header .nav-links>a,
  .site-header .nav-links>.nav-item,
  .site-header .nav-links>.nav-item>.nav-trigger{
    box-sizing:border-box;
    height:var(--header-h);
  }
  .site-header .nav-links>a,
  .site-header .nav-links>.nav-item>.nav-trigger{
    display:flex;
    align-items:center;
    padding:0;
    line-height:1;
  }
  .site-header .nav-links>.nav-item{
    display:flex;
    align-items:center;
  }
  .site-header .nav-trigger .chev{
    display:block;
    flex:0 0 12px;
    margin:0;
  }
  .site-header .nav-links>a::after,
  .site-header .nav-links>.nav-item>.nav-trigger::after{
    bottom:13px;
  }
}

.ppc-summary-text{
  max-width:760px;
  margin:12px 0 20px;
  color:var(--muted);
  font-size:16px;
  line-height:1.65;
}

.solution-visual{
  position:relative;
  background:#0a2d79;
}
.solution-image{
  z-index:0;
  opacity:1;
}
.solution-visual::after{z-index:1}
.solution-visual-copy{z-index:2}

/* 2026-07 hero: calm grid, orbital cubes and live analytics */
.hero-v2-grid{
  isolation:isolate;
  background:transparent;
}

/* =========================================================
   SEO SERVICE LANDINGS
   ========================================================= */
.seo-service-hero{
  position:relative;
  overflow:hidden;
  padding:72px 0 76px;
  background:
    radial-gradient(circle at 86% 14%,rgba(89,148,255,.25),transparent 25%),
    linear-gradient(135deg,#eef5ff 0%,#fff 58%,#f0faf8 100%);
  border-bottom:1px solid var(--line)
}
.seo-service-hero::after{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:-180px;
  bottom:-230px;
  border:1px solid rgba(20,84,232,.18);
  border-radius:50%
}
.seo-hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(310px,.6fr);
  gap:64px;
  align-items:center
}
.seo-service-hero h1{max-width:900px;margin:8px 0 20px}
.seo-service-hero .body-lg{max-width:800px}
.seo-honest-note{margin-top:16px;color:var(--muted);font-size:13px}
.seo-hero-panel{
  padding:28px;
  background:#fff;
  border:1px solid var(--line);
  border-top:4px solid var(--primary);
  box-shadow:0 18px 48px rgba(20,48,100,.11)
}
.seo-hero-panel>span{display:block;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.seo-hero-panel>strong{display:block;margin:8px 0;font-size:clamp(25px,2.3vw,34px);line-height:1.15}
.seo-hero-panel>p{color:var(--muted);font-size:13px;line-height:1.55;padding-bottom:17px;border-bottom:1px solid var(--line)}
.seo-hero-panel ul{display:grid;gap:10px;margin-top:17px}
.seo-hero-panel li{position:relative;padding-left:23px;font-size:14px;font-weight:650}
.seo-hero-panel li::before{content:"✓";position:absolute;left:0;color:var(--primary);font-weight:900}
.seo-toc{border-bottom:1px solid var(--line);background:#fff}
.seo-toc .container{display:flex;gap:8px;overflow:auto;padding-top:11px;padding-bottom:11px;scrollbar-width:none}
.seo-toc a{flex:0 0 auto;padding:8px 13px;border:1px solid var(--line);font-size:12px;font-weight:750}
.seo-toc a:hover{border-color:var(--primary);background:var(--sky-2)}
.seo-story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.seo-story-grid article{padding:28px;border:1px solid var(--line);background:#fff}
.seo-story-grid h3{font-size:20px;margin-bottom:12px}
.seo-story-grid p{color:var(--muted);line-height:1.72}
.seo-story-grid .seo-result-card{background:linear-gradient(145deg,#0b348f,#1454e8);color:#fff;border-color:transparent}
.seo-story-grid .seo-result-card p{color:#e3ecff}
.seo-deliverables .card{min-height:210px}
.seo-deliverables .card>span{display:block;color:var(--primary);font-size:12px;font-weight:850;letter-spacing:.08em;margin-bottom:22px}
.seo-deliverables .card h3{font-size:18px;line-height:1.3;margin-bottom:10px}
.seo-deliverables .card p{color:var(--muted);font-size:13px;line-height:1.6}
.seo-fit-grid{gap:72px}
.seo-check-list{display:grid;gap:12px}
.seo-check-list li{position:relative;padding:18px 18px 18px 52px;border:1px solid var(--line);background:#fff;font-weight:650}
.seo-check-list li::before{content:"✓";position:absolute;left:18px;top:17px;width:22px;height:22px;display:grid;place-items:center;background:var(--cloud-blue);color:var(--primary);font-weight:900}
.seo-process{background:linear-gradient(135deg,#101722,#1d2d48);color:#fff}
.seo-process .section-head p{color:#bcc8da;margin-top:14px}
.seo-process .eyebrow{color:#9fc1ff}
.seo-process-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12)}
.seo-process-grid li{min-height:250px;padding:26px 22px;background:#152033}
.seo-process-grid li>span{display:block;color:#8db5ff;font-size:12px;font-weight:850;letter-spacing:.08em;margin-bottom:40px}
.seo-process-grid h3{font-size:17px;line-height:1.3;margin-bottom:12px}
.seo-process-grid p{color:#aebcd0;font-size:13px;line-height:1.58}
.seo-price-grid{display:grid;grid-template-columns:1fr .72fr;gap:70px;align-items:center}
.seo-price-grid .body-lg{margin:14px 0 24px;max-width:700px}
.seo-price-grid .card>h3{font-size:20px;margin-bottom:18px}
.seo-price-grid .seo-check-list li{padding-top:14px;padding-bottom:14px}
.seo-price-grid .seo-check-list li::before{top:13px}
.seo-price-note{color:var(--muted);font-size:12px;line-height:1.6;margin-top:16px}
.seo-related-card{display:flex;flex-direction:column;min-height:270px}
.seo-related-card>span{color:var(--primary);font-size:11px;font-weight:850;letter-spacing:.07em;text-transform:uppercase}
.seo-related-card h3{font-size:20px;line-height:1.3;margin:18px 0 11px}
.seo-related-card p{color:var(--muted);font-size:13px;line-height:1.6;flex:1}
.seo-related-card .btn-text{margin-top:18px}
.cases-intro{padding:62px 0 34px;background:linear-gradient(145deg,#eef5ff,#fff)}
.cases-intro h1{max-width:930px;margin:8px 0 16px}
.cases-intro .body-lg{max-width:760px}
@media(max-width:1050px){
  .seo-hero-grid{grid-template-columns:1fr .7fr;gap:32px}
  .seo-story-grid{grid-template-columns:1fr 1fr}
  .seo-story-grid .seo-result-card{grid-column:1/-1}
  .seo-process-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .seo-service-hero{padding:46px 0 52px}
  .seo-hero-grid,.seo-story-grid,.seo-price-grid{grid-template-columns:1fr}
  .seo-hero-panel{padding:21px}
  .seo-fit-grid{gap:28px}
  .seo-process-grid{grid-template-columns:1fr}
  .seo-process-grid li{min-height:auto}
  .seo-process-grid li>span{margin-bottom:20px}
  .seo-toc .container{width:100%;padding-inline:16px}
  .cases-intro{padding:40px 0 24px}
}
.hero-v2{
  background:linear-gradient(105deg,#fff 0%,#fff 64%,#f7f9fc 100%);
}
.hero-v2::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.48;
  background-image:
    linear-gradient(rgba(126,151,187,.09) 1px,transparent 1px),
    linear-gradient(90deg,rgba(126,151,187,.09) 1px,transparent 1px),
    linear-gradient(112deg,transparent 28%,rgba(197,217,245,.13) 43%,rgba(255,255,255,.72) 50%,rgba(151,181,223,.1) 58%,transparent 72%);
  background-size:42px 42px,42px 42px,230% 100%;
  animation:heroGridShimmer 10s ease-in-out infinite;
}
.hero-v2-grid>*{
  position:relative;
  z-index:1;
}
.hero-v2-benefits>div{
  align-items:center;
}
.hero-v2-benefits p{
  display:flex;
  align-items:center;
  min-height:28px;
  margin:0;
}
.hero-check{
  align-self:center;
}

/* Remove decorative code characters: the hero stays digital without literal code labels. */
.hero-analytics-wrap::before,
.hero-analytics-wrap::after{
  content:none!important;
  display:none!important;
  animation:none!important;
}

.hero-orbit{
  width:450px;
  height:450px;
  background:transparent;
  border:1px solid rgba(78,125,197,.2);
  box-shadow:inset 0 0 0 22px rgba(216,229,248,.05);
  animation:heroOrbit 22s linear infinite!important;
  will-change:transform;
}
.hero-orbit::before,
.hero-orbit::after{
  display:block;
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 16px 32px rgba(27,73,151,.14);
}
.hero-orbit::before{
  left:17px;
  top:38px;
  width:68px;
  height:68px;
  background:linear-gradient(145deg,#2c70f5,#1249c8);
  animation:orbitSquare 7.5s ease-in-out infinite;
}
.hero-orbit::after{
  right:20px;
  bottom:43px;
  width:48px;
  height:48px;
  background:linear-gradient(145deg,#202937,#0d141d);
  animation:orbitSquare 6.4s -2s ease-in-out infinite reverse;
}
.orbit-cube{
  position:absolute;
  display:block;
  border:1px solid rgba(20,84,232,.4);
  background:rgba(238,245,255,.86);
  box-shadow:0 10px 24px rgba(31,78,154,.1);
  animation:orbitCubeCounter 22s linear infinite reverse;
}
.orbit-cube::after{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(20,84,232,.18);
}
.orbit-cube-a{
  width:34px;
  height:34px;
  right:54px;
  top:26px;
}
.orbit-cube-b{
  width:24px;
  height:24px;
  right:-10px;
  top:49%;
  background:rgba(255,255,255,.92);
}
.orbit-cube-c{
  width:39px;
  height:39px;
  left:48px;
  bottom:20px;
  background:rgba(218,233,255,.88);
}

.analytics-chart{
  position:relative;
  overflow:hidden;
}
.analytics-chart i{
  transition:height .9s cubic-bezier(.16,1,.3,1),opacity .35s ease;
}
.hero-analytics.is-live .analytics-chart i{
  height:var(--bar);
  animation:none!important;
}
.analytics-chart::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:-20%;
  width:18%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(90deg,transparent,rgba(126,175,255,.13),transparent);
  transform:skewX(-10deg);
  animation:chartSweep 4.2s 1.2s ease-in-out infinite;
}
.hero-analytics.analytics-pulse .analytics-top strong,
.hero-analytics.analytics-pulse .analytics-grid strong{
  animation:metricPulse .62s cubic-bezier(.16,1,.3,1);
}

@keyframes heroGridShimmer{
  0%,100%{opacity:.37;background-position:0 0,0 0,100% 0}
  50%{opacity:.58;background-position:8px 5px,8px 5px,0 0}
}
@keyframes orbitCubeCounter{
  to{transform:rotate(-360deg)}
}
@keyframes chartSweep{
  0%,12%{opacity:0;transform:translate3d(0,0,0) skewX(-10deg)}
  26%{opacity:.75}
  72%{opacity:.28}
  88%,100%{opacity:0;transform:translate3d(680%,0,0) skewX(-10deg)}
}
@keyframes metricPulse{
  0%{opacity:.58;transform:translateY(4px)}
  100%{opacity:1;transform:none}
}

@media(max-width:760px){
  .hero-v2::after{
    opacity:.34;
    background-size:34px 34px,34px 34px,230% 100%;
  }
  .hero-orbit{
    width:340px;
    height:340px;
  }
  .hero-orbit::before{
    display:block;
    width:48px;
    height:48px;
    left:12px;
    top:29px;
  }
  .hero-orbit::after{
    display:block;
    width:34px;
    height:34px;
    right:14px;
    bottom:32px;
  }
  .orbit-cube-a{right:38px;top:18px}
  .orbit-cube-b{right:-8px}
  .orbit-cube-c{left:34px;bottom:13px}
}
@media(prefers-reduced-motion:reduce){
  .hero-v2::after,
  .hero-orbit,
  .hero-orbit::before,
  .hero-orbit::after,
  .orbit-cube,
  .analytics-chart::after,
  .hero-analytics.analytics-pulse .analytics-top strong,
  .hero-analytics.analytics-pulse .analytics-grid strong{
    animation:none!important;
  }
}

/* =========================================================
   2026-07 responsive system: case-first desktop + mobile pass
   ========================================================= */

/* Case pages: the story leads, the cover supports it. */
@media(min-width:1025px){
  .case-study-hero{
    padding:64px 0;
  }
  .case-study-grid{
    grid-template-columns:minmax(0,1.28fr) minmax(350px,.72fr);
    gap:clamp(42px,5vw,76px);
  }
  .case-study-hero h1{
    max-width:900px;
    font-size:clamp(48px,4.7vw,74px);
    line-height:1.02;
  }
  .case-study-cover{
    width:100%;
    min-height:0;
    aspect-ratio:4/3;
    padding:18px;
  }
  .case-study-cover img{
    width:100%;
    height:100%;
    min-height:0;
    object-fit:cover;
  }
}

@media(max-width:900px){
  html,body{max-width:100%;overflow-x:clip}
  img,svg,video,canvas{max-width:100%}
  .case-study-cover{
    min-height:0;
    aspect-ratio:16/10;
  }
  .case-study-cover img{
    min-height:0;
    height:100%;
  }
  .table-wrap,
  .package-table-wrap,
  .matrix-table{
    max-width:100%;
    overscroll-behavior-inline:contain;
  }
}

@media(max-width:640px){
  :root{
    --header-h:58px;
    --section:48px;
  }
  body{
    font-size:15px;
    line-height:1.48;
  }
  .container,.container-wide{
    width:calc(100% - 28px);
  }
  .section,
  #seo.section,#ppc.section,#sites.section,#packages.section{
    padding:48px 0;
  }
  .section-head{
    margin-bottom:26px;
  }
  .section-head.center{
    text-align:left;
    margin-inline:0;
  }
  .eyebrow{
    margin-bottom:10px;
    font-size:10px;
    letter-spacing:.075em;
  }
  .display-xxl{font-size:clamp(36px,10.8vw,44px);line-height:1.02}
  .display-xl{font-size:clamp(33px,9.7vw,40px);line-height:1.04}
  .display-lg{font-size:clamp(29px,8.4vw,35px);line-height:1.07}
  .display-md{font-size:clamp(24px,7vw,30px)}
  .body-lg{font-size:15px;line-height:1.55}
  .body-md{font-size:14px}
  .btn{
    min-height:44px;
    padding:11px 15px;
    white-space:normal;
    text-align:center;
  }

  /* Compact mobile header with an always-visible request action. */
  .site-header{
    background:#fff;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .nav-bar{
    height:var(--header-h);
    gap:7px;
  }
  .logo{gap:8px}
  .logo-mark{
    width:34px;
    height:34px;
  }
  .logo-mark svg{width:19px;height:19px}
  .logo-text{font-size:15px}
  .logo-text span{display:none}
  .nav-actions{
    gap:6px;
    margin-left:auto;
  }
  .nav-actions>.btn{
    display:inline-flex!important;
    min-height:34px;
    padding:7px 10px;
    font-size:9px;
  }
  .burger{
    display:flex;
    width:36px;
    height:36px;
    border-radius:0;
  }
  .mobile-nav{
    position:fixed;
    top:var(--header-h);
    max-height:calc(100dvh - var(--header-h));
    overflow-y:auto;
    padding:12px 14px 22px;
  }
  .mobile-nav a{padding:11px 7px}

  /* Main hero: copy and actions only on a phone. */
  .hero-v2-grid{
    display:block;
    min-height:0;
    padding:38px 14px 42px;
  }
  .hero-v2-title{
    max-width:100%;
    font-size:clamp(40px,12.4vw,52px);
    line-height:1;
    letter-spacing:-.05em;
  }
  .hero-v2-lead{
    margin-top:18px;
    font-size:15px;
    line-height:1.55;
  }
  .hero-v2-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    margin-top:22px;
  }
  .hero-v2-actions .btn{width:100%}
  .hero-v2-benefits,
  .hero-analytics-wrap{
    display:none!important;
  }
  .hero-v2::after{
    opacity:.3;
    background-size:32px 32px,32px 32px,230% 100%;
  }
  .trust-strip{
    padding:18px 0;
    overflow:hidden;
  }
  .trust-strip .trust-row{
    display:block;
  }
  .trust-label{
    display:block;
    margin-bottom:12px;
  }
  .logo-wall{
    flex-wrap:nowrap;
    gap:22px;
    overflow-x:auto;
    padding-bottom:5px;
    scrollbar-width:none;
  }
  .logo-wall::-webkit-scrollbar{display:none}
  .logo-wall span{
    flex:0 0 auto;
    font-size:13px;
  }

  /* Business spheres: one readable compact card per row. */
  #audiences{padding:48px 0}
  .audience-intro{margin-bottom:22px}
  .audience-grid{
    grid-template-columns:1fr;
    gap:10px;
  }
  .audience-card{
    min-height:0;
    padding:18px 62px 18px 18px;
  }
  .audience-card::before{
    width:72px;
    height:72px;
    right:-24px;
    top:-24px;
  }
  .audience-icon{
    width:40px;
    height:40px;
    margin-bottom:11px!important;
  }
  .audience-icon svg{width:21px;height:21px}
  .audience-card h3{
    max-width:100%;
    margin-bottom:7px;
    font-size:17px;
  }
  .audience-card>p{
    display:block;
    max-width:100%;
    margin:0;
    font-size:11.5px;
    line-height:1.48;
  }
  .audience-action{
    position:static;
    margin-top:14px;
    font-size:10px;
  }
  .audience-action span:first-child{max-width:100%}
  .audience-action span:last-child{
    position:absolute;
    right:15px;
    bottom:15px;
    width:32px;
    height:32px;
  }
  .solution-panel.active{display:block}
  .solution-visual{
    min-height:220px;
    padding:24px;
  }
  .solution-copy{padding:22px 18px}
  .solution-list{
    grid-template-columns:1fr;
    margin:17px 0 20px;
  }
  .solution-list li{
    padding:13px;
    font-size:12px;
  }
  .solution-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .solution-actions .btn{width:100%}

  /* Process: readable heading, swipeable timeline, compact details. */
  .process-v2-section{
    padding:18px 0 48px;
  }
  .process-v2{
    padding:23px 15px 18px;
    overflow:hidden;
  }
  .process-v2::before,.process-v2::after,
  .process-v2-head::before,
  .process-v2-body::after{
    display:none;
  }
  .process-v2-head{
    grid-template-columns:1fr;
    gap:13px;
    align-items:start;
    padding-bottom:20px;
  }
  .process-v2 .display-xl{
    max-width:100%;
    font-size:clamp(32px,9.4vw,38px);
    line-height:1.04;
  }
  .process-v2-head p{
    max-width:100%;
    font-size:12.5px;
    line-height:1.55;
  }
  .process-v2-body{padding-top:18px}
  .process-types{
    display:grid;
    grid-template-columns:1.35fr .65fr 1fr;
    gap:5px;
    margin:0 0 18px;
  }
  .process-types button{
    min-width:0;
    padding:9px 5px;
    font-size:8.5px;
  }
  .process-slider-wrap{
    margin:0 -15px;
    padding:0 15px 24px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scrollbar-width:thin;
    scrollbar-color:#526071 transparent;
  }
  .process-markers{
    min-width:570px;
  }
  .process-progress-line{
    left:62px;
    right:auto;
    width:475px;
    top:21px;
  }
  .process-range{
    left:53px;
    right:auto;
    width:493px;
    top:8px;
  }
  .process-marker{
    gap:7px;
    font-size:9px;
  }
  .process-marker b{
    width:42px;
    height:42px;
    border-width:4px;
  }
  .process-stage-card{
    display:block;
    padding:18px 15px 68px;
  }
  .process-stage-card h3{font-size:22px}
  .process-stage-card p{font-size:12px}
  .process-stage-nav{
    top:auto;
    right:15px;
    bottom:14px;
  }
  .process-detail-grid{
    grid-template-columns:1fr;
    gap:8px;
  }
  .process-detail-grid .pd{padding:11px}
  .process-stage-actions{margin-top:12px}
  .process-stage-result{
    padding-left:13px;
  }

  /* Reviews and FAQ keep a simple reading rhythm. */
  .reviews-compact{padding:48px 0}
  .testi-grid,.reviews-grid--full{grid-template-columns:1fr}
  .testi,.testimonial-card{
    min-height:0;
    padding:18px;
  }
  .reviews-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .reviews-actions .btn{width:100%}
  .faq-list{gap:6px}
  .faq-q{
    min-height:58px;
    padding:16px 14px;
    gap:14px;
    font-size:14px;
  }
  .faq-a>div{padding-inline:14px;font-size:13px}
  .faq-item.open .faq-a>div{padding-bottom:16px}

  /* Case listing and case pages. */
  .cases-workspace{
    padding:18px 0 44px;
  }
  .cases-browser{gap:14px}
  .cases-sidebar{
    padding:14px;
  }
  .cases-sidebar>div:first-child,
  .cases-quick-nav,.cases-found{
    display:none;
  }
  .cases-side-filters{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
    margin:0;
  }
  .cases-side-filters>span{
    grid-column:1/-1;
    margin:0 0 3px;
  }
  .cases-side-filters button{
    min-height:40px;
    padding:8px 10px;
    text-align:center;
  }
  .portfolio-mosaic{
    grid-template-columns:1fr;
    grid-auto-rows:auto;
    gap:10px;
  }
  .portfolio-card:nth-child(n){
    grid-row:auto;
    aspect-ratio:16/10;
  }
  .portfolio-copy{
    left:15px;
    right:15px;
    bottom:14px;
  }
  .portfolio-copy strong{font-size:20px}
  .portfolio-copy>span{font-size:11px}
  .case-study-hero{
    padding:38px 0 32px;
  }
  .case-study-grid{gap:24px}
  .case-study-hero h1{
    margin:12px 0;
    font-size:clamp(35px,10.3vw,44px);
    line-height:1.03;
  }
  .case-study-actions{
    display:grid;
    grid-template-columns:1fr;
    margin-top:21px;
  }
  .case-study-actions .btn{width:100%}
  .case-study-cover{
    aspect-ratio:16/10;
    padding:10px;
  }
  .case-study-cover::before{
    top:7px;
    right:11px;
    font-size:7px;
  }
  .case-metrics-grid{
    grid-template-columns:1fr 1fr;
  }
  .case-metric{
    min-width:0;
    padding:17px 14px;
  }
  .case-metric:last-child{grid-column:1/-1}
  .case-metric strong{font-size:28px}
  .case-metric span{
    font-size:9px;
    line-height:1.4;
  }
  .case-story,.case-screens,.case-analysis{padding:46px 0}
  .case-story-grid,.case-analysis-grid{gap:30px}
  .case-route{gap:8px}
  .case-route article{
    min-height:0;
    padding:14px 14px 14px 54px;
  }
  .case-route::before{
    left:22px;
    top:23px;
    bottom:23px;
  }
  .case-route b{
    position:absolute;
    left:8px;
    top:13px;
    width:30px;
    height:30px;
    box-shadow:0 0 0 4px var(--paper);
  }
  .case-route h3{
    margin:0 0 5px;
    font-size:15px;
  }
  .screen-gallery{gap:9px}
  .screen-placeholder{
    min-height:220px!important;
    padding:18px;
  }
  .case-data-table{
    display:grid;
    gap:8px;
    overflow:visible;
    border:0;
  }
  .case-data-row{
    display:grid;
    grid-template-columns:1fr;
    min-width:0;
    padding:13px 14px;
    border:1px solid var(--line);
  }
  .case-data-row.head{display:none}
  .case-data-row>*{
    padding:3px 0;
    border:0;
  }
  .case-data-row span:nth-child(2)::before{
    content:"Было: ";
    color:var(--ink);
    font-weight:700;
  }
  .case-data-row span:nth-child(3)::before{
    content:"Стало: ";
    color:var(--primary);
    font-weight:700;
  }
  .case-final{padding-bottom:48px}

  /* Services, calculator, packages and forms. */
  .services-page-hero,.page-hero{
    padding:38px 0;
  }
  .services-page-hero .display-xl{font-size:clamp(34px,9.8vw,41px)}
  .page-hero-actions,.service-inline-actions,.about-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }
  .page-hero-actions .btn,
  .service-inline-actions .btn,
  .about-actions .btn{width:100%}
  .service-jump{overflow-x:auto}
  .service-jump .container{
    width:max-content;
    min-width:100%;
    flex-wrap:nowrap;
  }
  .service-layout,.wireframe-widget{
    grid-template-columns:1fr;
    gap:20px;
  }
  .service-detail{padding:48px 0}
  .service-fact-card,.wireframe-widget{padding:18px}
  .standards-grid{grid-template-columns:1fr}
  .roi-showcase{padding:48px 0}
  .roi-container--compact,
  .roi-container{
    grid-template-columns:1fr;
  }
  .roi-container--compact .roi-calc-panel,
  .roi-container--compact .roi-results-panel,
  .roi-calc-panel,.roi-results-panel{
    padding:20px 16px;
  }
  .roi-results-panel{
    border-left:0;
    border-top:1px solid var(--line);
  }
  .roi-slider-head{
    align-items:flex-start;
    gap:10px;
  }
  .roi-slider-head label{max-width:64%}
  .roi-metrics{grid-template-columns:1fr}
  .pricing-grid{gap:10px}
  .price-card,#packages .price-card{
    min-height:0;
    padding:20px 18px;
  }
  .price-card.featured{margin-top:10px}
  .package-detail-hero{padding:38px 0}
  .package-visual{display:none}
  .package-benefits,.package-composition,.package-route{padding:46px 0}
  .package-benefit-list li,
  .check-list li{
    padding:14px 14px 14px 42px;
  }
  .package-benefit-list li::before,
  .check-list li::before{
    left:14px;
    top:14px;
    width:18px;
    text-align:center;
    transform:none;
  }
  .package-route-grid{grid-template-columns:1fr}
  .package-table{min-width:660px}
  .promo-dark{
    display:grid;
    grid-template-columns:1fr;
    padding:24px 18px;
  }
  .promo-dark .btn{width:100%}

  .quiz-shell{display:block}
  .quiz-main,.quiz-side{
    min-height:0;
    padding:20px 16px;
  }
  .quiz-step h3{font-size:21px}
  .quiz-option{
    grid-template-columns:34px minmax(0,1fr) 16px;
    gap:9px;
    min-height:60px;
    padding:10px;
  }
  .quiz-option-icon{width:34px;height:34px}
  .quiz-option strong{font-size:13px}
  .quiz-option small{font-size:10px}
  .quiz-nav{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .quiz-nav .btn{min-width:0;padding-inline:8px}
  .form-grid{grid-template-columns:1fr}
  .field.full{grid-column:auto}
  .modal{padding:8px}
  .modal-dialog{
    max-height:calc(100dvh - 16px);
    overflow-y:auto;
    padding:22px 16px;
  }
  .modal-close{right:8px;top:8px}

  /* Company, business, blog, policy and contacts. */
  .company-hero,.business-hero,.knowledge-hero,.policy-hero{padding:40px 0}
  .agency-live-board,.business-dashboard,.knowledge-orbit,.data-flow{
    display:none;
  }
  .company-hero-grid,.business-hero-grid,.knowledge-hero-grid,.policy-hero-grid{
    display:block;
  }
  .agency-story{padding:48px 0}
  .agency-photo{height:300px}
  .agency-story-grid,.agency-flow-grid,.business-matrix-grid{gap:28px}
  .agency-principles{grid-template-columns:1fr}
  .agency-principles span{
    padding:14px 14px 14px 42px;
  }
  .agency-principles span::before{
    left:14px;
    top:14px;
  }
  .capability-grid,.business-signal-grid{
    grid-template-columns:1fr;
  }
  .capability-grid article,.business-signal-grid article{
    min-height:0;
    padding:20px;
  }
  .capability-grid h3,.business-signal-grid h3{margin:30px 0 8px}
  .business-signals,.business-matrix,.business-docs{padding:48px 0}
  .matrix-table{overflow-x:auto}
  .matrix-row{min-width:520px}
  .doc-ribbon{grid-template-columns:1fr 1fr}
  .blog-index{padding:48px 0}
  .blog-index-head{
    align-items:flex-start;
    flex-direction:column;
  }
  .blog-grid-v2{grid-template-columns:1fr}
  .blog-grid-v2 .blog-body{min-height:0}
  .policy-section{padding:48px 0}
  .policy-nav{grid-template-columns:1fr 1fr;padding:12px}
  .policy-layout .policy-doc{padding:22px 16px}
  .data-principle-grid{grid-template-columns:1fr}
  .contact-card{padding:20px 16px}
  .contact-item{
    grid-template-columns:44px minmax(0,1fr);
    gap:14px;
    padding:10px 8px;
  }
  .contact-item i{width:44px;height:44px}
  .contact-item strong{
    overflow-wrap:anywhere;
  }

  /* Footer and mobile performance. */
  .footer{padding:36px 0 16px}
  .footer-main{
    grid-template-columns:1fr;
    grid-template-areas:"brand" "map" "links";
    gap:28px;
  }
  .footer-map{height:180px}
  .footer-map-label{
    display:grid;
    grid-template-columns:1fr;
  }
  .footer-links-grid{gap:18px}
  .footer-bottom{
    display:grid;
    gap:8px;
    margin-top:24px;
  }
  .hero-orbit,
  .solution-image,
  .process-v2::before,.process-v2::after,
  .company-hero::before,.business-hero::before,
  .knowledge-hero::before,.policy-hero::before,
  .case-study-hero::after,
  .case-route::before,
  .package-browser,.package-signal{
    animation:none!important;
  }
  .price-card:hover,.case-card:hover,.blog-card:hover,
  .audience-card:hover,.capability-grid article:hover,
  .business-signal-grid article:hover{
    transform:none;
  }
}

@supports(content-visibility:auto){
  @media(max-width:640px){
    main>section:not(:first-child){
      content-visibility:auto;
      contain-intrinsic-size:auto 620px;
    }
  }
}

/* 2026-07 mobile app composition v2 */
.process-mobile-flow{display:none}

@media(max-width:640px){
  body{background:#eef3fa}

  /* Two-column app grids wherever the content remains readable. */
  .audience-grid,
  .portfolio-mosaic,
  #sites .grid-3,
  .info-grid,
  .term-grid,
  .doc-list,
  .standards-grid,
  .capability-grid,
  .business-signal-grid,
  .package-route-grid,
  .blog-grid,
  .blog-grid-v2{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  /* Business spheres: compact app-like 2 x N tiles without crowded footers. */
  #audiences{
    padding:42px 0;
  }
  .audience-intro{
    margin-bottom:17px;
  }
  .audience-intro .display-lg{
    max-width:none;
    font-size:clamp(28px,8vw,32px);
    line-height:1.06;
  }
  .audience-grid{
    gap:10px;
  }
  .audience-card{
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    min-width:0;
    width:100%;
    height:170px;
    min-height:170px;
    padding:13px 12px 45px;
    overflow:hidden;
    text-align:left;
    border-radius:16px!important;
    box-shadow:0 7px 20px rgba(23,55,110,.065);
  }
  .audience-card::before{
    top:-28px;
    right:-28px;
    width:72px;
    height:72px;
  }
  .audience-icon{
    flex:0 0 auto;
    width:34px;
    height:34px;
    margin-bottom:9px!important;
  }
  .audience-icon svg{width:18px;height:18px}
  .audience-card h3{
    display:-webkit-box;
    flex:0 0 32px;
    width:100%;
    height:32px;
    max-width:100%;
    overflow:hidden;
    margin:0 0 5px;
    font-size:13px;
    line-height:1.2;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }
  .audience-card>p{
    display:-webkit-box;
    width:100%;
    max-width:100%;
    overflow:hidden;
    margin:0;
    color:var(--muted);
    font-size:9.5px;
    line-height:1.38;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .audience-action{
    position:absolute!important;
    left:auto!important;
    right:11px!important;
    bottom:11px!important;
    width:30px!important;
    height:30px;
    padding:0;
    margin:0;
  }
  .audience-action span:first-child{
    display:none;
  }
  .audience-action span:last-child{
    position:static!important;
    width:30px;
    height:30px;
    font-size:15px;
  }

  #sites .grid-3>.service-card{
    min-width:0;
    min-height:0;
    padding:15px 13px;
    border-radius:16px!important;
    box-shadow:0 8px 24px rgba(23,55,110,.07);
  }
  #sites .grid-3>.service-card:last-child{
    grid-column:1/-1;
  }
  #sites .service-card .display-sm{
    font-size:17px;
  }
  #sites .service-card .price{
    font-size:18px;
  }
  #sites .service-card .body-md{
    display:-webkit-box;
    overflow:hidden;
    font-size:10.5px;
    line-height:1.42;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
  }
  #sites .service-card .card-list{
    gap:6px;
    margin:12px 0;
  }
  #sites .service-card .card-list li{
    font-size:10px;
  }
  #sites .service-card .btn{
    width:100%;
    min-height:38px;
    padding:8px 6px;
    font-size:8.5px;
  }

  /* Process is a static mobile timeline, not a squeezed desktop control. */
  .process-types,
  .process-slider-wrap,
  .process-stage-card{
    display:none!important;
  }
  .process-mobile-flow{
    position:relative;
    display:grid;
    gap:9px;
  }
  .process-mobile-flow::before{
    content:"";
    position:absolute;
    left:31px;
    top:29px;
    bottom:29px;
    width:2px;
    background:linear-gradient(#2f72ff,#79a5ff);
    opacity:.65;
  }
  .process-mobile-flow article{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:11px;
    align-items:start;
    padding:13px;
    border:1px solid #354151;
    border-radius:15px!important;
    background:linear-gradient(145deg,#1d232c,#151a21);
    box-shadow:0 8px 22px rgba(0,0,0,.13);
  }
  .process-mobile-flow article>span{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:4px solid #11161d;
    border-radius:12px;
    background:linear-gradient(135deg,#1454e8,#3f82ff);
    color:#fff;
    font-size:10px;
    font-weight:800;
    box-shadow:0 0 0 1px #5b8df6;
  }
  .process-mobile-flow h3{
    margin:1px 0 4px;
    font-size:15px;
    line-height:1.2;
  }
  .process-mobile-flow p{
    color:#aeb9c8;
    font-size:10.5px;
    line-height:1.45;
  }
  .process-mobile-flow small{
    display:inline-flex;
    margin-top:8px;
    padding:5px 7px;
    border-radius:7px;
    background:rgba(20,84,232,.16);
    color:#91b4ff;
    font-size:8.5px;
    font-weight:750;
  }
  .process-v2{
    border-radius:20px!important;
    padding:22px 14px 15px;
    box-shadow:0 18px 42px rgba(15,29,53,.18);
  }
  .process-v2-head{
    margin-bottom:14px;
  }
  .process-v2 .display-xl{
    font-size:clamp(30px,8.8vw,36px);
  }

  /* Cases form a 2-column visual library. */
  .portfolio-card:nth-child(n){
    min-width:0;
    aspect-ratio:1/1.08;
    border-radius:15px!important;
    box-shadow:0 8px 20px rgba(19,48,98,.1);
  }
  .portfolio-copy{
    left:11px;
    right:11px;
    bottom:10px;
  }
  .portfolio-copy small{
    margin-bottom:3px;
    font-size:7px;
  }
  .portfolio-copy strong{
    font-size:14px;
    line-height:1.15;
  }
  .portfolio-copy>span{
    display:-webkit-box;
    overflow:hidden;
    font-size:8.5px;
    line-height:1.3;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .portfolio-shade{
    background:linear-gradient(180deg,rgba(5,13,30,.02) 25%,rgba(4,12,28,.94) 100%);
  }

  /* Compact two-column utility cards. */
  .info-card,.term-card,.doc-item,
  .standards-grid article,
  .capability-grid article,
  .business-signal-grid article,
  .package-route-grid article,
  .blog-card,
  .blog-grid-v2 .blog-card{
    min-width:0;
    min-height:0;
    padding:14px;
    border-radius:15px!important;
    box-shadow:0 7px 20px rgba(23,55,110,.06);
  }
  .info-card h3,.term-card strong,
  .standards-grid h3,
  .capability-grid h3,
  .business-signal-grid h3,
  .package-route-grid h3,
  .blog-card h3{
    margin:12px 0 6px;
    font-size:14px;
    line-height:1.25;
  }
  .info-card p,.term-card p,
  .standards-grid p,
  .capability-grid p,
  .business-signal-grid p,
  .blog-card p{
    display:-webkit-box;
    overflow:hidden;
    font-size:10px!important;
    line-height:1.42!important;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
  }
  .doc-item{
    display:grid;
    grid-template-columns:30px minmax(0,1fr);
    gap:8px;
    font-size:10px;
  }
  .doc-item i{
    width:30px;
    height:30px;
  }
  .capability-grid article,.business-signal-grid article{
    border:1px solid var(--line)!important;
  }
  .capability-grid h3,.business-signal-grid h3{
    margin-top:22px;
  }
  .package-route-grid article:last-child:nth-child(odd){
    grid-column:1/-1;
  }
  .blog-grid-v2 .blog-thumb{
    height:112px;
    padding:12px;
  }
  .blog-grid-v2 .blog-thumb b{font-size:13px}
  .blog-grid-v2 .blog-body{
    min-height:0;
    padding:13px;
  }
  .blog-grid-v2 .blog-body p{
    -webkit-line-clamp:3;
  }

  /* Two secondary screenshots, one main screen. */
  .screen-gallery{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .screen-placeholder:first-child{
    grid-column:1/-1;
  }
  .screen-placeholder{
    min-height:150px!important;
    padding:13px;
    border-radius:14px!important;
  }
  .screen-placeholder:first-child{min-height:220px!important}
  .screen-placeholder span{font-size:13px}
  .screen-placeholder small{font-size:9px}

  /* App-like surfaces without changing the brand palette. */
  .case-metric,.testi,.testimonial-card,
  .faq-item,.price-card,.contact-card,
  .solution-panel,.roi-container,.quiz-shell,
  .promo-dark,.policy-doc,.case-data-row{
    border-radius:15px!important;
  }
  .case-metric,.testi,.testimonial-card,
  .contact-card,.price-card{
    box-shadow:0 8px 24px rgba(23,55,110,.07);
  }
  .faq-item{overflow:hidden}
  .cases-sidebar{
    border-radius:15px!important;
    box-shadow:0 8px 24px rgba(23,55,110,.07);
  }
  .cases-side-filters button{
    border-radius:10px;
  }
  .btn,.field input,.field textarea,.field select{
    border-radius:11px!important;
  }
}

/* Mobile introductions: keep primary page messages visually centered while
   preserving left alignment inside cards, forms, lists and content panels. */
@media (max-width:640px){
  .display-xxl{font-size:clamp(33px,9.8vw,40px)}
  .display-xl{font-size:clamp(30px,8.9vw,37px)}
  .display-lg{font-size:clamp(27px,7.8vw,32px)}
  .display-md{font-size:clamp(22px,6.5vw,27px)}

  .hero-v2-copy,
  .page-hero > .container,
  .services-page-hero > .container,
  .cases-intro > .container,
  .case-study-grid > div:first-child,
  .seo-hero-grid > div:first-child,
  .package-hero-grid > div:first-child,
  .company-hero-grid > div:first-child,
  .business-hero-grid > div:first-child,
  .knowledge-hero-grid > div:first-child,
  .policy-hero-grid > div:first-child,
  .section-head,
  .section-head.center,
  .audience-intro{
    text-align:center;
    margin-inline:auto;
  }

  .hero-v2-title,
  .hero-v2-lead,
  .page-hero .body-lg,
  .services-page-hero .body-lg,
  .case-study-hero h1,
  .case-study-hero .body-lg,
  .seo-service-hero h1,
  .seo-service-hero .body-lg,
  .seo-honest-note,
  .package-detail-hero h1,
  .package-detail-hero .body-lg,
  .company-hero h1,
  .company-hero .body-lg,
  .business-hero h1,
  .business-hero .body-lg,
  .knowledge-hero h1,
  .knowledge-hero .body-lg,
  .policy-hero h1,
  .policy-hero .body-lg,
  .section-head p,
  .section-head .body-lg{
    margin-left:auto;
    margin-right:auto;
  }

  .hero-v2-actions,
  .page-hero-actions,
  .case-study-actions,
  .about-actions{
    justify-content:center;
    justify-items:center;
  }

  .breadcrumbs{
    text-align:center;
  }

  .hero-v2-title{
    font-size:clamp(36px,10.8vw,46px);
  }

  .hero-v2-lead{
    font-size:14px;
  }

  .case-study-hero h1{
    font-size:clamp(32px,9.4vw,40px);
  }
}

/* Реальные экраны и рабочие кабинеты внутри страниц кейсов. */
.screen-shot{
  position:relative;
  min-height:300px;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(20,84,232,.22);
  border-radius:14px;
  background:#eef3fb;
  box-shadow:0 16px 36px rgba(18,42,82,.12);
}
.screen-shot:first-child{min-height:360px}
.screen-shot img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
}
.screen-shot figcaption{
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  bottom:0;
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:34px 18px 15px;
  color:#fff;
  background:linear-gradient(to top,rgba(5,14,31,.9),rgba(5,14,31,.48) 58%,transparent);
}
.screen-shot figcaption strong{font-size:16px;line-height:1.2}
.screen-shot figcaption span{font-size:11px;line-height:1.35;color:rgba(255,255,255,.8)}
.screen-shot.is-mobile img{object-position:top center}

@media(max-width:1024px){
  .screen-shot:first-child{grid-column:1/-1}
}

@media(max-width:640px){
  .screen-shot{min-height:170px!important}
  .screen-shot:first-child{grid-column:1/-1;min-height:235px!important}
  .screen-shot figcaption{padding:28px 12px 11px}
  .screen-shot figcaption strong{font-size:12px}
  .screen-shot figcaption span{font-size:9px}
}