@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

:root{
  --ink:#081525;--ink-2:#10233d;--muted:#6b7c91;--line:rgba(16,35,61,.12);
  --white:#fff;--ice:#f4f8fc;--navy:#07182b;--navy-2:#0a2541;
  --cyan:#19e1d4;--blue:#4f8cff;--violet:#9b6cff;--lime:#c7ff4a;
  --shadow:0 30px 90px rgba(6,25,48,.14);--radius:26px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"DM Sans",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.7;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.018;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}
a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}.container{width:min(1200px,92%);margin:auto}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.76);backdrop-filter:blur(22px) saturate(170%);-webkit-backdrop-filter:blur(22px) saturate(170%);border-bottom:1px solid rgba(16,35,61,.08);transition:.3s ease}
.site-header.scrolled{background:rgba(255,255,255,.93);box-shadow:0 12px 45px rgba(5,25,48,.1)}
.nav-wrap{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:11px;min-width:max-content}.company-logo{width:56px;height:56px;object-fit:contain;filter:drop-shadow(0 7px 16px rgba(9,39,68,.15))}.brand-name{display:flex;flex-direction:column;line-height:1.04}.brand-name strong{font:800 14px Manrope,sans-serif;letter-spacing:.13em;color:#0b2948}.brand-name small{font-size:9px;font-weight:800;letter-spacing:.18em;color:#0aaea7;margin-top:5px}
nav{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:800;color:#506278}nav a{padding:10px 12px;border-radius:12px;transition:.25s ease;position:relative}nav a:not(.nav-button)::after{content:"";position:absolute;left:12px;right:12px;bottom:5px;height:2px;background:linear-gradient(90deg,var(--cyan),var(--blue));transform:scaleX(0);transform-origin:left;transition:.25s}nav a:hover::after,nav a.active::after{transform:scaleX(1)}nav a:hover,nav a.active{color:#0b2948;background:#eef7fb}.nav-button{color:#fff!important;background:linear-gradient(135deg,#071e35,#0b6881 60%,#13b9ae);padding:12px 17px!important;box-shadow:0 12px 30px rgba(9,76,105,.2)}.nav-button:hover{transform:translateY(-2px);box-shadow:0 18px 35px rgba(9,76,105,.28)}.menu-toggle{display:none;border:0;background:transparent;color:#0b2948;font-size:28px;cursor:pointer}
.hero{position:relative;min-height:690px;display:flex;align-items:center;padding:85px 0 80px;overflow:hidden;background:radial-gradient(circle at 72% 18%,rgba(139,78,39,0.45),transparent 23%),radial-gradient(circle at 12% 78%,rgba(155,108,255,.14),transparent 28%),linear-gradient(135deg,#f9fcff 0%,#edf7ff 48%,#f7fffd 100%)}
.hero::before{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 45%,rgba(79,140,255,.08) 50%,transparent 55%);animation:sweep 9s linear infinite;pointer-events:none}.hero::after{content:"";position:absolute;width:620px;height:620px;right:-280px;bottom:-360px;border-radius:50%;border:1px solid rgba(139,78,39,0.45);box-shadow:0 0 0 60px rgba(139,78,39,0.45),0 0 0 120px rgba(139,78,39,0.45);pointer-events:none}
@keyframes sweep{0%{transform:translateX(-30%)}100%{transform:translateX(30%)}}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,900px);gap:70px;align-items:center}.eyebrow{font:700 10px/1.2 "Space Mono",monospace;letter-spacing:.19em;text-transform:uppercase;color:#079e99;margin:0 0 16px}.hero h1,.page-hero h1{font:800 clamp(46px,6vw,78px)/.99 Manrope,sans-serif;letter-spacing:-.065em;color:#071d35;margin:0 0 25px;max-width:760px}.hero h1::after{content:"";display:block;width:92px;height:5px;border-radius:20px;margin-top:27px;background:linear-gradient(90deg,var(--cyan),var(--blue),var(--violet));box-shadow:0 5px 18px rgba(139,78,39,0.45)}.lead{font-size:18px;line-height:1.8;color:#53687d;max-width:700px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:32px 0 25px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 21px;border-radius:13px;font-size:13px;font-weight:800;border:1px solid transparent;transition:.28s ease}.button:hover{transform:translateY(-3px);box-shadow:0 16px 35px rgba(8,44,79,.16)}.button.primary{color:#fff;background:linear-gradient(110deg,#071e35,#0c5576,#13b9ae);background-size:200% 100%;animation:gradientShift 5s ease infinite;box-shadow:0 14px 32px rgba(8,55,80,.2)}.button.outline{color:#0a3156;border-color:#cbd9e7;background:rgba(255,255,255,.7)}.button.light{color:#071d35;background:#fff}.microline{display:flex;gap:20px;flex-wrap:wrap;color:#6c7e92;font-size:11px;font-weight:700}.microline span{position:relative;padding-left:14px}.microline span::before{content:"";position:absolute;left:0;top:.7em;width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(139,78,39,0.45)}.microline b{color:#153c60}
@keyframes gradientShift{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
.hero-media{position:relative;height:515px;transform:perspective(1200px) rotateY(-3deg) rotateX(1deg);transition:transform .5s ease}.hero-media:hover{transform:perspective(1200px) rotateY(0) rotateX(0) translateY(-4px)}.hero-media-frame{height:100%;position:relative;overflow:hidden;border-radius:30px;background:#071c31;box-shadow:0 35px 90px rgba(7,33,61,.23);border:1px solid rgba(255,255,255,.7)}.hero-media-frame::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(3,19,34,.02) 35%,rgba(3,19,34,.76) 100%);pointer-events:none}.hero-media-frame::after{content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,.2);border-radius:22px;z-index:3;pointer-events:none}.hero-media-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(1.05) contrast(1.03)}.hero-media-overlay{position:absolute;z-index:4;left:30px;right:30px;bottom:32px;color:#fff}.hero-media-overlay span{display:block;font:700 9px "Space Mono",monospace;letter-spacing:.13em;color:var(--cyan);margin-bottom:12px}.hero-media-overlay strong{display:block;font:800 clamp(25px,3vw,38px)/1.05 Manrope,sans-serif;letter-spacing:-.04em;max-width:470px}.video-section{background:#f4f8fc}.video-card{display:grid;grid-template-columns:1.25fr .75fr;gap:45px;align-items:center}.video-frame{position:relative;border-radius:28px;overflow:hidden;background:#06111f;box-shadow:0 30px 80px rgba(6,25,48,.18);border:1px solid rgba(16,35,61,.12)}.video-frame video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.video-badge{position:absolute;top:18px;right:18px;padding:8px 11px;border-radius:999px;background:rgba(6,17,31,.72);color:var(--cyan);font:700 9px "Space Mono",monospace;letter-spacing:.1em;backdrop-filter:blur(10px)}.video-copy h2{font:800 clamp(34px,4vw,50px)/1.08 Manrope,sans-serif;letter-spacing:-.05em;color:#0a2038;margin:0 0 17px}.video-copy p{color:#6b7c91;font-size:16px}.video-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.video-meta span{padding:9px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);font:700 9px "Space Mono",monospace;color:#507087;letter-spacing:.08em}
.section{position:relative;padding:105px 0;background:#fff}.section:nth-of-type(even){background:#f6f9fc}.section-head{display:grid;grid-template-columns:.27fr 1fr;gap:55px;margin-bottom:54px}.section-head h2,.document-copy h2{font:800 clamp(34px,4vw,52px)/1.08 Manrope,sans-serif;letter-spacing:-.05em;color:#0a2038;margin:0 0 18px;max-width:850px}.section-copy{font-size:17px;color:#6a7c90;max-width:780px}.problem{display:grid;grid-template-columns:1.2fr .8fr;gap:28px}.problem-visual,.problem-note,.document,.stats-line,.workflow,.service-list,.industry-matrix{border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.82);box-shadow:0 20px 60px rgba(11,38,67,.06)}.problem-visual{padding:28px;overflow:hidden;background:linear-gradient(145deg,#0a1d33,#0e2b49);color:#fff;position:relative}.problem-visual::before{content:"";position:absolute;width:260px;height:260px;right:-120px;top:-120px;border-radius:50%;background:rgba(139,78,39,0.45);filter:blur(10px)}.problem-visual .row{display:grid;grid-template-columns:1fr 1fr;padding:18px 4px;border-bottom:1px solid rgba(255,255,255,.11);position:relative;z-index:1}.problem-visual .row:last-child{border-bottom:0}.problem-visual span:first-child{font:700 10px "Space Mono",monospace;color:#8fa5bb;letter-spacing:.12em}.problem-visual span:last-child{font-weight:700;color:#dffaf7}.problem-note{padding:38px;background:linear-gradient(145deg,#ffffff,#effbfd);transition:.35s}.problem-note:hover{transform:translateY(-7px);box-shadow:0 30px 70px rgba(10,67,91,.11)}.problem-note h3{font:800 28px/1.15 Manrope,sans-serif;letter-spacing:-.04em;margin:0 0 14px;color:#0b2948}.problem-note p:last-child{color:#6a7c90}
.workflow{display:grid;grid-template-columns:repeat(6,1fr);overflow:hidden;background:#071a2e;border-color:#173b5d}.node{min-height:170px;padding:24px 17px;color:#fff;border-right:1px solid rgba(255,255,255,.1);position:relative;overflow:hidden;transition:.35s}.node:last-child{border-right:0}.node::after{content:"";position:absolute;width:100px;height:100px;right:-45px;bottom:-50px;border-radius:50%;background:rgba(139,78,39,0.45);transition:.35s}.node:hover{background:linear-gradient(145deg,#0b2c4c,#0a4058);transform:translateY(-5px)}.node:hover::after{transform:scale(1.5)}.node-number{display:inline-flex;width:35px;height:35px;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(139,78,39,0.45);color:var(--cyan);font:700 11px "Space Mono",monospace;margin-bottom:42px}.node h3{font:800 13px/1.25 Manrope,sans-serif;letter-spacing:.02em;margin:0;max-width:130px}
.service-list{overflow:hidden}.service-list article{display:grid;grid-template-columns:55px 1fr auto;gap:24px;align-items:center;padding:28px 31px;border-bottom:1px solid var(--line);transition:.3s;background:#fff;position:relative}.service-list article:last-child{border-bottom:0}.service-list article::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--cyan),var(--blue));transform:scaleY(0);transform-origin:bottom;transition:.3s}.service-list article:hover{background:linear-gradient(90deg,#f5fffe,#fff)}.service-list article:hover::before{transform:scaleY(1)}.num{font:700 12px "Space Mono",monospace;color:#0a9f9a}.service-list h3{font:800 20px Manrope,sans-serif;color:#0b2948;margin:0 0 6px}.service-list p{margin:0;color:#718195}.tag{padding:8px 10px;border-radius:999px;background:#eef8f8;color:#078e8a;font:700 9px "Space Mono",monospace;letter-spacing:.1em;white-space:nowrap}
.industry-matrix{overflow:hidden}.industry-row{display:grid;grid-template-columns:55px 1fr 1fr;gap:25px;align-items:center;padding:25px 30px;border-bottom:1px solid var(--line);transition:.3s}.industry-row:last-child{border-bottom:0}.industry-row:hover{background:linear-gradient(90deg,#f0fbfb,#f7faff);padding-left:37px}.industry-row h3{margin:0;font:800 18px Manrope,sans-serif;color:#0b2948}.industry-row p{margin:0;color:#728398}
.stats-line{display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden;background:#071a2e;border-color:#163653}.stat{padding:43px 35px;color:#fff;border-right:1px solid rgba(255,255,255,.1);position:relative;overflow:hidden}.stat:last-child{border-right:0}.stat::before{content:"";position:absolute;right:-50px;top:-50px;width:150px;height:150px;border-radius:50%;background:rgba(139,78,39,0.45)}.stat strong{display:block;font:800 clamp(36px,5vw,58px)/1 Manrope,sans-serif;letter-spacing:-.06em;color:#fff}.stat span{display:block;margin-top:12px;color:#9db0c4;font-size:13px}.stat:first-child strong{color:var(--cyan)}
.document-section{background:linear-gradient(135deg,#f7fbff,#eef7ff)}.document-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:65px;align-items:center}.document-copy p:last-child{color:#6d7e92;font-size:16px}.document{overflow:hidden;background:#fff;box-shadow:var(--shadow);transform:rotate(.7deg);transition:.4s}.document:hover{transform:rotate(0) translateY(-7px)}.doc-top{display:flex;justify-content:space-between;padding:16px 22px;background:#071a2e;color:#9db2c8;font:700 9px "Space Mono",monospace}.doc-title{padding:26px 24px 18px;font:800 24px Manrope,sans-serif;color:#0b2948;border-bottom:1px solid var(--line)}.doc-fields{display:grid;grid-template-columns:1fr 1fr}.doc-field{padding:18px 20px;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}.doc-field:nth-child(even){border-right:0}.doc-field b{display:block;font:700 9px "Space Mono",monospace;color:#078f8b;letter-spacing:.1em;margin-bottom:6px}.doc-field span{font-size:13px;color:#5e7186}
.cta{position:relative;overflow:hidden;padding:90px 0;background:radial-gradient(circle at 82% 40%,rgba(139,78,39,0.45),transparent 25%),radial-gradient(circle at 10% 90%,rgba(155,108,255,.18),transparent 25%),linear-gradient(120deg,#06182b,#0b2b48 55%,#082b3b);color:#fff}.cta::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 80%,transparent)}.cta-inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:50px}.cta h2{font:800 clamp(34px,4vw,55px)/1.05 Manrope,sans-serif;letter-spacing:-.05em;margin:0 0 14px;max-width:800px}.cta p{color:#a9bbcb;max-width:750px}.cta .eyebrow{color:var(--cyan)}
.footer{background:#04111f;color:#9aafc2;padding:70px 0 0}.footer-grid{display:grid;grid-template-columns:1.4fr .6fr .6fr;gap:65px;padding-bottom:50px}.footer-brand{color:#fff}.footer p{max-width:460px;color:#8399ad;font-size:13px}.footer h4{color:#fff;font:800 13px Manrope,sans-serif;margin:4px 0 15px}.footer-grid>div>a:not(.brand){display:block;color:#8ea4b8;font-size:13px;margin:8px 0;transition:.2s}.footer-grid>div>a:not(.brand):hover{color:var(--cyan);transform:translateX(3px)}.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:20px 0 25px;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#647a8f}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.in{opacity:1;transform:none}.card,.industry,.expertise{transition:.3s ease}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr;gap:45px}.hero-media{height:470px}.section-head{grid-template-columns:1fr;gap:15px}.workflow{grid-template-columns:repeat(3,1fr)}.node:nth-child(3){border-right:0}.document-grid{grid-template-columns:1fr}.document{transform:none}.cta-inner{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.nav-wrap{min-height:74px}.menu-toggle{display:block;z-index:101}nav a{text-align:center}.nav-button{text-align:center}.hero{padding:65px 0 55px}.hero h1{font-size:clamp(43px,13vw,62px)}.hero-media{height:390px;transform:none}.problem{grid-template-columns:1fr}.workflow{grid-template-columns:1fr 1fr}.node{border-right:1px solid rgba(255,255,255,.1)!important;border-bottom:1px solid rgba(255,255,255,.1)}.node:nth-child(even){border-right:0!important}.service-list article{grid-template-columns:35px 1fr}.tag{grid-column:2;justify-self:start}.industry-row{grid-template-columns:35px 1fr}.industry-row p{grid-column:2}.stats-line{grid-template-columns:1fr}.stat{border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}.footer-grid{grid-template-columns:1fr;gap:35px}.footer-bottom{flex-direction:column}.section{padding:78px 0}.section-head h2,.document-copy h2{font-size:38px}.doc-fields{grid-template-columns:1fr}.doc-field{border-right:0}.slider-prev{left:14px}.slider-next{right:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}


/* =========================================================
   ACCESSIBILITY / BRAND VISIBILITY UPDATE
   High-contrast footer company branding
   ========================================================= */
.footer .footer-brand .brand-name strong {
  color: #ffffff !important;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-shadow: 0 0 18px rgba(255,255,255,0.10);
}

.footer .footer-brand .brand-name small {
  color: #F4A261 !important;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-shadow: 0 0 14px rgba(53,224,255,0.28);
}

.footer .footer-brand .brand-mark {
  color: #ffffff !important;
  border-color: rgba(53,224,255,0.45) !important;
  background: rgba(53,224,255,0.08) !important;
}

.footer .footer-brand {
  color: #ffffff !important;
}

.footer .footer-brand:hover .brand-name strong {
  color: #ffffff !important;
}

.footer .footer-brand:hover .brand-name small {
  color: #FFD2A6 !important;
}

@media (max-width: 640px) {
  .footer .footer-brand .brand-name strong {
    font-size: 0.96rem;
  }
  .footer .footer-brand .brand-name small {
    font-size: 0.62rem;
  }
}


/* VIBRANT BROWN CORPORATE TECHNOLOGY THEME */
:root{
 --brown-950:#24130D; --brown-900:#321B10; --brown-800:#4A2917;
 --brown-700:#673B1D; --brown-600:#8B4E27; --caramel:#C96F3D;
 --orange:#F4A261; --gold:#F6BD60; --cream:#FFF8F0;
}
html,body{
 background:radial-gradient(circle at 15% 10%,rgba(244,162,97,.16),transparent 30%),
 radial-gradient(circle at 85% 20%,rgba(201,111,61,.13),transparent 28%),
 linear-gradient(135deg,#FFF8F0 0%,#F5E5D3 48%,#EED4BA 100%);
}
body{color:#321B10}
.navbar,.nav,header{background:rgba(36,19,13,.94)!important;border-color:rgba(244,162,97,.24)!important}
a,.accent,.eyebrow,.section-kicker{color:#C96F3D!important}
.btn,.button,.cta,button{
 background:linear-gradient(135deg,#8B4E27,#C96F3D 55%,#F4A261)!important;
 border-color:#F4A261!important;color:#FFF8F0!important;
 box-shadow:0 12px 28px rgba(139,78,39,.24);
}
.btn:hover,.button:hover,.cta:hover,button:hover{
 background:linear-gradient(135deg,#673B1D,#C96F3D 55%,#F6BD60)!important
}
.card,.service-card,.industry-card,.panel,.glass,.content-card{
 border-color:rgba(139,78,39,.22)!important;
 background:rgba(255,248,240,.82)!important;
 box-shadow:0 18px 45px rgba(91,48,25,.12);
}
.footer{background:linear-gradient(135deg,#24130D,#4A2917)!important;border-top-color:rgba(244,162,97,.3)!important}
.footer .footer-brand .brand-name strong{color:#FFF8F0!important}
.footer .footer-brand .brand-name small{color:#F4A261!important}
::selection{background:#C96F3D;color:#FFF8F0}


/* =========================================================
   COMPLETE ALL-BROWN OVERRIDE
   No blue/cyan UI accents
   ========================================================= */
:root {
  --primary: #6B3A1E !important;
  --secondary: #8B4E27 !important;
  --accent: #C96F3D !important;
  --accent-bright: #F0A15A !important;
  --highlight: #F6BD60 !important;
  --dark: #24130D !important;
  --dark-2: #321B10 !important;
  --cream: #FFF8F0 !important;
}

* {
  scrollbar-color: #8B4E27 #321B10;
}

body {
  color: #321B10 !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(240,161,90,.18), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(201,111,61,.16), transparent 30%),
    linear-gradient(135deg, #FFF8F0 0%, #F4E0CC 50%, #E8C9AB 100%) !important;
}

h1,h2,h3,h4,h5,h6,
.hero-title, .section-title {
  color: #3A2114 !important;
}

.navbar, nav, header {
  background: linear-gradient(135deg,#24130D,#4A2917) !important;
  border-color: rgba(240,161,90,.30) !important;
}

.navbar a, nav a {
  color: #FFF8F0 !important;
}

.navbar a:hover, nav a:hover,
.navbar .active, nav .active {
  color: #F0A15A !important;
}

a, .accent, .eyebrow, .section-kicker, .highlight {
  color: #A95D2A !important;
}

button, .btn, .button, .cta {
  background: linear-gradient(135deg,#6B3A1E,#A95D2A 55%,#F0A15A) !important;
  border-color: #F0A15A !important;
  color: #FFF8F0 !important;
}

button:hover, .btn:hover, .button:hover, .cta:hover {
  background: linear-gradient(135deg,#512E19,#8B4E27 55%,#F6BD60) !important;
}

.card, .service-card, .industry-card, .panel, .glass, .content-card,
.feature-card, .info-card {
  background: rgba(255,248,240,.90) !important;
  border-color: rgba(139,78,39,.25) !important;
  box-shadow: 0 18px 45px rgba(91,48,25,.15) !important;
}

.icon, .service-icon, .feature-icon {
  color: #C96F3D !important;
  border-color: rgba(201,111,61,.35) !important;
  background: rgba(201,111,61,.10) !important;
}

input, textarea, select {
  background: #FFF8F0 !important;
  color: #321B10 !important;
  border-color: rgba(139,78,39,.32) !important;
}

input:focus, textarea:focus, select:focus {
  border-color: #C96F3D !important;
  box-shadow: 0 0 0 3px rgba(240,161,90,.16) !important;
}

.footer {
  background: linear-gradient(135deg,#24130D,#4A2917,#673B1D) !important;
  border-top-color: rgba(240,161,90,.35) !important;
}

.footer a {
  color: #FFE0C2 !important;
}

.footer a:hover {
  color: #F6BD60 !important;
}

.footer .footer-brand .brand-name strong {
  color: #FFF8F0 !important;
}

.footer .footer-brand .brand-name small {
  color: #F0A15A !important;
}

::selection {
  background: #C96F3D !important;
  color: #FFF8F0 !important;
}


/* SD WARM BROWN THEME */
:root{
  --brown:#3B2921;
  --brown-dark:#241914;
  --brown-mid:#6F5143;
  --accent:#A85636;
  --ink:#2B211D;
  --muted:#665953;
  --line:#D8CCC4;
  --soft:#F4EFEA;
  --paper:#FBF8F4;
}
body{background:var(--paper);color:var(--ink)}
.site-header{background:rgba(251,248,244,.98);border-bottom:1px solid var(--line)}
.brand-mark{background:var(--brown);color:#fff}
.brand b,.brand strong{color:var(--brown)}
.brand small{color:var(--accent)}
nav{color:#5A4941}
nav a:hover,nav a.active{color:var(--brown)}
.nav-button{background:var(--brown);color:#fff}
.menu-toggle{color:var(--brown)}
.hero{background:linear-gradient(135deg,#F5F0EB,#FBF8F4 55%,#F1E7E0)}
.hero h1,.page-hero h1,.section h2,.service-list h2,.card h3,.section h3,.step h2{color:var(--brown)}
.eyebrow,.number,.service-list article>span,.step>span,.contact-points b,.industry b{color:var(--accent)}
.lead,.section p,.page-hero p:not(.eyebrow){color:var(--muted)}
.primary{background:var(--brown);color:#fff}
.outline{border-color:#BCAAA0;background:#fff;color:var(--brown)}
.light{background:#fff;color:var(--brown)}
.trust,.microline{color:#6A5B54}
.hero-visual,.feature-box{background:var(--brown);color:#fff}
.hero-visual{box-shadow:0 18px 50px rgba(59,41,33,.14)}
.soft,.section.soft,.page-hero{background:var(--soft)}
.card,.industry,.stats div{background:#fff;border-color:var(--line)}
.text-link{color:var(--accent)}
.cta{background:linear-gradient(110deg,var(--brown-dark),var(--brown));color:#fff}
.cta h2{color:#fff}.cta p{color:#E9DDD5}
.feature-box strong{color:#E59A79}.feature-box p{color:#E2D5CD}
.notice{border-left-color:var(--accent);background:#F3E8E1}
.notice strong{color:var(--brown)}
.service-list article,.step,.contact-points div{border-color:var(--line)}
.contact-form label{color:#51423B}
.contact-form input,.contact-form textarea,.contact-form select{border-color:#CDBDB3;background:#fff;color:var(--ink)}
.footer{background:var(--brown-dark);color:#D9C9C0}
.footer-brand b,.footer-brand strong,.footer h4{color:#fff}
.footer-brand small{color:#E59A79}
.footer p,.footer a{color:#D9C9C0}
.footer a:hover{color:#fff}
.footer-bottom{border-top-color:rgba(255,255,255,.18);color:#BDAAA0}
.hero-slider{background:var(--brown)}
.slider-prev,.slider-next{background:rgba(59,41,33,.78);border-color:rgba(255,255,255,.65);color:#fff}
.slider-prev:hover,.slider-next:hover{background:var(--accent)}
@media(max-width:700px){nav{background:#FBF8F4}}
/* Replace numbered visual markers with bullets */
.service-list article>span.num,.industry-row>span.num,.step>span,.node-number{font-size:0}
.service-list article>span.num::after,.industry-row>span.num::after,.step>span::after,.node-number::after{
  content:"•";font-size:20px;color:var(--accent);line-height:1
}


/* =========================================================
   COMPANY BRAND VISIBILITY FIX
   High contrast against dark brown header/footer
   ========================================================= */

/* Header / navigation brand */
.brand,
.brand-name,
.logo-text,
.site-brand,
.nav-brand,
.navbar-brand,
header .brand-name,
header .logo-text,
header .site-brand {
  color: #FFF8F0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.45) !important;
}

.brand strong,
.brand-name strong,
.logo-text strong,
.site-brand strong,
.nav-brand strong,
.navbar-brand strong,
header .brand-name strong,
header .logo-text strong,
header .site-brand strong {
  color: #FFFFFF !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.55) !important;
}

.brand small,
.brand-name small,
.logo-text small,
.site-brand small,
.nav-brand small,
.navbar-brand small,
header .brand-name small,
header .logo-text small,
header .site-brand small {
  color: #F4A261 !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  letter-spacing: .16em !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.5) !important;
}

/* Common nested spans used by branding */
.brand span,
.brand-name span,
.logo-text span,
.site-brand span,
.nav-brand span,
.navbar-brand span {
  color: #FFF8F0 !important;
  opacity: 1 !important;
}

/* If the brand is rendered as plain text beside the logo */
header a,
.navbar a {
  opacity: 1 !important;
}

/* Keep the logo itself crisp */
.brand img,
.nav-brand img,
.navbar-brand img,
.logo img,
header img {
  opacity: 1 !important;
  filter: none !important;
}

/* =========================================================
   ABOUT PAGE — FINAL POLISH
   ========================================================= */

/* 1. Prevent hero content from hiding behind navbar */
.page-hero {
    padding-top: 90px;
}

.page-hero .container {
    padding-top: 20px;
}


/* 2. Technical expertise — structured editorial layout */

.expertise-list {
    margin-top: 65px;
    border-top: 1px solid rgba(61, 35, 22, 0.22);
}

.expertise {
    position: relative;
    display: grid;
    grid-template-columns: 80px minmax(260px, 0.8fr) minmax(300px, 1fr);
    align-items: center;
    gap: 40px;
    padding: 34px 10px;
    border-bottom: 1px solid rgba(61, 35, 22, 0.16);
    transition:
        background-color 0.3s ease,
        padding-left 0.3s ease;
}

.expertise .n {
    font-family: "Space Mono", monospace;
    font-size: 12px;
    letter-spacing: 0.12em;
    color: var(--accent);
}

.expertise h3 {
    margin: 0;
    font-size: 25px;
    line-height: 1.2;
    color: var(--brown);
    font-weight: 700;
}

.expertise p {
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: var(--muted);
}

.expertise:hover {
    background: rgba(197, 91, 47, 0.045);
    padding-left: 20px;
}


/* 3. Disclaimer */

.notice {
    max-width: 1100px;
    margin: 0 auto;
    padding: 30px 36px;
    border-left: 4px solid var(--accent);
    border-top: 1px solid rgba(61, 35, 22, 0.12);
    border-bottom: 1px solid rgba(61, 35, 22, 0.12);
    background: rgba(197, 91, 47, 0.055);
}

.notice strong {
    display: block;
    margin-bottom: 14px;
    font-size: 16px;
    line-height: 1.4;
    color: var(--brown);
}

.notice p {
    margin: 0;
    max-width: 100%;
    font-size: 14px;
    line-height: 1.75;
    color: var(--muted);
}


/* 4. Footer contrast */

.footer h4 {
    color: #f4eee4;
}

.footer a {
    color: rgba(244, 238, 228, 0.82);
}

.footer a:hover {
    color: #ffffff;
}


/* 5. Expertise heading spacing */

.section-head {
    margin-bottom: 20px;
}

.section-head h2 {
    margin-bottom: 0;
}

.section-head .eyebrow {
    margin-bottom: 10px;
}


/* 6. 23+ experience statement */

.about-note {
    align-self: center;
    padding: 35px 0 35px 45px;
    border-left: 1px solid rgba(61, 35, 22, 0.25);
}

.about-note strong {
    display: block;
    font-family: "Manrope", sans-serif;
    font-size: clamp(48px, 6vw, 72px);
    line-height: 0.95;
    letter-spacing: -0.05em;
    color: var(--brown);
    margin-bottom: 16px;
}

.about-note span {
    display: block;
    max-width: 420px;
    font-size: 14px;
    line-height: 1.75;
    color: var(--muted);
}


/* Mobile */

@media (max-width: 768px) {

    .page-hero {
        padding-top: 70px;
    }

    .expertise {
        grid-template-columns: 45px 1fr;
        gap: 15px 20px;
    }

    .expertise h3 {
        font-size: 21px;
    }

    .expertise p {
        grid-column: 2;
    }

    .about-note {
        margin-top: 30px;
        padding: 25px 0 25px 25px;
    }

    .notice {
        padding: 24px;
    }
}

.footer h4 {
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 20px;
}

.footer a {
    color: #f4e6d8;
}

.footer a:hover {
    color: #ffffff;
}

/* Footer headings */
.footer h4 {
    color: #f4e6d8 !important;
    font-weight: 700 !important;
}
.page-hero {
    padding-bottom: 35px !important;
    border-bottom: 16px solid #f6dfc8 !important;
}

/* =========================================================
   INDUSTRIES PAGE — TECHNICAL MATRIX
   ========================================================= */

.industry-matrix {
    border: 1px solid rgba(57, 33, 22, 0.14);
    border-radius: 24px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.55);
    box-shadow: 0 18px 45px rgba(57, 33, 22, 0.06);
}

.industry-matrix .industry-row {
    position: relative;
    display: grid;
    grid-template-columns: 70px minmax(280px, 0.8fr) 1fr;
    align-items: center;
    gap: 28px;

    min-height: 105px;
    padding: 24px 38px;

    border-bottom: 1px solid rgba(57, 33, 22, 0.12);

    transition:
        background 0.25s ease,
        padding-left 0.25s ease;
}

.industry-matrix .industry-row:last-child {
    border-bottom: none;
}

/* NUMBER */

.industry-matrix .industry-row .num {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;

    border: 1px solid rgba(190, 99, 48, 0.35);
    border-radius: 50%;

    color: #b95f2d;
    background: rgba(201, 109, 50, 0.055);

    font-family: "Space Mono", monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
}

/* Remove any old bullet added by previous CSS */

.industry-matrix .industry-row .num::before {
    content: none !important;
}

/* INDUSTRY NAME */

.industry-matrix .industry-row h3 {
    margin: 0;

    color: #392116;

    font-size: 18px;
    line-height: 1.3;
    font-weight: 750;
}

/* DESCRIPTION */

.industry-matrix .industry-row p {
    margin: 0;

    color: #766b66;

    font-size: 14px;
    line-height: 1.7;
}

/* HOVER */

.industry-matrix .industry-row:hover {
    background:
        linear-gradient(
            90deg,
            rgba(201, 109, 50, 0.065),
            rgba(201, 109, 50, 0.015)
        );

    padding-left: 46px;
}

/* SMALL ACCENT LINE */

.industry-matrix .industry-row::after {
    content: "";

    position: absolute;
    left: 0;
    top: 0;

    width: 3px;
    height: 100%;

    background: #c56b32;

    transform: scaleY(0);
    transform-origin: center;

    transition: transform 0.25s ease;
}

.industry-matrix .industry-row:hover::after {
    transform: scaleY(1);
}


/* =========================================================
   INDUSTRIES — MOBILE
   ========================================================= */

@media (max-width: 800px) {

    .industry-matrix .industry-row {
        grid-template-columns: 50px 1fr;
        gap: 18px;
        padding: 24px;
    }

    .industry-matrix .industry-row p {
        grid-column: 2;
        margin-top: -8px;
    }

    .industry-matrix .industry-row:hover {
        padding-left: 28px;
    }

}


@media (max-width: 520px) {

    .industry-matrix {
        border-radius: 18px;
    }

    .industry-matrix .industry-row {
        grid-template-columns: 42px 1fr;
        gap: 14px;
        min-height: auto;
        padding: 22px 18px;
    }

    .industry-matrix .industry-row .num {
        width: 34px;
        height: 34px;
        font-size: 10px;
    }

    .industry-matrix .industry-row h3 {
        font-size: 16px;
    }

    .industry-matrix .industry-row p {
        font-size: 13px;
        line-height: 1.6;
    }

}

/* =========================================================
   INDUSTRIES — FINAL CLEANUP
   ========================================================= */

/* Remove the old orange dot after the number */
.industry-matrix .industry-row .num::after {
    content: none !important;
    display: none !important;
}

/* Remove the hover-side orange bar */
.industry-matrix .industry-row::after {
    display: none !important;
}

/* Keep the hover subtle */
.industry-matrix .industry-row:hover {
    padding-left: 38px;
    background: rgba(201, 109, 50, 0.035);
}

/* =========================================================
   INDUSTRIES — TECHNICAL SCOPE
   ========================================================= */

.technical-scope {
    background: #f8f6f2;
}

.technical-scope-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 55px;

    border-top: 1px solid rgba(57, 33, 22, 0.14);
    border-left: 1px solid rgba(57, 33, 22, 0.14);
}

.scope-item {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 22px;

    min-height: 170px;
    padding: 30px;

    border-right: 1px solid rgba(57, 33, 22, 0.14);
    border-bottom: 1px solid rgba(57, 33, 22, 0.14);

    transition:
        background 0.25s ease,
        transform 0.25s ease;
}

.scope-item:hover {
    background: rgba(201, 109, 50, 0.035);
}

.scope-number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    border: 1px solid rgba(190, 99, 48, 0.35);
    border-radius: 50%;

    color: #b95f2d;

    font-family: "Space Mono", monospace;
    font-size: 10px;
    font-weight: 700;
}

.scope-item h3 {
    margin: 3px 0 10px;

    color: #392116;

    font-size: 18px;
    line-height: 1.3;
}

.scope-item p {
    max-width: 390px;

    margin: 0;

    color: #766b66;

    font-size: 14px;
    line-height: 1.7;
}


/* =========================================================
   TECHNICAL SCOPE — MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .technical-scope-grid {
        grid-template-columns: 1fr;
    }

    .scope-item {
        min-height: auto;
        padding: 25px 22px;
    }

}
/* ============================================================
   SD RESEARCH — PROCESS PAGE
   Isolated styles
   ============================================================ */


/* ------------------------------------------------------------
   PROCESS HERO
   ------------------------------------------------------------ */

.process-page .process-hero {
    position: relative;
}

.process-page .process-hero h1 {
    max-width: 820px;
}

.process-page .process-hero > .container > p:last-child {
    max-width: 900px;
}


/* ------------------------------------------------------------
   WORKFLOW INTRO
   ------------------------------------------------------------ */

.process-page .process-workflow-section {
    padding-top: 105px;
    padding-bottom: 110px;
}

.process-page .process-section-intro {
    margin-bottom: 70px;
}


/* ------------------------------------------------------------
   WORKFLOW
   ------------------------------------------------------------ */

.process-page .process-steps {
    position: relative;
    max-width: 1050px;
    margin: 0 auto;
}


/* vertical engineering line */

.process-page .process-steps::before {
    content: "";
    position: absolute;

    left: 27px;
    top: 30px;
    bottom: 30px;

    width: 1px;

    background:
        linear-gradient(
            to bottom,
            rgba(191, 103, 48, .15),
            rgba(191, 103, 48, .55),
            rgba(191, 103, 48, .15)
        );
}


/* individual step */

.process-page .process-step {
    position: relative;

    display: grid;
    grid-template-columns: 56px 1fr;

    gap: 38px;

    padding: 0 0 72px;
}

.process-page .process-step:last-child {
    padding-bottom: 0;
}


/* number circle */

.process-page .process-step-marker {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 56px;
    height: 56px;

    border-radius: 50%;

    background: #f8f5f0;

    border: 1px solid rgba(190, 99, 48, .42);

    box-shadow:
        0 0 0 8px #f8f5f0;
}

.process-page .process-step-marker span {
    color: #b7602d;

    font-family: "Space Mono", monospace;

    font-size: 11px;
    font-weight: 700;
}


/* content */

.process-page .process-step-content {
    padding-top: 1px;
    padding-bottom: 45px;

    border-bottom: 1px solid rgba(57, 33, 22, .12);
}

.process-page .process-step:last-child
.process-step-content {
    border-bottom: none;
}


/* small label */

.process-page .process-step-label {
    margin: 0 0 13px;

    color: #b7602d;

    font-family: "Space Mono", monospace;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .18em;
}


/* heading */

.process-page .process-step-content h2 {
    margin: 0 0 15px;

    color: #392116;

    font-size: clamp(25px, 2.5vw, 34px);

    line-height: 1.18;

    letter-spacing: -.025em;
}


/* description */

.process-page .process-step-description {
    max-width: 760px;

    margin: 0;

    color: #766b66;

    font-size: 15px;

    line-height: 1.8;
}


/* focus strip */

.process-page .process-step-note {
    display: flex;
    align-items: baseline;

    gap: 14px;

    margin-top: 25px;
    padding-top: 17px;

    max-width: 760px;

    border-top: 1px solid rgba(57, 33, 22, .09);
}

.process-page .process-step-note strong {
    flex: 0 0 auto;

    color: #392116;

    font-size: 11px;

    text-transform: uppercase;

    letter-spacing: .12em;
}

.process-page .process-step-note span {
    color: #8a7e77;

    font-size: 12px;

    line-height: 1.6;
}


/* ------------------------------------------------------------
   WHAT TO SEND
   ------------------------------------------------------------ */

.process-page .process-input-section {
    padding-top: 120px;
    padding-bottom: 120px;

    background:
        linear-gradient(
            180deg,
            #f5f7f6 0%,
            #f7f5f1 100%
        );
}


/* header */

.process-page .process-input-header {
    display: grid;

    grid-template-columns:
        minmax(300px, .85fr)
        minmax(300px, .65fr);

    gap: 80px;

    align-items: end;

    margin-bottom: 55px;
}

.process-page .process-input-header h2 {
    max-width: 600px;

    margin: 0;

    color: #392116;

    font-size: clamp(35px, 4vw, 54px);

    line-height: 1.05;

    letter-spacing: -.045em;
}

.process-page .process-input-header > p {
    max-width: 500px;

    margin: 0;

    color: #766b66;

    font-size: 15px;

    line-height: 1.8;
}


/* information board */

.process-page .process-input-board {
    overflow: hidden;

    border: 1px solid rgba(57, 33, 22, .15);

    border-radius: 20px;

    background: #fffdf9;

    box-shadow:
        0 25px 60px rgba(57, 33, 22, .07);
}


/* board header */

.process-page .input-board-top {
    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 17px 25px;

    background: #392116;

    color: #f5eee7;

    font-family: "Space Mono", monospace;

    font-size: 9px;

    letter-spacing: .14em;
}


/* board grid */

.process-page .input-board-grid {
    display: grid;

    grid-template-columns: repeat(2, 1fr);
}


/* individual information item */

.process-page .input-item {
    display: grid;

    grid-template-columns: 42px 1fr;

    gap: 18px;

    min-height: 145px;

    padding: 27px 30px;

    border-right: 1px solid rgba(57, 33, 22, .11);
    border-bottom: 1px solid rgba(57, 33, 22, .11);

    transition:
        background .25s ease;
}


/* remove right border from every second item */

.process-page .input-item:nth-child(even) {
    border-right: none;
}


/* remove bottom border from last row */

.process-page .input-item:nth-child(7),
.process-page .input-item:nth-child(8) {
    border-bottom: none;
}


.process-page .input-item:hover {
    background: rgba(39, 204, 201, .035);
}


/* number */

.process-page .input-number {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid rgba(190, 99, 48, .35);

    border-radius: 50%;

    color: #b7602d;

    font-family: "Space Mono", monospace;

    font-size: 9px;

    font-weight: 700;
}


/* item title */

.process-page .input-item strong {
    display: block;

    margin: 3px 0 8px;

    color: #392116;

    font-size: 16px;

    line-height: 1.3;
}


/* item description */

.process-page .input-item p {
    max-width: 390px;

    margin: 0;

    color: #81766f;

    font-size: 12px;

    line-height: 1.65;
}


/* note underneath */

.process-page .process-input-note {
    display: flex;

    align-items: center;

    gap: 18px;

    max-width: 800px;

    margin: 28px auto 0;

    padding: 18px 22px;

    border-left: 2px solid #c66d32;

    background: rgba(198, 109, 50, .045);
}

.process-page .process-note-mark {
    flex: 0 0 auto;

    color: #b7602d;

    font-family: "Space Mono", monospace;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .12em;
}

.process-page .process-input-note p {
    margin: 0;

    color: #766b66;

    font-size: 12px;

    line-height: 1.6;
}


/* ------------------------------------------------------------
   TECHNICAL SCOPE
   ------------------------------------------------------------ */

.process-page .process-scope-section {
    padding-top: 120px;
    padding-bottom: 120px;
}


.process-page .process-scope-grid {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    margin-top: 60px;

    border-top: 1px solid rgba(57, 33, 22, .14);
    border-left: 1px solid rgba(57, 33, 22, .14);
}


.process-page .process-scope-grid article {
    min-height: 220px;

    padding: 30px;

    border-right: 1px solid rgba(57, 33, 22, .14);
    border-bottom: 1px solid rgba(57, 33, 22, .14);

    transition:
        background .25s ease;
}


.process-page .process-scope-grid article:hover {
    background: rgba(198, 109, 50, .035);
}


.process-page .process-scope-grid article > span {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 35px;
    height: 35px;

    margin-bottom: 25px;

    border: 1px solid rgba(190, 99, 48, .35);

    border-radius: 50%;

    color: #b7602d;

    font-family: "Space Mono", monospace;

    font-size: 9px;

    font-weight: 700;
}


.process-page .process-scope-grid h3 {
    margin: 0 0 10px;

    color: #392116;

    font-size: 18px;

    line-height: 1.3;
}


.process-page .process-scope-grid p {
    max-width: 300px;

    margin: 0;

    color: #766b66;

    font-size: 13px;

    line-height: 1.7;
}


/* ------------------------------------------------------------
   CTA
   ------------------------------------------------------------ */

.process-page .process-cta {
    position: relative;

    overflow: hidden;

    padding: 90px 0;

    background: #392116;
}


.process-page .process-cta::after {
    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    right: -220px;
    top: -260px;

    border: 1px solid rgba(255,255,255,.09);

    border-radius: 50%;

    box-shadow:
        0 0 0 55px rgba(255,255,255,.025),
        0 0 0 110px rgba(255,255,255,.018);

    pointer-events: none;
}


.process-page .process-cta-inner {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns: 1fr auto;

    gap: 60px;

    align-items: end;
}


.process-page .process-cta .eyebrow {
    color: #f0a66d;
}


.process-page .process-cta h2 {
    max-width: 760px;

    margin: 0 0 18px;

    color: #fff;

    font-size: clamp(34px, 4vw, 56px);

    line-height: 1.05;

    letter-spacing: -.045em;
}


.process-page .process-cta p {
    max-width: 650px;

    margin: 0;

    color: rgba(255,255,255,.68);

    font-size: 15px;

    line-height: 1.7;
}


.process-page .process-cta .button {
    white-space: nowrap;
}


/* ------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------ */

@media (max-width: 900px) {

    .process-page .process-input-header {
        grid-template-columns: 1fr;

        gap: 25px;
    }


    .process-page .process-scope-grid {
        grid-template-columns: repeat(2, 1fr);
    }


    .process-page .process-cta-inner {
        grid-template-columns: 1fr;

        align-items: start;
    }

}


@media (max-width: 700px) {

    .process-page .process-workflow-section,
    .process-page .process-input-section,
    .process-page .process-scope-section {
        padding-top: 75px;
        padding-bottom: 75px;
    }


    /* workflow */

    .process-page .process-steps::before {
        left: 21px;
    }


    .process-page .process-step {
        grid-template-columns: 44px 1fr;

        gap: 22px;

        padding-bottom: 50px;
    }


    .process-page .process-step-marker {
        width: 44px;
        height: 44px;
    }


    .process-page .process-step-marker span {
        font-size: 9px;
    }


    .process-page .process-step-content {
        padding-bottom: 30px;
    }


    .process-page .process-step-content h2 {
        font-size: 25px;
    }


    .process-page .process-step-description {
        font-size: 14px;
    }


    .process-page .process-step-note {
        display: block;
    }


    .process-page .process-step-note strong {
        display: block;

        margin-bottom: 5px;
    }


    /* input board */

    .process-page .input-board-grid {
        grid-template-columns: 1fr;
    }


    .process-page .input-item,
    .process-page .input-item:nth-child(even) {
        border-right: none;
        border-bottom: 1px solid rgba(57, 33, 22, .11);
    }


    .process-page .input-item:last-child {
        border-bottom: none;
    }


    .process-page .input-board-top {
        padding: 15px 18px;

        font-size: 8px;
    }


    .process-page .input-item {
        min-height: auto;

        padding: 24px 20px;
    }


    /* scope */

    .process-page .process-scope-grid {
        grid-template-columns: 1fr;

        margin-top: 40px;
    }


    .process-page .process-scope-grid article {
        min-height: auto;
    }


    /* CTA */

    .process-page .process-cta {
        padding: 70px 0;
    }


    .process-page .process-cta h2 {
        font-size: 36px;
    }

}
/* ============================================================
   PROCESS PAGE — FINAL CTA
   ============================================================ */

.cta {
    position: relative;
    overflow: hidden;

    /* Distinguish it clearly from the footer */
    background:
        linear-gradient(
            135deg,
            #4a291b 0%,
            #5b321f 55%,
            #6a3a22 100%
        );

    padding: 95px 0 100px;
    border-top: 1px solid rgba(210, 125, 67, .35);
}

/* subtle technical rings */
.cta::before {
    content: "";
    position: absolute;

    width: 500px;
    height: 500px;

    right: -170px;
    top: -250px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.07);
    box-shadow:
        0 0 0 55px rgba(255,255,255,.025),
        0 0 0 110px rgba(255,255,255,.018);

    pointer-events: none;
}

/* second subtle ring */
.cta::after {
    content: "";
    position: absolute;

    width: 280px;
    height: 280px;

    right: 20px;
    bottom: -210px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.045);

    pointer-events: none;
}

.cta-inner {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 70px;
}

/* Small label */
.cta .eyebrow {
    margin-bottom: 22px;

    color: #d47a3a !important;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: .22em;
}

/* Main CTA heading */
.cta h2 {
    max-width: 850px;

    margin: 0 0 24px;

    color: #fff;

    font-size: clamp(34px, 4vw, 58px);
    line-height: 1.04;
    letter-spacing: -.045em;
}

/* Supporting text */
.cta p:not(.eyebrow) {
    max-width: 760px;

    margin: 0;

    color: rgba(255,255,255,.72);

    font-size: 18px;
    line-height: 1.7;
}

/* CTA button */
.cta .button {
    position: relative;
    z-index: 3;

    white-space: nowrap;

    padding: 17px 27px;

    border: 1px solid rgba(255,255,255,.28);
    border-radius: 10px;

    background: #d47738;
    color: #fff;

    font-size: 14px;
    font-weight: 800;

    box-shadow:
        0 12px 30px rgba(0,0,0,.16);

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

.cta .button:hover {
    transform: translateY(-3px);

    background: #e08a4b;

    box-shadow:
        0 18px 38px rgba(0,0,0,.22);
}


/* ============================================================
   PROCESS PAGE — MAKE THE CTA FEEL SEPARATE FROM FOOTER
   ============================================================ */

main > .cta {
    margin-top: 0;
    margin-bottom: 0;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 800px) {

    .cta {
        padding: 70px 0 75px;
    }

    .cta-inner {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .cta h2 {
        font-size: clamp(32px, 8vw, 48px);
    }

    .cta p:not(.eyebrow) {
        font-size: 16px;
    }

    .cta .button {
        justify-self: start;
    }
}

/* ============================================================
   SD RESEARCH — TECHNICAL GEOMETRY FOR HEADER + FOOTER
   ============================================================ */

/* ---------- HEADER ---------- */

.site-header {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Fine technical grid */
.site-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(
            rgba(255,255,255,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.035) 1px,
            transparent 1px
        );
    background-size: 34px 34px;
    opacity: .45;
    pointer-events: none;
    z-index: -1;
}

/* Large engineering-style arc */
.site-header::after {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    right: -250px;
    top: -430px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.075);
    box-shadow:
        0 0 0 55px rgba(255,255,255,.025),
        0 0 0 110px rgba(255,255,255,.018),
        0 0 0 165px rgba(255,255,255,.012);
    pointer-events: none;
    z-index: -1;
}

/* Keep header contents above the geometry */
.site-header .container {
    position: relative;
    z-index: 2;
}


/* ---------- FOOTER ---------- */

.footer {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Technical grid */
.footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(
            rgba(255,255,255,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.035) 1px,
            transparent 1px
        );
    background-size: 36px 36px;
    opacity: .35;
    pointer-events: none;
    z-index: -1;
}

/* Large circular engineering geometry */
.footer::after {
    content: "";
    position: absolute;
    width: 620px;
    height: 620px;
    right: -330px;
    bottom: -470px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.075);
    box-shadow:
        0 0 0 65px rgba(255,255,255,.025),
        0 0 0 130px rgba(255,255,255,.018),
        0 0 0 195px rgba(255,255,255,.012);
    pointer-events: none;
    z-index: -1;
}

/* Keep footer content above the geometry */
.footer .container {
    position: relative;
    z-index: 2;
}


/* ---------- SUBTLE ACCENT LINE ---------- */

.site-header {
    border-bottom: 1px solid rgba(255,255,255,.055);
}

.footer {
    border-top: 1px solid rgba(255,255,255,.055);
}


/* ---------- MOBILE ---------- */

@media (max-width: 700px) {

    .site-header::after {
        width: 360px;
        height: 360px;
        right: -230px;
        top: -280px;
    }

    .footer::after {
        width: 420px;
        height: 420px;
        right: -260px;
        bottom: -320px;
    }
}

/* ============================================================
   PROCESS PAGE — TECHNICAL HERO BACKGROUND
   ============================================================ */

.page-hero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Fine engineering grid */
.page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(
            rgba(57, 33, 22, 0.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(57, 33, 22, 0.035) 1px,
            transparent 1px
        );
    background-size: 42px 42px;
    pointer-events: none;
    z-index: -2;
}

/* Large technical construction rings */
.page-hero::after {
    content: "";
    position: absolute;
    width: 720px;
    height: 720px;
    right: -260px;
    top: -410px;
    border-radius: 50%;

    border: 1px solid rgba(196, 103, 48, 0.13);

    box-shadow:
        0 0 0 70px rgba(196, 103, 48, 0.035),
        0 0 0 140px rgba(196, 103, 48, 0.025),
        0 0 0 210px rgba(196, 103, 48, 0.018);

    pointer-events: none;
    z-index: -1;
}

/* Keep the actual hero content above the pattern */
.page-hero .container {
    position: relative;
    z-index: 2;
}


/* ============================================================
   PROCESS HERO — SMALL TECHNICAL ACCENT
   ============================================================ */

.page-hero .eyebrow {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.page-hero .eyebrow::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #c56b32;
    box-shadow:
        0 0 0 5px rgba(197, 107, 50, 0.08);
}


/* ============================================================
   PROCESS HERO — BOTTOM TECHNICAL RULE
   ============================================================ */

.page-hero {
    border-bottom: 1px solid rgba(197, 107, 50, 0.10);
}

.page-hero::marker {
    display: none;
}


/* ============================================================
   OPTIONAL: subtle coordinate marks on the right
   ============================================================ */

.page-hero .container::after {
    
    position: absolute;
    right: 0;
    bottom: 28px;

    font-family: "Space Mono", monospace;
    font-size: 10px;
    letter-spacing: 0.16em;
    color: rgba(57, 33, 22, 0.28);

    pointer-events: none;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 700px) {

    .page-hero::after {
        width: 480px;
        height: 480px;
        right: -280px;
        top: -180px;

        box-shadow:
            0 0 0 50px rgba(196, 103, 48, 0.035),
            0 0 0 100px rgba(196, 103, 48, 0.025);
    }

    .page-hero .container::after {
        display: none;
    }
}

/* ============================================================
   CONTACT PAGE — MATCH INNER-PAGE HERO SYSTEM
   ============================================================ */

.page-hero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-bottom: 1px solid rgba(197, 107, 50, 0.10);
}

/* Technical drafting grid */
.page-hero::before {
    content: "";
    position: absolute;
    inset: 0;

    background-image:
        linear-gradient(
            rgba(57, 33, 22, 0.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(57, 33, 22, 0.035) 1px,
            transparent 1px
        );

    background-size: 42px 42px;
    pointer-events: none;
    z-index: -2;
}

/* Large construction / engineering rings */
.page-hero::after {
    content: "";
    position: absolute;

    width: 720px;
    height: 720px;

    right: -270px;
    top: -410px;

    border-radius: 50%;
    border: 1px solid rgba(196, 103, 48, 0.13);

    box-shadow:
        0 0 0 70px rgba(196, 103, 48, 0.035),
        0 0 0 140px rgba(196, 103, 48, 0.025),
        0 0 0 210px rgba(196, 103, 48, 0.018);

    pointer-events: none;
    z-index: -1;
}

/* Keep content above the technical background */
.page-hero .container {
    position: relative;
    z-index: 2;
}

/* Orange technical marker */
.page-hero .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.page-hero .eyebrow::before {
    content: "";

    width: 7px;
    height: 7px;

    flex: 0 0 7px;

    border-radius: 50%;
    background: #c56b32;

    box-shadow:
        0 0 0 5px rgba(197, 107, 50, 0.08);
}


/* Contact hero typography */
.page-hero h1 {
    max-width: 950px;
}


/* Small technical identifier */
.page-hero .container::after {
  

    position: absolute;
    right: 0;
    bottom: 28px;

    font-family: "Space Mono", monospace;
    font-size: 10px;
    letter-spacing: 0.16em;

    color: rgba(57, 33, 22, 0.28);

    pointer-events: none;
}


/* ============================================================
   CONTACT HERO — MOBILE
   ============================================================ */

@media (max-width: 700px) {

    .page-hero::after {
        width: 480px;
        height: 480px;

        right: -280px;
        top: -180px;

        box-shadow:
            0 0 0 50px rgba(196, 103, 48, 0.035),
            0 0 0 100px rgba(196, 103, 48, 0.025);
    }

    .page-hero .container::after {
        display: none;
    }
}

/* Contact hero: give it the same visual weight as About / Process */
.page-hero h1 {
    font-size: clamp(58px, 6.2vw, 96px);
    line-height: 0.98;
    letter-spacing: -0.055em;
    max-width: 900px;
    margin-bottom: 28px;
}

.page-hero > .container > p:last-child {
    max-width: 850px;
    font-size: 20px;
    line-height: 1.65;
    color: #6f625c;
}

/* ============================================================
   INDEX — TECHNICAL INTELLIGENCE / DOCUMENT
   SD ENGINEERING REPORT STYLE
   ============================================================ */

.document-section {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Subtle engineering drafting grid */
.document-section::before {
    content: "";
    position: absolute;
    inset: 0;

    background-image:
        linear-gradient(
            rgba(57, 33, 22, 0.028) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(57, 33, 22, 0.028) 1px,
            transparent 1px
        );

    background-size: 42px 42px;
    pointer-events: none;
    z-index: -2;
}

/* Large construction circle */
.document-section::after {
    content: "";

    position: absolute;
    width: 760px;
    height: 760px;

    right: -330px;
    bottom: -520px;

    border-radius: 50%;
    border: 1px solid rgba(197, 107, 50, 0.12);

    box-shadow:
        0 0 0 65px rgba(197, 107, 50, 0.028),
        0 0 0 130px rgba(197, 107, 50, 0.020),
        0 0 0 195px rgba(197, 107, 50, 0.014);

    pointer-events: none;
    z-index: -1;
}


/* ============================================================
   DOCUMENT COPY
   ============================================================ */

.document-copy {
    position: relative;
}

.document-copy .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.document-copy .eyebrow::before {
    content: "";

    width: 7px;
    height: 7px;

    flex: 0 0 7px;

    border-radius: 50%;
    background: #c56b32;

    box-shadow:
        0 0 0 5px rgba(197, 107, 50, 0.08);
}

.document-copy h2 {
    max-width: 600px;
}


/* ============================================================
   TECHNICAL DOCUMENT CARD
   ============================================================ */

.document {
    position: relative;
    overflow: hidden;

    background: #f8f3ec;

    border: 1px solid rgba(82, 48, 31, 0.20);
    border-radius: 20px;

    box-shadow:
        0 25px 60px rgba(57, 33, 22, 0.13);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.document:hover {
    transform: translateY(-5px);

    box-shadow:
        0 32px 70px rgba(57, 33, 22, 0.17);
}


/* ============================================================
   DOCUMENT TOP BAR
   ============================================================ */

.document .doc-top {
    background:
        linear-gradient(
            90deg,
            #2a170f,
            #4a2718
        );

    color: #f5e9dc;

    border-bottom: 1px solid rgba(197, 107, 50, 0.35);
}

.document .doc-top span {
    color: #e6c3a4;
}


/* ============================================================
   DOCUMENT TITLE
   ============================================================ */

.document .doc-title {
    color: #392116;

    background: #fbf7f1;

    border-bottom: 1px solid rgba(82, 48, 31, 0.14);

    letter-spacing: -0.025em;
}


/* ============================================================
   DOCUMENT FIELDS
   ============================================================ */

.document .doc-fields {
    background: #f8f3ec;
}

.document .doc-field {
    border-color: rgba(82, 48, 31, 0.13);
}

.document .doc-field b {
    color: #b7602c;
}

.document .doc-field span {
    color: #746861;
}


/* ============================================================
   TECHNICAL ACCENT LINE
   ============================================================ */

.document::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 4px;
    height: 100%;

    background:
        linear-gradient(
            180deg,
            #c56b32,
            #d9955c,
            transparent 80%
        );

    z-index: 4;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 900px) {

    .document-section::after {
        width: 600px;
        height: 600px;

        right: -300px;
        bottom: -400px;
    }
}

@media (max-width: 700px) {

    .document-section::before {
        background-size: 32px 32px;
    }

    .document-section::after {
        width: 480px;
        height: 480px;

        right: -260px;
        bottom: -300px;
    }

    .document {
        border-radius: 16px;
    }
}

/* ============================================================
   SD RESEARCH — SERVICES PAGE / CONSULTANCY UPGRADE
   ============================================================ */


/* ------------------------------------------------------------
   SERVICES HERO
   ------------------------------------------------------------ */

.page-hero {
    position: relative;
    overflow: hidden;
}

.page-hero::after {
    content: "";
    position: absolute;
    width: 720px;
    height: 720px;
    right: -260px;
    top: -390px;
    border-radius: 50%;
    border: 1px solid rgba(193, 104, 49, .10);
    box-shadow:
        0 0 0 75px rgba(193, 104, 49, .025),
        0 0 0 150px rgba(193, 104, 49, .018);
    pointer-events: none;
}


/* ------------------------------------------------------------
   SERVICE LIST — MAKE IT LOOK LIKE A CONSULTANCY
   ------------------------------------------------------------ */

.service-list {
    position: relative;
    margin-top: 45px;
    border-top: 1px solid rgba(57, 33, 22, .16);
    border-bottom: 1px solid rgba(57, 33, 22, .16);
    background: rgba(255,255,255,.35);
}

.service-list article {
    position: relative;

    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;

    min-height: 155px;

    padding: 30px 34px;

    border-bottom: 1px solid rgba(57, 33, 22, .12);

    transition:
        background .25s ease,
        transform .25s ease,
        padding-left .25s ease;
}

.service-list article:last-child {
    border-bottom: none;
}


/* left number */

.service-list article .num {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    border: 1px solid rgba(193, 104, 49, .38);
    border-radius: 50%;

    color: #bd6931;

    font-family: "Space Mono", monospace;
    font-size: 11px;
    font-weight: 700;
}


/* service title */

.service-list article h3 {
    margin: 0 0 9px;

    color: #392116;

    font-size: clamp(19px, 1.7vw, 24px);
    line-height: 1.25;
    letter-spacing: -.025em;
}


/* description */

.service-list article p {
    margin: 0;

    max-width: 820px;

    color: #756a64;

    font-size: 14px;
    line-height: 1.75;
}


/* right category */

.service-list article .tag {
    align-self: start;

    margin-top: 4px;

    padding: 8px 13px;

    border: 1px solid rgba(37, 171, 177, .15);
    border-radius: 999px;

    background: rgba(37, 171, 177, .07);

    color: #b8622e;

    font-family: "Space Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    letter-spacing: .12em;
    white-space: nowrap;
}


/* hover */

.service-list article:hover {
    padding-left: 43px;

    background:
        linear-gradient(
            90deg,
            rgba(199, 107, 50, .055),
            rgba(255,255,255,.15) 65%,
            transparent
        );
}

.service-list article:hover .num {
    background: #392116;
    border-color: #392116;
    color: #fff;
}


/* small accent line */

.service-list article::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;
    bottom: 0;

    width: 3px;

    background:
        linear-gradient(
            180deg,
            #c66b32,
            #24c9c7
        );

    transform: scaleY(0);

    transform-origin: center;

    transition: transform .25s ease;
}

.service-list article:hover::before {
    transform: scaleY(1);
}


/* ------------------------------------------------------------
   NEW TECHNICAL SCOPE SECTION
   ------------------------------------------------------------ */

.technical-scope-section {
    position: relative;
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f4f8fa 0%,
            #edf4f7 100%
        );
}


/* subtle engineering grid */

.technical-scope-section::before {
    content: "";

    position: absolute;
    inset: 0;

    background-image:
        linear-gradient(
            rgba(35, 101, 115, .045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(35, 101, 115, .045) 1px,
            transparent 1px
        );

    background-size: 42px 42px;

    pointer-events: none;
}


/* intro */

.technical-scope-intro {
    position: relative;

    display: grid;
    grid-template-columns: 1.05fr .95fr;

    gap: 90px;

    align-items: end;

    margin-bottom: 60px;
}

.technical-scope-intro h2 {
    max-width: 650px;

    margin: 12px 0 0;

    color: #392116;

    font-size: clamp(38px, 4.5vw, 65px);
    line-height: .98;

    letter-spacing: -.055em;
}

.technical-scope-lead {
    max-width: 560px;

    margin: 0;

    color: #6f8298;

    font-size: 16px;
    line-height: 1.85;
}


/* ------------------------------------------------------------
   TECHNICAL SCOPE CARDS
   ------------------------------------------------------------ */

.technical-scope-grid {
    position: relative;

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 1px;

    overflow: hidden;

    border: 1px solid rgba(57, 33, 22, .14);
    border-radius: 20px;

    background: rgba(57, 33, 22, .14);

    box-shadow:
        0 25px 60px rgba(37, 61, 72, .08);
}


.scope-card {
    position: relative;

    display: grid;
    grid-template-columns: 55px 1fr;

    gap: 22px;

    min-height: 245px;

    padding: 34px;

    background:
        rgba(250, 247, 242, .96);

    transition:
        background .25s ease,
        transform .25s ease;
}


.scope-card:hover {
    background: #fff;

    z-index: 2;
}


/* number */

.scope-index {
    display: flex;
    align-items: flex-start;
    justify-content: center;

    width: 38px;
    height: 38px;

    padding-top: 10px;

    border-top: 2px solid #c66b32;

    color: #bd6931;

    font-family: "Space Mono", monospace;
    font-size: 11px;
    font-weight: 700;
}


/* category */

.scope-label {
    display: block;

    margin-bottom: 12px;

    color: #c06932;

    font-family: "Space Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    letter-spacing: .15em;
}


/* title */

.scope-card h3 {
    margin: 0 0 13px;

    color: #392116;

    font-size: 23px;
    line-height: 1.2;

    letter-spacing: -.025em;
}


/* copy */

.scope-card p {
    max-width: 470px;

    margin: 0;

    color: #766d68;

    font-size: 13px;
    line-height: 1.75;
}


/* first card gets a slightly stronger treatment */

.scope-card-main {
    background:
        linear-gradient(
            135deg,
            #fffdf9,
            #f4eee7
        );
}


/* ------------------------------------------------------------
   BOTTOM NOTE
   ------------------------------------------------------------ */

.technical-scope-note {
    position: relative;

    display: grid;
    grid-template-columns: 55px 1fr;

    gap: 22px;

    align-items: center;

    max-width: 900px;

    margin: 45px auto 0;

    padding: 25px 30px;

    border-left: 3px solid #c66b32;

    background: rgba(255,255,255,.55);
}


.technical-scope-note-mark {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    background: #392116;

    color: #fff;

    font-family: "Space Mono", monospace;
    font-size: 11px;
    font-weight: 700;
}


.technical-scope-note strong {
    display: block;

    margin-bottom: 6px;

    color: #392116;

    font-size: 15px;
}


.technical-scope-note p {
    margin: 0;

    color: #766d68;

    font-size: 13px;
    line-height: 1.7;
}


/* ------------------------------------------------------------
   SECTION SPACING
   ------------------------------------------------------------ */

.services-page .section {
    padding-top: 105px;
    padding-bottom: 105px;
}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media (max-width: 900px) {

    .technical-scope-intro {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .technical-scope-grid {
        grid-template-columns: 1fr;
    }

    .service-list article {
        grid-template-columns: 50px 1fr;
    }

    .service-list article .tag {
        grid-column: 2;
        justify-self: start;
        margin-top: -12px;
    }

}


@media (max-width: 600px) {

    .service-list article {
        grid-template-columns: 1fr;
        gap: 15px;

        padding: 28px 22px;
    }

    .service-list article:hover {
        padding-left: 28px;
    }

    .service-list article .num {
        width: 32px;
        height: 32px;
    }

    .service-list article .tag {
        grid-column: 1;
        margin-top: 0;
    }

    .scope-card {
        grid-template-columns: 1fr;
        gap: 18px;

        min-height: auto;

        padding: 28px 24px;
    }

    .scope-index {
        width: 42px;
    }

    .technical-scope-note {
        grid-template-columns: 1fr;

        padding: 24px;
    }

}

/* ============================================================
   STICKY HEADER — KEEP NAVIGATION VISIBLE WHILE SCROLLING
   ============================================================ */

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
}


/* ============================================================
   FOOTER CONTACT — COMPACT PROFESSIONAL LAYOUT
   ============================================================ */

.footer-contact {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}

.footer-contact h4 {
    margin: 0 0 18px;
}

.footer-contact a,
.footer-contact span {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    color: rgba(255, 248, 240, 0.82);
    font-size: 14px;
    line-height: 1.5;
}

.footer-contact a {
    text-decoration: none;
    transition: color .2s ease;
    margin-bottom: 12px !important;
}

.footer-contact a:hover {
    color: #e98a45;
}

.footer-contact span {
    margin-bottom: 12px !important;
}

.footer-contact .footer-contact-link {
    margin-top: 4px !important;
    margin-bottom: 0 !important;
    font-weight: 700;
    color: #fff8f0;
}

/* =========================================================
   MOBILE VIDEO FIX
   ========================================================= */

@media (max-width: 700px) {

    .video-section {
        overflow: hidden;
    }

    .video-card {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .video-frame {
        display: block !important;
        position: relative;
        width: 100%;
        height: auto !important;
        min-height: 220px;
        overflow: hidden;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .video-frame video {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 220px;
        object-fit: cover;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .video-copy {
        width: 100%;
    }

    .video-badge {
        display: block;
    }
}


@media (max-width: 700px) {

    .site-header {
        position: relative !important;
        z-index: 999999 !important;
    }

    .site-header .nav-wrap {
        position: relative !important;
        z-index: 999999 !important;
    }

    .menu-toggle {
        display: flex !important;
        position: relative !important;
        z-index: 1000000 !important;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    .site-header nav {
        display: none !important;
        position: absolute !important;
        top: calc(100% + 10px) !important;
        left: 15px !important;
        right: 15px !important;

        flex-direction: column !important;
        align-items: stretch !important;
        padding: 10px !important;
        gap: 4px !important;

        background: #32180f !important;
        border: 1px solid rgba(255,255,255,.15) !important;
        border-radius: 14px !important;

        z-index: 1000001 !important;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;
    }

    .site-header nav.mobile-open {
        display: flex !important;
    }

    .site-header nav a {
        display: block !important;
        width: 100% !important;
        padding: 15px 18px !important;
        color: #fff !important;
        text-decoration: none !important;
        border-radius: 9px !important;
    }
}

