/* The American Logo, full-site mockup: inner pages.
   The live pages' markup (pg-*, pkg-*, csx-*, bf-*, policy-*, bottmform) is kept exactly,
   including every word. Only the look changes, to the mockup 4 dot-matrix system. */
:root{
  --w:#FFFFFF; --p:#EEF1F3; --p2:#E2E7EA; --p3:#D3DADF;
  --ink:#001B27; --ink2:#1D3945; --ink3:#3E5763;
  --line:rgba(0,27,39,.14); --line2:rgba(0,27,39,.28);
  --red:#F54529; --amber:#F2A33A; --ok:#1F8A5B;
  --sg:"Space Grotesk",system-ui,sans-serif; --mono:"Space Mono",ui-monospace,monospace; --dot:"Doto","Space Mono",monospace;
  --jb:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --wrap:1320px; --gut:32px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{background:var(--w);color:var(--ink);font:400 17px/1.6 var(--sg);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.container{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.dot{font-family:var(--dot);font-weight:800;letter-spacing:.02em}
.led{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--p3);box-shadow:inset 0 0 0 1px rgba(0,27,39,.18);flex:none}
.led.on{background:var(--red);box-shadow:0 0 0 3px rgba(245,69,41,.16)}
h1{font:700 clamp(34px,4vw,58px)/1.02 var(--sg);letter-spacing:-.04em}
h2{font:700 clamp(28px,3.1vw,44px)/1.05 var(--sg);letter-spacing:-.03em}
h3{font:700 21px/1.2 var(--sg);letter-spacing:-.02em}
h4{font:700 17px/1.25 var(--sg)}
em{font-style:normal;color:var(--red)}
.fa{font-size:.95em}

/* hardware primitives (from mockup 4) */
.hw{position:relative;border:1px solid var(--line2);background:var(--w)}
.screws{background-image:
  radial-gradient(circle at 11px 11px,var(--ink3) 0 1px,var(--w) 1.4px 2.6px,var(--p3) 2.9px 4px,transparent 4.3px),
  radial-gradient(circle at calc(100% - 11px) 11px,var(--ink3) 0 1px,var(--w) 1.4px 2.6px,var(--p3) 2.9px 4px,transparent 4.3px),
  radial-gradient(circle at 11px calc(100% - 11px),var(--ink3) 0 1px,var(--w) 1.4px 2.6px,var(--p3) 2.9px 4px,transparent 4.3px),
  radial-gradient(circle at calc(100% - 11px) calc(100% - 11px),var(--ink3) 0 1px,var(--w) 1.4px 2.6px,var(--p3) 2.9px 4px,transparent 4.3px)}
.reg::before,.reg::after{content:"";position:absolute;width:13px;height:13px;pointer-events:none;
  background:linear-gradient(var(--ink),var(--ink)) center/1px 100% no-repeat,linear-gradient(var(--ink),var(--ink)) center/100% 1px no-repeat}
.reg::before{top:-7px;left:-7px}.reg::after{bottom:-7px;right:-7px}

/* buttons */
.pg-btn,.btnmain,.csx-cta,.pkg-cta,.bf-submit,.pay-btn{display:inline-flex;align-items:center;justify-content:center;gap:11px;white-space:nowrap;min-height:52px;padding:0 22px;border-radius:3px;
  font:600 16px/1 var(--sg);border:1px solid var(--ink);background:var(--ink);color:var(--w);cursor:pointer;box-shadow:0 3px 0 var(--ink2);transition:transform .12s,box-shadow .12s,background .2s}
.pg-btn:hover,.btnmain:hover,.pkg-cta:hover{background:#0B2A38}
.pg-btn:active,.btnmain:active{transform:translateY(3px);box-shadow:none}
.pg-btn-primary::before,.btnmain::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red)}
.pg-btn-ghost{background:var(--w);color:var(--ink);box-shadow:0 3px 0 var(--p3)}
.pg-btn-ghost:hover{background:var(--p)}
.pg-hero-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}

