/* ============================================================ DOBLER DATA SOLUTIONS (doblerdata.com): shared stylesheet. The family register of doblerinsights.com and ddsfabriccontrol.com (Peter, 2026-10-22: "use the doblerinsights.com and ddsfabriccontrol.com as reference for look and feel and color palette choices"): white ground, cool bands, Manrope set heavy and tight, pill controls, 20px panels, navy-tinted shadows, one gradient stage per page. DDS wears its logo: blue #01599A for every action, coral #F24C40 only as the selected-state spark and inside pictures. Each product appears in its own hue (Dobler Insights teal, Fabric Control ultramarine), never as page chrome. Chart and illustration marks: blue #01599A, teal #0F8A72, coral #F24C40. Text never wears a mark colour. ============================================================ */ :root{ --navy:#0F2E4C; --navy-deep:#0A2238; --ink:#1A2B3C; --body:#3A4A5C; --muted:#5F6F82; --ground:#FFFFFF; --field:#F2F6FA; --field-2:#E6EEF6; --line:#DAE3EC; --line-soft:#ECF1F6; --blue:#01599A; --blue-deep:#014A80; --blue-bright:#1F7FC9; --blue-tint:#E3EEF8; --cyan:#27B5C9; --coral:#F24C40; --coral-tint:#FDE7E5; --teal:#16A085; --teal-deep:#0F8A72; --teal-tint:#DDF4EE; --ultra:#2D3BE8; --ultra-tint:#E6E9FC; --grid:#E6ECF2; --axis:#C9D4DF; --grad-stage:linear-gradient(200deg,#27B5C9 0%,#1F7FC9 34%,#01599A 72%,#014A80 100%); --grad-btn:linear-gradient(135deg,#01599A,#0B6FB5); --grad-soft:linear-gradient(135deg,#E3EEF8,#E4F3F6 58%,#FBEDEB); --shadow-lg:0 30px 70px rgba(15,46,76,.20); --shadow:0 12px 32px rgba(15,46,76,.10); --shadow-sm:0 4px 14px rgba(15,46,76,.08); --glow:0 8px 20px rgba(1,89,154,.28); --font:"Manrope","Segoe UI",system-ui,-apple-system,sans-serif; --wrap:1180px; --r:12px; --r-lg:20px; } *{box-sizing:border-box;margin:0;padding:0} [hidden]{display:none!important} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scrollbar-color:var(--navy) var(--field);scroll-padding-top:96px} body{font-family:var(--font);font-size:17px;line-height:1.6;color:var(--body);background:var(--ground);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility} h1,h2,h3,h4{color:var(--navy);font-weight:800;line-height:1.1;letter-spacing:-.02em;text-wrap:balance} h1{font-size:clamp(2.4rem,4.6vw,3.7rem)} h2{font-size:clamp(1.8rem,3vw,2.6rem)} h3{font-size:1.35rem;line-height:1.3;letter-spacing:-.01em} p,li{max-width:66ch;text-wrap:pretty} b,strong{color:var(--ink);font-weight:700} a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--blue-bright);text-decoration-thickness:2px;text-underline-offset:3px} a:hover{color:var(--blue)} img,svg{display:block;max-width:100%} img{height:auto} ::selection{background:var(--blue-tint);color:var(--navy)} :focus-visible{outline:3px solid var(--blue-bright);outline-offset:3px;border-radius:4px} input,button,select,textarea{font:inherit;caret-color:var(--blue)} button{touch-action:manipulation} .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px} .center{text-align:center} .center p{margin-left:auto;margin-right:auto} .skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--navy);color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;text-decoration:none;transition:top .15s} .skip:focus,.skip:hover{top:12px;color:#fff} .vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} /* buttons */ .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:1rem;line-height:1;padding:16px 24px;border-radius:999px;border:2px solid transparent;background:var(--grad-btn);color:#fff;text-decoration:none;cursor:pointer;white-space:nowrap;box-shadow:var(--glow);transition:transform .15s,box-shadow .15s,background-color .15s,color .15s,border-color .15s} .btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(1,89,154,.34);color:#fff} .btn:active{transform:translateY(0);box-shadow:var(--glow)} .btn-secondary{background:#fff;color:var(--navy);border-color:var(--line);box-shadow:var(--shadow-sm)} .btn-secondary:hover{border-color:var(--blue-bright);color:var(--navy);box-shadow:var(--shadow-sm)} .on-dark .btn-secondary{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.5);box-shadow:none} .on-dark .btn-secondary:hover{background:rgba(255,255,255,.2);border-color:#fff;color:#fff} .btn:disabled{opacity:.6;cursor:progress;transform:none} .btn-block{width:100%} .btn-lg{font-size:1.05rem;padding:18px 30px} .link-arrow{font-weight:700;color:var(--blue);text-decoration:none;display:inline-flex;align-items:center;gap:6px} .link-arrow svg{width:16px;height:16px;transition:transform .15s} .link-arrow:hover{color:var(--blue-deep)} .link-arrow:hover svg{transform:translateX(3px)} /* header */ .site-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft)} .nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px} .brand{display:inline-flex;align-items:center;text-decoration:none;flex:none} .brand img{height:34px;width:auto} .nav-links{display:flex;gap:28px} .nav-links a{text-decoration:none;font-weight:600;font-size:.95rem;color:var(--body);padding:8px 0 6px;border-bottom:2px solid transparent;white-space:nowrap} .nav-links a:hover{color:var(--navy)} .nav-links a.active{color:var(--navy);border-bottom-color:var(--blue)} .nav-links .nav-req{display:none} .nav-cta{display:flex;align-items:center;gap:12px} .nav-cta .btn{padding:13px 20px;font-size:.95rem} .burger{display:none;background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 8px;cursor:pointer} .burger span{display:block;width:22px;height:2px;background:var(--navy);margin:4px 0;transition:transform .2s,opacity .2s} .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)} .burger[aria-expanded="true"] span:nth-child(2){opacity:0} .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)} /* sections */ section.block{padding:88px 0} .block .intro{font-size:1.15rem;margin-top:16px;max-width:62ch} .band{background:var(--field)} .sec-head{max-width:760px;margin-bottom:44px} .sec-head.center{margin-left:auto;margin-right:auto} .sec-foot{margin-top:36px} /* home hero */ .hero{position:relative;overflow:hidden;padding:72px 0 76px} .hero::before{content:"";position:absolute;width:760px;height:760px;right:-240px;top:-280px;border-radius:50%;background:radial-gradient(closest-side,rgba(39,181,201,.20),rgba(39,181,201,0));pointer-events:none} .hero::after{content:"";position:absolute;width:560px;height:560px;left:-240px;bottom:-300px;border-radius:50%;background:radial-gradient(closest-side,rgba(242,76,64,.10),rgba(242,76,64,0));pointer-events:none} .hero .wrap{position:relative} .hero-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:48px 56px;align-items:center} .hero-title .sub{font-size:1.2rem;margin:22px 0 28px;max-width:50ch} .hero-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center} .clients-line{margin-top:28px;font-size:.98rem;color:var(--muted);max-width:none} .clients-line b{color:var(--navy);font-weight:800;letter-spacing:-.01em;white-space:nowrap} /* the stage: gradient panel holding the capability matrix */ .stage{position:relative;border-radius:28px;background:var(--grad-stage);padding:36px 36px 40px;box-shadow:var(--shadow-lg)} .stage::after{content:"";position:absolute;inset:0;border-radius:28px;background:radial-gradient(120% 80% at 100% 0%,rgba(255,255,255,.18),rgba(255,255,255,0) 55%);pointer-events:none} .matrix-card{position:relative;z-index:1;background:#fff;border-radius:18px;box-shadow:0 26px 60px rgba(4,24,48,.32);padding:10px 10px 12px} table.matrix{width:100%;border-collapse:separate;border-spacing:0;font-size:.92rem} table.matrix caption{caption-side:top;text-align:left;padding:12px 14px 14px;font-weight:800;color:var(--navy);font-size:1rem;letter-spacing:-.01em} table.matrix caption span{display:block;font-weight:600;color:var(--muted);font-size:.82rem;letter-spacing:0;margin-top:2px} table.matrix thead th{font-size:.78rem;font-weight:700;color:var(--muted);text-align:center;padding:0 6px 10px;white-space:nowrap} table.matrix thead th:first-child{text-align:left;padding-left:14px} table.matrix tbody th{text-align:left;padding:0;font-weight:700} table.matrix td{text-align:center;padding:10px 6px;vertical-align:middle} table.matrix tbody tr{transition:background-color .2s} table.matrix tbody tr td:last-child{border-radius:0 12px 12px 0} table.matrix tbody th button{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;padding:12px 10px 12px 14px;border-radius:12px 0 0 12px;cursor:pointer;color:var(--navy);font-weight:700;font-size:.95rem;line-height:1.25} table.matrix tbody th button::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--line);transition:background-color .2s,transform .2s} table.matrix tbody th button:hover::before{background:var(--axis)} table.matrix tbody th button:focus-visible{outline:3px solid var(--blue-bright);outline-offset:-3px} table.matrix tbody tr.on{background:var(--blue-tint)} table.matrix tbody tr.on th button::before{background:var(--coral);transform:scale(1.15)} .mx-yes{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--grad-btn);align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(1,89,154,.25)} .mx-yes svg{width:14px;height:14px;color:#fff} .mx-no{display:inline-block;width:14px;height:2px;border-radius:1px;background:var(--axis)} .mx-prod{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:700;padding:6px 10px;border-radius:999px;white-space:nowrap;line-height:1.2} .mx-prod i{width:8px;height:8px;border-radius:50%;flex:none} .mx-prod.di{background:var(--teal-tint);color:#0B5E4E} .mx-prod.di i{background:var(--teal)} .mx-prod.fc{background:var(--ultra-tint);color:#2330C4} .mx-prod.fc i{background:var(--ultra)} .mx-detail{position:relative;z-index:1;margin-top:18px;color:#fff;min-height:5.2em;max-width:none} .mx-detail b{color:#fff;display:block;font-size:1.05rem;margin-bottom:4px} .mx-detail span{color:#E6F1FA;font-size:.98rem;line-height:1.55;display:block;max-width:62ch} .mx-detail a{color:#fff;text-decoration-color:rgba(255,255,255,.6)} .stage-cap{margin-top:14px;font-size:.85rem;color:var(--muted);max-width:none} /* products */ .prods{display:grid;grid-template-columns:1fr 1fr;gap:28px} .prod{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--line-soft)} .prod .art{padding:28px 30px 0;height:230px;display:flex;align-items:flex-end;justify-content:center} .prod.di .art{background:linear-gradient(135deg,#DDF4EE,#E3F1FB 60%,#ECE9FA)} .prod.fc .art{background:linear-gradient(135deg,#E6E9FC,#E3EEFB 60%,#DFF4F8)} .prod .art svg{width:100%;height:auto;max-height:200px} .prod .txt{padding:28px 30px 32px;display:flex;flex-direction:column;flex:1} .prod-name{display:flex;align-items:center;gap:10px;margin-bottom:12px} .prod-name i{width:12px;height:12px;border-radius:50%;flex:none} .prod.di .prod-name i{background:var(--teal)} .prod.fc .prod-name i{background:var(--ultra)} .prod h3{font-size:1.5rem} .prod .lede{font-size:1.05rem;margin-bottom:14px} .prod .checks{margin:0 0 22px} .prod .go{margin-top:auto} .prod.di .link-arrow{color:var(--teal-deep)} .prod.fc .link-arrow{color:var(--ultra)} /* features: illustration and text in alternating rows */ .feature{display:grid;grid-template-columns:1.1fr 1fr;gap:48px 72px;align-items:center;padding:36px 0} .feature + .feature{border-top:1px solid var(--line)} .feature.flip .art{order:2} .feature .art{border-radius:var(--r-lg);background:var(--grad-soft);padding:32px;box-shadow:var(--shadow-sm)} .feature .art svg{width:100%;height:auto} .feature h3{font-size:1.7rem;margin-bottom:14px} .feature p{font-size:1.05rem} .feature p + p{margin-top:12px} .feature .checks{margin-top:18px} .feature .link-arrow{margin-top:20px} /* illustration classes (inline SVG) */ .ill-t{font-family:var(--font);font-weight:700;font-size:13px;fill:var(--navy)} .ill-s{font-family:var(--font);font-weight:600;font-size:12px;fill:var(--muted)} .ill-w{font-family:var(--font);font-weight:700;font-size:12px;fill:#fff} .ill-card{fill:#fff;stroke:var(--line);stroke-width:1.5} .ill-soft{fill:var(--field-2)} .ill-field{fill:var(--field)} .ill-conn{fill:none;stroke:var(--blue);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round} .ill-conn2{fill:none;stroke:var(--teal-deep);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round} .ill-conn3{fill:none;stroke:var(--coral);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round} .ill-dash{fill:none;stroke:var(--axis);stroke-width:2;stroke-dasharray:5 6;stroke-linecap:round} .ill-row{fill:var(--line)} .ill-row.on{fill:var(--blue)} .ill-rowbg{fill:transparent} .ill-rowbg.on{fill:var(--blue-tint)} .ill-blue{fill:var(--blue)} .ill-teal{fill:var(--teal)} .ill-coral{fill:var(--coral)} .ill-ultra{fill:var(--ultra)} .ill-navy{fill:var(--navy)} .ill-bar{fill:var(--blue)} .ill-bar2{fill:var(--line)} .ill-grid{stroke:var(--grid);stroke-width:1} .ill-axis{stroke:var(--axis);stroke-width:1} .ill-line{fill:none;stroke:var(--blue);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round} .ill-area{fill:var(--blue);opacity:.12} /* stepper: the engagement sequence */ .stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:8px;counter-reset:s;position:relative;list-style:none} .stepper::before{content:"";position:absolute;left:28px;right:28px;top:28px;height:3px;background:linear-gradient(90deg,var(--blue),var(--blue-bright),var(--cyan));border-radius:2px} .stepper li{position:relative;max-width:none;padding-top:80px} .stepper li::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:0;width:56px;height:56px;border-radius:50%;background:var(--grad-btn);color:#fff;font-weight:800;font-size:1.2rem;display:flex;align-items:center;justify-content:center;box-shadow:var(--glow)} .stepper li:nth-child(2)::before{background:linear-gradient(135deg,#0B6FB5,#1F7FC9)} .stepper li:nth-child(3)::before{background:linear-gradient(135deg,#1F7FC9,#27B5C9)} .stepper li.opt::before{background:#fff;color:var(--blue);border:2px dashed var(--blue-bright);box-shadow:none} .stepper b{display:block;font-size:1.1rem;margin-bottom:6px;color:var(--navy)} .stepper p{font-size:.98rem} .fee{margin-top:44px;display:grid;grid-template-columns:auto 1fr;gap:18px 22px;align-items:center;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);border:1px solid var(--line-soft);padding:26px 30px} .fee svg{width:46px;height:46px;flex:none} .fee h3{font-size:1.2rem;margin-bottom:4px} .fee p{font-size:1rem} /* checks */ .checks{list-style:none} .checks li{position:relative;padding-left:34px;margin-bottom:10px;max-width:none} .checks li svg{position:absolute;left:0;top:2px;width:22px;height:22px;color:var(--blue)} .prod.di .checks li svg{color:var(--teal-deep)} .prod.fc .checks li svg{color:var(--ultra)} /* clients */ .clients{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:8px} .client{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);border:1px solid var(--line-soft);padding:28px 30px} .client h3{font-size:1.45rem;margin-bottom:8px} .client p{font-size:1rem} /* post cards (home "from the blog", the blog index, related posts) */ .posts{display:grid;grid-template-columns:repeat(3,1fr);gap:28px} .post-card{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;position:relative;transition:transform .2s,box-shadow .2s} .post-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(15,46,76,.16)} .post-card .pic{aspect-ratio:16/9;background:var(--grad-soft);overflow:hidden} .post-card .pic img{width:100%;height:100%;object-fit:cover} .post-card .txt{padding:22px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1} .post-card h2,.post-card h3{font-size:1.15rem;line-height:1.3;letter-spacing:-.01em} .post-card :is(h2,h3) a{color:var(--navy);text-decoration:none} .post-card :is(h2,h3) a::after{content:"";position:absolute;inset:0;border-radius:var(--r-lg)} .post-card :is(h2,h3) a:focus-visible{outline:none} .post-card:has(:is(h2,h3) a:focus-visible){outline:3px solid var(--blue-bright);outline-offset:3px} .post-card:hover :is(h2,h3) a{color:var(--blue)} .post-card p{font-size:.95rem;color:var(--body)} .post-meta{font-size:.85rem;color:var(--muted);font-weight:600;margin-top:auto;max-width:none} .topic{text-decoration:none;display:inline-flex;align-self:flex-start;font-size:.78rem;font-weight:700;color:var(--blue-deep);background:var(--blue-tint);padding:5px 10px;border-radius:999px} .post-card.feat{grid-column:1/-1;display:grid;grid-template-columns:1.2fr 1fr} .post-card.feat .pic{aspect-ratio:16/9;align-self:center;margin:18px 0 18px 18px;border-radius:14px} .post-card.feat .txt{padding:36px 40px;justify-content:center} .post-card.feat :is(h2,h3){font-size:1.8rem;line-height:1.15;letter-spacing:-.02em} .post-card.feat p{font-size:1.05rem} /* blog filter */ .filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px} .filter button{border:1px solid var(--line);background:#fff;color:var(--body);font-weight:600;font-size:.9rem;padding:9px 16px;border-radius:999px;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s} .filter button:hover{border-color:var(--blue-bright);color:var(--navy)} .filter button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff} .filter-count{font-size:.9rem;color:var(--muted);margin:-16px 0 24px} /* photo band / closing band */ .photo-band{position:relative;color:#fff;padding:112px 0;background:var(--navy) center/cover no-repeat;overflow:hidden} .photo-band::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(10,34,56,.95) 0%,rgba(10,34,56,.84) 48%,rgba(1,89,154,.62) 100%)} .photo-band .wrap{position:relative} .photo-band h2,.photo-band b{color:#fff} .photo-band p{color:#E3EBF4;max-width:58ch} .photo-band .intro{font-size:1.15rem;margin-top:16px} .cta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px} .on-dark .btn{box-shadow:0 10px 24px rgba(0,0,0,.25)} .band-contact{margin-top:26px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:.98rem;color:#E3EBF4} .band-contact a{color:#fff;text-decoration-color:rgba(255,255,255,.5)} /* two columns */ .cols{display:grid;grid-template-columns:1fr 1fr;gap:48px 64px;align-items:start} .cols > *{min-width:0} /* faq (visible questions and answers; no accordion, so crawlers and readers see the same text) */ .faq{display:grid;grid-template-columns:1fr 1fr;gap:24px} .faq > div{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);padding:26px 28px;border:1px solid var(--line-soft)} .faq h3{font-size:1.1rem;margin-bottom:10px} .faq h3 a{color:var(--navy);text-decoration:none} .faq h3 a:hover{text-decoration:underline;text-decoration-color:var(--blue-bright)} .faq p{font-size:.98rem} /* interior page hero */ .page-hero{background:var(--grad-soft);padding:72px 0 64px;position:relative;overflow:hidden} .page-hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px 56px;align-items:center} .page-hero.solo .wrap{grid-template-columns:1fr} .page-hero h1{max-width:20ch} .page-hero p{font-size:1.15rem;margin-top:18px;max-width:58ch} .page-hero .media{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);background:#fff} .page-hero .media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3} .page-hero .media svg{width:100%;height:auto} .page-hero .media.pad{padding:24px} .crumbs{font-size:.88rem;color:var(--muted);margin-bottom:18px;max-width:none} .crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px} .crumbs li{display:flex;align-items:center;gap:6px;max-width:none} .crumbs li + li::before{content:"/";color:var(--axis)} .crumbs a{color:var(--muted);text-decoration:none;font-weight:600} .crumbs a:hover{color:var(--navy);text-decoration:underline;text-decoration-color:var(--blue-bright)} /* prose on interior pages */ .prose h2{margin-bottom:14px} .prose p{margin-bottom:16px} .prose .checks{margin:4px 0 22px} /* a blog post */ .post-head{background:var(--grad-soft);padding:56px 0 0} .post-head.has-fig{background:var(--grad-soft) top/100% calc(100% - 150px) no-repeat} .post-head a.topic:hover{background:#D3E5F5} .post-head .wrap{max-width:860px} .post-head h1{font-size:clamp(2.1rem,4vw,3.1rem);max-width:24ch} .post-head .byline{margin-top:18px;font-size:.95rem;color:var(--muted);display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;max-width:none} .post-head .byline b{color:var(--navy)} .post-head .byline a{color:var(--blue);font-weight:700;text-decoration:none} .post-head .byline a:hover{text-decoration:underline} .post-figure{max-width:860px;margin:36px auto 0;padding:0 24px;position:relative;z-index:1} .post-head > .post-figure{margin-bottom:0} .post-figure img{width:100%;border-radius:var(--r-lg);box-shadow:var(--shadow-lg);background:#fff} .post-figure.small img{width:auto;max-width:100%;margin:0 auto} .post-body{max-width:860px;margin:0 auto;padding:48px 24px 72px} .article{font-size:1.08rem;line-height:1.72;color:var(--body)} .article > *{max-width:68ch} .article > * + *{margin-top:1.05em} .article h2{font-size:clamp(1.5rem,2.4vw,1.9rem);margin-top:1.9em;line-height:1.2} .article h3{font-size:1.3rem;margin-top:1.7em} .article h4{font-size:1.1rem;margin-top:1.5em;letter-spacing:-.01em} .article h2 + *,.article h3 + *,.article h4 + *{margin-top:.6em} .article ul,.article ol{padding-left:1.4em} .article li + li{margin-top:.45em} .article li::marker{color:var(--blue);font-weight:700} .article blockquote{padding:4px 0 4px 22px;border-left:1px solid var(--axis);color:var(--ink);font-weight:600} .article img{border-radius:var(--r);box-shadow:var(--shadow-sm);margin-left:auto;margin-right:auto} .article hr{border:0;height:1px;background:var(--line);margin:2.2em 0} .article table{border-collapse:collapse;width:100%;font-size:.95rem;display:block;overflow-x:auto} .article th,.article td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top} .article th{color:var(--navy);background:var(--field)} .article a{word-break:break-word} .post-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px;max-width:none} .post-tags span{font-size:.82rem;font-weight:600;color:var(--muted);background:var(--field);border:1px solid var(--line);padding:5px 11px;border-radius:999px} .author-box{margin-top:40px;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;background:var(--field);border-radius:var(--r-lg);padding:24px 26px} .author-box .av{width:52px;height:52px;border-radius:50%;background:var(--grad-btn);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:1.05rem} .author-box b{display:block;color:var(--navy);font-size:1.05rem} .author-box p{font-size:.95rem;margin-top:4px} /* forms */ .panel{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow);padding:36px} .panel h2{font-size:1.5rem;margin-bottom:8px} .panel .panel-intro{margin-bottom:22px;font-size:1rem} .field-row{display:grid;grid-template-columns:1fr 1fr;gap:0 16px} .field{margin-bottom:16px} .field label{display:block;font-weight:700;font-size:.9rem;color:var(--navy);margin-bottom:6px} .field label .opt{font-weight:600;color:var(--muted)} .field input{width:100%;font-size:1rem;padding:13px 14px;border:1.5px solid var(--line);border-radius:var(--r);color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s} .field input:hover{border-color:var(--axis)} .field input:focus{border-color:var(--blue-bright);outline:none;box-shadow:0 0 0 4px var(--blue-tint)} .field input[aria-invalid="true"]{border-color:#B3261E} .field .err{display:none;color:#B3261E;font-size:.88rem;font-weight:600;margin-top:6px} .field input[aria-invalid="true"] + .err{display:block} .hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden} .form-note{font-size:.9rem;color:var(--muted);margin-top:14px;text-align:center;margin-left:auto;margin-right:auto} .form-error{color:#B3261E;font-weight:700;margin-top:14px;text-align:center;margin-left:auto;margin-right:auto} .form-error a{color:#B3261E} .form-sent{text-align:center;padding:16px 0} .form-sent svg{width:56px;height:56px;margin:0 auto 14px;color:var(--blue)} .form-sent h2{font-size:1.5rem;margin-bottom:8px} .form-sent h2:focus{outline:none} .contact-list{list-style:none;margin-top:26px;display:grid;gap:18px} .contact-list li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;max-width:none} .contact-list .ic{width:44px;height:44px;border-radius:12px;background:#fff;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center} .contact-list .ic svg{width:22px;height:22px;color:var(--blue)} .contact-list b{display:block;color:var(--navy)} .contact-list a{color:var(--body)} /* interior-page pieces */ .h-feature{font-size:1.7rem;line-height:1.2;letter-spacing:-.02em;margin-bottom:14px} .reading{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px;max-width:none} .reading b{font-size:.85rem;color:var(--muted);font-weight:700} .reading a{font-weight:600;font-size:.98rem;line-height:1.4} .reading-panel{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);border:1px solid var(--line-soft);padding:26px 30px;margin-top:0;border-top:1px solid var(--line-soft)} .big-checks li{font-size:1.05rem;margin-bottom:18px} .big-checks li span{display:block} .leader{display:grid;grid-template-columns:auto 1fr;gap:24px 28px;align-items:start;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);border:1px solid var(--line-soft);padding:32px 36px;max-width:900px} .leader .av{width:84px;height:84px;border-radius:50%;background:var(--grad-btn);color:#fff;font-weight:800;font-size:1.6rem;display:flex;align-items:center;justify-content:center;box-shadow:var(--glow)} .leader h3{font-size:1.5rem} .leader .role{color:var(--blue);font-weight:700;margin:4px 0 12px} .client-names{list-style:none;display:flex;flex-wrap:wrap;gap:16px 48px} .client-names li{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:800;color:var(--navy);letter-spacing:-.02em;max-width:none;line-height:1.2} .stepper.three{grid-template-columns:repeat(3,1fr)} .contact-hero .wrap{align-items:start} .contact-hero .panel{position:relative} .dates{font-size:.95rem!important;color:var(--muted)} .legal{font-size:1.02rem} .legal code{font-size:.9em;background:var(--field);padding:1px 6px;border-radius:6px} .tbl-wrap{overflow-x:auto;border-radius:var(--r);border:1px solid var(--line);max-width:68ch;padding:6px} .tbl-wrap table{display:table;margin:0} .faq .h3{font-size:1.1rem;line-height:1.3;letter-spacing:-.01em;margin-bottom:10px} .faq-note{margin-top:28px;font-size:.95rem;color:var(--muted)} .article .faq-note{margin-top:1.4em} /* the generated 404 page */ .not-found{padding:96px 0 112px} .not-found h1{margin-bottom:16px} .not-found p{margin-bottom:14px} .not-found ul{margin:8px 0 24px 22px} .not-found li{margin-bottom:8px} /* related guides (the middleware inserts this before