/* ---------- hero ---------- */
.pg-hero,.csx-hero,.home-bannerwrp{padding:60px 0 64px;border-bottom:1px solid var(--line);background:
  linear-gradient(90deg,var(--w) 0 55%,transparent 75%),radial-gradient(circle,#D7DEE3 1.1px,transparent 1.5px) 0 0/14px 14px}
.pg-hero .container.x{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:48px;align-items:center}
.pg-eyebrow,.pg-kicker,.csx-eyebrow,.upr-head,.pkgs-eyebrow{display:inline-flex;align-items:center;gap:9px;font:400 12px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:18px}
.pg-eyebrow::before,.pg-kicker::before,.csx-eyebrow::before,.pkgs-eyebrow::before,.upr-head::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 0 3px rgba(245,69,41,.16);flex:none}
.pg-eyebrow .fa{display:none}
.pg-hero h1,.csx-hero h1,.home-bannerwrp h1{max-width:22ch}
.pg-hero-lead{font:500 21px/1.4 var(--sg);letter-spacing:-.01em;margin-top:22px;max-width:52ch}
.pg-hero-sub,.pg-hero p:not([class]),.csx-hero p:not(.csx-eyebrow){color:var(--ink2);margin-top:14px;max-width:64ch;font-size:16.5px}
.home-bannerwrp h1 span{color:var(--red)}
.home-bannerwrp .txtwrp{text-align:left}
/* dot-matrix channel display beside the hero */
.pg-screen{padding:16px}
.pg-screen .cv{background:linear-gradient(180deg,#01141E,#000D14);border:1px solid rgba(140,190,215,.28);box-shadow:inset 0 0 0 1px #000}
.pg-screen .bar{display:flex;align-items:center;gap:10px;height:34px;padding:0 12px;border-bottom:1px solid rgba(140,190,215,.16);font:400 10.5px/1 var(--jb);letter-spacing:.08em;text-transform:uppercase;color:#C3D0D7;white-space:nowrap;overflow:hidden}
.pg-screen .bar i{width:7px;height:7px;border:1px solid rgba(140,190,215,.3)}
.pg-screen .bar i:first-child{background:var(--red);border-color:var(--red)}
.pg-screen .bar b{color:#fff;font-weight:500;margin-left:auto}
.pg-screen .disp{min-height:170px;display:flex;flex-direction:column;justify-content:center;padding:22px 18px;
  background-image:radial-gradient(circle,rgba(140,190,215,.13) 1px,transparent 1.4px);background-size:8px 8px}
.pg-screen .disp .dot{font-size:clamp(30px,3.4vw,50px);line-height:1;color:var(--red);text-shadow:0 0 14px rgba(245,69,41,.45);word-break:break-word}
.pg-screen .disp small{font:400 11px/1.4 var(--jb);letter-spacing:.1em;text-transform:uppercase;color:#8FA6B1;margin-top:12px}
.pg-screen .keys{display:flex;gap:8px;padding:12px 2px 0;flex-wrap:wrap}
.pg-screen .keys a{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px;border:1px solid var(--line2);border-radius:3px;background:var(--w);font:400 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 2px 0 var(--p3)}
.pg-screen .keys a .led{background:var(--red)}

/* ---------- blocks ---------- */
.pg-block,.pg-industries,.pkgs-section,.csx-work,.our-testi,.bottmform{padding:80px 0}
.pg-alt{background:var(--p)}
.pg-h2{margin-bottom:18px}
.pg-p{color:var(--ink2);margin-top:14px;max-width:68ch}
.pg-p:first-of-type{margin-top:0}
.pg-block>.container>.pg-h2{display:flex;align-items:center;gap:16px}
.pg-block>.container>.pg-h2::after{content:"";flex:1;height:1px;background:var(--line2);min-width:40px}
.pg-block>.container>.pg-p{max-width:78ch}
.pg-sec-head{margin-bottom:34px;max-width:760px}
.pg-sec-head h2 span{color:var(--red)}
.pg-sec-head p{color:var(--ink2);margin-top:12px}

/* showcase */
.pg-showcase{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.pg-alt .pg-showcase{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.pg-alt .pg-showcase-text{order:2}
.pg-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:28px;border:1px solid var(--line2);background:var(--w)}
.pg-mini-grid span{padding:12px 14px;border-left:1px solid var(--line);font:400 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);display:flex;flex-direction:column;gap:6px}
.pg-mini-grid span:first-child{border-left:0}
.pg-mini-grid strong{font:800 24px/1 var(--dot);color:var(--ink)}
.pg-showcase-art{position:relative}
.pg-art-frame{position:relative;border:1px solid var(--line2);background:var(--p) radial-gradient(circle,#D0D8DD 1px,transparent 1.4px) 0 0/12px 12px;padding:26px;aspect-ratio:5/4;display:grid;place-items:center}
.pg-alt .pg-art-frame{background-color:var(--w)}
.pg-art-frame::before,.pg-art-frame::after{content:"";position:absolute;width:13px;height:13px;
  background:linear-gradient(var(--ink),var(--ink)) center/1px 100% no-repeat,linear-gradient(var(--ink),var(--ink)) center/100% 1px no-repeat}
.pg-art-frame::before{top:-7px;left:-7px}.pg-art-frame::after{bottom:-7px;right:-7px}
.pg-art-frame img{max-height:100%;width:auto;object-fit:contain}
.pg-art-note{display:flex;flex-direction:column;gap:4px;margin-top:12px;padding:12px 14px;background:var(--ink);color:#C3D0D7;font:400 11px/1.45 var(--jb);letter-spacing:.06em;text-transform:uppercase}
.pg-art-note strong{color:#fff;font-weight:500;letter-spacing:.04em}

/* process */
.pg-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));border:1px solid var(--line2);background:var(--w);margin-top:8px}
.pg-step{padding:22px 20px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:14px;margin:0 -1px -1px 0}
.pg-step-num{font:800 44px/1 var(--dot);color:var(--red)}
.pg-step p{font-size:15.5px;color:var(--ink)}
.pg-step h3,.pg-step h4{font-size:18px}

/* faq */
.pg-faq{border-top:1px solid var(--line2);margin-top:8px}
.pg-faq-item{border-bottom:1px solid var(--line2)}
.pg-faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 2px;font:600 18.5px/1.3 var(--sg);letter-spacing:-.01em}
.pg-faq-item summary::-webkit-details-marker{display:none}
.pg-faq-item summary .fa{flex:none;width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line2);border-radius:3px;font-size:12px;transition:transform .2s}
.pg-faq-item[open] summary .fa{transform:rotate(45deg);background:var(--ink);color:#fff}
.pg-faq-a{padding:0 50px 22px 2px;color:var(--ink2);max-width:80ch}

/* pills + lists */
.pg-pill,.csx-tags span,.pkg-format-pills span{display:inline-flex;align-items:center;height:30px;padding:0 11px;border:1px solid var(--line2);border-radius:3px;font:400 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;background:var(--w);margin:0 6px 6px 0}
.pg-block ul,.policy-list{list-style:none;display:grid;gap:9px;margin-top:14px}
.pg-block ul li,.policy-list li{display:flex;gap:11px;align-items:flex-start;color:var(--ink2)}
.fa-check{color:var(--red)}
.pg-block ul li .fa-check,.policy-list .fa-check,.pkg-features .fa-check{margin-top:6px;flex:none}
.pg-feature{border:1px solid var(--line2);padding:18px;background:var(--w)}

/* ctas */
.pg-cta{padding:76px 0;background:var(--ink);color:#DCE4E8;border-top:1px solid #000;
  background-image:radial-gradient(circle,rgba(140,190,215,.12) 1px,transparent 1.5px);background-size:11px 11px}
.pg-cta h2{color:#fff;max-width:24ch}
.pg-cta p{margin-top:14px;max-width:62ch;color:#C3D0D7}
.pg-cta .pg-btn-primary{background:var(--red);border-color:var(--red);color:var(--ink);box-shadow:0 3px 0 #B8321C}
.pg-cta .pg-btn-primary::before{background:var(--ink)}
.pg-cta .pg-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5);box-shadow:none}
.pg-cta .pg-eyebrow{color:var(--amber)}
.pg-cta-final{border-top:1px solid rgba(255,255,255,.12)}
.pg-funnel{margin-top:22px;font:400 12px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.pg-funnel a{color:#fff;border-bottom:1px solid var(--red);padding-bottom:2px}
.pg-funnel a::after{content:" →"}

/* industries + service cards */
.pg-industry-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:10px}
.pg-industry-card,.pg-serv-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 16px 14px;border:1px solid var(--line2);background:var(--w);box-shadow:0 3px 0 var(--p3);transition:transform .12s,box-shadow .12s}
.pg-industry-card:hover,.pg-serv-card:hover{transform:translateY(2px);box-shadow:0 1px 0 var(--p3);border-color:var(--ink)}
.pg-industry-card .fa{width:34px;height:34px;display:grid;place-items:center;background:var(--p);border:1px solid var(--line);color:var(--ink);font-size:15px;margin-bottom:6px}
.pg-industry-card:hover .fa{background:var(--ink);color:#fff}
.pg-industry-card span{font-weight:700;font-size:17px}
.pg-industry-card small{font:400 10.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.pg-serv-ico{width:40px;height:40px;display:grid;place-items:center;background:var(--ink);color:#fff}
.pg-serv-more{margin-top:auto;font:400 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--red)}

/* ---------- packages ---------- */
.pkgs-head{margin-bottom:26px;max-width:760px}
.pkgs-head p{color:var(--ink2);margin-top:12px}
.pkgs-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px;padding:12px;background:var(--p);border:1px solid var(--line2)}
.pkgs-tab{display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 14px;border:1px solid var(--line2);border-radius:3px;background:var(--w);cursor:pointer;font:400 11.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 2px 0 var(--p3)}
.pkgs-tab::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--p3)}
.pkgs-tab.active{transform:translateY(2px);box-shadow:none;border-color:var(--ink)}
.pkgs-tab.active::before{background:var(--red);box-shadow:0 0 0 3px rgba(245,69,41,.16)}
.pkgs-panel{display:none}.pkgs-panel.active{display:block}
.pkgs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:16px;align-items:start}
.pkg-card{position:relative;border:1px solid var(--line2);background:var(--w);padding:22px 20px;display:flex;flex-direction:column}
.pkg-badge{position:absolute;top:-1px;right:-1px;background:var(--red);color:var(--ink);font:700 10px/1 var(--mono);letter-spacing:.1em;padding:7px 9px}
.pkg-card-head{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:14px}
.pkg-card-head h3{padding-right:90px}
.pkg-desc{color:var(--ink2);font-size:15px;margin-top:8px}
.pkg-price{display:flex;align-items:baseline;gap:10px;margin-top:14px}
.pkg-amt{font:800 52px/1 var(--dot);color:var(--ink)}
.pkg-orig{font:400 14px/1 var(--mono);color:var(--ink3);text-decoration:line-through}
.pkg-features,.pkg-addons{list-style:none;display:grid;gap:8px;font-size:15px}
.pkg-features li,.pkg-addons li{display:flex;gap:10px}
.pkg-formats{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.pkg-formats strong{display:block;font:700 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin-bottom:10px}
.pkg-cta{margin-top:18px;width:100%}
/* trustpilot wall (packages page) */
.tp-section{padding:80px 0;background:var(--p);border-top:1px solid var(--line);overflow:hidden}
.tp-top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;align-items:center;margin-bottom:40px}
.tp-panel{border:1px solid var(--line2);background:var(--w);padding:26px 24px}
.tp-brand{display:flex;align-items:center;gap:9px;margin-bottom:16px;font-weight:700;font-size:19px}
.tp-brand .fa{color:#00B67A;font-size:20px}
.tp-score-stars{position:relative;display:inline-block;line-height:0;margin-bottom:14px}
.tp-row-grey,.tp-row-fill{display:flex;gap:4px}
.tp-row-fill{position:absolute;top:0;left:0;overflow:hidden;white-space:nowrap}
.tp-tile{width:30px;height:30px;flex:0 0 30px;display:inline-flex;align-items:center;justify-content:center}
.tp-tile .fa{font-size:15px;color:#fff}
.tp-tile-grey{background:var(--p3)}.tp-tile-green{background:#00B67A}
.tp-score-line{font-size:16px}.tp-score-line strong{font:800 34px/1 var(--dot);margin-right:4px}
.tp-score-sub{color:var(--ink2);font-size:14px;margin:4px 0 18px}
.tp-panel-link{display:inline-flex;align-items:center;height:44px;padding:0 16px;background:#00B67A;color:#06251a;font-weight:700;font-size:14px;border-radius:3px}
.tp-intro p{color:var(--ink2);margin:14px 0 20px;max-width:58ch}
.tp-intro h2 span{color:var(--red)}
.tp-cta{display:inline-flex;align-items:center;min-height:52px;padding:0 22px;background:var(--ink);color:#fff;font-weight:600;border-radius:3px;box-shadow:0 3px 0 var(--ink2)}
.tp-rail{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tp-track{display:flex;gap:16px;width:max-content;animation:tp-scroll 70s linear infinite}
.tp-rail:hover .tp-track{animation-play-state:paused}
@keyframes tp-scroll{to{transform:translateX(-50%)}}
.tp-card{flex:0 0 340px;width:340px;display:flex;flex-direction:column;border:1px solid var(--line2);background:var(--w);padding:22px 20px}
.tp-card-stars{display:flex;gap:3px;margin-bottom:14px}
.tp-card-stars .tp-tile{width:22px;height:22px;flex:0 0 22px}.tp-card-stars .tp-tile .fa{font-size:11px}
.tp-quote{flex:1;font-size:15px;margin-bottom:16px}
.tp-who{border-top:1px solid var(--line);padding-top:12px}
.tp-who b{display:block;font-size:15px}.tp-who span{display:block;font:400 11px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);margin-top:3px}
.tp-who .tp-verified{color:#0B7A52}
@media (max-width:991px){.tp-top{grid-template-columns:minmax(0,1fr)}}
@media (max-width:575px){.tp-card{flex-basis:280px;width:280px}.tp-section{padding:56px 0}}
@media (prefers-reduced-motion:reduce){.tp-rail{overflow-x:auto;-webkit-mask-image:none;mask-image:none}}

/* ---------- case studies ---------- */
.csx-row{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center;padding:36px 0;border-bottom:1px solid var(--line)}
.csx-row.rev .csx-stage{order:2}
.csx-browser{border:1px solid var(--line2);background:var(--w);box-shadow:0 18px 40px rgba(0,27,39,.12)}
.csx-chrome{display:flex;align-items:center;gap:12px;height:36px;padding:0 12px;background:var(--ink);color:#C3D0D7;font:400 11px/1 var(--jb)}
.csx-dots{display:flex;gap:5px}.csx-dots i{width:8px;height:8px;border:1px solid rgba(140,190,215,.35)}.csx-dots i:first-child{background:var(--red);border-color:var(--red)}
.csx-url{display:flex;gap:8px;align-items:center}
.csx-shot{position:relative;overflow:hidden}
.csx-open-badge{position:absolute;right:12px;bottom:12px;background:var(--ink);color:#fff;font:400 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;padding:9px 11px}
.csx-index{font:400 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin-bottom:12px}
.csx-role{font:400 12px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);margin-top:8px}
.csx-desc{color:var(--ink2);margin:14px 0 16px}
.csx-cta{margin-top:12px}
.csx-end{padding:40px 0}

/* ---------- forms (get started, contact, briefs) ---------- */
.bottmform .formwrp,.contact-form-card,.contact-info-card,.brief-card{border:1px solid var(--line2);background:var(--w);padding:28px;position:relative}
.bottmform .formwrp{max-width:820px;margin:0 auto}
.main-heading{font:700 clamp(28px,3vw,42px)/1.05 var(--sg);letter-spacing:-.03em}
.main-heading span{color:var(--red)}
.main-pera,.contact-form-card .sub,.contact-info-card .sub{color:var(--ink2);margin:12px 0 22px}
.text-center{text-align:center}
.row{display:flex;flex-wrap:wrap;margin:0 -8px}
.row>[class*="col-"]{padding:0 8px;width:100%}
@media (min-width:760px){.col-md-6{width:50%!important}}
.labelwrp{margin-bottom:14px}
input:not([type=hidden]):not([type=submit]):not([type=radio]):not([type=checkbox]),select,textarea{width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--line2);border-radius:3px;background:var(--w);font-size:16px}
textarea{min-height:130px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(245,69,41,.14)}
.contact-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px}
.contact-item{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--line)}
.contact-ico{width:40px;height:40px;display:grid;place-items:center;background:var(--ink);color:#fff;flex:none}
.contact-item h4{font:700 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin-bottom:6px}
.contact-social{display:flex;gap:8px;margin:16px 0}
.contact-social a{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line2)}
.contact-map iframe{width:100%;height:240px;border:1px solid var(--line2);display:block}
.cf{display:grid;gap:12px;margin-bottom:12px}
.cf-row{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.brief-wrap{max-width:900px;margin:0 auto;display:grid;gap:18px}
.brief-label,.brief-step{font:400 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin-bottom:14px;display:block}
.bf{display:grid;gap:8px;margin-bottom:16px}
.bf label{font-weight:600}
.bf-hint{color:var(--ink3);font-size:14px}
.bf-required{color:var(--red)}
.bf-style-grid,.bf-check-grid,.bf-color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr));gap:8px}
.bf-style-opt,.bf-check-item,.bf-color-opt{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line2);cursor:pointer;background:var(--w)}
.bf-style-opt:has(input:checked),.bf-check-item:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.bf-footer{margin-top:18px}

/* ---------- policies, testimonials, blog ---------- */
.policy-wrap{max-width:880px}
.policy-h2{font-size:clamp(22px,2.2vw,28px);margin:40px 0 8px}
.policy-h2::after{display:none}
.policy-contact{margin-top:30px;padding:20px;border:1px solid var(--line2);background:var(--p)}
.our-testi .row{gap:0}
.our-testi .txtwrp{margin-bottom:24px}
.mainwrp{border:1px solid var(--line2);padding:22px;margin-bottom:16px;display:grid;grid-template-columns:minmax(0,1fr) 54px;gap:12px 16px;background:var(--w)}
.mainwrp>p{grid-column:1/-1;font-size:17px}
.namwrp h4{font-size:16px}.namwrp h6{font:400 11px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);margin:4px 0 6px}
.namwrp .fa-star{color:var(--ok)}
.imawrp span{width:54px;height:54px;display:grid;place-items:center;background:var(--ink);color:#fff;font:800 20px/1 var(--dot)}
.blog-empty{padding:30px;border:1px dashed var(--line2);text-align:center;color:var(--ink2)}
.pay-wrap{max-width:720px;margin:0 auto}

/* demo toast for mock form submits */
.demo-toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:90;background:var(--ink);color:#fff;padding:12px 16px;border-radius:3px;font:400 12px/1.4 var(--jb);letter-spacing:.04em;box-shadow:0 14px 34px rgba(0,27,39,.3);max-width:calc(100vw - 32px)}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .pg-hero .container.x,.pg-showcase,.pg-alt .pg-showcase,.csx-row,.contact-grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .pg-alt .pg-showcase-text{order:0}
  .csx-row.rev .csx-stage{order:0}
}
@media (max-width:720px){
  :root{--gut:16px}
  body{font-size:16px}
  .pg-hero,.csx-hero,.home-bannerwrp{padding:36px 0 44px}
  .pg-block,.pg-industries,.pkgs-section,.csx-work,.our-testi,.bottmform{padding:56px 0}
  .pg-cta{padding:56px 0}
  .pg-hero-lead{font-size:19px}
  .pg-hero-btns .pg-btn{width:100%}
  .pg-art-frame{padding:16px}
  .pg-faq-a{padding-right:0}
  .pg-faq-item summary{font-size:17px}
  .bottmform .formwrp,.contact-form-card,.contact-info-card,.brief-card{padding:20px 16px}
  .pkg-amt{font-size:44px}
  .pg-screen{padding:10px}
  .pg-screen .disp{min-height:130px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.pg-cta:not(:has(h2,h3)){padding:28px 0}
@media (min-width:900px){.bf-style-grid,.bf-check-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.pg-industry-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.pg-industry-card{padding:12px 12px 10px}}
.wk-filter>*{flex:1 1 auto}
.keys>*{flex:1 1 auto;justify-content:center}
@media (min-width:900px){html body .wk-filter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}}
html body .wk-filter>*{flex:1 1 auto}
@media (min-width:900px){html body .pkgs-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}}
