/*
==========================================================================
  AURORA UI – Corporate IT Website Stylesheet
  Company: [Your Company Name]
  Version: 1.0.0
  
  TABLE OF CONTENTS:
  1.  CSS Variables (Colors, Fonts, Spacing)
  2.  Reset & Base Styles
  3.  Typography
  4.  Utility Classes
  5.  Preloader
  6.  Navbar & Mega Menu
  7.  Aurora Hero Backgrounds
  8.  Buttons
  9.  Cards & Glass Components
  10. Sections – Home
  11. Services Page
  12. Portfolio Page
  13. Industry Page
  14. About Page
  15. Blog Page
  16. Contact Page
  17. Footer
  18. 404 Page
  19. Animations & Keyframes
  20. Light Mode Overrides
  21. Responsive Breakpoints
==========================================================================
*/

/* =========================================================
   1. CSS VARIABLES
   ========================================================= */
:root {
  /* Colors – Dark Mode (default) */
  --bg:           #0B1020;
  --bg-alt:       #11172B;
  --bg-card:      #141A30;
  --surface:      rgba(255, 255, 255, 0.06);
  --surface-hover: rgba(255, 255, 255, 0.10);
  --border:       rgba(255, 255, 255, 0.10);
  --border-glow:  rgba(0, 229, 195, 0.30);

  /* Aurora Palette */
  --aurora-teal:   #00E5C3;
  --aurora-blue:   #2D9CFF;
  --aurora-violet: #7C5CFF;
  --aurora-pink:   #FF4FD8;

  /* Primary gradient */
  --grad-primary: linear-gradient(135deg, #00E5C3, #2D9CFF, #7C5CFF);
  --grad-hover:   linear-gradient(135deg, #00c4a8, #1a87e8, #6a4de0);
  --grad-card:    linear-gradient(135deg, rgba(0,229,195,0.15), rgba(124,92,255,0.15));

  /* Text */
  --text:         #EAF0FF;
  --text-muted:   #9AA6C4;
  --text-dark:    #1a1a2e;

  /* Fonts */
  --font-head:    'Sora', 'Plus Jakarta Sans', sans-serif;
  --font-body:    'Inter', sans-serif;

  /* Sizing */
  --radius-sm:    8px;
  --radius-md:    16px;
  --radius-lg:    24px;
  --radius-xl:    32px;
  --radius-full:  9999px;

  /* Spacing scale (8px base) */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  24px;
  --sp-6:  32px;
  --sp-7:  48px;
  --sp-8:  64px;
  --sp-9:  80px;
  --sp-10: 96px;

  /* Shadows */
  --shadow-sm:  0 2px 8px rgba(0,0,0,0.3);
  --shadow-md:  0 8px 32px rgba(0,0,0,0.4);
  --shadow-lg:  0 16px 64px rgba(0,0,0,0.5);
  --shadow-glow: 0 0 40px rgba(0,229,195,0.2);

  /* Transitions */
  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);

  /* Navbar */
  --nav-h: 72px;
  --nav-h-scrolled: 60px;
}

/* Light Mode Variables */
[data-theme="light"] {
  --bg:           #F0F4FF;
  --bg-alt:       #E4EAF8;
  --bg-card:      #FFFFFF;
  --surface:      rgba(255, 255, 255, 0.80);
  --surface-hover: rgba(255, 255, 255, 0.95);
  --border:       rgba(0, 0, 0, 0.10);
  --border-glow:  rgba(0, 145, 120, 0.30);
  --text:         #0B1020;
  --text-muted:   #5A6A8A;
  --shadow-sm:    0 2px 8px rgba(0,0,0,0.08);
  --shadow-md:    0 8px 32px rgba(0,0,0,0.12);
  --shadow-lg:    0 16px 64px rgba(0,0,0,0.15);
  --shadow-glow:  0 0 40px rgba(0,150,130,0.15);
}

/* =========================================================
   2. RESET & BASE
   ========================================================= */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  background-color: var(--bg);
  color: var(--text);
  line-height: 1.65;
  overflow-x: hidden;
  transition: background-color var(--transition), color var(--transition);
}

/* Grain overlay for subtle texture */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 0;
  opacity: 0.5;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

ul, ol {
  list-style: none;
}

button {
  cursor: pointer;
  border: none;
  background: none;
  font-family: inherit;
}

input, textarea, select {
  font-family: inherit;
}

:focus-visible {
  outline: 2px solid var(--aurora-teal);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}

::selection {
  background: rgba(0, 229, 195, 0.25);
  color: var(--text);
}

/* Custom scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--aurora-violet); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--aurora-blue); }

/* =========================================================
   3. TYPOGRAPHY
   ========================================================= */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-head);
  font-weight: 700;
  line-height: 1.2;
  color: var(--text);
}

h1 { font-size: clamp(2.2rem, 5vw, 4rem); }
h2 { font-size: clamp(1.75rem, 3.5vw, 2.75rem); }
h3 { font-size: clamp(1.3rem, 2.5vw, 1.75rem); }
h4 { font-size: clamp(1.1rem, 2vw, 1.35rem); }
h5 { font-size: 1.1rem; }
h6 { font-size: 1rem; }

p {
  color: var(--text-muted);
  font-size: clamp(0.95rem, 1.5vw, 1.05rem);
}

.gradient-text {
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.section-label {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--aurora-teal);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-bottom: var(--sp-3);
}

.section-label::before {
  content: '';
  width: 24px;
  height: 2px;
  background: var(--aurora-teal);
  display: inline-block;
}

.section-title {
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-family: var(--font-head);
  font-weight: 700;
  margin-bottom: var(--sp-4);
}

.section-subtitle {
  font-size: clamp(1rem, 1.8vw, 1.1rem);
  color: var(--text-muted);
  max-width: 600px;
  line-height: 1.7;
}

.text-center { text-align: center; }
.text-center .section-subtitle { margin: 0 auto; }

/* =========================================================
   4. UTILITY CLASSES
   ========================================================= */
.container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--sp-5);
}

.section {
  padding: var(--sp-10) 0;
  position: relative;
}

.section-alt {
  background: var(--bg-alt);
}

.flex { display: flex; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.grid { display: grid; }

.gap-1 { gap: var(--sp-2); }
.gap-2 { gap: var(--sp-3); }
.gap-3 { gap: var(--sp-4); }
.gap-4 { gap: var(--sp-5); }
.gap-5 { gap: var(--sp-6); }

.mb-1 { margin-bottom: var(--sp-2); }
.mb-2 { margin-bottom: var(--sp-3); }
.mb-3 { margin-bottom: var(--sp-4); }
.mb-4 { margin-bottom: var(--sp-5); }
.mb-5 { margin-bottom: var(--sp-7); }

.mt-auto { margin-top: auto; }

.d-none { display: none; }
.d-block { display: block; }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.tag {
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--radius-full);
  font-size: 0.75rem;
  font-weight: 600;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--aurora-teal);
}

.divider {
  height: 1px;
  background: var(--border);
  margin: var(--sp-7) 0;
}

/* =========================================================
   5. PRELOADER
   ========================================================= */
#preloader {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 2000;
  align-content: center;
  justify-items: center;
  gap: 24px;
  overflow: hidden;
  background: #f7f6f1;
  color: #282b25;
  opacity: 1;
  visibility: visible;
  transition: opacity .42s ease, visibility .42s ease;
}
html.js-enabled #preloader { display: grid; }
html.loader-fallback-hidden #preloader, #preloader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.preloader-stage { position: relative; width: 176px; height: 176px; display: grid; place-items: center; }
.preloader-orbit { position: absolute; inset: 14px 2px; border: 1px solid rgba(79, 112, 88, .24); border-radius: 50%; transform: rotate(-28deg) scaleY(.58); }
.preloader-orbit-outer { animation: loaderOrbit 7s linear infinite; }
.preloader-orbit-inner { inset: 5px 27px; border-color: rgba(185, 79, 54, .25); transform: rotate(57deg) scaleY(.66); animation: loaderOrbit 9s linear infinite reverse; }
.preloader-orbit i { position: absolute; top: 50%; left: -4px; width: 8px; height: 8px; border-radius: 50%; background: #bd5a3e; box-shadow: 0 0 0 5px rgba(189, 90, 62, .10); }
.preloader-orbit-inner i { top: 10%; left: 50%; width: 6px; height: 6px; background: #55745c; box-shadow: 0 0 0 4px rgba(85, 116, 92, .12); }
.preloader-core { position: relative; display: grid; width: 58px; height: 58px; place-items: center; border-radius: 50%; background: #f7f6f1; color: #fffefa; font-family: 'DM Serif Display', Georgia, serif; font-size: 30px; box-shadow: 0 10px 35px rgba(48, 60, 50, .20); }
.preloader-core img { display:block; width:42px; height:42px; object-fit:contain; }
.preloader-core span { position: absolute; right: 11px; bottom: 13px; width: 5px; height: 5px; border-radius: 50%; background: #e4a278; animation: loaderPulse 1.25s ease-in-out infinite; }
.preloader-coordinate { position: absolute; color: #8a8b80; font-size: 7px; font-weight: 600; letter-spacing: .16em; }
.preloader-coordinate-one { top: 5px; left: 4px; }
.preloader-coordinate-two { right: 0; bottom: 31px; }
.preloader-coordinate-three { bottom: 5px; left: 22px; }
.preloader-copy { display: grid; justify-items: center; gap: 7px; text-align: center; }
.preloader-eyebrow { color: #a9573d; font-size: 8px; font-weight: 700; letter-spacing: .2em; }
.preloader-copy strong { color: #30332c; font-size: 21px; font-weight: 500; letter-spacing: -.045em; }
.preloader-caption { color: #73766c; font-size: 10px; }
.preloader-progress { width: min(220px, 58vw); height: 2px; margin-top: 3px; overflow: hidden; background: rgba(40, 43, 37, .12); }
.preloader-progress span { display: block; width: 38%; height: 100%; background: #b65339; animation: loaderProgress 1s cubic-bezier(.45,0,.55,1) infinite alternate; }
.preloader-foot { position: absolute; right: 28px; bottom: 23px; left: 28px; display: flex; justify-content: space-between; color: #929388; font-size: 7px; letter-spacing: .15em; }
@keyframes loaderOrbit { to { rotate: 360deg; } }
@keyframes loaderPulse { 50% { opacity: .38; transform: scale(.65); } }
@keyframes loaderProgress { from { transform: translateX(-105%); } to { transform: translateX(365%); } }

/* Small interface symbols are local text glyphs, so the site never waits on an icon CDN. */
i.fa-solid, i.fa-regular, i.fa-brands {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1em;
  font-family: system-ui, sans-serif;
  font-size: 1em;
  font-style: normal;
  font-weight: 600;
  line-height: 1;
  text-align: center;
}
.fa-arrow-up-right-from-square::before { content: "↗"; }
.fa-cloud::before { content: "☁"; }
.fa-cubes::before { content: "⬡"; }
.fa-wand-magic-sparkles::before { content: "✦"; }
.fa-chevron-right::before { content: "›"; }
.fa-location-dot::before { content: "⌖"; }
.fa-clock::before { content: "◷"; }
.fa-layer-group::before { content: "▤"; }
.fa-check::before { content: "✓"; }
.fa-window-maximize::before { content: "▣"; }
.fa-mobile-screen-button::before { content: "▯"; }
.fa-bag-shopping::before { content: "◇"; }
.fa-gears::before { content: "⚙"; }
.fa-pen-ruler::before { content: "✎"; }
.fa-compass::before { content: "⊙"; }
.fa-code::before { content: "‹/›"; }
.fa-house::before { content: "⌂"; }
.fa-envelope::before { content: "✉"; }
.fa-x-twitter::before { content: "X"; }
.fa-linkedin-in::before { content: "in"; font-size: .8em; }

/* =========================================================
   6. NAVBAR & MEGA MENU
   ========================================================= */
.navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  height: var(--nav-h);
  display: flex;
  align-items: center;
  transition: all var(--transition);
  background: transparent;
}

.navbar.scrolled {
  height: var(--nav-h-scrolled);
  background: rgba(11, 16, 32, 0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow-md);
}

[data-theme="light"] .navbar.scrolled {
  background: rgba(240, 244, 255, 0.85);
}

.navbar .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}

/* Logo */
.nav-logo {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-shrink: 0;
}

.nav-logo-icon {
  width: 40px;
  height: 40px;
  background: var(--grad-primary);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 800;
  flex-shrink: 0;
}

.nav-logo-text {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 1.2rem;
  color: var(--text);
  line-height: 1.1;
}

.nav-logo-text span {
  display: block;
  font-size: 0.65rem;
  font-weight: 500;
  color: var(--text-muted);
  letter-spacing: 0.05em;
}

/* Nav Menu */
.nav-menu {
  display: flex;
  align-items: center;
  gap: var(--sp-1);
  height: 100%;
}

.nav-item {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
}

.nav-link {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
  border-radius: var(--radius-sm);
  transition: color var(--transition), background var(--transition);
  white-space: nowrap;
}

.nav-link:hover,
.nav-item:hover > .nav-link,
.nav-item.active > .nav-link {
  color: var(--aurora-teal);
  background: var(--surface);
}

.nav-link .nav-arrow {
  width: 14px;
  height: 14px;
  transition: transform var(--transition);
}

.nav-item:hover > .nav-link .nav-arrow,
.nav-item.active > .nav-link .nav-arrow {
  transform: rotate(180deg);
}

/* Nav Right Controls */
.nav-right {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-shrink: 0;
}

/* Theme Toggle */
.theme-toggle {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  transition: all var(--transition);
}

.theme-toggle:hover {
  background: var(--surface-hover);
  border-color: var(--aurora-teal);
  color: var(--aurora-teal);
}

.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }
[data-theme="light"] .theme-toggle .icon-sun { display: block; }
[data-theme="light"] .theme-toggle .icon-moon { display: none; }

/* Hamburger */
.nav-hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  background: var(--surface);
  border: 1px solid var(--border);
  transition: all var(--transition);
}

.nav-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--text);
  border-radius: 2px;
  transition: all var(--transition);
}

.nav-hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---- MEGA MENU & DROPDOWN ---- */
.mega-menu,
.dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  background: rgba(17, 23, 43, 0.97);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transition: all 0.25s ease;
  z-index: 999;
}

[data-theme="light"] .mega-menu,
[data-theme="light"] .dropdown-menu {
  background: rgba(255, 255, 255, 0.97);
}

.nav-item:hover > .mega-menu,
.nav-item:hover > .dropdown-menu,
.nav-item:focus-within > .mega-menu,
.nav-item:focus-within > .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Services mega menu — full width panel anchored to navbar */
.mega-menu-services {
  width: max-content;
  max-width: min(1180px, calc(100vw - 32px));
  padding: var(--sp-5);
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr)) 220px;
  gap: var(--sp-3);
  align-items: stretch;     /* all 5 columns stretch to same row height */
  left: 50%;
  transform: translateX(-50%) translateY(10px);
}

.nav-item:hover > .mega-menu-services,
.nav-item:focus-within > .mega-menu-services {
  transform: translateX(-50%) translateY(0);
}

/* Each column fills the full height of the grid row */
.mega-menu-services > .mega-col {
  display: flex;
  flex-direction: column;
}

.mega-col h4 {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--aurora-teal);
  margin-bottom: var(--sp-3);
  padding-bottom: var(--sp-2);
  border-bottom: 1px solid var(--border);
}

.mega-links { display: flex; flex-direction: column; gap: var(--sp-1); }

.mega-link {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-2);
  border-radius: var(--radius-sm);
  transition: all var(--transition);
  text-decoration: none;
}

.mega-link:hover {
  background: var(--surface-hover);
}

.mega-link-icon {
  width: 28px;
  height: 28px;
  background: var(--surface);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--aurora-blue);
  flex-shrink: 0;
  font-size: 0.75rem;
  margin-top: 2px;
}

.mega-link-text { display: flex; flex-direction: column; }

.mega-link-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
}

.mega-link-desc {
  font-size: 0.72rem;
  color: var(--text-muted);
  line-height: 1.3;
}

/* Featured card in mega menu */
.mega-featured {
  background: var(--grad-card);
  border: 1px solid var(--border-glow);
  border-radius: var(--radius-md);
  padding: var(--sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  /* Stretch to full grid row height so panel background covers it */
  align-self: stretch;
  height: 100%;
  box-sizing: border-box;
}

.mega-featured-img {
  width: 100%;
  height: 110px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  background: var(--surface);
}

.mega-featured h5 {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
}

.mega-featured p {
  font-size: 0.8rem;
  color: var(--text-muted);
  line-height: 1.5;
}

/* Industries mega menu */
.mega-menu-industries {
  width: 640px;
  padding: var(--sp-5);
  left: 50%;
  transform: translateX(-50%) translateY(10px);
}

.mega-menu-industries:hover,
.nav-item:hover > .mega-menu-industries {
  transform: translateX(-50%) translateY(0);
}

.industry-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-2);
}

.industry-tile {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 10px var(--sp-3);
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  transition: all var(--transition);
  text-decoration: none;
}

.industry-tile:hover {
  background: var(--surface-hover);
  border-color: var(--border);
}

.industry-tile-icon {
  font-size: 1.1rem;
  width: 26px;
  text-align: center;
}

.industry-tile-name {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text);
}

.mega-bottom-strip {
  margin-top: var(--sp-4);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--border);
  text-align: center;
  font-size: 0.82rem;
  color: var(--text-muted);
}

.mega-bottom-strip a {
  color: var(--aurora-teal);
  font-weight: 600;
}

/* Portfolio mega menu */
.mega-menu-portfolio {
  width: 600px;
  padding: var(--sp-5);
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: var(--sp-5);
  left: 50%;
  transform: translateX(-50%) translateY(10px);
}

.nav-item:hover > .mega-menu-portfolio,
.nav-item:focus-within > .mega-menu-portfolio {
  transform: translateX(-50%) translateY(0);
}

.portfolio-cats { display: flex; flex-direction: column; gap: 4px; }

.portfolio-cat-link {
  display: block;
  padding: 8px var(--sp-3);
  border-radius: var(--radius-sm);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted);
  transition: all var(--transition);
  text-decoration: none;
}

.portfolio-cat-link:hover {
  background: var(--surface-hover);
  color: var(--aurora-teal);
}

.portfolio-thumbs { display: flex; flex-direction: column; gap: var(--sp-3); }

.portfolio-thumb {
  display: flex;
  gap: var(--sp-3);
  align-items: center;
  text-decoration: none;
  padding: var(--sp-2);
  border-radius: var(--radius-sm);
  transition: background var(--transition);
}

.portfolio-thumb:hover { background: var(--surface-hover); }

.portfolio-thumb-img {
  width: 60px;
  height: 45px;
  object-fit: cover;
  border-radius: 6px;
  background: var(--surface);
  flex-shrink: 0;
}

.portfolio-thumb-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text);
  display: block;
  margin-bottom: 2px;
}

.portfolio-thumb-cat {
  font-size: 0.72rem;
  color: var(--aurora-blue);
}

/* About dropdown */
.dropdown-menu {
  width: 200px;
  padding: var(--sp-3);
  left: 50%;
  transform: translateX(-50%) translateY(10px);
}

.nav-item:hover > .dropdown-menu,
.nav-item:focus-within > .dropdown-menu {
  transform: translateX(-50%) translateY(0);
}

.dropdown-link {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 9px var(--sp-3);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text-muted);
  transition: all var(--transition);
  text-decoration: none;
}

.dropdown-link:hover {
  color: var(--aurora-teal);
  background: var(--surface-hover);
}

/* ---- MOBILE DRAWER ---- */
.nav-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: min(380px, 100vw);
  height: 100vh;
  background: var(--bg-alt);
  border-left: 1px solid var(--border);
  z-index: 1100;
  transform: translateX(100%);
  transition: transform var(--transition-slow);
  overflow-y: auto;
  padding: var(--sp-5);
  padding-top: var(--nav-h);
}

.nav-drawer.open {
  transform: translateX(0);
}

.nav-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(4px);
  z-index: 1050;
  opacity: 0;
  visibility: hidden;
  transition: all var(--transition);
}

.nav-overlay.show {
  opacity: 1;
  visibility: visible;
}

.drawer-menu { display: flex; flex-direction: column; gap: 4px; }

.drawer-item {}

.drawer-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px var(--sp-4);
  border-radius: var(--radius-md);
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  transition: all var(--transition);
  text-decoration: none;
}

.drawer-link:hover {
  background: var(--surface-hover);
  color: var(--aurora-teal);
}

.drawer-link .arrow {
  transition: transform var(--transition);
  font-size: 0.8rem;
}

.drawer-link.open .arrow { transform: rotate(180deg); }

.drawer-submenu {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--transition-slow);
  padding-left: var(--sp-4);
}

.drawer-submenu.open { max-height: 600px; }

.drawer-sub-link {
  display: block;
  padding: 8px var(--sp-3);
  font-size: 0.875rem;
  color: var(--text-muted);
  border-radius: var(--radius-sm);
  transition: all var(--transition);
  text-decoration: none;
}

.drawer-sub-link:hover {
  color: var(--aurora-teal);
  background: var(--surface);
}

.drawer-cta {
  margin-top: var(--sp-5);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--border);
}

/* =========================================================
   7. AURORA HERO BACKGROUND
   ========================================================= */
.hero-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
}

.aurora-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.35;
  animation: floatBlob 12s ease-in-out infinite;
  will-change: transform;
}

[data-theme="light"] .aurora-blob { opacity: 0.18; }

.aurora-blob-1 {
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, var(--aurora-violet), transparent 70%);
  top: -150px;
  left: -100px;
  animation-duration: 14s;
  animation-delay: 0s;
}

.aurora-blob-2 {
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, var(--aurora-teal), transparent 70%);
  top: 100px;
  right: -50px;
  animation-duration: 16s;
  animation-delay: -4s;
}

.aurora-blob-3 {
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, var(--aurora-blue), transparent 70%);
  bottom: -100px;
  left: 40%;
  animation-duration: 18s;
  animation-delay: -8s;
}

.aurora-blob-4 {
  width: 250px;
  height: 250px;
  background: radial-gradient(circle, var(--aurora-pink), transparent 70%);
  top: 50%;
  right: 20%;
  animation-duration: 20s;
  animation-delay: -6s;
}

@keyframes floatBlob {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%       { transform: translate(30px, -40px) scale(1.05); }
  66%       { transform: translate(-20px, 30px) scale(0.95); }
}

.hero-grid-overlay {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
}

/* =========================================================
   8. BUTTONS
   ========================================================= */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  padding: 12px 28px;
  border-radius: var(--radius-full);
  font-size: 0.9rem;
  font-weight: 700;
  font-family: var(--font-body);
  transition: all var(--transition);
  white-space: nowrap;
  text-decoration: none;
  border: none;
  cursor: pointer;
}

/* Primary gradient button */
.btn-primary {
  background: var(--grad-primary);
  color: #fff;
  box-shadow: 0 4px 24px rgba(0, 229, 195, 0.3);
  position: relative;
  overflow: hidden;
}

.btn-primary::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--grad-hover);
  opacity: 0;
  transition: opacity var(--transition);
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(0, 229, 195, 0.45);
}

.btn-primary:hover::after { opacity: 1; }

.btn-primary > * { position: relative; z-index: 1; }

/* Glass secondary button */
.btn-glass {
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.btn-glass:hover {
  background: var(--surface-hover);
  border-color: var(--aurora-teal);
  color: var(--aurora-teal);
  transform: translateY(-2px);
  box-shadow: var(--shadow-glow);
}

/* Outline button */
.btn-outline {
  background: transparent;
  color: var(--aurora-teal);
  border: 1px solid var(--aurora-teal);
}

.btn-outline:hover {
  background: rgba(0, 229, 195, 0.1);
  box-shadow: 0 0 20px rgba(0, 229, 195, 0.2);
  transform: translateY(-2px);
}

.btn-sm {
  padding: 8px 20px;
  font-size: 0.82rem;
}

.btn-lg {
  padding: 16px 40px;
  font-size: 1rem;
}

/* =========================================================
   9. CARDS & GLASS COMPONENTS
   ========================================================= */
.glass-card {
  background: var(--surface);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-5);
  transition: all var(--transition);
  position: relative;
  overflow: hidden;
}

.glass-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: var(--grad-primary);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity var(--transition);
  pointer-events: none;
}

.glass-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg), var(--shadow-glow);
  background: var(--surface-hover);
}

.glass-card:hover::before { opacity: 1; }

/* Fallback for browsers without backdrop-filter */
@supports not (backdrop-filter: blur(16px)) {
  .glass-card {
    background: var(--bg-card);
  }
}

/* Service card */
.service-card {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}

.service-card-icon {
  width: 52px;
  height: 52px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--grad-card);
  border: 1px solid var(--border-glow);
  font-size: 1.4rem;
  flex-shrink: 0;
}

.service-card h4 {
  font-size: 1.05rem;
  font-weight: 700;
}

.service-card p {
  font-size: 0.875rem;
  line-height: 1.65;
  flex-grow: 1;
}

.service-card .link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--aurora-teal);
  transition: gap var(--transition);
  text-decoration: none;
}

.service-card .link-arrow:hover { gap: 10px; }

/* Counter card */
.counter-card {
  text-align: center;
  padding: var(--sp-5);
}

.counter-number {
  font-family: var(--font-head);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: var(--sp-2);
}

.counter-label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* Testimonial card */
.testimonial-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-6);
}

.stars { color: #F59E0B; font-size: 0.875rem; margin-bottom: var(--sp-3); }

.testimonial-text {
  font-size: 0.95rem;
  line-height: 1.8;
  color: var(--text-muted);
  font-style: italic;
  margin-bottom: var(--sp-4);
}

.testimonial-author { display: flex; align-items: center; gap: var(--sp-3); }

.testimonial-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--border-glow);
  background: var(--surface);
}

.testimonial-name {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--text);
}

.testimonial-role {
  font-size: 0.78rem;
  color: var(--aurora-teal);
}

/* Blog card */
.blog-card {
  overflow: hidden;
}

.blog-card-img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: var(--radius-md);
  margin-bottom: var(--sp-4);
  background: var(--surface);
  transition: transform var(--transition);
}

.blog-card:hover .blog-card-img { transform: scale(1.03); }

.blog-meta {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-3);
  flex-wrap: wrap;
}

.blog-category {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--aurora-teal);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.blog-date {
  font-size: 0.75rem;
  color: var(--text-muted);
}

.blog-read-time {
  font-size: 0.75rem;
  color: var(--text-muted);
}

.blog-card h4 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: var(--sp-3);
  line-height: 1.4;
  transition: color var(--transition);
}

.blog-card:hover h4 { color: var(--aurora-teal); }

.blog-excerpt {
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.65;
}

/* =========================================================
   10. SECTIONS – HOME PAGE
   ========================================================= */

/* =====================================================
   HERO — Premium Redesign
   ===================================================== */

/* ---- Main section ---- */
.hero {
  min-height: calc(100vh - var(--nav-h));
  min-height: calc(100dvh - var(--nav-h));
  height: calc(100vh - var(--nav-h));
  height: calc(100dvh - var(--nav-h));
  max-height: 100vh;
  max-height: 100dvh;
  display: flex;
  align-items: center;
  /* Fix: reduce top padding so hero sits snug under navbar */
  padding-top: 0;
  padding-bottom: 0;
  margin-top: var(--nav-h);
  position: relative;
  overflow: hidden;
}

.hero::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

/* ---- 2-col grid ---- */
.hero-content {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-7);
  align-items: center;
  /* Fit within hero height */
  padding: var(--sp-4) 0 var(--sp-5);
  height: 100%;
}

/* ---- FLOATING BACKGROUND WORDS ---- */
.hero-words-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

.hw {
  position: absolute;
  font-family: var(--font-head);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  opacity: 0;
  color: transparent;
  -webkit-text-stroke: 1px rgba(0, 229, 195, 0.12);
  animation: hwFloat 18s ease-in-out infinite;
  user-select: none;
  white-space: nowrap;
}

[data-theme="light"] .hw {
  -webkit-text-stroke: 1px rgba(0, 120, 100, 0.1);
}

.hw-1  { font-size: clamp(3rem,8vw,7rem);  top: 8%;   left: 5%;   animation-delay: 0s;    animation-duration: 16s; }
.hw-2  { font-size: clamp(2rem,6vw,5rem);  top: 60%;  left: 2%;   animation-delay: -4s;   animation-duration: 20s; }
.hw-3  { font-size: clamp(4rem,10vw,9rem); top: 15%;  right: 3%;  animation-delay: -8s;   animation-duration: 14s; }
.hw-4  { font-size: clamp(2rem,5vw,4.5rem);top: 78%;  left: 30%;  animation-delay: -2s;   animation-duration: 22s; }
.hw-5  { font-size: clamp(3rem,7vw,6rem);  top: 45%;  right: 5%;  animation-delay: -6s;   animation-duration: 18s; }
.hw-6  { font-size: clamp(2rem,5vw,4rem);  top: 30%;  left: 40%;  animation-delay: -10s;  animation-duration: 24s; }
.hw-7  { font-size: clamp(3rem,7vw,6.5rem);top: 70%;  right: 20%; animation-delay: -3s;   animation-duration: 17s; }
.hw-8  { font-size: clamp(2rem,5vw,4rem);  top: 5%;   left: 55%;  animation-delay: -12s;  animation-duration: 21s; }
.hw-9  { font-size: clamp(2rem,6vw,5.5rem);top: 50%;  left: 15%;  animation-delay: -7s;   animation-duration: 19s; }
.hw-10 { font-size: clamp(3rem,8vw,7.5rem);top: 85%;  left: 55%;  animation-delay: -5s;   animation-duration: 23s; }

@keyframes hwFloat {
  0%   { opacity: 0;    transform: translateY(0)     scale(1); }
  10%  { opacity: 1; }
  50%  { opacity: 1;    transform: translateY(-24px) scale(1.02); }
  90%  { opacity: 1; }
  100% { opacity: 0;    transform: translateY(0)     scale(1); }
}

/* ---- LEFT COLUMN ---- */
.hero-left { max-width: 600px; }

/* Headline */
.hero-title {
  font-size: clamp(2.5rem, 5vw, 4.2rem);
  font-family: var(--font-head);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: var(--sp-4);
  color: var(--text);
}

.hero-title .typewriter-wrap {
  display: block;
  min-height: 1.15em;
}

.hero-title .typewriter-text {
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-title .cursor {
  display: inline-block;
  width: 3px;
  height: 0.85em;
  background: var(--aurora-teal);
  margin-left: 3px;
  vertical-align: middle;
  border-radius: 2px;
  animation: blink-cursor 0.9s step-end infinite;
  -webkit-text-fill-color: initial;
}

@keyframes blink-cursor {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

/* Eyebrow badge */
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 7px 18px;
  background: rgba(0, 229, 195, 0.08);
  border: 1px solid rgba(0, 229, 195, 0.35);
  border-radius: var(--radius-full);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--aurora-teal);
  letter-spacing: 0.04em;
  margin-bottom: var(--sp-5);
  backdrop-filter: blur(8px);
}

.hero-badge-dot {
  width: 8px; height: 8px;
  background: var(--aurora-teal);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--aurora-teal);
  animation: pulse-dot 2s ease-in-out infinite;
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.6; transform: scale(0.75); }
}

/* Subheading */
.hero-subtitle {
  font-size: clamp(1rem, 1.7vw, 1.1rem);
  color: var(--text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-6);
  max-width: 520px;
}

/* CTA buttons */
.hero-buttons {
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
  margin-bottom: var(--sp-5);
}

/* Stats pill row */
.hero-stats {
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-4) var(--sp-5);
  backdrop-filter: blur(12px);
  margin-bottom: var(--sp-5);
}

.hero-stat-item {
  flex: 1;
  min-width: 90px;
  text-align: center;
  padding: 0 var(--sp-3);
  position: relative;
}

.hero-stat-item + .hero-stat-item::before {
  content: '';
  position: absolute;
  left: 0; top: 15%;
  height: 70%; width: 1px;
  background: var(--border);
}

.hero-stat-number {
  font-family: var(--font-head);
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 4px;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-stat-label {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Tech strip */
.tech-strip {
  padding-top: var(--sp-4);
  border-top: 1px solid var(--border);
}

.tech-strip-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: var(--sp-3);
}

.tech-logos {
  display: flex;
  gap: var(--sp-2);
  align-items: center;
  flex-wrap: wrap;
}

.tech-logo-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-muted);
  padding: 4px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  background: var(--surface);
  transition: all var(--transition);
}

.tech-logo-item:hover {
  color: var(--aurora-teal);
  border-color: var(--aurora-teal);
  background: rgba(0,229,195,0.07);
}

/* =====================================================
   HERO RIGHT — Premium 3D Orb + Orbit System
   ===================================================== */

.hero-right {
  position: relative;
  height: 100%;
  max-height: clamp(320px, 60vh, 560px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* Particle canvas */
.hero-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  opacity: 0.6;
}

/* ---- Central Orb ---- */
.hero-orb {
  position: relative;
  z-index: 2;
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-orb-inner {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--grad-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  color: #fff;
  box-shadow:
    0 0 0 12px rgba(0,229,195,0.08),
    0 0 40px rgba(0,229,195,0.35),
    0 0 80px rgba(124,92,255,0.2);
  animation: orbPulse 3s ease-in-out infinite;
  z-index: 3;
  position: relative;
}

@keyframes orbPulse {
  0%, 100% { box-shadow: 0 0 0 10px rgba(0,229,195,0.08), 0 0 36px rgba(0,229,195,0.3), 0 0 70px rgba(124,92,255,0.18); }
  50%       { box-shadow: 0 0 0 18px rgba(0,229,195,0.12), 0 0 60px rgba(0,229,195,0.5), 0 0 100px rgba(124,92,255,0.3); }
}

/* Concentric rings around orb */
.hero-orb-ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid;
  animation: spin-ring linear infinite;
}

.hero-orb-ring-1 {
  width: 180px; height: 180px;
  border-color: rgba(0,229,195,0.2);
  animation-duration: 8s;
}
.hero-orb-ring-1::before {
  content: '';
  position: absolute;
  top: -4px; left: 50%;
  width: 8px; height: 8px;
  background: var(--aurora-teal);
  border-radius: 50%;
  box-shadow: 0 0 10px var(--aurora-teal);
  transform: translateX(-50%);
}

.hero-orb-ring-2 {
  width: 300px; height: 300px;
  border-color: rgba(45,156,255,0.15);
  animation-duration: 14s;
  animation-direction: reverse;
}
.hero-orb-ring-2::before {
  content: '';
  position: absolute;
  top: -4px; left: 50%;
  width: 8px; height: 8px;
  background: var(--aurora-blue);
  border-radius: 50%;
  box-shadow: 0 0 10px var(--aurora-blue);
  transform: translateX(-50%);
}

.hero-orb-ring-3 {
  width: 430px; height: 430px;
  border-color: rgba(124,92,255,0.1);
  border-style: dashed;
  animation-duration: 24s;
}

/* ====================================================
   HERO ORBIT SYSTEM — 4-6 icons visible at all times
   28 icons, total cycle = 28s
   Each icon: visible for 5s out of 28s
   Stagger: 28/28 = 1s apart
   At any moment: ~5 icons visible simultaneously
   ==================================================== */

.hero-orbit-system {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

/* Base node — hidden by default */
.orbit-node {
  position: absolute;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(13, 18, 38, 0.90);
  border: 1.5px solid rgba(255,255,255,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  opacity: 0;
  transform: scale(0.5);
  animation: iconReveal 28s ease-in-out infinite;
}

/*
  iconReveal keyframe:
  cycle = 28s, visible window = 5s (17.86% of cycle)
  0%      → hidden
  2.85%   → fade+scale in  (0.8s)
  14.28%  → fade+scale out (0.8s)
  17.86%  → hidden again
  100%    → hidden
*/
@keyframes iconReveal {
  0%     { opacity: 0; transform: scale(0.4);  }
  2.85%  { opacity: 1; transform: scale(1.08); }
  5%     { opacity: 1; transform: scale(1);    }
  14.28% { opacity: 1; transform: scale(1);    }
  17.86% { opacity: 0; transform: scale(0.5);  }
  100%   { opacity: 0; transform: scale(0.5);  }
}

/* Icon brand colors */
.on-1  { color:#61dafb; border-color:rgba(97,218,251,0.4);   box-shadow:0 0 22px rgba(97,218,251,0.3);  }
.on-2  { color:#68a063; border-color:rgba(104,160,99,0.4);   box-shadow:0 0 22px rgba(104,160,99,0.3);  }
.on-3  { color:#ff9900; border-color:rgba(255,153,0,0.4);    box-shadow:0 0 22px rgba(255,153,0,0.3);   }
.on-4  { color:#2496ed; border-color:rgba(36,150,237,0.4);   box-shadow:0 0 22px rgba(36,150,237,0.3);  }
.on-5  { color:#3776ab; border-color:rgba(55,118,171,0.4);   box-shadow:0 0 22px rgba(55,118,171,0.3);  }
.on-6  { color:#336791; border-color:rgba(51,103,145,0.4);   box-shadow:0 0 22px rgba(51,103,145,0.3);  }
.on-7  { color:#f7df1e; border-color:rgba(247,223,30,0.4);   box-shadow:0 0 22px rgba(247,223,30,0.3);  }
.on-8  { color:#a259ff; border-color:rgba(162,89,255,0.4);   box-shadow:0 0 22px rgba(162,89,255,0.3);  }
.on-9  { color:#e5e5e5; border-color:rgba(255,255,255,0.25); box-shadow:0 0 22px rgba(255,255,255,0.15);}
.on-10 { color:#00e5c3; border-color:rgba(0,229,195,0.4);    box-shadow:0 0 22px rgba(0,229,195,0.3);   }
.on-11 { color:#41b883; border-color:rgba(65,184,131,0.4);   box-shadow:0 0 22px rgba(65,184,131,0.3);  }
.on-12 { color:#7c5cff; border-color:rgba(124,92,255,0.4);   box-shadow:0 0 22px rgba(124,92,255,0.3);  }
.on-13 { color:#dd1b16; border-color:rgba(221,27,22,0.4);    box-shadow:0 0 22px rgba(221,27,22,0.3);   }
.on-14 { color:#00a4ef; border-color:rgba(0,164,239,0.4);    box-shadow:0 0 22px rgba(0,164,239,0.3);   }
.on-15 { color:#4285f4; border-color:rgba(66,133,244,0.4);   box-shadow:0 0 22px rgba(66,133,244,0.3);  }
.on-16 { color:#e5e5e5; border-color:rgba(255,255,255,0.22); box-shadow:0 0 22px rgba(255,255,255,0.12);}
.on-17 { color:#3ddc84; border-color:rgba(61,220,132,0.4);   box-shadow:0 0 22px rgba(61,220,132,0.3);  }
.on-18 { color:#00e5c3; border-color:rgba(0,229,195,0.4);    box-shadow:0 0 22px rgba(0,229,195,0.3);   }
.on-19 { color:#4285f4; border-color:rgba(66,133,244,0.4);   box-shadow:0 0 22px rgba(66,133,244,0.3);  }
.on-20 { color:#f05133; border-color:rgba(240,81,51,0.4);    box-shadow:0 0 22px rgba(240,81,51,0.3);   }
.on-21 { color:#e5e5e5; border-color:rgba(255,255,255,0.2);  box-shadow:0 0 22px rgba(255,255,255,0.1); }
.on-22 { color:#00e5c3; border-color:rgba(0,229,195,0.4);    box-shadow:0 0 22px rgba(0,229,195,0.3);   }
.on-23 { color:#8892be; border-color:rgba(136,146,190,0.4);  box-shadow:0 0 22px rgba(136,146,190,0.3); }
.on-24 { color:#7c5cff; border-color:rgba(124,92,255,0.4);   box-shadow:0 0 22px rgba(124,92,255,0.3);  }
.on-25 { color:#2d9cff; border-color:rgba(45,156,255,0.4);   box-shadow:0 0 22px rgba(45,156,255,0.3);  }
.on-26 { color:#00e5c3; border-color:rgba(0,229,195,0.4);    box-shadow:0 0 22px rgba(0,229,195,0.3);   }
.on-27 { color:#cc6699; border-color:rgba(204,102,153,0.4);  box-shadow:0 0 22px rgba(204,102,153,0.3); }
.on-28 { color:#ffbd2e; border-color:rgba(255,189,46,0.4);   box-shadow:0 0 22px rgba(255,189,46,0.3);  }

/* Positions — spread across hero-right area */
.on-1  { top:10%;  left:38%;  animation-delay:0s;    }
.on-2  { top:22%;  left:75%;  animation-delay:-1s;   }
.on-3  { top:52%;  left:80%;  animation-delay:-2s;   }
.on-4  { top:70%;  left:52%;  animation-delay:-3s;   }
.on-5  { top:65%;  left:15%;  animation-delay:-4s;   }
.on-6  { top:35%;  left:6%;   animation-delay:-5s;   }
.on-7  { top:6%;   left:15%;  animation-delay:-6s;   }
.on-8  { top:4%;   left:58%;  animation-delay:-7s;   }
.on-9  { top:28%;  left:86%;  animation-delay:-8s;   }
.on-10 { top:62%;  left:72%;  animation-delay:-9s;   }
.on-11 { top:80%;  left:32%;  animation-delay:-10s;  }
.on-12 { top:58%;  left:4%;   animation-delay:-11s;  }
.on-13 { top:18%;  left:4%;   animation-delay:-12s;  }
.on-14 { top:16%;  left:60%;  animation-delay:-13s;  }
.on-15 { top:40%;  left:84%;  animation-delay:-14s;  }
.on-16 { top:74%;  left:62%;  animation-delay:-15s;  }
.on-17 { top:76%;  left:25%;  animation-delay:-16s;  }
.on-18 { top:46%;  left:2%;   animation-delay:-17s;  }
.on-19 { top:8%;   left:32%;  animation-delay:-18s;  }
.on-20 { top:20%;  left:80%;  animation-delay:-19s;  }
.on-21 { top:48%;  left:88%;  animation-delay:-20s;  }
.on-22 { top:68%;  left:45%;  animation-delay:-21s;  }
.on-23 { top:84%;  left:12%;  animation-delay:-22s;  }
.on-24 { top:32%;  left:3%;   animation-delay:-23s;  }
.on-25 { top:5%;   left:72%;  animation-delay:-24s;  }
.on-26 { top:44%;  left:78%;  animation-delay:-25s;  }
.on-27 { top:14%;  left:46%;  animation-delay:-26s;  }
.on-28 { top:56%;  left:28%;  animation-delay:-27s;  }

/* Glow ring */
.hero-ring {
  position: absolute;
  width: 480px; height: 480px;
  border-radius: 50%;
  background: conic-gradient(from 0deg, var(--aurora-teal), var(--aurora-blue), var(--aurora-violet), var(--aurora-pink), var(--aurora-teal));
  opacity: 0.12;
  filter: blur(36px);
  animation: spin-ring 14s linear infinite;
  pointer-events: none;
  z-index: 0;
}

.hero-orbit {
  position: absolute;
  width: 450px; height: 450px;
  border-radius: 50%;
  border: 1px dashed rgba(0,229,195,0.2);
  animation: spin-ring 20s linear infinite reverse;
  pointer-events: none;
  z-index: 0;
}

.hero-orbit::after {
  content: '';
  position: absolute;
  top: -5px; left: 50%;
  width: 10px; height: 10px;
  background: var(--aurora-teal);
  border-radius: 50%;
  box-shadow: 0 0 14px var(--aurora-teal);
  transform: translateX(-50%);
}

@keyframes spin-ring {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ---- ANIMATED TERMINAL ---- */
.hero-terminal {
  position: relative;
  z-index: 2;
  width: 420px;
  background: rgba(10, 14, 26, 0.96);
  border: 1px solid rgba(0, 229, 195, 0.2);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow:
    0 0 0 1px rgba(0,229,195,0.08),
    0 24px 64px rgba(0,0,0,0.6),
    0 0 80px rgba(0,229,195,0.06);
  font-family: 'Courier New', 'Monaco', monospace;
  font-size: 0.78rem;
}

[data-theme="light"] .hero-terminal {
  background: rgba(10, 14, 26, 0.94);
}

/* Terminal top bar */
.terminal-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  background: rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.terminal-dots {
  display: flex;
  gap: 6px;
}

.t-dot {
  width: 12px; height: 12px;
  border-radius: 50%;
  display: inline-block;
}

.t-red    { background: #ff5f57; box-shadow: 0 0 6px rgba(255,95,87,0.5); }
.t-yellow { background: #ffbd2e; box-shadow: 0 0 6px rgba(255,189,46,0.5); }
.t-green  { background: #28ca41; box-shadow: 0 0 6px rgba(40,202,65,0.5); }

.terminal-title {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
  font-family: var(--font-body);
  letter-spacing: 0.03em;
}

/* Terminal body — fixed height so it never jumps */
.terminal-body {
  padding: 14px 18px;
  height: 280px;              /* fixed: no min/max jumping */
  overflow-y: auto;
  overflow-x: hidden;
  line-height: 1.65;
}

.terminal-body::-webkit-scrollbar { width: 4px; }
.terminal-body::-webkit-scrollbar-track { background: transparent; }
.terminal-body::-webkit-scrollbar-thumb { background: rgba(0,229,195,0.3); border-radius: 2px; }

/* Terminal line types */
.t-line {
  display: block;
  animation: tLineIn 0.15s ease forwards;
  opacity: 0;
  word-break: break-all;
}

@keyframes tLineIn {
  from { opacity: 0; transform: translateX(-4px); }
  to   { opacity: 1; transform: translateX(0); }
}

.t-cmd   { color: #7ee787; }
.t-cmd::before { content: '$ '; color: rgba(0,229,195,0.7); }
.t-out   { color: rgba(255,255,255,0.6); padding-left: 14px; }
.t-ok    { color: #28ca41; padding-left: 14px; }
.t-warn  { color: #ffbd2e; padding-left: 14px; }
.t-info  { color: var(--aurora-blue); padding-left: 14px; }
.t-grad  {
  padding-left: 14px;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 700;
}

/* Progress bar inside terminal */
.t-progress-wrap {
  padding-left: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.t-progress-bar {
  flex: 1;
  height: 4px;
  background: rgba(255,255,255,0.1);
  border-radius: 2px;
  overflow: hidden;
}

.t-progress-fill {
  height: 100%;
  background: var(--grad-primary);
  border-radius: 2px;
  width: 0%;
  transition: width 0.4s ease;
}

.t-progress-pct {
  font-size: 0.7rem;
  color: var(--aurora-teal);
  min-width: 32px;
  text-align: right;
}

/* Blinking cursor line at bottom */
.terminal-cursor-line {
  padding: 0 18px 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.terminal-prompt {
  color: rgba(0,229,195,0.7);
  font-family: monospace;
  font-size: 0.78rem;
}

.terminal-blink-cursor {
  display: inline-block;
  width: 8px; height: 14px;
  background: var(--aurora-teal);
  border-radius: 1px;
  animation: blink-cursor 1s step-end infinite;
  opacity: 0.8;
}

/* ---- FLOATING CARDS ---- */
.float-card {
  position: absolute;
  background: rgba(17, 23, 43, 0.88);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-md);
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  animation: floatCard 6s ease-in-out infinite;
  white-space: nowrap;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
  z-index: 4;
}

[data-theme="light"] .float-card {
  background: rgba(255,255,255,0.9);
  border-color: rgba(0,0,0,0.08);
}

.float-card-icon {
  width: 36px; height: 36px;
  background: var(--grad-primary);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.9rem;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(0,229,195,0.3);
}

.float-card-value {
  font-family: var(--font-head);
  font-size: 1rem;
  font-weight: 800;
  color: var(--text);
  line-height: 1;
}

.float-card-label {
  font-size: 0.68rem;
  color: var(--text-muted);
  margin-top: 2px;
}

.float-card-1 { top: 15px;    left: -55px;  animation-delay: 0s;    animation-duration: 7s; }
.float-card-2 { bottom: 60px; right: -50px; animation-delay: -3s;   animation-duration: 6s; }
.float-card-3 { bottom: 10px; left: 5px;    animation-delay: -1.5s; animation-duration: 8s; }

@keyframes floatCard {
  0%, 100% { transform: translateY(0)   rotate(0deg); }
  33%       { transform: translateY(-10px) rotate(0.5deg); }
  66%       { transform: translateY(5px)   rotate(-0.5deg); }
}

/* ---- SCROLL INDICATOR ---- */
.hero-scroll-indicator {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  opacity: 0.45;
  animation: bounce-scroll 2.2s ease-in-out infinite;
  z-index: 2;
  text-decoration: none;
}

.hero-scroll-indicator span {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.hero-scroll-indicator svg { color: var(--aurora-teal); }

@keyframes bounce-scroll {
  0%, 100% { transform: translateX(-50%) translateY(0);   opacity: 0.45; }
  50%       { transform: translateX(-50%) translateY(7px); opacity: 0.9; }
}

/* =====================================================
   HERO PILLS + DASHBOARD CARD
   ===================================================== */

/* Highlight pills */
.hero-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: var(--sp-5);
}

.hero-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted);
  transition: all var(--transition);
}

.hero-pill i { color: var(--aurora-teal); font-size: 0.68rem; }

.hero-pill:hover {
  border-color: var(--aurora-teal);
  color: var(--aurora-teal);
  background: rgba(0,229,195,0.06);
}

/* Dashboard card wrapper */
.hero-dashboard {
  position: relative;
  z-index: 2;
  width: 400px;
  background: rgba(13, 18, 35, 0.94);
  border: 1px solid rgba(0,229,195,0.18);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow:
    0 0 0 1px rgba(0,229,195,0.06),
    0 24px 64px rgba(0,0,0,0.55),
    0 0 60px rgba(0,229,195,0.05);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

[data-theme="light"] .hero-dashboard {
  background: rgba(10,14,30,0.92);
}

/* Top bar */
.dash-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03);
}

.dash-dots { display: flex; gap: 6px; }

.dash-title {
  font-size: 0.73rem;
  font-weight: 600;
  color: rgba(255,255,255,0.45);
  font-family: var(--font-body);
}

.dash-live {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.67rem;
  font-weight: 700;
  color: #28ca41;
  letter-spacing: 0.04em;
}

.dash-live-dot {
  width: 7px; height: 7px;
  background: #28ca41;
  border-radius: 50%;
  box-shadow: 0 0 6px #28ca41;
  animation: pulse-dot 1.8s ease-in-out infinite;
}

/* Metric row */
.dash-metrics {
  display: flex;
  padding: 16px 18px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

.dash-metric {
  flex: 1;
  text-align: center;
  position: relative;
}

.dash-metric + .dash-metric::before {
  content: '';
  position: absolute;
  left: 0; top: 10%; height: 80%; width: 1px;
  background: rgba(255,255,255,0.07);
}

.dash-metric-val {
  font-family: var(--font-head);
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 4px;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.dash-metric-label {
  font-size: 0.66rem;
  color: rgba(255,255,255,0.38);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* Bar chart */
.dash-chart {
  padding: 14px 18px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

.dash-chart-label {
  font-size: 0.66rem;
  font-weight: 600;
  color: rgba(255,255,255,0.32);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 10px;
}

.dash-bars {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  height: 64px;
}

.dash-bar-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  height: 100%;
  justify-content: flex-end;
}

.dash-bar {
  width: 100%;
  height: var(--h);
  background: linear-gradient(to top, rgba(0,229,195,0.28), rgba(45,156,255,0.28));
  border-radius: 3px 3px 0 0;
  transform-origin: bottom;
  animation: barGrow 1s ease both;
}

.dash-bar-active {
  background: linear-gradient(to top, var(--aurora-teal), var(--aurora-blue));
  box-shadow: 0 0 14px rgba(0,229,195,0.45);
}

@keyframes barGrow {
  from { transform: scaleY(0); opacity: 0; }
  to   { transform: scaleY(1); opacity: 1; }
}

.dash-bar-wrap:nth-child(1) .dash-bar { animation-delay: 0.15s; }
.dash-bar-wrap:nth-child(2) .dash-bar { animation-delay: 0.25s; }
.dash-bar-wrap:nth-child(3) .dash-bar { animation-delay: 0.35s; }
.dash-bar-wrap:nth-child(4) .dash-bar { animation-delay: 0.45s; }
.dash-bar-wrap:nth-child(5) .dash-bar { animation-delay: 0.55s; }
.dash-bar-wrap:nth-child(6) .dash-bar { animation-delay: 0.65s; }
.dash-bar-wrap:nth-child(7) .dash-bar { animation-delay: 0.75s; }

.dash-bar-wrap span {
  font-size: 0.58rem;
  color: rgba(255,255,255,0.28);
  font-family: var(--font-body);
}

/* Project status list */
.dash-projects {
  padding: 12px 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.dash-project-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dash-status {
  width: 8px; height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.dash-status-done  { background: #28ca41; box-shadow: 0 0 6px #28ca41; }
.dash-status-run   { background: var(--aurora-blue); box-shadow: 0 0 6px var(--aurora-blue); animation: pulse-dot 2s ease-in-out infinite; }
.dash-status-build { background: #ffbd2e; box-shadow: 0 0 6px #ffbd2e; animation: pulse-dot 2.5s ease-in-out infinite; }

.dash-project-name {
  flex: 1;
  font-size: 0.77rem;
  color: rgba(255,255,255,0.65);
  font-family: var(--font-body);
}

.dash-project-tag {
  font-size: 0.63rem;
  font-weight: 700;
  padding: 2px 9px;
  border-radius: var(--radius-full);
  background: rgba(40,202,65,0.12);
  color: #28ca41;
  border: 1px solid rgba(40,202,65,0.22);
}

.dash-tag-run   { background: rgba(45,156,255,0.12); color: var(--aurora-blue); border-color: rgba(45,156,255,0.22); }
.dash-tag-build { background: rgba(255,189,46,0.12);  color: #ffbd2e; border-color: rgba(255,189,46,0.22); }

/* 2-col grid */
.hero-content {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-8);
  align-items: center;
  padding: var(--sp-9) 0;
}

/* ---- LEFT COLUMN ---- */
.hero-left { max-width: 600px; }

/* Eyebrow badge */
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 7px 18px;
  background: rgba(0, 229, 195, 0.08);
  border: 1px solid rgba(0, 229, 195, 0.35);
  border-radius: var(--radius-full);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--aurora-teal);
  letter-spacing: 0.04em;
  margin-bottom: var(--sp-5);
  backdrop-filter: blur(8px);
}

.hero-badge-dot {
  width: 8px;
  height: 8px;
  background: var(--aurora-teal);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--aurora-teal);
  animation: pulse-dot 2s ease-in-out infinite;
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 8px var(--aurora-teal); }
  50%       { opacity: 0.6; transform: scale(0.75); box-shadow: 0 0 4px var(--aurora-teal); }
}

/* Headline */
.hero-title {
  font-size: clamp(2.6rem, 5vw, 4.2rem);
  font-family: var(--font-head);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin-bottom: var(--sp-4);
  color: var(--text);
}

/* Typewriter line */
.hero-title .typewriter-wrap {
  display: block;
  min-height: 1.15em;
}

.hero-title .typewriter-text {
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Blinking cursor */
.hero-title .cursor {
  display: inline-block;
  width: 3px;
  height: 0.85em;
  background: var(--aurora-teal);
  margin-left: 3px;
  vertical-align: middle;
  border-radius: 2px;
  animation: blink-cursor 0.9s step-end infinite;
  -webkit-text-fill-color: initial;
}

@keyframes blink-cursor {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

/* Subheading */
.hero-subtitle {
  font-size: clamp(1rem, 1.7vw, 1.1rem);
  color: var(--text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-6);
  max-width: 520px;
}

/* CTA buttons */
.hero-buttons {
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
  margin-bottom: var(--sp-6);
}

/* Stats row */
.hero-stats {
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-4) var(--sp-5);
  backdrop-filter: blur(12px);
  margin-bottom: var(--sp-5);
}

.hero-stat-item {
  flex: 1;
  min-width: 100px;
  text-align: center;
  padding: 0 var(--sp-3);
  position: relative;
}

.hero-stat-item + .hero-stat-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 15%;
  height: 70%;
  width: 1px;
  background: var(--border);
}

.hero-stat-number {
  font-family: var(--font-head);
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 4px;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-stat-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Tech strip */
.tech-strip {
  padding-top: var(--sp-4);
  border-top: 1px solid var(--border);
}

.tech-strip-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: var(--sp-3);
}

.tech-logos {
  display: flex;
  gap: var(--sp-3);
  align-items: center;
  flex-wrap: wrap;
}

.tech-logo-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted);
  padding: 5px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  background: var(--surface);
  transition: all var(--transition);
}

.tech-logo-item:hover {
  color: var(--aurora-teal);
  border-color: var(--aurora-teal);
  background: rgba(0,229,195,0.07);
}

/* --- STATS BAR (replaces trust/marquee bar) --- */
.stats-bar {
  padding: var(--sp-5) 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: var(--bg-alt);
  position: relative;
  z-index: 1;
}

.stats-bar-grid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  flex-wrap: wrap;
}

.stats-bar-item {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  min-width: 140px;
  justify-content: center;
}

.stats-bar-icon {
  width: 42px;
  height: 42px;
  border-radius: var(--radius-md);
  background: var(--grad-card);
  border: 1px solid var(--border-glow);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  color: var(--aurora-teal);
  flex-shrink: 0;
}

.stats-bar-num {
  font-family: var(--font-head);
  font-size: 1.4rem;
  font-weight: 800;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: 2px;
}

.stats-bar-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-muted);
  white-space: nowrap;
}

.stats-bar-divider {
  width: 1px;
  height: 40px;
  background: var(--border);
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .stats-bar-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-4);
  }
  .stats-bar-divider { display: none; }
  .stats-bar-item { justify-content: flex-start; }
}

@media (max-width: 480px) {
  .stats-bar-grid { grid-template-columns: 1fr; }
}

.trust-label {
  text-align: center;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: var(--sp-4);
}

.marquee-track {
  display: flex;
  gap: var(--sp-8);
  animation: marquee 30s linear infinite;
  width: max-content;
}

.marquee-track:hover { animation-play-state: paused; }

@keyframes marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.client-logo {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 8px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-muted);
  white-space: nowrap;
  transition: all var(--transition);
  flex-shrink: 0;
}

.client-logo:hover {
  border-color: var(--aurora-teal);
  color: var(--aurora-teal);
}

/* --- SERVICES OVERVIEW --- */
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--sp-5);
  margin-top: var(--sp-7);
}

/* --- WHY CHOOSE US --- */
.why-us-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-8);
  align-items: center;
  margin-top: var(--sp-7);
}

.why-us-points {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}

.why-point {
  display: flex;
  gap: var(--sp-4);
  align-items: flex-start;
}

.why-point-icon {
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  background: var(--grad-card);
  border: 1px solid var(--border-glow);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--aurora-teal);
}

.why-point-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}

.why-point-desc {
  font-size: 0.875rem;
  color: var(--text-muted);
  line-height: 1.6;
}

.counters-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-4);
}

/* --- PORTFOLIO GRID (HOME) --- */
.portfolio-filter {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
  justify-content: center;
  margin: var(--sp-7) 0 var(--sp-5);
}

.filter-btn {
  padding: 8px 20px;
  border-radius: var(--radius-full);
  font-size: 0.82rem;
  font-weight: 700;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text-muted);
  transition: all var(--transition);
  cursor: pointer;
}

.filter-btn:hover,
.filter-btn.active {
  background: var(--grad-primary);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 16px rgba(0,229,195,0.3);
}

.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--sp-5);
}

.portfolio-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4/3;
  background: var(--surface);
  cursor: pointer;
}

.portfolio-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow);
}

.portfolio-card:hover .portfolio-card-img { transform: scale(1.08); }

.portfolio-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(11,16,32,0.95) 0%, rgba(11,16,32,0.3) 60%, transparent 100%);
  opacity: 0;
  transition: opacity var(--transition);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: var(--sp-5);
}

.portfolio-card:hover .portfolio-card-overlay { opacity: 1; }

.portfolio-card-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: var(--sp-2);
}

.portfolio-card-tags {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
  margin-bottom: var(--sp-3);
}

.portfolio-tag {
  background: rgba(0,229,195,0.2);
  border: 1px solid rgba(0,229,195,0.3);
  color: var(--aurora-teal);
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
}

/* --- PROCESS TIMELINE --- */
.process-timeline {
  display: flex;
  gap: 0;
  margin-top: var(--sp-7);
  position: relative;
}

.process-timeline::before {
  content: '';
  position: absolute;
  top: 30px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--border);
  z-index: 0;
}

.process-step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  padding: 0 var(--sp-3);
  z-index: 1;
}

.process-dot {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--bg-alt);
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  margin-bottom: var(--sp-4);
  transition: all var(--transition);
  position: relative;
  z-index: 1;
}

.process-step:hover .process-dot,
.process-step.active .process-dot {
  border-color: var(--aurora-teal);
  background: rgba(0,229,195,0.1);
  box-shadow: 0 0 24px rgba(0,229,195,0.3);
}

.process-step-num {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 20px;
  height: 20px;
  background: var(--grad-primary);
  border-radius: 50%;
  font-size: 0.65rem;
  font-weight: 800;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.process-step-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: var(--sp-2);
}

.process-step-desc {
  font-size: 0.8rem;
  color: var(--text-muted);
  line-height: 1.5;
}

/* --- INDUSTRIES GRID --- */
.industries-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: var(--sp-3);
  margin-top: var(--sp-7);
}

.industry-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: var(--sp-5) var(--sp-4);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-2);
  transition: all var(--transition);
  cursor: pointer;
  text-decoration: none;
}

.industry-card:hover {
  background: var(--surface-hover);
  border-color: var(--aurora-teal);
  transform: translateY(-3px);
  box-shadow: var(--shadow-glow);
}

.industry-card-icon { font-size: 2rem; }

.industry-card-name {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text);
}

/* --- TECHNOLOGIES TABS --- */
.tech-tabs {
  margin-top: var(--sp-7);
}

.tab-nav {
  display: flex;
  gap: var(--sp-2);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--sp-6);
  flex-wrap: wrap;
}

.tab-btn {
  padding: 10px 20px;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--text-muted);
  border-bottom: 2px solid transparent;
  transition: all var(--transition);
  cursor: pointer;
  margin-bottom: -1px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
}

.tab-btn:hover { color: var(--text); }

.tab-btn.active {
  color: var(--aurora-teal);
  border-bottom-color: var(--aurora-teal);
}

.tab-panel { display: none; }
.tab-panel.active { display: block; }

.tech-logos-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
}

.tech-pill {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 10px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text-muted);
  transition: all var(--transition);
}

.tech-pill:hover {
  background: var(--surface-hover);
  border-color: var(--aurora-blue);
  color: var(--aurora-blue);
}

/* --- TESTIMONIALS SLIDER --- */
.testimonials-slider {
  position: relative;
  margin-top: var(--sp-7);
  overflow: hidden;
}

.slider-track {
  display: flex;
  transition: transform var(--transition-slow);
  gap: var(--sp-5);
}

.slider-track .testimonial-card {
  min-width: calc(33.333% - var(--sp-4));
  flex-shrink: 0;
}

.slider-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-4);
  margin-top: var(--sp-5);
}

.slider-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition);
}

.slider-btn:hover {
  background: var(--surface-hover);
  border-color: var(--aurora-teal);
  color: var(--aurora-teal);
}

.slider-dots {
  display: flex;
  gap: var(--sp-2);
}

.slider-dot {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background: var(--border);
  transition: all var(--transition);
  cursor: pointer;
}

.slider-dot.active {
  width: 24px;
  background: var(--aurora-teal);
}

/* --- BLOG GRID --- */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--sp-5);
  margin-top: var(--sp-7);
}

/* --- CTA BANNER --- */
.cta-banner {
  background: var(--grad-card);
  border: 1px solid var(--border-glow);
  border-radius: var(--radius-xl);
  padding: var(--sp-9) var(--sp-8);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.cta-banner::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--grad-primary);
  opacity: 0.05;
  border-radius: inherit;
}

.cta-banner h2 {
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  margin-bottom: var(--sp-4);
}

.cta-banner p {
  margin-bottom: var(--sp-6);
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.cta-buttons {
  display: flex;
  gap: var(--sp-3);
  justify-content: center;
  flex-wrap: wrap;
}

/* =========================================================
   11. SERVICES PAGE
   ========================================================= */
.page-hero {
  min-height: 380px;
  display: flex;
  align-items: center;
  padding-top: var(--nav-h);
  position: relative;
  overflow: hidden;
  background: var(--bg-alt);
}

.page-hero-content {
  position: relative;
  z-index: 1;
  max-width: 700px;
}

.breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: 0.82rem;
  color: var(--text-muted);
  margin-bottom: var(--sp-4);
  flex-wrap: wrap;
}

.breadcrumb a {
  color: var(--text-muted);
  transition: color var(--transition);
  text-decoration: none;
}

.breadcrumb a:hover { color: var(--aurora-teal); }
.breadcrumb span { color: var(--aurora-teal); }

.service-detail-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-8);
  align-items: center;
  padding: var(--sp-9) 0;
  border-bottom: 1px solid var(--border);
}

.service-detail-block:last-child { border-bottom: none; }

.service-detail-block.reverse { direction: rtl; }
.service-detail-block.reverse > * { direction: ltr; }

.service-detail-img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  border-radius: var(--radius-lg);
  background: var(--surface);
}

.service-features-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  margin: var(--sp-4) 0;
}

.service-feature-item {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: 0.875rem;
  color: var(--text-muted);
}

.service-feature-item::before {
  content: '';
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(0,229,195,0.15);
  border: 1px solid var(--aurora-teal);
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2300E5C3' stroke-width='3'%3E%3Cpolyline points='20,6 9,17 4,12'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px;
}

.tool-tags { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-3) 0; }

/* FAQ Accordion */
.faq-list { max-width: 800px; margin: var(--sp-7) auto 0; display: flex; flex-direction: column; gap: var(--sp-3); }

.faq-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.faq-question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-4) var(--sp-5);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  gap: var(--sp-3);
  transition: color var(--transition);
}

.faq-question:hover { color: var(--aurora-teal); }

.faq-icon {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--surface-hover);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  transition: all var(--transition);
}

.faq-item.open .faq-icon {
  background: var(--aurora-teal);
  border-color: var(--aurora-teal);
  color: #000;
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--transition-slow), padding var(--transition);
  padding: 0 var(--sp-5);
}

.faq-item.open .faq-answer {
  max-height: 300px;
  padding-bottom: var(--sp-4);
}

.faq-answer p { font-size: 0.875rem; line-height: 1.75; }

/* =========================================================
   12. PORTFOLIO PAGE
   ========================================================= */
.portfolio-full-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--sp-5);
  margin-top: var(--sp-6);
}

.portfolio-full-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
}

.portfolio-full-card:hover {
  transform: translateY(-4px);
  border-color: var(--aurora-teal);
  box-shadow: var(--shadow-lg), var(--shadow-glow);
}

.portfolio-full-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  background: var(--surface);
  transition: transform var(--transition-slow);
}

.portfolio-full-card:hover .portfolio-full-img { transform: scale(1.04); }

.portfolio-full-body {
  padding: var(--sp-4);
}

.portfolio-full-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: var(--sp-2);
}

.portfolio-full-excerpt {
  font-size: 0.82rem;
  color: var(--text-muted);
  line-height: 1.6;
  margin-bottom: var(--sp-3);
}

.portfolio-tech-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--sp-3); }

.tech-badge {
  padding: 3px 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--aurora-blue);
}

/* Portfolio Modal */
.portfolio-modal {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--sp-5);
  opacity: 0;
  visibility: hidden;
  transition: all var(--transition);
}

.portfolio-modal.open {
  opacity: 1;
  visibility: visible;
}

.portfolio-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.8);
  backdrop-filter: blur(8px);
}

.portfolio-modal-content {
  position: relative;
  z-index: 1;
  background: var(--bg-alt);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  max-width: 800px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  padding: var(--sp-6);
  transform: translateY(20px);
  transition: transform var(--transition);
}

.portfolio-modal.open .portfolio-modal-content { transform: translateY(0); }

.modal-close {
  position: absolute;
  top: var(--sp-4);
  right: var(--sp-4);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition);
  font-size: 1.1rem;
}

.modal-close:hover { background: var(--surface-hover); color: var(--aurora-pink); }

.modal-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-3);
  margin: var(--sp-5) 0;
}

.modal-metric {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: var(--sp-4);
  text-align: center;
}

.modal-metric-value {
  font-family: var(--font-head);
  font-size: 1.5rem;
  font-weight: 800;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.modal-metric-label {
  font-size: 0.78rem;
  color: var(--text-muted);
}

/* =========================================================
   13. INDUSTRY PAGE
   ========================================================= */
.industry-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--sp-5);
  margin-top: var(--sp-7);
}

.industry-detail-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-5);
  transition: all var(--transition);
}

.industry-detail-card:hover {
  transform: translateY(-4px);
  border-color: var(--aurora-violet);
  box-shadow: 0 16px 48px rgba(124,92,255,0.2);
}

.industry-detail-icon {
  font-size: 2.5rem;
  margin-bottom: var(--sp-3);
}

.industry-detail-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: var(--sp-3);
}

.industry-challenges { margin: var(--sp-4) 0; }

.industry-challenges h5 {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--aurora-pink);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: var(--sp-2);
}

.challenge-item {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-2);
  font-size: 0.82rem;
  color: var(--text-muted);
  margin-bottom: 6px;
}

.challenge-item::before {
  content: '⚡';
  flex-shrink: 0;
  font-size: 0.7rem;
  margin-top: 2px;
}

.industry-solutions h5 {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--aurora-teal);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: var(--sp-2);
}

.solution-item {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-2);
  font-size: 0.82rem;
  color: var(--text-muted);
  margin-bottom: 6px;
}

.solution-item::before {
  content: '✓';
  flex-shrink: 0;
  font-size: 0.8rem;
  color: var(--aurora-teal);
  margin-top: 1px;
}

/* =========================================================
   14. ABOUT PAGE
   ========================================================= */
.story-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-8);
  align-items: center;
  margin-top: var(--sp-7);
}

.story-img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  border-radius: var(--radius-lg);
  background: var(--surface);
}

.values-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--sp-4);
  margin-top: var(--sp-7);
}

.value-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-5);
  text-align: center;
  transition: all var(--transition);
}

.value-card:hover {
  transform: translateY(-4px);
  border-color: var(--aurora-violet);
  box-shadow: 0 16px 48px rgba(124,92,255,0.15);
}

.value-icon {
  font-size: 2rem;
  margin-bottom: var(--sp-3);
  display: block;
}

/* Timeline milestones */
.timeline {
  position: relative;
  max-width: 700px;
  margin: var(--sp-7) auto 0;
}

.timeline::before {
  content: '';
  position: absolute;
  left: 30px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--border);
}

.timeline-item {
  display: flex;
  gap: var(--sp-5);
  margin-bottom: var(--sp-6);
  position: relative;
}

.timeline-dot {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--bg-alt);
  border: 2px solid var(--aurora-teal);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--aurora-teal);
  position: relative;
  z-index: 1;
  box-shadow: 0 0 16px rgba(0,229,195,0.2);
}

.timeline-content {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: var(--sp-4) var(--sp-5);
  flex: 1;
  margin-top: var(--sp-2);
}

.timeline-year {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--aurora-teal);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 4px;
}

.timeline-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: var(--sp-2);
}

.timeline-desc {
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* Team grid */
.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--sp-5);
  margin-top: var(--sp-7);
}

.team-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  text-align: center;
  transition: all var(--transition);
}

.team-card:hover {
  transform: translateY(-4px);
  border-color: var(--aurora-violet);
  box-shadow: var(--shadow-lg);
}

.team-card-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  background: var(--surface);
  transition: transform var(--transition-slow);
}

.team-card:hover .team-card-img { transform: scale(1.05); }

.team-card-body {
  padding: var(--sp-4);
}

.team-card-name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}

.team-card-role {
  font-size: 0.8rem;
  color: var(--aurora-teal);
  margin-bottom: var(--sp-3);
}

.team-social { display: flex; justify-content: center; gap: var(--sp-2); }

.team-social a {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  color: var(--text-muted);
  transition: all var(--transition);
  text-decoration: none;
}

.team-social a:hover {
  background: var(--aurora-teal);
  border-color: var(--aurora-teal);
  color: #000;
}

/* Partners */
.partners-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-4);
  justify-content: center;
  align-items: center;
  margin-top: var(--sp-7);
}

.partner-badge {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px 28px;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text-muted);
  transition: all var(--transition);
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}

.partner-badge:hover {
  border-color: var(--aurora-blue);
  color: var(--aurora-blue);
  transform: translateY(-2px);
}

/* =========================================================
   15. BLOG PAGE
   ========================================================= */
.blog-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: var(--sp-8);
  margin-top: var(--sp-7);
}

.blog-featured {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  margin-bottom: var(--sp-7);
}

.blog-featured-img {
  height: 100%;
  min-height: 280px;
  object-fit: cover;
  background: var(--surface);
}

.blog-featured-body {
  padding: var(--sp-6);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.blog-grid-main {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-5);
}

.blog-sidebar {
  position: sticky;
  top: calc(var(--nav-h) + var(--sp-4));
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
}

.sidebar-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-4);
}

.sidebar-card h4 {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: var(--sp-4);
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--border);
}

.sidebar-popular { display: flex; flex-direction: column; gap: var(--sp-3); }

.sidebar-post {
  display: flex;
  gap: var(--sp-3);
  text-decoration: none;
  transition: opacity var(--transition);
}

.sidebar-post:hover { opacity: 0.8; }

.sidebar-post-img {
  width: 60px;
  height: 50px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  background: var(--surface);
  flex-shrink: 0;
}

.sidebar-post-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.4;
  margin-bottom: 4px;
}

.sidebar-post-date { font-size: 0.72rem; color: var(--text-muted); }

.sidebar-cats { display: flex; flex-direction: column; gap: 6px; }

.sidebar-cat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px var(--sp-3);
  border-radius: var(--radius-sm);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-muted);
  transition: all var(--transition);
  text-decoration: none;
}

.sidebar-cat:hover { background: var(--surface-hover); color: var(--aurora-teal); }

.sidebar-cat-count {
  background: var(--surface);
  border-radius: var(--radius-full);
  padding: 2px 8px;
  font-size: 0.7rem;
  color: var(--text-muted);
}

.newsletter-form { display: flex; flex-direction: column; gap: var(--sp-2); }

.newsletter-input {
  padding: 10px var(--sp-3);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 0.875rem;
  transition: border-color var(--transition);
}

.newsletter-input:focus {
  outline: none;
  border-color: var(--aurora-teal);
}

.newsletter-input::placeholder { color: var(--text-muted); }

.blog-search {
  display: flex;
  gap: var(--sp-2);
  margin-bottom: var(--sp-5);
}

.blog-search-input {
  flex: 1;
  padding: 10px var(--sp-4);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  color: var(--text);
  font-size: 0.875rem;
  transition: border-color var(--transition);
}

.blog-search-input:focus {
  outline: none;
  border-color: var(--aurora-teal);
}

.blog-search-input::placeholder { color: var(--text-muted); }

/* Blog Detail */
.blog-detail-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: var(--sp-8);
}

.blog-detail-hero-img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  border-radius: var(--radius-lg);
  background: var(--surface);
  margin-bottom: var(--sp-6);
}

.blog-content {
  font-size: 1rem;
  line-height: 1.85;
  color: var(--text-muted);
}

.blog-content h2 {
  font-size: 1.5rem;
  color: var(--text);
  margin: var(--sp-7) 0 var(--sp-3);
}

.blog-content h3 {
  font-size: 1.2rem;
  color: var(--text);
  margin: var(--sp-5) 0 var(--sp-3);
}

.blog-content p { margin-bottom: var(--sp-4); }

.blog-content ul, .blog-content ol {
  list-style: disc;
  padding-left: var(--sp-5);
  margin-bottom: var(--sp-4);
}

.blog-content ol { list-style: decimal; }

.blog-content li { margin-bottom: var(--sp-2); }

.blog-content blockquote {
  border-left: 3px solid var(--aurora-teal);
  padding: var(--sp-4) var(--sp-5);
  background: var(--surface);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  margin: var(--sp-5) 0;
  font-style: italic;
}

.blog-content code {
  background: var(--surface);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.875em;
  color: var(--aurora-teal);
  font-family: monospace;
}

/* =========================================================
   16. CONTACT PAGE
   ========================================================= */
.contact-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-8);
  margin-top: var(--sp-7);
}

.contact-form-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
}

.form-group {
  margin-bottom: var(--sp-4);
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: var(--sp-2);
}

.form-control {
  width: 100%;
  padding: 12px var(--sp-4);
  background: var(--bg-alt);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  color: var(--text);
  font-size: 0.9rem;
  font-family: var(--font-body);
  transition: border-color var(--transition), box-shadow var(--transition);
  -webkit-appearance: none;
  appearance: none;
}

.form-control:focus {
  outline: none;
  border-color: var(--aurora-teal);
  box-shadow: 0 0 0 3px rgba(0, 229, 195, 0.1);
}

.form-control::placeholder { color: var(--text-muted); }

.form-control.error { border-color: var(--aurora-pink); }

.form-error-msg {
  font-size: 0.75rem;
  color: var(--aurora-pink);
  margin-top: var(--sp-1);
  display: none;
}

.form-error-msg.show { display: block; }

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }

textarea.form-control { resize: vertical; min-height: 120px; }

.file-upload {
  border: 2px dashed var(--border);
  border-radius: var(--radius-md);
  padding: var(--sp-5);
  text-align: center;
  cursor: pointer;
  transition: all var(--transition);
}

.file-upload:hover {
  border-color: var(--aurora-teal);
  background: rgba(0,229,195,0.05);
}

.file-upload-text { font-size: 0.82rem; color: var(--text-muted); }
.file-upload-text strong { color: var(--aurora-teal); }

.form-success {
  display: none;
  text-align: center;
  padding: var(--sp-7);
}

.form-success.show { display: block; }

.form-success-icon {
  width: 64px;
  height: 64px;
  background: rgba(0,229,195,0.15);
  border: 2px solid var(--aurora-teal);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  margin: 0 auto var(--sp-4);
  color: var(--aurora-teal);
}

.contact-info { display: flex; flex-direction: column; gap: var(--sp-4); }

.contact-info-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--sp-5);
  display: flex;
  gap: var(--sp-4);
  align-items: flex-start;
  transition: all var(--transition);
}

.contact-info-card:hover {
  border-color: var(--aurora-teal);
  transform: translateX(4px);
}

.contact-info-icon {
  width: 44px;
  height: 44px;
  background: var(--grad-card);
  border: 1px solid var(--border-glow);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
}

.contact-info-label {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--aurora-teal);
  margin-bottom: 4px;
}

.contact-info-value {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
}

.map-placeholder {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: var(--sp-3);
  color: var(--text-muted);
  font-size: 0.875rem;
  margin-top: var(--sp-4);
}

.contact-social-links {
  display: flex;
  gap: var(--sp-3);
  margin-top: var(--sp-4);
  flex-wrap: wrap;
}

.contact-social-link {
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  background: var(--surface);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  color: var(--text-muted);
  transition: all var(--transition);
  text-decoration: none;
}

.contact-social-link:hover {
  background: var(--aurora-teal);
  border-color: var(--aurora-teal);
  color: #000;
  transform: translateY(-2px);
}

/* Contact FAQ strip */
.contact-faq {
  margin-top: var(--sp-8);
}

/* WhatsApp floating btn */
.whatsapp-float {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 56px;
  height: 56px;
  background: #25D366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  color: #fff;
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.4);
  z-index: 500;
  transition: all var(--transition);
  text-decoration: none;
  animation: float-wa 4s ease-in-out infinite;
}

.whatsapp-float:hover {
  transform: scale(1.1);
  box-shadow: 0 12px 32px rgba(37, 211, 102, 0.6);
}

@keyframes float-wa {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-6px); }
}

.whatsapp-float:hover { animation-play-state: paused; }

/* Back to top */
.back-to-top {
  position: fixed;
  bottom: 100px;
  right: 30px;
  width: 44px;
  height: 44px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text);
  font-size: 1rem;
  z-index: 500;
  transition: all var(--transition);
  opacity: 0;
  visibility: hidden;
  text-decoration: none;
  cursor: pointer;
}

.back-to-top.show {
  opacity: 1;
  visibility: visible;
}

.back-to-top:hover {
  background: var(--aurora-teal);
  border-color: var(--aurora-teal);
  color: #000;
  transform: translateY(-2px);
}

/* =========================================================
   17. FOOTER
   ========================================================= */
.footer {
  background: var(--bg-alt);
  border-top: 1px solid var(--border);
  padding: var(--sp-10) 0 0;
}

/* Footer uses full container width — no extra side padding */
.footer > .container {
  max-width: 1280px;
  padding: 0 var(--sp-7);
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.6fr;
  gap: var(--sp-6);
  margin-bottom: var(--sp-8);
  width: 100%;
  align-items: start;
}

.footer-brand-text {
  font-size: 0.875rem;
  color: var(--text-muted);
  line-height: 1.75;
  margin: var(--sp-4) 0;
  max-width: 100%;
}

.footer-social {
  display: flex;
  gap: var(--sp-2);
  margin-top: var(--sp-4);
}

.footer-social-link {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: var(--surface);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  color: var(--text-muted);
  transition: all var(--transition);
  text-decoration: none;
}

.footer-social-link:hover {
  background: var(--aurora-teal);
  border-color: var(--aurora-teal);
  color: #000;
  transform: translateY(-2px);
}

.footer-col-title {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--text);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: var(--sp-4);
}

.footer-links { display: flex; flex-direction: column; gap: 10px; }

.footer-link {
  font-size: 0.875rem;
  color: var(--text-muted);
  transition: color var(--transition);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
}

.footer-link:hover { color: var(--aurora-teal); }

.footer-link::before {
  content: '';
  width: 0;
  height: 1px;
  background: var(--aurora-teal);
  transition: width var(--transition);
}

.footer-link:hover::before { width: 12px; }

.footer-contact-item {
  display: flex;
  gap: var(--sp-3);
  align-items: flex-start;
  font-size: 0.875rem;
  color: var(--text-muted);
  margin-bottom: var(--sp-3);
}

.footer-contact-icon {
  color: var(--aurora-teal);
  flex-shrink: 0;
  margin-top: 2px;
}

.footer-newsletter { margin-top: var(--sp-4); }
.footer-newsletter-title { font-size: 0.82rem; font-weight: 600; color: var(--text); margin-bottom: var(--sp-2); }

.footer-newsletter-form { display: flex; gap: var(--sp-2); }

.footer-newsletter-input {
  flex: 1;
  padding: 10px var(--sp-3);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 0.82rem;
  transition: border-color var(--transition);
}

.footer-newsletter-input:focus { outline: none; border-color: var(--aurora-teal); }
.footer-newsletter-input::placeholder { color: var(--text-muted); }

.footer-newsletter-btn {
  padding: 10px 16px;
  background: var(--grad-primary);
  color: #fff;
  border-radius: var(--radius-sm);
  font-size: 0.82rem;
  font-weight: 700;
  border: none;
  cursor: pointer;
  transition: opacity var(--transition);
  white-space: nowrap;
}

.footer-newsletter-btn:hover { opacity: 0.85; }

.footer-bottom {
  border-top: 1px solid var(--border);
  padding: var(--sp-5) 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--sp-3);
}

.footer-copyright {
  font-size: 0.82rem;
  color: var(--text-muted);
}

.footer-legal { display: flex; gap: var(--sp-4); }

.footer-legal a {
  font-size: 0.82rem;
  color: var(--text-muted);
  transition: color var(--transition);
  text-decoration: none;
}

.footer-legal a:hover { color: var(--aurora-teal); }

/* =========================================================
   18. 404 PAGE
   ========================================================= */
.not-found {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.not-found-content {
  position: relative;
  z-index: 1;
  max-width: 500px;
}

.not-found-number {
  font-family: var(--font-head);
  font-size: clamp(6rem, 15vw, 10rem);
  font-weight: 900;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: var(--sp-4);
}

.not-found h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: var(--sp-4);
}

.not-found p {
  margin-bottom: var(--sp-6);
}

/* =========================================================
   19. ANIMATIONS & KEYFRAMES
   ========================================================= */
/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; }
  .aurora-blob { animation: none; }
  .float-card { animation: none; }
  .marquee-track { animation-play-state: paused; }
  .whatsapp-float { animation: none; }
  * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* =========================================================
   20. LIGHT MODE OVERRIDES
   ========================================================= */
[data-theme="light"] .navbar.scrolled {
  background: rgba(240, 244, 255, 0.9);
}

[data-theme="light"] .glass-card {
  background: rgba(255,255,255,0.8);
}

[data-theme="light"] .portfolio-card-overlay {
  background: linear-gradient(to top, rgba(240,244,255,0.97) 0%, rgba(240,244,255,0.5) 60%, transparent 100%);
}

[data-theme="light"] .portfolio-card-title { color: #0B1020; }

[data-theme="light"] .hero-grid-overlay {
  background-image:
    linear-gradient(rgba(0,0,0,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.04) 1px, transparent 1px);
}

[data-theme="light"] .float-card {
  background: rgba(255,255,255,0.85);
  border-color: rgba(0,0,0,0.1);
}

/* =========================================================
   21. RESPONSIVE BREAKPOINTS
   ========================================================= */

/* 1280px */
@media (max-width: 1280px) {
  .mega-menu-services {
    width: max-content;
    max-width: calc(100vw - 32px);
    grid-template-columns: repeat(4, minmax(160px, 1fr)) 200px;
    padding: var(--sp-4);
    gap: var(--sp-2);
  }
  /* Keep featured card visible but smaller */
  .mega-featured { padding: var(--sp-3); }
  .mega-featured-img { height: 80px; }
  /* Footer stays 4-col at 1280px — no change needed */
}

/* 1024px */
@media (max-width: 1024px) {
  .nav-menu { display: none; }
  .nav-hamburger { display: flex; }
  
  .hero {
    height: auto;
    min-height: calc(100vh - var(--nav-h));
    min-height: calc(100dvh - var(--nav-h));
  }
  .hero-content { grid-template-columns: 1fr; text-align: center; height: auto; }
  .hero-left { max-width: 100%; }
  .hero-right { display: none; }
  .hero-buttons { justify-content: center; }
  .hero-stats { justify-content: center; }
  .tech-logos { justify-content: center; }

  .why-us-grid { grid-template-columns: 1fr; }
  .story-grid { grid-template-columns: 1fr; }
  .service-detail-block { grid-template-columns: 1fr; }
  .service-detail-block.reverse { direction: ltr; }
  .service-detail-img { height: 280px; }

  .blog-layout { grid-template-columns: 1fr; }
  .blog-sidebar { position: static; }
  .blog-detail-layout { grid-template-columns: 1fr; }

  .contact-layout { grid-template-columns: 1fr; }

  .footer-grid { grid-template-columns: 1fr 1fr; }

  .process-timeline { flex-direction: column; align-items: flex-start; gap: var(--sp-4); }
  .process-timeline::before { display: none; }
  .process-step { flex-direction: row; text-align: left; gap: var(--sp-4); align-items: flex-start; width: 100%; }
  .process-dot { flex-shrink: 0; }
}

/* 768px */
@media (max-width: 768px) {
  :root { --nav-h: 64px; }
  
  .section { padding: var(--sp-8) 0; }

  .blog-featured { grid-template-columns: 1fr; }
  .blog-featured-img { height: 220px; }
  .blog-grid-main { grid-template-columns: 1fr; }

  .slider-track .testimonial-card { min-width: 100%; }

  .portfolio-grid { grid-template-columns: 1fr; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--sp-5); }

  .modal-metrics { grid-template-columns: 1fr; }

  .counters-grid { grid-template-columns: 1fr 1fr; }

  .form-row { grid-template-columns: 1fr; }

  .footer-bottom { flex-direction: column; text-align: center; }
}

/* 360px (mobile) */
@media (max-width: 480px) {
  .hero-title { font-size: 2rem; }
  .hero-buttons { flex-direction: column; align-items: center; }
  .hero-buttons .btn { width: 100%; max-width: 280px; }

  .services-grid { grid-template-columns: 1fr; }
  .industries-grid { grid-template-columns: repeat(2, 1fr); }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .values-grid { grid-template-columns: 1fr; }

  .footer-grid { grid-template-columns: 1fr; }
  .footer-brand-text { max-width: 100%; }
  
  .cta-banner { padding: var(--sp-6) var(--sp-4); }
  
  .contact-form-wrap { padding: var(--sp-4); }

  .counters-grid { grid-template-columns: 1fr 1fr; }
}

/* =========================================================
   EXTRA UTILITIES (appended)
   ========================================================= */

/* Desktop-only display utility used in navbar CTA */
.d-lg-inline-flex { display: none; }
@media (min-width: 1024px) {
  .d-lg-inline-flex { display: inline-flex !important; }
}

/* File upload click passthrough */
.file-upload { cursor: pointer; }
.file-upload input[type="file"] { position: absolute; opacity: 0; width: 0; height: 0; }

/* Contact form select arrow */
select.form-control {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239AA6C4' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
  cursor: pointer;
}

/* Blog search button adjustment */
.blog-search .btn { flex-shrink: 0; }

/* Portfolio filter on blog page */
.portfolio-filter[style*="margin:0"] { justify-content: flex-start; }

/* Ensure slider cards have equal height */
.slider-track .testimonial-card { display: flex; flex-direction: column; }
.testimonial-card .testimonial-text { flex-grow: 1; }

/* Active nav link indicator */
.nav-link.active { color: var(--aurora-teal) !important; }

/* Story grid responsive fix */
@media (max-width: 768px) {
  .story-grid { grid-template-columns: 1fr !important; }
  .blog-detail-layout { grid-template-columns: 1fr !important; }
  .blog-featured { grid-template-columns: 1fr !important; }
}

/* =========================================================
   AURORA DIGITAL — editorial design system
   ========================================================= */
html[data-theme] {
  color-scheme: light;
  --bg: #f7f6f1;
  --bg-alt: #eeede6;
  --bg-card: #fffefa;
  --surface: #fffefa;
  --surface-hover: #f2f0e8;
  --border: rgba(34, 39, 31, .14);
  --border-glow: rgba(202, 86, 56, .24);
  --aurora-teal: #3d6754;
  --aurora-blue: #687c70;
  --aurora-violet: #c75b3e;
  --aurora-pink: #b87550;
  --grad-primary: linear-gradient(120deg, #c75b3e, #a74d34);
  --grad-hover: linear-gradient(120deg, #a74d34, #833f30);
  --grad-card: linear-gradient(135deg, #f1eee4, #f8f6f0);
  --text: #282b25;
  --text-muted: #686c61;
  --text-dark: #282b25;
  --font-head: 'DM Sans', sans-serif;
  --font-body: 'DM Sans', sans-serif;
  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 8px;
  --radius-xl: 10px;
  --shadow-sm: 0 2px 8px rgba(35, 37, 31, .06);
  --shadow-md: 0 10px 30px rgba(35, 37, 31, .08);
  --shadow-lg: 0 18px 55px rgba(35, 37, 31, .14);
  --shadow-glow: 0 0 30px rgba(199, 91, 62, .10);
  --nav-h: 78px;
  scroll-behavior: smooth;
}

body { background: var(--bg); color: var(--text); font-size: 15px; line-height: 1.7; }
body::before { display: none; }
::selection { background: #e4d4bf; color: #282b25; }
:focus-visible { outline-color: #b75036; outline-offset: 4px; border-radius: 3px; }
html { scrollbar-color: #a7aa9a #f7f6f1; }
::-webkit-scrollbar-track { background: #f7f6f1; }
::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb:hover { background: #a7aa9a; }
.container { width: min(100% - 72px, 1200px); }

.skip-link { position: fixed; z-index: 2000; top: 8px; left: 8px; padding: 12px 18px; transform: translateY(-150%); background: #282b25; color: #fff; }
.skip-link:focus { transform: translateY(0); }
.navbar { position: sticky; top: 0; z-index: 1000; height: var(--nav-h); background: rgba(247, 246, 241, .94); border-bottom: 1px solid rgba(40, 43, 37, .10); backdrop-filter: blur(18px); transition: box-shadow .25s ease; }
.navbar.scrolled { box-shadow: 0 5px 24px rgba(40, 43, 37, .06); }
.nav-shell { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.nav-logo { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.brand-mark { display: block; width: 38px; height: 38px; flex: 0 0 38px; object-fit: contain; }
.brand-name { display: flex; flex-direction: column; color: #282b25; font-size: 15px; font-weight: 700; letter-spacing: -.035em; line-height: 1.1; }
.brand-name > span { margin-top: 4px; color: #77796f; font-size: 9px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; }
.nav-menu { display: flex; align-items: center; gap: clamp(22px, 3.2vw, 48px); margin: 0 auto; }
.nav-link { padding: 10px 0; color: #55594f; font-size: 13px; font-weight: 500; transition: color .2s ease; }
.nav-link:hover, .nav-link.active { color: #bf5237 !important; }
.nav-cta { display: inline-flex; align-items: center; gap: 22px; padding: 12px 16px; border: 1px solid #30332b; color: #30332b; font-size: 12px; font-weight: 600; transition: background .2s ease,color .2s ease; }
.nav-cta:hover { background: #30332b; color: #fffefa; }
.nav-cta span { color: #bc533a; font-size: 15px; }
.nav-hamburger { display: none; width: 42px; height: 42px; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--border); }
.nav-hamburger span { width: 17px; height: 1px; background: #282b25; transition: transform .2s ease; }
.nav-hamburger.active span:first-child { transform: translateY(3.5px) rotate(45deg); }
.nav-hamburger.active span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.nav-overlay { display: none; }

.atelier-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 690px; background: #f0eee6; }
.atelier-hero-grid { position: absolute; z-index: -1; inset: 0; opacity: .32; background-image: linear-gradient(rgba(49, 55, 45, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(49, 55, 45, .08) 1px, transparent 1px); background-size: 66px 66px; mask-image: linear-gradient(90deg, transparent 10%, #000 70%); }
.atelier-hero-layout { min-height: 690px; display: grid; grid-template-columns: 1fr .96fr; align-items: center; gap: 25px; padding-top: 50px; padding-bottom: 64px; }
.atelier-copy { position: relative; z-index: 2; padding: 5px 0 0; }
.eyebrow, .atelier-label { display: flex; align-items: center; gap: 10px; color: #676b60; font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.status-dot { width: 7px; height: 7px; flex: 0 0 7px; background: #4f8065; border-radius: 50%; box-shadow: 0 0 0 4px rgba(79, 128, 101, .13); }
.eyebrow-divider { height: 15px; width: 1px; margin: 0 3px; background: #c8c6bb; }
.atelier-hero h1 { max-width: 640px; margin-top: 30px; color: #292c26; font-size: clamp(52px, 6.1vw, 86px); font-weight: 500; letter-spacing: -.075em; line-height: .99; }
.serif-italic { color: #b94f36; font-family: 'DM Serif Display', Georgia, serif; font-weight: 400; font-style: italic; letter-spacing: -.045em; }
.atelier-intro { max-width: 460px; margin-top: 27px; color: #686c61; font-size: 15px; line-height: 1.85; }
.atelier-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 26px; margin-top: 31px; }
.button-ink, .button-paper { display: inline-flex; min-height: 51px; align-items: center; justify-content: center; gap: 25px; padding: 0 19px; background: #292c26; color: #fffefa; font-size: 12px; font-weight: 600; transition: transform .2s ease, background .2s ease; }
.button-ink:hover { transform: translateY(-2px); background: #b94f36; }
.button-ink span, .button-paper span { font-size: 17px; }
.text-link { display: inline-flex; gap: 11px; align-items: center; color: #41443c; font-size: 12px; font-weight: 600; }
.text-link span { color: #b94f36; font-size: 17px; transition: transform .2s ease; }
.text-link:hover span { transform: translateX(4px); }
.hero-footnote { display: flex; align-items: center; gap: 16px; margin-top: 68px; color: #7a7c71; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.hero-footnote > span:first-child { color: #b94f36; font-weight: 700; }
.footnote-line { width: 66px; height: 1px; background: #c9c7bb; }

.orbit-art { position: relative; width: min(100%, 520px); height: 500px; justify-self: end; }
.orbit-caption { position: absolute; right: 6px; left: 6px; display: flex; justify-content: space-between; color: #838579; font-size: 8px; font-weight: 600; letter-spacing: .17em; }
.orbit-caption-top { top: 1px; }
.orbit-caption-bottom { bottom: 0; }
.orbit-halo { position: absolute; top: 51%; left: 51%; border: 1px solid rgba(78, 89, 73, .18); border-radius: 50%; transform: translate(-50%, -50%) rotate(-25deg); }
.orbit-halo-one { width: 420px; height: 188px; }
.orbit-halo-two { width: 330px; height: 440px; transform: translate(-50%, -50%) rotate(39deg); }
.orbit-planet { position: absolute; top: 51%; left: 51%; display: flex; width: 190px; height: 190px; align-items: center; justify-content: center; overflow: hidden; border-radius: 50%; background: #d9dfcf; transform: translate(-50%, -50%); }
.planet-core { position: absolute; width: 134px; height: 134px; border: 1px solid rgba(64, 88, 67, .23); border-radius: 50%; }
.planet-cross { position: absolute; z-index: 1; top: 15px; left: 23px; color: #527563; font-size: 23px; }
.planet-caption { position: relative; z-index: 1; color: #34463b; font-family: 'DM Serif Display', Georgia, serif; font-size: 29px; line-height: .99; letter-spacing: -.04em; }
.orbit-stamp { position: absolute; z-index: 1; right: 36px; bottom: 81px; display: flex; width: 62px; height: 62px; flex-direction: column; align-items: center; justify-content: center; gap: 2px; border-radius: 50%; background: #c75b3e; color: #fffefa; font-size: 6px; font-weight: 700; letter-spacing: .11em; transform: rotate(12deg); box-shadow: 0 8px 20px rgba(139, 65, 46, .2); }
.floating-window { position: absolute; z-index: 2; overflow: hidden; border: 1px solid rgba(40, 43, 37, .14); box-shadow: 0 20px 55px rgba(45, 47, 38, .14); }
.window-primary { top: 78px; left: 44px; width: 306px; transform: rotate(-5deg); background: #fbfaf5; }
.window-bar { height: 34px; display: flex; align-items: center; justify-content: space-between; padding: 0 11px; border-bottom: 1px solid rgba(40, 43, 37, .1); }
.window-brand { display: flex; align-items: center; gap: 7px; color: #42463d; font-size: 9px; font-weight: 700; }
.window-brand i { display: block; width: 8px; height: 8px; border-radius: 50%; background: #bc694a; }
.window-menu { color: #a4a295; font-size: 7px; }
.window-body { position: relative; min-height: 269px; overflow: hidden; padding: 20px 20px 0; background: linear-gradient(137deg, #faf9f3 50%, #e8e9dc 100%); }
.window-kicker { position: relative; z-index: 1; display: block; color: #768075; font-size: 8px; letter-spacing: .1em; }
.window-body strong { position: relative; z-index: 1; display: block; margin-top: 8px; color: #2d3931; font-family: 'DM Serif Display', Georgia, serif; font-size: 35px; font-weight: 400; letter-spacing: -.04em; line-height: .99; }
.window-cta { position: relative; z-index: 1; display: flex; width: 119px; justify-content: space-between; margin-top: 13px; padding: 7px 8px; background: #365342; color: white; font-size: 7px; }
.window-landscape { position: absolute; right: 0; bottom: 0; left: 0; height: 95px; overflow: hidden; background: linear-gradient(167deg, #dbe4da 0 45%, #e7ded0 45% 100%); }
.landscape-sun { position: absolute; top: 11px; right: 43px; width: 34px; height: 34px; border-radius: 50%; background: #d9a174; }
.landscape-hill { position: absolute; right: -20px; bottom: -35px; width: 75%; height: 110px; border-radius: 48% 52% 0 0; background: #879b83; transform: rotate(-12deg); }
.hill-front { right: auto; bottom: -58px; left: -37px; width: 77%; height: 117px; background: #687f6e; transform: rotate(15deg); }
.window-note { right: 1px; bottom: 81px; display: flex; width: 157px; min-height: 84px; flex-direction: column; align-items: flex-start; justify-content: center; padding: 12px 14px; background: #d8ab83; color: #34362e; transform: rotate(5deg); }
.note-mark { position: absolute; top: 10px; right: 12px; color: #8d533c; font-size: 14px; }
.window-note > span:nth-child(2) { font-family: 'DM Serif Display', Georgia, serif; font-size: 17px; line-height: 1.05; }
.note-index { margin-top: 9px; font-size: 7px; letter-spacing: .16em; }
.art-star { position: absolute; color: #bd6849; }
.star-one { top: 50px; right: 80px; font-size: 21px; }
.star-two { right: 20px; bottom: 166px; color: #69836f; font-size: 12px; }

.signal-strip { border-top: 1px solid rgba(40, 43, 37, .12); border-bottom: 1px solid rgba(40, 43, 37, .12); background: #fbfaf6; }
.signal-inner { min-height: 77px; display: flex; align-items: center; justify-content: space-between; gap: 18px; color: #45483f; font-family: 'DM Serif Display', Georgia, serif; font-size: 18px; }
.signal-end { display: flex; align-items: center; gap: 15px; color: #78796f; font-family: 'DM Sans', sans-serif; font-size: 10px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }
.signal-end span { color: #bc533a; font-size: 16px; }
.section.atelier-services { padding: 112px 0 116px; }
.section-heading-row { display: grid; grid-template-columns: 1fr .63fr; align-items: end; gap: 70px; margin-bottom: 45px; }
.atelier-label { color: #b65339; font-size: 9px; }
.atelier-heading { margin-top: 17px; color: #292c26; font-size: clamp(40px, 5.2vw, 65px); font-weight: 500; letter-spacing: -.07em; line-height: 1.05; }
.atelier-heading .serif-italic { color: #b94f36; }
.atelier-section-intro { max-width: 390px; padding-bottom: 6px; color: #696c62; font-size: 14px; line-height: 1.9; }
.capability-list { border-top: 1px solid rgba(40, 43, 37, .2); }
.capability-row { display: grid; grid-template-columns: 34px 43px minmax(245px, 1fr) minmax(170px, .65fr) 25px; align-items: center; gap: 20px; min-height: 110px; border-bottom: 1px solid rgba(40, 43, 37, .16); transition: background .2s ease, padding .2s ease; }
.capability-row:hover { padding-right: 12px; padding-left: 12px; background: #eeede6; }
.cap-number { align-self: start; padding-top: 31px; color: #99998e; font-size: 9px; letter-spacing: .08em; }
.cap-icon { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid rgba(40, 43, 37, .16); border-radius: 50%; color: #53705b; font-size: 14px; transition: background .2s ease,color .2s ease; }
.capability-row:hover .cap-icon { border-color: #c75b3e; background: #c75b3e; color: #fffefa; }
.cap-copy { display: flex; flex-direction: column; gap: 6px; padding: 17px 0; }
.cap-copy strong { color: #30332c; font-size: 15px; font-weight: 600; letter-spacing: -.025em; }
.cap-copy > span { max-width: 450px; color: #72746a; font-size: 11px; line-height: 1.7; }
.cap-tags { color: #707368; font-size: 8px; font-weight: 600; letter-spacing: .105em; }
.cap-tags i { padding: 0 3px; color: #c05a40; font-style: normal; }
.cap-arrow { justify-self: end; color: #aa4c35; font-size: 18px; transition: transform .2s ease; }
.capability-row:hover .cap-arrow { transform: translate(3px,-3px); }

.atelier-manifesto { overflow: hidden; padding: 105px 0 111px; background: #e8e6db; }
.manifesto-layout { position: relative; display: grid; grid-template-columns: .55fr 1fr .4fr; align-items: center; gap: 30px; }
.manifesto-index { align-self: start; padding-top: 11px; color: #77796e; font-size: 8px; font-weight: 600; letter-spacing: .12em; line-height: 1.9; }
.manifesto-layout h2 { margin-top: 18px; color: #292c26; font-size: clamp(37px, 5.2vw, 62px); font-weight: 500; letter-spacing: -.065em; line-height: 1.08; }
.manifesto-layout > div:nth-child(2) > p:not(.atelier-label) { max-width: 515px; margin-top: 20px; color: #696c62; font-size: 13px; line-height: 1.85; }
.manifesto-link { display: inline-flex; align-items: center; gap: 16px; margin-top: 22px; color: #363931; font-size: 11px; font-weight: 600; }
.manifesto-link span { color: #b94f36; font-size: 17px; }
.manifesto-flower { position: relative; display: grid; width: 160px; height: 160px; place-items: center; justify-self: end; border: 1px solid rgba(69, 86, 68, .34); border-radius: 50%; color: #526d57; }
.manifesto-flower::before, .manifesto-flower::after { position: absolute; width: 206px; height: 76px; border: 1px solid rgba(69, 86, 68, .28); border-radius: 50%; content: ''; }
.manifesto-flower::after { transform: rotate(60deg); }
.manifesto-flower > span { position: absolute; top: 24px; right: 29px; font-size: 15px; }
.manifesto-flower small { font-family: 'DM Serif Display', Georgia, serif; font-size: 16px; line-height: 1.04; text-align: center; }

.atelier-contact { padding: 0 0 104px; background: #e8e6db; }
.contact-panel { position: relative; display: flex; min-height: 246px; align-items: center; justify-content: space-between; gap: 35px; overflow: hidden; padding: 42px 55px; background: #303c32; }
.contact-panel .atelier-label { color: #d7ad88; }
.contact-panel h2 { position: relative; z-index: 1; margin-top: 16px; color: #f8f6ee; font-size: clamp(33px, 4.2vw, 50px); font-weight: 500; letter-spacing: -.065em; line-height: 1.08; }
.contact-panel h2 .serif-italic { color: #e2b88f; }
.button-paper { position: relative; z-index: 1; flex: 0 0 auto; background: #f4f1e8; color: #303c32; }
.button-paper:hover { transform: translateY(-2px); background: #e2b88f; }
.contact-spark { position: absolute; right: 250px; bottom: -126px; color: rgba(242, 230, 199, .08); font-size: 360px; line-height: 1; }

.atelier-footer { padding: 46px 0 20px; background: #f7f6f1; }
.footer-main { display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; gap: 30px; padding-bottom: 37px; }
.footer-main > p { color: #76786e; font-size: 12px; line-height: 1.65; }
.footer-hello { justify-self: end; display: flex; flex-direction: column; gap: 5px; color: #76786e; font-size: 10px; }
.footer-hello span { color: #343730; font-size: 14px; font-weight: 600; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 17px; border-top: 1px solid rgba(40, 43, 37, .14); color: #818277; font-size: 9px; }
.footer-bottom nav { display: flex; gap: 22px; }
.footer-bottom a { color: #6d7066; }
.footer-bottom a:hover, .footer-hello:hover span { color: #b94f36; }
.back-to-top { position: static; width: auto; height: auto; transform: none !important; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 9px; opacity: 1; visibility: visible; }
.back-to-top.show { transform: none !important; }

/* The editorial palette continues across the existing content pages. */
.page-hero { min-height: 350px; padding: 48px 0 75px; background: #f0eee6; }
.page-hero .hero-bg { opacity: .16; }
.page-hero .page-hero-content { max-width: 760px; padding: 0; }
.breadcrumb { margin-bottom: 35px; color: #73766c; }
.breadcrumb a:hover { color: #b94f36; }
.section-label { color: #b65339; font-size: 9px; letter-spacing: .14em; }
.section-label::before { background: #c75b3e; }
.hero-title { color: #292c26; font-family: 'DM Sans', sans-serif; font-size: clamp(42px, 6vw, 67px); font-weight: 500; letter-spacing: -.065em; line-height: 1.04; }
.hero-subtitle { max-width: 570px; margin-top: 18px; color: #696c62; font-size: 14px; }
.section { padding: 88px 0; }
.section-alt { background: #eeede6; }
.section-title { color: #292c26; font-size: clamp(34px, 4.7vw, 53px); font-weight: 500; letter-spacing: -.06em; }
.section-subtitle { max-width: 590px; margin: 14px auto 0; color: #696c62; font-size: 14px; }
.glass-card, .testimonial-card, .contact-form-wrap, .faq-item, .portfolio-modal-content { border: 1px solid rgba(40, 43, 37, .13); border-radius: 5px; background: #fbfaf6; box-shadow: 0 8px 30px rgba(35, 37, 31, .035); }
.service-card, .blog-card, .counter-card { color: #292c26; }
.service-card h4, .blog-card h4, .why-point-title, .counter-number, .tech-pill, .tab-btn, .faq-question { color: #30332c; }
.service-card p, .why-point-desc, .blog-excerpt, .testimonial-text { color: #686c61; }
.btn-primary { border-radius: 3px; background: #303c32; box-shadow: none; }
.btn-primary:hover { background: #b94f36; box-shadow: none; }
.btn-glass { border: 1px solid rgba(40, 43, 37, .26); border-radius: 3px; background: transparent; color: #383b34; }
.btn-glass:hover { border-color: #303c32; background: #303c32; color: #fffefa; }
.link-arrow { color: #b65339 !important; }
.tech-tabs, .contact-info-card, .team-card, .value-card, .timeline-item, .industry-card { border-color: rgba(40, 43, 37, .14); background: #fbfaf6; }
.filter-btn { border-color: rgba(40, 43, 37, .2); color: #55594f; }
.filter-btn.active, .filter-btn:hover { border-color: #303c32; background: #303c32; color: #fffefa; }
.form-control { border-color: rgba(40, 43, 37, .2); background: #fffefa; color: #292c26; }
.form-control:focus { border-color: #72856f; box-shadow: 0 0 0 3px rgba(91, 119, 94, .12); }
.faq-answer, .contact-form-wrap p { color: #696c62; }
.cta-banner { border-radius: 6px; background: #303c32; }
.cta-banner .section-title { color: #fbfaf6; }
.cta-banner .section-subtitle { color: #d8d8cb; }
.cta-banner .section-label { color: #d8ae89; }
.cta-banner .section-label::before { background: #d8ae89; }
.contact-note { align-self: stretch; display: flex; flex-direction: column; justify-content: center; padding: 38px; border: 1px solid rgba(40, 43, 37, .14); background: #eeede6; }
.contact-note h2 { margin-top: 16px; color: #292c26; font-size: clamp(35px, 4vw, 48px); font-weight: 500; letter-spacing: -.065em; line-height: 1.05; }
.contact-note > p { margin: 17px 0 14px; color: #696c62; font-size: 12px; line-height: 1.85; }
.contact-note-item { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-top: 1px solid rgba(40, 43, 37, .13); }
.contact-note-item > span { color: #b65339; font-size: 9px; }
.contact-note-item p { color: #4c5047; font-size: 11px; }
.contact-info[hidden] { display: none !important; }

@media (min-width: 1025px) {
  .nav-menu { display: flex; }
  .nav-hamburger { display: none; }
}
@media (max-width: 1024px) {
  .container { width: min(100% - 52px, 860px); }
  .nav-menu, .nav-cta { display: none; }
  .nav-hamburger { display: flex; }
  .nav-drawer { position: fixed; z-index: 1002; inset: var(--nav-h) 0 auto; display: block; padding: 25px 28px 33px; border-bottom: 1px solid var(--border); background: #f7f6f1; transform: translateY(-115%); transition: transform .3s ease; visibility: hidden; }
  .nav-drawer.open { transform: translateY(0); visibility: visible; }
  .drawer-menu { display: flex; flex-direction: column; gap: 0; }
  .drawer-menu .nav-link { display: flex; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid var(--border); color: #30332c; font-size: 17px; }
  .drawer-menu .nav-link span { color: #b65339; font-size: 10px; }
  .drawer-contact { margin-top: 22px; color: #b65339; font-size: 13px; font-weight: 600; }
  .nav-overlay.show { position: fixed; z-index: 1001; inset: var(--nav-h) 0 0; display: block; background: rgba(38, 41, 34, .23); }
  .atelier-hero, .atelier-hero-layout { min-height: 640px; }
  .atelier-hero-layout { grid-template-columns: 1fr .85fr; gap: 5px; }
  .atelier-hero h1 { font-size: clamp(52px, 7.3vw, 75px); }
  .orbit-art { height: 430px; transform: scale(.88); transform-origin: center right; }
  .orbit-halo-one { width: 360px; }
  .orbit-halo-two { height: 365px; }
  .window-primary { left: 25px; transform: scale(.88) rotate(-5deg); transform-origin: left center; }
  .window-note { right: 0; }
  .capability-row { grid-template-columns: 25px 40px minmax(205px, 1fr) 22px; gap: 15px; }
  .cap-tags { display: none; }
  .manifesto-layout { grid-template-columns: .36fr 1fr .35fr; }
}
@media (max-width: 700px) {
  .container { width: calc(100% - 40px); }
  :root { --nav-h: 68px; }
  .atelier-hero, .atelier-hero-layout { min-height: auto; }
  .atelier-hero-layout { grid-template-columns: 1fr; gap: 0; padding-top: 67px; padding-bottom: 0; }
  .eyebrow { flex-wrap: wrap; font-size: 8px; gap: 8px; }
  .atelier-hero h1 { margin-top: 25px; font-size: clamp(50px, 12vw, 72px); }
  .atelier-intro { max-width: 440px; margin-top: 19px; font-size: 13px; }
  .atelier-actions { align-items: flex-start; gap: 17px; margin-top: 24px; }
  .button-ink { min-height: 48px; gap: 16px; padding: 0 13px; font-size: 11px; }
  .text-link { font-size: 11px; }
  .hero-footnote { margin-top: 35px; }
  .orbit-art { width: min(100%, 420px); height: 350px; justify-self: center; margin: 3px auto 17px; transform: scale(.88); transform-origin: top center; }
  .orbit-halo-one { width: 340px; height: 155px; }
  .orbit-halo-two { width: 275px; height: 365px; }
  .orbit-planet { width: 156px; height: 156px; }
  .planet-core { width: 112px; height: 112px; }
  .planet-caption { font-size: 25px; }
  .window-primary { top: 59px; left: 12px; transform: scale(.78) rotate(-5deg); transform-origin: top left; }
  .window-note { right: 0; bottom: 58px; transform: scale(.83) rotate(5deg); transform-origin: bottom right; }
  .orbit-stamp { right: 12px; bottom: 58px; }
  .orbit-caption-bottom { bottom: 6px; }
  .signal-inner { min-height: 74px; flex-wrap: wrap; justify-content: flex-start; gap: 4px 22px; padding-top: 12px; padding-bottom: 12px; }
  .signal-inner > span { font-size: 15px; }
  .signal-end { width: 100%; font-size: 8px !important; }
  .section.atelier-services { padding: 73px 0 78px; }
  .section-heading-row { grid-template-columns: 1fr; gap: 16px; margin-bottom: 25px; }
  .atelier-heading { font-size: 46px; }
  .atelier-section-intro { font-size: 12px; }
  .capability-row { grid-template-columns: 24px 37px minmax(0, 1fr) 18px; gap: 10px; min-height: 104px; }
  .cap-icon { width: 35px; height: 35px; font-size: 12px; }
  .cap-number { font-size: 8px; }
  .cap-copy strong { font-size: 12px; }
  .cap-copy > span { font-size: 10px; }
  .atelier-manifesto { padding: 73px 0 80px; }
  .manifesto-layout { grid-template-columns: 1fr 105px; gap: 16px; }
  .manifesto-index { grid-column: 1 / -1; padding: 0; }
  .manifesto-layout h2 { font-size: clamp(35px, 9vw, 51px); }
  .manifesto-layout > div:nth-child(2) > p:not(.atelier-label) { font-size: 11px; }
  .manifesto-flower { width: 90px; height: 90px; align-self: center; }
  .manifesto-flower::before, .manifesto-flower::after { width: 118px; height: 43px; }
  .manifesto-flower small { font-size: 10px; }
  .manifesto-flower > span { top: 9px; right: 15px; font-size: 9px; }
  .atelier-contact { padding-bottom: 70px; }
  .contact-panel { min-height: 260px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 22px; padding: 30px 24px; }
  .contact-note { padding: 27px 23px; }
  .contact-panel h2 { font-size: 38px; }
  .contact-spark { right: -24px; bottom: -100px; font-size: 240px; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 18px; }
  .footer-main > p { justify-self: end; text-align: right; font-size: 10px; }
  .footer-hello { grid-column: 1 / -1; justify-self: start; }
  .footer-bottom { flex-wrap: wrap; justify-content: center; text-align: center; }
  .footer-bottom > span { width: 100%; }
  .footer-bottom nav { flex-wrap: wrap; justify-content: center; gap: 13px; }
  .page-hero { min-height: 0; padding: 30px 0 56px; }
  .breadcrumb { margin-bottom: 25px; }
  .section { padding: 68px 0; }
  .home-industries, .home-process { padding: 70px 0; }
  .home-industry-grid a { min-height: 90px; grid-template-columns: 20px 1fr 15px; gap: 7px; padding: 11px 8px; }
  .home-industry-grid strong { font-size: 11px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 380px) {
  .atelier-hero h1 { font-size: 47px; }
  .orbit-art { width: 360px; margin-left: 50%; transform: translateX(-50%) scale(.78); transform-origin: top center; margin-bottom: -53px; }
  .atelier-actions { flex-direction: column; }
  .capability-row { grid-template-columns: 20px 33px minmax(0, 1fr) 15px; gap: 8px; }
  .cap-copy strong { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Kratvya navigation: readable sticky state and focused, working mega menus. */
html[data-theme] .navbar.scrolled { background: rgba(247, 246, 241, .98); border-bottom-color: rgba(40, 43, 37, .14); box-shadow: 0 5px 24px rgba(40, 43, 37, .08); }
html[data-theme] .navbar.scrolled .brand-name,
html[data-theme] .navbar.scrolled .nav-link,
html[data-theme] .navbar.scrolled .nav-text-trigger { color: #282b25; }
html[data-theme] .navbar.scrolled .nav-cta { border-color: #30332b; color: #30332b; }
/* Keep the header's geometry fixed while its surface changes on scroll. */
.navbar, .navbar.scrolled { height: var(--nav-h); transition: background-color .18s ease, box-shadow .18s ease, border-color .18s ease; }
.navbar.scrolled { backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.nav-menu { gap: clamp(15px, 2vw, 30px); }
.mega-menu-services { width: min(790px, calc(100vw - 48px)) !important; }
.mega-menu-industries { width: min(920px, calc(100vw - 48px)) !important; }
.nav-menu-trigger { width: 29px; height: 29px; border: 1px solid rgba(40, 43, 37, .14); border-radius: 50%; background: rgba(255, 254, 250, .65); color: #596054; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.nav-menu-trigger:hover, .nav-has-menu.is-open > .nav-menu-trigger { border-color: #ba5b3f; background: #ba5b3f; color: #fffefa; }
.nav-text-trigger { width: auto; height: auto; padding: 9px 0; border: 0; border-radius: 0; background: transparent; }
.nav-has-menu.active > .nav-link, .nav-has-menu.active > .nav-text-trigger { color: #b94f36; }
.nav-has-menu .nav-mega { padding-top: 27px; border-color: rgba(40, 43, 37, .10); border-radius: 8px; box-shadow: 0 28px 80px rgba(35, 37, 31, .20), 0 4px 14px rgba(35, 37, 31, .07); }
.nav-mega .mega-intro { position: relative; overflow: hidden; border-right: 0; border-radius: 5px; padding: 19px 19px 21px; background: #eeede6; }
.nav-mega .mega-intro::after { position: absolute; right: -41px; bottom: -50px; width: 135px; height: 135px; border: 1px solid rgba(80, 111, 85, .22); border-radius: 50%; box-shadow: 0 0 0 16px rgba(80, 111, 85, .04), 0 0 0 34px rgba(80, 111, 85, .035); content: ''; pointer-events: none; }
.nav-mega .mega-intro h2 { font-size: 27px; }
.nav-mega .mega-intro p { position: relative; z-index: 1; }
.service-mega-grid { display: grid; grid-template-columns: 1fr 1fr; align-content: center; gap: 8px; }
.service-mega-grid a { position: relative; display: grid; min-height: 72px; grid-template-columns: 36px 1fr 12px; align-items: center; gap: 10px; padding: 10px; border: 1px solid rgba(40, 43, 37, .09); border-radius: 5px; background: #fffefa; transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.service-mega-grid a:hover, .service-mega-grid a:focus-visible { transform: translateY(-2px); border-color: rgba(185, 79, 54, .35); background: #fff; box-shadow: 0 8px 20px rgba(40, 43, 37, .07); }
.service-mega-grid a > i { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: #f0eee6; color: #54705d; font-size: 12px; }
.service-mega-grid a > span { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.service-mega-grid strong { color: #30332c; font-size: 10px; font-weight: 600; }
.service-mega-grid small { color: #77796f; font-size: 9px; line-height: 1.45; }
.service-mega-grid b { color: #b94f36; font-size: 13px; font-weight: 400; opacity: 0; transition: opacity .18s ease; }
.service-mega-grid a:hover b, .service-mega-grid a:focus-visible b { opacity: 1; }
.nav-mega .mega-footer { min-height: 46px; margin-top: 1px; }
.mega-menu-company { min-width: min(700px, calc(100vw - 48px)); }
.career-role-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.career-role-card { display: flex; min-height: 316px; flex-direction: column; padding: 22px; border: 1px solid rgba(40, 43, 37, .14); background: #fffefa; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.career-role-card:hover { transform: translateY(-4px); border-color: rgba(185, 79, 54, .38); box-shadow: 0 16px 34px rgba(40, 43, 37, .09); }
.career-role-top { display: flex; justify-content: space-between; align-items: center; }
.career-role-type { color: #a9573d; font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.career-role-index { color: #9b9c91; font-size: 9px; }
.career-role-card h3 { margin-top: 24px; color: #30332c; font-size: 21px; font-weight: 600; letter-spacing: -.045em; }
.career-role-card > p { margin-top: 10px; color: #6c7065; font-size: 11px; line-height: 1.8; }
.career-role-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: auto; padding: 19px 0 14px; color: #686c61; font-size: 9px; }
.career-role-meta span { display: inline-flex; align-items: center; gap: 6px; }
.career-role-meta i { color: #b65339; }
.career-apply-button { display: flex; width: 100%; justify-content: space-between; align-items: center; padding: 12px 0 0; border-top: 1px solid rgba(40, 43, 37, .14); color: #303c32; font-size: 11px; font-weight: 600; text-align: left; }
.career-apply-button span { color: #b94f36; font-size: 15px; }
.career-note { margin-top: 24px; color: #686c61; font-size: 12px; }
.career-note a { color: #a74d34; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.careers-hero { background: #eeede6; }
.careers-hero-link { display: inline-flex; align-items: center; gap: 12px; margin-top: 24px; color: #3d5143; font-size: 12px; font-weight: 600; }
.application-dialog { position: fixed; top: 50%; left: 50%; width: min(690px, calc(100% - 28px)); max-height: min(90dvh, 900px); margin: 0; padding: 0; overflow: auto; border: 1px solid rgba(40, 43, 37, .14); background: #f8f7f1; color: #282b25; box-shadow: 0 28px 100px rgba(20, 24, 20, .30); transform: translate(-50%, -50%); }
.application-dialog::backdrop { background: rgba(27, 31, 26, .62); backdrop-filter: blur(5px); }
.application-dialog-shell { position: relative; padding: clamp(24px, 5vw, 44px); }
.application-close { position: sticky; z-index: 1; top: 0; float: right; display: grid; width: 38px; height: 38px; place-items: center; margin: -12px -12px 0 12px; border: 1px solid rgba(40, 43, 37, .16); border-radius: 50%; background: #fffefa; color: #30332c; font-size: 23px; line-height: 1; }
.application-heading { padding-right: 25px; }
.application-heading h2, .application-success h2 { margin-top: 12px; color: #30332c; font-size: clamp(31px, 5vw, 46px); font-weight: 500; letter-spacing: -.065em; line-height: 1.08; }
.application-heading > p, .application-success > p { margin-top: 10px; color: #696c62; font-size: 12px; line-height: 1.7; }
.application-form { display: flex; flex-direction: column; gap: 13px; margin-top: 23px; }
.application-form .form-row { gap: 14px; }
.application-form .form-group { gap: 6px; }
.application-form .form-label { font-size: 10px; }
.application-form .form-control { min-height: 43px; font-size: 12px; }
.application-form textarea.form-control { min-height: 95px; }
.resume-upload-input.form-control { min-height: 58px; padding: 9px; border: 1px dashed rgba(40, 43, 37, .28); background: #fffefa; }
.resume-upload-input::file-selector-button { margin-right: 12px; padding: 8px 12px; border: 0; background: #303c32; color: #fffefa; cursor: pointer; }
.resume-upload-help { color: #72766b; font-size: 9px; }
.application-privacy { color: #72766b; font-size: 10px; line-height: 1.6; }
.application-validation, .application-form .field-validation-error { color: #a33d32; font-size: 10px; }
.application-validation:empty { display: none; }
.application-submit { min-height: 47px; }
.application-success { padding: 35px 0 20px; }
.application-success-mark { display: grid; width: 48px; height: 48px; place-items: center; margin-bottom: 24px; border-radius: 50%; background: #dfe8dc; color: #45624c; }
.application-success > p { max-width: 480px; margin-bottom: 22px; }
.application-success > p strong { color: #30332c; }
.nav-menu > .nav-item.nav-has-menu { position: static; display: flex; height: 100%; align-items: center; gap: 5px; }
.nav-has-menu > .nav-link, .nav-text-trigger { padding: 10px 0; color: #55594f; font-size: 12px; font-weight: 500; }
.nav-text-trigger { display: inline-flex; align-items: center; gap: 7px; }
.nav-text-trigger svg, .nav-menu-trigger svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.6; transition: transform .2s ease; }
.nav-has-menu.is-open .nav-menu-trigger svg, .nav-has-menu:hover .nav-menu-trigger svg { transform: rotate(180deg); }
.nav-has-menu .nav-mega { position: absolute; top: calc(100% + 1px); left: 50%; display: grid; width: min(920px, calc(100vw - 48px)); max-width: none; grid-template-columns: 230px 1fr; gap: 28px; padding: 30px 32px 0; overflow: hidden; border: 1px solid rgba(40, 43, 37, .13); border-radius: 4px; background: #fbfaf6; box-shadow: 0 24px 65px rgba(35, 37, 31, .16); opacity: 0; visibility: hidden; transform: translate(-50%, 9px); transition: opacity .2s ease, visibility .2s ease, transform .2s ease; z-index: 1010; }
.nav-has-menu:hover > .nav-mega, .nav-has-menu:focus-within > .nav-mega, .nav-has-menu.is-open > .nav-mega { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.nav-mega .mega-intro { padding: 2px 22px 22px 0; border-right: 1px solid rgba(40, 43, 37, .13); }
.mega-link-grid { display: grid; grid-template-columns: 1fr 1fr; align-content: start; gap: 2px 18px; }
.mega-link-grid a { display: flex; min-height: 38px; align-items: center; justify-content: space-between; padding: 0 10px; color: #3c4037; font-size: 11px; transition: background .18s ease, color .18s ease; }
.mega-link-grid a:hover { background: #f0eee6; color: #a74d34; }
.mega-link-grid a span { color: #b65339; opacity: 0; }
.mega-link-grid a:hover span, .mega-link-grid a:focus-visible span { opacity: 1; }
.nav-mega .mega-footer { grid-column: 1 / -1; margin: 0 -32px; padding: 0 32px; }
.mega-menu-company { width: min(700px, calc(100vw - 48px)) !important; grid-template-columns: 215px 1fr !important; }
.careers-layout { display: grid; grid-template-columns: 1fr .78fr; align-items: center; gap: 10%; }
.careers-layout .atelier-heading { margin-bottom: 20px; }
.careers-intro { max-width: 560px; margin-bottom: 25px; color: #696c62; font-size: 14px; line-height: 1.9; }
.careers-note { position: relative; overflow: hidden; padding: 35px; border: 1px solid rgba(40, 43, 37, .14); background: #eeede6; }
.careers-note-mark { position: absolute; top: -50px; right: 5px; color: rgba(79, 112, 88, .10); font-family: 'DM Serif Display', Georgia, serif; font-size: 210px; line-height: 1; }
.careers-note .atelier-label, .careers-value { position: relative; z-index: 1; }
.careers-value { display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 20px 0; border-bottom: 1px solid rgba(40, 43, 37, .13); }
.careers-value:first-of-type { margin-top: 10px; }
.careers-value > span { color: #b65339; font-size: 9px; }
.careers-value p { color: #42463d; font-size: 12px; }
.home-industries { padding: 100px 0 95px; background: #eeede6; }
.home-industries .section-heading-row, .home-process .section-heading-row { margin-bottom: 34px; }
.home-industry-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(40, 43, 37, .2); border-bottom: 1px solid rgba(40, 43, 37, .2); }
.home-industry-grid a { display: grid; min-height: 116px; grid-template-columns: 28px 1fr 18px; align-items: center; gap: 12px; padding: 18px; border-right: 1px solid rgba(40, 43, 37, .15); color: #30332c; transition: background .2s ease; }
.home-industry-grid a:first-child { border-left: 1px solid rgba(40, 43, 37, .15); }
.home-industry-grid a:hover { background: #f8f7f1; }
.home-industry-grid a > span { align-self: start; padding-top: 4px; color: #a35b43; font-size: 9px; }
.home-industry-grid strong { font-size: 13px; font-weight: 600; }
.home-industry-grid b { justify-self: end; color: #b94f36; font-weight: 400; }
.home-industries-link { display: inline-flex; align-items: center; gap: 13px; margin-top: 22px; color: #393d34; font-size: 11px; font-weight: 600; }
.home-industries-link span { color: #b94f36; font-size: 16px; }
.home-process { padding: 100px 0; }
.home-process-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(40, 43, 37, .18); }
.home-process-grid article { padding: 25px 28px 15px 0; }
.home-process-grid article + article { padding-left: 28px; border-left: 1px solid rgba(40, 43, 37, .14); }
.home-process-grid article > span { color: #a9573d; font-size: 9px; font-weight: 600; letter-spacing: .12em; }
.home-process-grid h3 { margin-top: 18px; color: #30332c; font-size: 17px; font-weight: 600; letter-spacing: -.035em; }
.home-process-grid p { max-width: 320px; margin-top: 10px; color: #696c62; font-size: 12px; line-height: 1.8; }
.company-menu-links { display: flex; flex-direction: column; }
.company-menu-links a { position: relative; display: grid; grid-template-columns: 28px 1fr 15px; align-items: center; gap: 2px 10px; padding: 13px 9px; border-bottom: 1px solid rgba(40, 43, 37, .11); }
.company-menu-links a:hover { background: #f0eee6; }
.company-menu-links a > span { grid-row: 1 / 3; color: #ae6045; font-size: 9px; }
.company-menu-links strong { color: #30332c; font-size: 12px; font-weight: 600; }
.company-menu-links small { color: #77796f; font-size: 9px; }
.company-menu-links b { grid-column: 3; grid-row: 1 / 3; color: #b94f36; font-size: 13px; font-weight: 400; opacity: 0; }
.company-menu-links a:hover b, .company-menu-links a:focus-visible b { opacity: 1; }
.drawer-group { border-bottom: 1px solid var(--border); }
.drawer-group:has(.drawer-inline-toggle) { display: grid; grid-template-columns: 1fr 48px; align-items: center; }
.drawer-group:has(.drawer-inline-toggle) > .drawer-submenu { grid-column: 1 / -1; }
.drawer-group .drawer-inline-toggle { width: 48px; height: 48px; padding: 0; text-align: center; }
.drawer-group-toggle { display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 13px 0; color: #30332c; font-size: 17px; text-align: left; }
.drawer-group-toggle > span { color: #b65339; font-size: 20px; transition: transform .2s ease; }
.drawer-group-toggle[aria-expanded="true"] > span { transform: rotate(45deg); }
.drawer-submenu { display: none; grid-template-columns: 1fr 1fr; gap: 0 14px; padding: 0 0 13px 12px; }
.drawer-submenu.open { display: grid; }
.drawer-submenu a { padding: 9px 0; color: #62665c; font-size: 12px; }
.drawer-submenu a:hover { color: #b94f36; }
@media (max-width: 1024px) {
  .nav-has-menu .nav-mega { display: none; }
  .nav-drawer { max-height: calc(100dvh - var(--nav-h)); overflow-y: auto; }
  .careers-layout { grid-template-columns: 1fr; gap: 34px; }
  .career-role-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-industry-grid { grid-template-columns: repeat(2, 1fr); }
  .home-industry-grid a:nth-child(3) { border-left: 1px solid rgba(40, 43, 37, .15); }
  .home-process-grid { grid-template-columns: 1fr; }
  .home-process-grid article, .home-process-grid article + article { padding: 22px 0; border-left: 0; border-bottom: 1px solid rgba(40, 43, 37, .14); }
}
@media (max-width: 380px) { .drawer-submenu { grid-template-columns: 1fr; } }
@media (max-width: 700px) {
  .career-role-list { grid-template-columns: 1fr; }
  .career-role-card { min-height: 285px; padding: 20px; }
  .application-dialog { max-height: 94dvh; }
  .application-dialog-shell { padding: 24px 20px; }
  .application-form .form-row { grid-template-columns: 1fr; gap: 12px; }
  .service-mega-grid { grid-template-columns: 1fr; }
}

/* Keep native scrolling while hiding scrollbar chrome across the whole site. */
html, body, * { scrollbar-width: none; -ms-overflow-style: none; }
*::-webkit-scrollbar, *::-webkit-scrollbar-track, *::-webkit-scrollbar-thumb { display: none; width: 0; height: 0; background: transparent; }

/* =========================================================
   EDITORIAL SERVICE PAGES — journal, work, services, industries
   ========================================================= */
.editorial-hero{position:relative;isolation:isolate;overflow:hidden;min-height:610px;padding:calc(var(--nav-h) + 52px) 0 27px;background:#202923;color:#f4f1e8}
.editorial-hero::before{position:absolute;z-index:-1;inset:0;content:"";opacity:.3;background-image:linear-gradient(rgba(244,241,232,.085) 1px,transparent 1px),linear-gradient(90deg,rgba(244,241,232,.085) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(90deg,#000 0%,transparent 95%)}
.editorial-hero::after{position:absolute;z-index:-1;content:"";width:520px;height:520px;right:8%;top:7%;border-radius:50%;background:radial-gradient(circle,rgba(184,91,60,.2),transparent 68%);filter:blur(8px)}
.editorial-hero-inner{position:relative;display:grid;min-height:510px;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);align-items:center;gap:40px;padding-bottom:55px}
.editorial-hero-copy{position:relative;z-index:2;max-width:680px}
.editorial-hero .breadcrumb{margin-bottom:36px;color:rgba(244,241,232,.54)}
.editorial-hero .breadcrumb a{color:rgba(244,241,232,.6)}
.editorial-hero .breadcrumb span:last-child{color:#e6a184}
.editorial-kicker,.editorial-overline{display:inline-flex;align-items:center;gap:9px;color:#ba644a;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.editorial-kicker{color:#dfaa8c}
.editorial-kicker i{width:7px;height:7px;border-radius:50%;background:#e0a084;box-shadow:0 0 0 4px rgba(224,160,132,.13)}
.editorial-hero h1{max-width:760px;margin:27px 0 21px;color:#faf8f1;font-size:clamp(54px,7vw,94px);font-weight:500;letter-spacing:-.078em;line-height:.93}
.editorial-hero h1 em,.editorial-bottom-cta h2 em{color:#d88b6e;font-family:"DM Serif Display",Georgia,serif;font-weight:400;letter-spacing:-.055em}
.editorial-hero-copy>p{max-width:480px;margin:0;color:rgba(244,241,232,.68);font-size:15px;line-height:1.85}
.editorial-text-link,.editorial-light-link{display:inline-flex;align-items:center;gap:16px;margin-top:28px;padding-bottom:8px;border-bottom:1px solid rgba(226,165,137,.5);color:#f4c3a5;font-size:13px;font-weight:650;text-decoration:none;transition:gap .2s ease,color .2s ease}
.editorial-text-link:hover,.editorial-light-link:hover{gap:23px;color:#fff}
.editorial-hero-foot{position:absolute;right:0;bottom:0;left:0;display:flex;justify-content:space-between;gap:15px;padding-top:14px;border-top:1px solid rgba(244,241,232,.22);color:rgba(244,241,232,.52);font-size:9px;font-weight:700;letter-spacing:.16em}
.editorial-section{padding:98px 0 110px;background:#f5f3ec;color:#292c26}
.editorial-section-head{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:35px}
.editorial-section-head h2{margin:12px 0 0;color:#292c26;font-size:clamp(37px,5vw,61px);font-weight:500;letter-spacing:-.07em;line-height:1.03}
.editorial-section-head>p{max-width:390px;margin:0 0 4px;color:#686c61;font-size:13px;line-height:1.85}
.editorial-filter-bar{display:flex;align-items:center;gap:0;min-height:58px;margin:35px 0 43px;padding:6px 7px 6px 18px;border:1px solid rgba(41,44,38,.14);border-radius:10px;background:#fbfaf6;box-shadow:0 9px 24px rgba(41,44,38,.035)}
.editorial-search{display:flex;flex:1;align-items:center;gap:12px;min-width:180px;color:#9a9b91}
.editorial-search>span:first-child{font-size:25px;line-height:1}
.editorial-search input,.editorial-select select{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#30332c;font:inherit;font-size:13px}
.editorial-search input::placeholder{color:#9b9c92}
.editorial-select{position:relative;display:flex;align-items:center;gap:10px;width:210px;padding:0 18px;border-left:1px solid rgba(41,44,38,.12);color:#686c61}
.editorial-select select{appearance:none;cursor:pointer}
.editorial-select>span:last-child{position:absolute;right:17px;pointer-events:none}
.editorial-filter-submit{align-self:stretch;display:flex;align-items:center;gap:18px;padding:0 20px;border:0;border-radius:7px;background:#303c32;color:#fffdf6;font:600 12px "DM Sans",sans-serif;cursor:pointer;transition:background .2s ease}
.editorial-filter-submit:hover{background:#b65339}
.editorial-clear{margin-left:12px;color:#8d4a38;font-size:11px;text-decoration:none}
.editorial-empty{padding:64px 26px;border:1px solid rgba(41,44,38,.14);background:#fbfaf6;text-align:center}
.editorial-empty h3{margin:12px 0;color:#292c26;font-family:"DM Serif Display",Georgia,serif;font-size:clamp(27px,4vw,42px);font-weight:400;letter-spacing:-.035em}
.editorial-empty p{max-width:480px;margin:0 auto;color:#686c61;line-height:1.8}
.journal-feature{display:grid;grid-template-columns:1.08fr .92fr;min-height:370px;margin-bottom:62px;background:#e9e7dd}
.journal-feature-art{position:relative;display:block;min-height:350px;overflow:hidden;background:#33443b;color:#f4f1e8;text-decoration:none}
.journal-feature-art>img,.journal-card-art>img,.work-project-art>img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.journal-feature-art:hover>img,.journal-card-art:hover>img,.work-project-art:hover>img{transform:scale(1.035)}
.journal-art-fallback{position:absolute;inset:0;overflow:hidden;padding:28px;background:linear-gradient(140deg,#44584a,#26372f 65%,#b4593d);}
.journal-art-fallback::before,.journal-art-fallback::after{position:absolute;content:"";border:1px solid rgba(249,239,214,.29);border-radius:50%}
.journal-art-fallback::before{width:370px;height:370px;right:-85px;top:36px}.journal-art-fallback::after{width:280px;height:280px;right:-40px;top:80px}
.journal-art-label,.journal-art-number,.journal-art-caption{position:absolute;color:rgba(249,239,214,.68);font-size:9px;font-weight:700;letter-spacing:.16em}
.journal-art-label{top:29px;left:28px}.journal-art-number{right:29px;bottom:25px}.journal-art-caption{bottom:30px;left:28px;font-size:11px;line-height:1.8}
.journal-art-glyph{position:absolute;top:50%;left:50%;transform:translate(-50%,-53%);color:#f3e7c8;font-family:"DM Serif Display",Georgia,serif;font-size:clamp(110px,18vw,220px);font-weight:400;line-height:.7}
.journal-art-glyph span{color:#e2a085}
.journal-feature-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:clamp(28px,5vw,62px)}
.editorial-meta{display:flex;align-items:center;gap:13px;margin-bottom:18px;color:#77786e;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.editorial-meta span+span{padding-left:13px;border-left:1px solid rgba(41,44,38,.22);font-weight:500;letter-spacing:.02em;text-transform:none}
.journal-feature-copy>.editorial-overline{margin-bottom:10px;font-size:9px}
.journal-feature-copy h2{margin:0 0 14px;color:#292c26;font-size:clamp(27px,3.4vw,43px);font-weight:500;letter-spacing:-.06em;line-height:1.08}
.journal-feature-copy h2 a,.journal-card h3 a,.work-project-copy h3 a{color:inherit;text-decoration:none}
.journal-feature-copy h2 a:hover,.journal-card h3 a:hover,.work-project-copy h3 a:hover{color:#a94e37}
.journal-feature-copy>p,.journal-card>p,.work-project-copy>p{margin:0;color:#686c61;font-size:13px;line-height:1.8}
.journal-byline{display:flex;align-items:center;gap:10px;width:100%;margin-top:28px;padding-top:18px;border-top:1px solid rgba(41,44,38,.15);color:#77786e;font-size:11px}
.journal-byline strong{color:#30332c}
.byline-mark{display:grid;width:30px;height:30px;place-items:center;border-radius:50%;background:#303c32;color:#f5f3ec;font-family:Georgia,serif;font-size:17px}
.editorial-round-link{display:grid;width:35px;height:35px;place-items:center;margin-left:auto;border:1px solid rgba(41,44,38,.2);border-radius:50%;color:#303c32;text-decoration:none;transition:background .2s,color .2s}
.editorial-round-link:hover{background:#303c32;color:#fff}
.journal-list-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid rgba(41,44,38,.18);color:#77786e;font-size:11px}
.journal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.journal-card{display:flex;flex-direction:column;min-width:0;padding-bottom:19px;border-bottom:1px solid rgba(41,44,38,.2)}
.journal-card-art{position:relative;display:grid;aspect-ratio:1.47;place-items:center;margin-bottom:18px;overflow:hidden;background:#d9ded2;color:#303c32;text-decoration:none}
.journal-card-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#d6dacf,#eee9db)}
.journal-card:nth-child(3n+2) .journal-card-fallback{background:linear-gradient(145deg,#e6d6cb,#cfaa95)}
.journal-card:nth-child(3n) .journal-card-fallback{background:linear-gradient(145deg,#d1dcdb,#a8b9b1)}
.journal-card-fallback span{position:absolute;top:17px;left:18px;color:#687064;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.journal-card-fallback b{color:#3b4a3c;font-family:"DM Serif Display",Georgia,serif;font-size:105px;font-weight:400;line-height:.8}
.journal-card .editorial-meta{margin-bottom:10px;font-size:9px}
.journal-card h3{margin:0 0 10px;color:#292c26;font-size:21px;font-weight:550;letter-spacing:-.04em;line-height:1.2}
.journal-card>p{margin-bottom:16px;font-size:12px}
.editorial-card-link{display:inline-flex;align-items:center;gap:12px;margin-top:auto;color:#a64c36;font-size:11px;font-weight:750;text-decoration:none}
.editorial-card-link:hover{gap:18px}
.editorial-bottom-cta{position:relative;isolation:isolate;overflow:hidden;padding:88px 0 96px;background:#303c32;color:#f4f1e8}
.editorial-bottom-cta::before{position:absolute;z-index:-1;inset:0;content:"";opacity:.12;background-image:linear-gradient(rgba(244,241,232,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(244,241,232,.3) 1px,transparent 1px);background-size:50px 50px}
.editorial-bottom-cta .container{position:relative;z-index:1}
.editorial-bottom-cta .editorial-overline{color:#e0a084}
.editorial-bottom-cta h2{margin:19px 0 5px;color:#f4f1e8;font-size:clamp(42px,6vw,76px);font-weight:500;letter-spacing:-.075em;line-height:.99}
.editorial-light-link{margin-top:27px}
.cta-watermark{position:absolute;right:7%;bottom:-.42em;color:rgba(247,238,217,.055);font-family:"DM Serif Display",Georgia,serif;font-size:clamp(230px,36vw,510px);line-height:.8;pointer-events:none}
.editorial-hero-work{background:#e8e6db;color:#292c26}
.editorial-hero-work::before{opacity:.24;background-image:linear-gradient(rgba(40,43,37,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(40,43,37,.13) 1px,transparent 1px);mask-image:linear-gradient(90deg,transparent,#000)}
.editorial-hero-work::after{right:10%;background:radial-gradient(circle,rgba(181,84,58,.16),transparent 68%)}
.editorial-hero-work .editorial-hero-inner{grid-template-columns:minmax(0,1fr) minmax(350px,.92fr)}
.editorial-hero-work .breadcrumb,.editorial-hero-work .breadcrumb a{color:#74776b}
.editorial-hero-work .breadcrumb span:last-child{color:#a64e37}
.editorial-hero-work h1{color:#292c26}
.editorial-hero-work .editorial-hero-copy>p{color:#686c61}
.editorial-hero-work .editorial-kicker{color:#9c4d37}
.editorial-hero-work .editorial-kicker i{background:#ad593d;box-shadow:0 0 0 4px rgba(173,89,61,.12)}
.editorial-hero-work .editorial-text-link{color:#934531;border-color:rgba(147,69,49,.35)}
.editorial-hero-work .editorial-hero-foot{border-color:rgba(41,44,38,.25);color:#73756c}
.work-hero-art{position:relative;display:grid;min-height:390px;place-items:center}
.work-art-window{position:relative;width:min(100%,430px);height:300px;padding:0 23px 18px;border:1px solid rgba(46,57,45,.24);border-radius:10px;background:#f5f3ec;box-shadow:0 30px 80px rgba(45,48,39,.12);transform:rotate(-5deg)}
.work-art-top{display:flex;align-items:center;gap:6px;height:38px;border-bottom:1px solid rgba(41,44,38,.14)}
.work-art-top i{width:6px;height:6px;border-radius:50%;background:#bd745b}.work-art-top i:nth-child(2){background:#d9b580}.work-art-top i:nth-child(3){background:#7b8d71}
.work-art-top span{margin-left:auto;color:#85877c;font-size:8px;font-weight:700;letter-spacing:.15em}
.work-art-canvas{position:relative;display:flex;height:207px;align-items:center;justify-content:space-around;margin-top:14px;background:#e8e6db;color:#303c32}
.work-art-canvas>span{position:relative;z-index:1;display:grid;width:81px;height:81px;place-items:center;border-radius:50%;background:#f6f4ec;font-size:9px;font-weight:750;letter-spacing:.12em}
.work-art-canvas>b{position:relative;z-index:1;color:#a95239;font-size:26px;font-weight:400}
.work-art-line{position:absolute;right:15%;left:15%;top:50%;border-top:1px dashed rgba(48,60,50,.4)}
.work-art-foot{display:flex;justify-content:space-between;margin-top:11px;color:#72766a;font-size:7px;font-weight:750;letter-spacing:.13em}
.work-art-stamp{position:absolute;right:0;bottom:16px;display:grid;width:104px;height:104px;place-content:center;border-radius:50%;background:#b65339;color:#fff5e9;font-size:10px;font-weight:750;letter-spacing:.12em;line-height:1.5;text-align:center;transform:rotate(9deg)}
.work-section{background:#f7f6f1}
.work-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 25px}
.work-project-card{min-width:0}
.work-project-wide{grid-column:1/-1;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:34px}
.work-project-art{position:relative;display:block;aspect-ratio:1.42;overflow:hidden;background:#deded2;text-decoration:none}
.work-project-wide .work-project-art{aspect-ratio:1.52}
.work-project-placeholder{position:absolute;inset:0;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:22px;background:#4b5a4c;color:#f5f1e5;transition:transform .5s ease}
.work-project-art:hover .work-project-placeholder{transform:scale(1.025)}
.work-project-placeholder::before,.work-project-placeholder::after{position:absolute;content:"";border:1px solid rgba(255,249,227,.22);border-radius:50%}
.work-project-placeholder::before{width:260px;height:260px;right:-50px;top:12%}.work-project-placeholder::after{width:180px;height:180px;right:-10px;top:26%}
.placeholder-2{background:#80604e}.placeholder-3{background:#526a70}.placeholder-4{background:#776a4a}
.work-project-placeholder>span,.work-project-placeholder>b{position:relative;z-index:1;font-size:9px;font-weight:750;letter-spacing:.16em}
.work-project-placeholder>b{align-self:flex-end;color:#fff3de;font-family:"DM Serif Display",Georgia,serif;font-size:clamp(24px,4vw,48px);font-weight:400;letter-spacing:-.04em}
.work-project-placeholder>i{position:absolute;left:25px;bottom:18px;font-size:23px;font-style:normal}
.work-project-copy{padding:20px 2px 0}
.work-project-wide .work-project-copy{padding:25px 0}
.work-project-copy .editorial-meta{margin-bottom:12px}
.work-project-copy h3{margin:0 0 11px;color:#292c26;font-size:clamp(23px,3vw,34px);font-weight:550;letter-spacing:-.055em;line-height:1.08}
.work-tech-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.work-tech-list span{padding:5px 9px;border:1px solid rgba(41,44,38,.16);border-radius:2px;color:#65695e;font-size:9px;font-weight:650}
.work-project-copy .editorial-card-link{margin-top:21px}
/* Portfolio index: let the project artwork lead; reveal useful context on hover/focus. */
.work-section .work-project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.work-section .work-project-card,.work-section .work-project-wide{position:relative;display:block;min-width:0;padding:0;border:0}
.work-section .work-project-art,.work-section .work-project-wide .work-project-art{aspect-ratio:1.42;margin:0;background:#344238}
.work-section .work-project-art>img{display:block}
.work-section .work-project-copy,.work-section .work-project-wide .work-project-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:clamp(18px,3vw,32px);background:linear-gradient(180deg,rgba(29,39,32,0) 20%,rgba(29,39,32,.26) 47%,rgba(29,39,32,.94) 100%);color:#f7f4e9;opacity:0;transform:translateY(5px);transition:opacity .25s ease,transform .25s ease;pointer-events:none}
.work-section .work-project-card:hover .work-project-copy,.work-section .work-project-card:focus-within .work-project-copy{opacity:1;transform:none}
.work-section .work-project-copy .editorial-meta{margin:0 0 8px;color:#f1c1a4;font-size:9px}
.work-section .work-project-copy .editorial-meta span+span{border-color:rgba(255,255,255,.38)}
.work-section .work-project-copy h3{margin:0;color:#fffdf6;font-size:clamp(25px,3vw,39px)}
.work-section .work-project-copy>p{display:none}
.work-section .work-tech-list{gap:6px;margin-top:13px}
.work-section .work-tech-list span{padding:5px 8px;border-color:rgba(255,255,255,.38);color:#fffdf6;font-size:10px}
.work-section .work-project-copy .editorial-card-link{display:inline-flex;align-items:center;gap:12px;margin-top:16px;padding:10px 13px;background:#f5f3ec;color:#303c32;font-size:11px;pointer-events:auto}
.work-section .work-project-copy .editorial-card-link:hover{gap:17px}
.work-section .work-project-placeholder{transition:transform .45s ease}
.work-section .work-project-card:hover .work-project-placeholder{transform:scale(1.025)}
.content-pagination{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:52px;padding-top:20px;border-top:1px solid rgba(41,44,38,.19)}
.pagination-context{color:#77786e;font-size:11px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.pagination-links{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.pagination-links a{display:grid;min-width:40px;min-height:40px;place-items:center;padding:0 12px;border:1px solid rgba(41,44,38,.18);color:#394238;font-size:12px;font-weight:650;text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.pagination-links a[rel],.pagination-links a[aria-label^="Previous"],.pagination-links a[aria-label^="Next"]{display:flex;gap:8px}
.pagination-links a:hover,.pagination-links a[aria-current="page"]{border-color:#303c32;background:#303c32;color:#fffdf6}
.pagination-links a:focus-visible{outline:3px solid #b65339;outline-offset:3px}
/* Editorial reading pages */
.section:has(.portfolio-case-meta){padding-block:calc(var(--nav-h) + 54px) 96px!important}
.section:has(.portfolio-case-meta)>.container{max-width:1040px!important}
.section:has(.portfolio-case-meta) .breadcrumb,.section:has(.article-reading-copy) .breadcrumb{margin-bottom:34px;color:#77786e}
.section:has(.portfolio-case-meta)>.container>.section-label{display:inline-flex;margin:0 0 18px;padding:8px 11px;border:1px solid rgba(48,60,50,.2);color:#9e5039;font-size:10px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}
.section:has(.portfolio-case-meta) .hero-title{max-width:900px;margin:0;color:#292c26;font-size:clamp(48px,7.5vw,88px);letter-spacing:-.075em;line-height:.98}
.section:has(.portfolio-case-meta) .hero-subtitle{max-width:760px;margin:22px 0 0;color:#60655b;font-size:clamp(17px,2vw,21px);line-height:1.75}
.portfolio-case-meta{gap:0!important;margin:30px 0!important;padding:17px 0;border-block:1px solid rgba(41,44,38,.16)}
.portfolio-case-meta>div{min-width:155px;padding-right:25px}
.portfolio-case-meta>div+div{padding-left:25px;border-left:1px solid rgba(41,44,38,.15)}
.portfolio-case-meta .section-label{display:block;margin-bottom:5px;color:#9b503a;font-size:9px;letter-spacing:.13em}
.portfolio-case-meta>div>div{color:#333b32;font-size:14px;font-weight:650}
.section:has(.portfolio-case-meta) img{display:block;width:100%;max-height:none!important;aspect-ratio:1.85;object-fit:cover;border:1px solid rgba(41,44,38,.12);border-radius:2px!important;margin:26px 0 48px!important;box-shadow:0 25px 60px rgba(41,44,38,.11)}
.section:has(.portfolio-case-meta) h2{margin:34px 0 18px;color:#292c26;font-size:clamp(28px,4vw,42px);letter-spacing:-.055em}
.section:has(.portfolio-case-meta) .portfolio-tech-tags{display:flex;flex-wrap:wrap;gap:9px}
.section:has(.portfolio-case-meta) .tech-badge{padding:9px 13px;border:1px solid rgba(41,44,38,.18);background:#f7f5ee;color:#41483e;font-size:12px}
.section:has(.portfolio-case-meta) .btn{margin:28px 10px 0 0}
.section:has(.portfolio-case-meta) .btn-glass{border:1px solid rgba(41,44,38,.22)}
.section:has(.blog-meta){padding-block:calc(var(--nav-h) + 48px) 92px!important;background:#f7f6f1}
.section:has(.blog-meta)>.container{max-width:880px!important}
.section:has(.blog-meta) .breadcrumb{margin-bottom:34px;color:#77786e}
.section:has(.blog-meta) .section-label{display:inline-block;margin:0 0 15px;color:#a6533b;font-size:10px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}
.section:has(.blog-meta) .hero-title{margin:0;color:#292c26;font-size:clamp(42px,7vw,76px);letter-spacing:-.07em;line-height:1.02}
.section:has(.blog-meta) .hero-subtitle{margin:20px 0 14px;color:#60655b;font-size:clamp(17px,2.1vw,21px);line-height:1.7}
.section:has(.blog-meta) .blog-meta{padding:16px 0;border-top:1px solid rgba(41,44,38,.16);color:#74766d;font-size:12px}
.section:has(.blog-meta) .blog-featured-img{display:block;width:100%;max-height:none;aspect-ratio:1.8;object-fit:cover;border:1px solid rgba(41,44,38,.12);margin:0 0 38px;box-shadow:0 22px 55px rgba(41,44,38,.1)}
.section:has(.blog-meta) div[style*="white-space:pre-wrap"]{color:#454a41;font-size:17px;line-height:1.95;overflow-wrap:anywhere}
.section:has(.blog-meta) div[style*="white-space:pre-wrap"]+a{margin-top:36px!important}
.section:has(.article-reading-copy){padding-block:calc(var(--nav-h) + 45px) 100px!important;background:#f7f6f1}
.section:has(.article-reading-copy)>.container{max-width:880px!important}
.article-reading-head{margin:0 auto 32px}
.article-reading-head>.section-label{display:inline-block;margin:0 0 15px;color:#a6533b;font-size:10px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}
.article-reading-head .hero-title{margin:0;color:#292c26;font-size:clamp(42px,7vw,76px);letter-spacing:-.07em;line-height:1.02}
.article-reading-head .hero-subtitle{margin:20px 0 14px;color:#60655b;font-size:clamp(17px,2.1vw,21px);line-height:1.7}
.article-reading-head .blog-meta{padding:16px 0;border-top:1px solid rgba(41,44,38,.16);color:#74766d;font-size:12px}
.article-reading-cover{display:block;width:100%;max-height:none;aspect-ratio:1.8;object-fit:cover;border:1px solid rgba(41,44,38,.12);margin:0 0 38px;box-shadow:0 22px 55px rgba(41,44,38,.1)}
.article-reading-copy{color:#454a41;font-size:17px;line-height:1.95;white-space:pre-wrap;overflow-wrap:anywhere}
.article-reading-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:44px;padding-top:22px;border-top:1px solid rgba(41,44,38,.16)}
@media(max-width:700px){
  .work-section .work-project-grid{grid-template-columns:1fr;gap:18px}
  .work-section .work-project-art,.work-section .work-project-wide .work-project-art{aspect-ratio:1.22}
  .work-section .work-project-copy,.work-section .work-project-wide .work-project-copy{padding:20px;opacity:1;transform:none;background:linear-gradient(180deg,rgba(29,39,32,0) 7%,rgba(29,39,32,.34) 36%,rgba(29,39,32,.95) 100%)}
  .work-section .work-project-copy h3{font-size:27px}
  .content-pagination{align-items:flex-start;flex-direction:column;gap:13px;margin-top:34px}
  .pagination-links{justify-content:flex-start}
  .section:has(.portfolio-case-meta){padding-block:calc(var(--nav-h) + 32px) 70px!important}
  .section:has(.portfolio-case-meta) .hero-title{font-size:clamp(43px,13vw,68px)}
  .section:has(.portfolio-case-meta) img,.article-reading-cover{aspect-ratio:1.2}
  .portfolio-case-meta>div{min-width:50%;padding-right:12px}
  .portfolio-case-meta>div+div{padding-left:15px}
  .article-reading-copy{font-size:16px;line-height:1.85}
  .section:has(.blog-meta){padding-block:calc(var(--nav-h) + 32px) 70px!important}
  .section:has(.blog-meta) .hero-title{font-size:clamp(40px,12vw,64px)}
  .section:has(.blog-meta) .blog-featured-img{aspect-ratio:1.2}
  .section:has(.blog-meta) div[style*="white-space:pre-wrap"]{font-size:16px;line-height:1.85}
}
.editorial-hero-services{background:#2c3730}
.service-hero-art{position:relative;width:min(100%,430px);aspect-ratio:1;margin:auto}
.service-orbit{position:absolute;inset:8%;border:1px solid rgba(240,234,215,.25);border-radius:50%}
.service-orbit.orbit-b{inset:20%;border-style:dashed;transform:rotate(-20deg)}
.service-orbit.orbit-c{inset:33%;border-color:rgba(226,160,132,.55)}
.service-orbit-core{position:absolute;inset:42%;display:grid;place-items:center;border-radius:50%;background:#d48b6d;color:#26342b;box-shadow:0 0 0 12px rgba(212,139,109,.11),0 0 65px rgba(212,139,109,.25)}
.service-orbit-core span{font-family:"DM Serif Display",Georgia,serif;font-size:42px}
.service-orbit-label{position:absolute;padding:7px 10px;border:1px solid rgba(241,236,220,.25);background:#2c3730;color:#f0eadd;font-size:8px;font-weight:700;letter-spacing:.14em}
.label-a{top:13%;left:36%}.label-b{right:2%;top:48%}.label-c{bottom:14%;left:28%}
.service-orbit-caption{position:absolute;right:7%;bottom:20%;color:rgba(240,234,215,.6);font-family:"DM Serif Display",Georgia,serif;font-size:20px;line-height:1.12}
.services-section{background:#f5f3ec}
.service-anchor-nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px;padding-bottom:22px;border-bottom:1px solid rgba(41,44,38,.17)}
.service-anchor-nav a{padding:8px 12px;border:1px solid rgba(41,44,38,.17);border-radius:30px;color:#53584e;font-size:10px;font-weight:650;text-decoration:none;transition:.18s}
.service-anchor-nav a:hover{border-color:#303c32;background:#303c32;color:#f8f4e8}
.service-editorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.service-editorial-card{position:relative;display:flex;min-height:385px;flex-direction:column;align-items:flex-start;padding:23px 22px 21px;border:1px solid rgba(41,44,38,.14);background:#fbfaf6;scroll-margin-top:calc(var(--nav-h) + 18px);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.service-editorial-card:hover{transform:translateY(-4px);border-color:rgba(182,83,57,.48);box-shadow:0 18px 40px rgba(42,48,39,.08)}
.service-card-feature{grid-column:span 2}
.service-card-contrast{background:#344238;color:#f4f1e8}
.service-card-top{display:flex;width:100%;justify-content:space-between;color:#8c8c80;font-size:8px;font-weight:750;letter-spacing:.13em}
.service-card-top>span:last-child{color:#b65339;font-size:15px}
.service-card-contrast .service-card-top{color:#bfc4b8}
.service-card-symbol{position:relative;display:grid;width:53px;height:53px;place-items:center;margin:26px 0 20px;color:#a85039}
.symbol-web{border:1px solid rgba(48,60,50,.3);border-radius:50%}
.symbol-web i{position:absolute;width:23px;height:16px;border:1px solid #a85039;border-radius:2px}.symbol-web i:first-child{transform:translate(-5px,-4px)}.symbol-web i:nth-child(2){transform:translate(5px,4px);background:#d7e0d3}.symbol-web i:nth-child(3){width:9px;height:1px;transform:translate(4px,11px);border-width:1px 0 0}
.symbol-cloud{border:1px solid rgba(48,60,50,.25);border-radius:50%;font-family:Georgia,serif;font-size:45px;line-height:1}
.symbol-mobile{border:1px solid rgba(48,60,50,.25);border-radius:50%}.symbol-mobile i{width:18px;height:30px;border:1.5px solid #a85039;border-radius:4px}.symbol-mobile i::after{display:block;width:3px;height:3px;margin:23px auto 0;border-radius:50%;background:#a85039;content:""}
.symbol-commerce{border:1px solid rgba(48,60,50,.25);border-radius:50%;font-size:29px}
.symbol-devops{display:flex;gap:5px;border:1px solid rgba(48,60,50,.25);border-radius:50%}.symbol-devops i{width:6px;height:6px;border-radius:50%;background:#a85039}.symbol-devops i:nth-child(2){width:15px;height:1px;margin-top:3px;border-radius:0}
.symbol-design{display:flex;align-items:center;justify-content:center;gap:3px;border:1px solid rgba(48,60,50,.25);border-radius:50%}.symbol-design span{width:11px;height:17px;border:1px solid #a85039;border-radius:50%}.symbol-design span:nth-child(2){height:28px;background:#ddd9c8}
.symbol-growth{display:flex;align-items:end;gap:4px;border:1px solid rgba(48,60,50,.25);border-radius:50%}.symbol-growth i{width:5px;height:12px;background:#a85039}.symbol-growth i:nth-child(2){height:19px}.symbol-growth i:nth-child(3){height:25px}.symbol-growth i:nth-child(4){height:31px}
.service-editorial-card h3{margin:0 0 12px;color:#292c26;font-size:clamp(22px,2.4vw,30px);font-weight:550;letter-spacing:-.055em;line-height:1.05}
.service-card-contrast h3{color:#f5f1e8}
.service-editorial-card>p{max-width:460px;margin:0;color:#686c61;font-size:12px;line-height:1.8}
.service-card-contrast>p{color:#cbd0c5}
.service-deliverables{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0 20px}
.service-deliverables span{padding:5px 8px;border:1px solid rgba(41,44,38,.13);color:#696b60;font-size:8px;font-weight:650;letter-spacing:.02em}
.service-card-contrast .service-deliverables span{border-color:rgba(245,241,232,.2);color:#d5d9ce}
.service-editorial-card .editorial-card-link{margin-top:auto;padding-top:14px;border-top:1px solid rgba(41,44,38,.14);width:100%}
.service-card-contrast .editorial-card-link{border-color:rgba(245,241,232,.2);color:#f0b293}
/* Keep service copy left-aligned; refine only the DevOps and growth icon badges. */
#devops .service-card-symbol,
#seo .service-card-symbol{box-sizing:border-box;width:44px;height:44px;flex:0 0 44px;margin:26px 0 20px;border:1px solid rgba(48,60,50,.25);border-radius:50%;overflow:hidden}
#devops .symbol-devops{display:flex;align-items:center;justify-content:center;gap:3px}
#devops .symbol-devops i{width:5px;height:5px;margin:0}
#devops .symbol-devops i:nth-child(2){width:12px;height:1px}
#seo .symbol-growth{display:flex;align-items:flex-end;justify-content:center;gap:3px;padding-bottom:9px}
#seo .symbol-growth i{width:4px;height:8px}
#seo .symbol-growth i:nth-child(2){height:12px}
#seo .symbol-growth i:nth-child(3){height:16px}
#seo .symbol-growth i:nth-child(4){height:20px}
.editorial-process{padding:94px 0 105px;background:#e9e7dd;color:#292c26}
.process-steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:48px;border-top:1px solid rgba(41,44,38,.23);border-bottom:1px solid rgba(41,44,38,.23)}
.process-steps article{min-height:200px;padding:21px 20px 24px;border-right:1px solid rgba(41,44,38,.17)}.process-steps article:first-child{padding-left:0}.process-steps article:last-child{border-right:0}
.process-steps article>span{color:#a85039;font-size:10px;font-weight:750;letter-spacing:.12em}
.process-steps h3{margin:31px 0 8px;color:#30332c;font-family:"DM Serif Display",Georgia,serif;font-size:26px;font-weight:400}
.process-steps p{max-width:230px;margin:0;color:#686c61;font-size:11px;line-height:1.75}
.editorial-faq{background:#f7f6f1}
.editorial-faq .faq-list{max-width:780px;margin-left:auto}
.editorial-hero-industries{background:#e9e7dd;color:#292c26}
.editorial-hero-industries::before{opacity:.2;background-image:linear-gradient(rgba(40,43,37,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(40,43,37,.12) 1px,transparent 1px)}
.editorial-hero-industries::after{right:5%;background:radial-gradient(circle,rgba(96,119,92,.2),transparent 70%)}
.editorial-hero-industries .editorial-hero-inner{grid-template-columns:minmax(0,1fr) minmax(340px,.8fr)}
.editorial-hero-industries .breadcrumb,.editorial-hero-industries .breadcrumb a{color:#74776b}
.editorial-hero-industries .breadcrumb span:last-child{color:#a64e37}
.editorial-hero-industries h1{color:#292c26;font-size:clamp(51px,6.3vw,82px)}
.editorial-hero-industries .editorial-hero-copy>p{color:#686c61}
.editorial-hero-industries .editorial-kicker{color:#9c4d37}
.editorial-hero-industries .editorial-kicker i{background:#ad593d;box-shadow:0 0 0 4px rgba(173,89,61,.12)}
.editorial-hero-industries .editorial-text-link{color:#934531;border-color:rgba(147,69,49,.35)}
.editorial-hero-industries .editorial-hero-foot{border-color:rgba(41,44,38,.25);color:#73756c}
.industry-hero-map{position:relative;width:min(100%,430px);aspect-ratio:1;margin:auto}
.industry-map-ring{position:absolute;inset:9%;border:1px solid rgba(48,60,50,.22);border-radius:50%}.industry-map-ring.map-ring-two{inset:22%;border-style:dashed;transform:rotate(22deg)}.industry-map-ring.map-ring-three{inset:35%;border-color:rgba(182,83,57,.45)}
.industry-map-center{position:absolute;inset:42%;display:grid;place-items:center;border-radius:50%;background:#303c32;color:#f3eee0;box-shadow:0 0 0 12px rgba(48,60,50,.08);font-size:10px;font-weight:750;letter-spacing:.11em;line-height:1.5;text-align:center}
.industry-map-node{position:absolute;padding:8px 10px;background:#f7f5ed;border:1px solid rgba(48,60,50,.18);color:#536050;font-size:8px;font-weight:750;letter-spacing:.14em;box-shadow:0 8px 24px rgba(41,44,38,.08)}
.node-health{top:10%;left:41%}.node-learn{top:48%;right:-1%}.node-move{bottom:12%;left:39%}.node-trade{top:48%;left:-2%}
.industry-map-caption{position:absolute;right:6%;bottom:24%;color:#777b70;font-size:8px;font-weight:750;letter-spacing:.13em;line-height:1.8;text-align:right}
.industry-index-section{padding:96px 0 110px;background:#f5f3ec;color:#292c26}
.industry-jump-list{display:flex;flex-wrap:wrap;gap:7px;margin:35px 0 48px;padding:19px 0;border-top:1px solid rgba(41,44,38,.17);border-bottom:1px solid rgba(41,44,38,.17)}
.industry-jump-list a{padding:8px 10px;color:#606459;font-size:9px;font-weight:650;text-decoration:none;transition:color .2s,background .2s}
.industry-jump-list a:hover{background:#303c32;color:#f7f4e9}
.industry-editorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.industry-editorial-card{position:relative;min-height:330px;padding:20px 20px 18px;border:1px solid rgba(41,44,38,.14);background:#fbfaf6;scroll-margin-top:calc(var(--nav-h) + 18px);transition:transform .23s ease,border-color .23s ease,box-shadow .23s ease}
.industry-editorial-card:hover{transform:translateY(-3px);border-color:rgba(182,83,57,.45);box-shadow:0 15px 35px rgba(42,48,39,.065)}
.industry-card-index{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid rgba(41,44,38,.12)}
.industry-card-index>span{color:#b65339;font-family:"DM Serif Display",Georgia,serif;font-size:25px}
.industry-card-index>b{margin-left:auto;color:#929286;font-size:8px;letter-spacing:.16em}
.industry-glyph{display:grid;width:38px;height:38px;place-items:center;margin-left:13px;border:1px solid rgba(41,44,38,.17);border-radius:50%;color:#53624f;font-size:19px;font-style:normal}
.industry-card-kicker{display:block;margin-top:20px;color:#9d553e;font-size:8px;font-weight:750;letter-spacing:.12em}
.industry-editorial-card h3{margin:8px 0 9px;color:#292c26;font-size:21px;font-weight:550;letter-spacing:-.045em;line-height:1.13}
.industry-editorial-card>p{min-height:57px;margin:0 0 17px;color:#686c61;font-size:11px;line-height:1.75}
.industry-editorial-card details{border-top:1px solid rgba(41,44,38,.13)}
.industry-editorial-card summary{display:flex;justify-content:space-between;align-items:center;padding:12px 0 2px;color:#3d483d;font-size:10px;font-weight:750;cursor:pointer;list-style:none}
.industry-editorial-card summary::-webkit-details-marker{display:none}
.industry-editorial-card summary span{color:#a85039;font-size:17px;transition:transform .2s}
.industry-editorial-card details[open] summary span{transform:rotate(45deg)}
.industry-editorial-card details>div{padding:12px 0 1px;color:#686c61;font-size:10px;line-height:1.7}
.industry-editorial-card details strong{color:#303c32;font-size:9px;letter-spacing:.07em;text-transform:uppercase}
.industry-editorial-card details p{margin:4px 0 12px}
@media(max-width:980px){.editorial-hero-inner{grid-template-columns:1.05fr .8fr;gap:14px}.editorial-hero h1{font-size:clamp(50px,7.5vw,75px)}.journal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.industry-editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service-editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service-card-feature{grid-column:span 1}}
@media(max-width:700px){.editorial-hero{min-height:0;padding:calc(var(--nav-h) + 26px) 0 20px}.editorial-hero-inner,.editorial-hero-work .editorial-hero-inner,.editorial-hero-industries .editorial-hero-inner{min-height:0;grid-template-columns:1fr;gap:12px;padding-bottom:57px}.editorial-hero .breadcrumb{margin-bottom:25px}.editorial-hero h1,.editorial-hero-industries h1{margin:21px 0 14px;font-size:clamp(49px,13vw,73px)}.editorial-hero-copy>p{font-size:13px}.editorial-hero-foot{font-size:7px;letter-spacing:.1em}.journal-orbit,.work-hero-art,.industry-hero-map{width:min(78vw,330px);margin:8px auto 0}.journal-orbit{aspect-ratio:1}.work-hero-art{min-height:295px}.work-art-window{height:235px;padding:0 15px 14px}.work-art-canvas{height:155px}.work-art-canvas>span{width:62px;height:62px;font-size:7px}.work-art-stamp{width:78px;height:78px;font-size:8px}.editorial-section,.industry-index-section{padding:67px 0 76px}.editorial-section-head{display:block;margin-bottom:24px}.editorial-section-head h2{font-size:42px}.editorial-section-head>p{margin-top:14px;font-size:12px}.editorial-filter-bar{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px}.editorial-search{grid-column:1/-1;min-height:42px;padding-bottom:10px;border-bottom:1px solid rgba(41,44,38,.12)}.editorial-select{width:auto;min-height:39px;padding:0 12px 0 0;border:0}.editorial-select>span:last-child{right:1px}.editorial-filter-submit{justify-content:space-between;min-height:41px;padding:0 11px;font-size:10px}.editorial-clear{margin:0;text-align:center}.journal-feature{grid-template-columns:1fr;margin-bottom:44px}.journal-feature-art{min-height:0;aspect-ratio:1.35}.journal-feature-copy{padding:25px 21px 22px}.journal-feature-copy h2{font-size:31px}.journal-grid{grid-template-columns:1fr;gap:29px}.journal-card-art{aspect-ratio:1.6}.journal-card h3{font-size:22px}.work-project-grid{grid-template-columns:1fr;gap:34px}.work-project-wide{grid-column:auto;display:flex;flex-direction:column;align-items:stretch;gap:0}.work-project-wide .work-project-art,.work-project-art{aspect-ratio:1.35}.work-project-wide .work-project-copy{padding:19px 2px 0}.work-project-copy h3{font-size:26px}.service-hero-art{width:min(72vw,300px);margin-top:5px}.service-orbit-caption{font-size:16px}.service-anchor-nav{gap:6px;margin-bottom:20px}.service-anchor-nav a{padding:7px 9px;font-size:9px}.service-editorial-grid{grid-template-columns:1fr;gap:10px}.service-editorial-card{min-height:0;padding:19px}.service-card-feature{grid-column:auto}.service-card-symbol{margin:18px 0 14px}.service-editorial-card h3{font-size:25px}.service-deliverables{margin:13px 0 16px}.editorial-process{padding:65px 0 72px}.process-steps{grid-template-columns:repeat(2,1fr);margin-top:29px}.process-steps article{min-height:165px;padding:17px 13px;border-bottom:1px solid rgba(41,44,38,.17)}.process-steps article:first-child{padding-left:13px}.process-steps article:nth-child(2){border-right:0}.process-steps article:nth-child(3),.process-steps article:nth-child(4){border-bottom:0}.process-steps h3{margin-top:20px;font-size:23px}.process-steps p{font-size:10px}.editorial-faq .faq-list{margin-top:25px}.industry-hero-map{width:min(70vw,280px)}.industry-jump-list{gap:4px;margin:25px 0 30px;padding:13px 0}.industry-jump-list a{padding:7px;font-size:8px}.industry-editorial-grid{grid-template-columns:1fr;gap:10px}.industry-editorial-card{min-height:0;padding:17px}.industry-editorial-card>p{min-height:0}.industry-glyph{width:33px;height:33px}.editorial-bottom-cta{padding:65px 0 70px}.editorial-bottom-cta h2{font-size:clamp(42px,12vw,62px)}.cta-watermark{right:-6%;font-size:260px}}

/* Portfolio presentation below the hero. */
.work-results-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; padding-bottom:12px; border-bottom:1px solid rgba(41,44,38,.17); color:#77796e; font-size:8px; font-weight:750; letter-spacing:.14em; }
.work-results-bar > span:last-child { display:flex; align-items:center; gap:8px; }
.work-results-bar strong { color:#a6533c; font-family:"DM Serif Display",Georgia,serif; font-size:23px; font-weight:400; letter-spacing:-.04em; }
.work-section .editorial-section-head { margin-bottom:30px; }
.work-project-grid { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:58px 28px; counter-reset:work-project; }
.work-project-card { counter-increment:work-project; padding-top:13px; border-top:1px solid rgba(41,44,38,.19); }
.work-project-wide { align-items:start; gap:clamp(24px,4vw,58px); }
.work-project-art { aspect-ratio:1.48; background:#e3e1d7; }
.work-project-wide .work-project-art { aspect-ratio:1.5; }
.work-project-art::after { position:absolute; z-index:2; right:13px; bottom:13px; padding:9px 11px; background:#f7f5ed; color:#344239; content:"VIEW CASE STUDY  ↗"; font-size:7px; font-weight:750; letter-spacing:.1em; transition:background .2s,color .2s; }
.work-project-art:hover::after { background:#344239; color:#f7f5ed; }
.work-project-copy { padding:17px 2px 0; }
.work-project-wide .work-project-copy { padding:20px 0 0; }
.work-project-copy::before { display:block; margin-bottom:10px; color:#929286; content:"PROJECT / " counter(work-project,decimal-leading-zero); font-size:8px; font-weight:750; letter-spacing:.14em; }
.work-project-copy .editorial-meta { margin-bottom:11px; }
.work-project-copy h3 { max-width:580px; margin-bottom:10px; font-size:clamp(25px,3vw,37px); }
.work-project-copy > p { max-width:540px; font-size:12px; }
.work-tech-list { margin-top:15px; }
.work-tech-list span { padding:6px 9px; background:#eeede6; border-color:transparent; }
.work-project-copy .editorial-card-link { margin-top:19px; padding-top:13px; border-top:1px solid rgba(41,44,38,.14); }
.work-section .editorial-filter-bar { margin-top:30px; }
.work-section .editorial-select { width:230px; min-height:46px; padding:0 12px; border-left:0; }
.work-section .editorial-select select { min-height:44px; padding:0 38px 0 13px; border:1px solid rgba(52,66,57,.2); border-radius:3px; background:#f3f1e9; color:#344239; font-size:12px; font-weight:600; transition:background .2s,border-color .2s,box-shadow .2s; }
.work-section .editorial-select select:hover { border-color:rgba(166,78,55,.55); background:#fffdf7; }
.work-section .editorial-select:focus-within select { border-color:#a6533c; background:#fffdf7; box-shadow:0 0 0 3px rgba(182,83,57,.13); outline:0; }
.work-section .editorial-select select option { background:#fbfaf6; color:#303c32; }
.work-section .editorial-select select { width:100%; appearance:none; -webkit-appearance:none; -moz-appearance:none; background-image:none; cursor:pointer; }
.work-section .editorial-select > span:last-child { position:absolute; top:50%; right:29px; display:block; width:8px; height:8px; padding:0; border-right:1.5px solid #a6533c; border-bottom:1.5px solid #a6533c; font-size:0; line-height:0; pointer-events:none; transform:translateY(-50%) rotate(45deg); transition:border-color .18s; }
.work-section .editorial-select:focus-within > span:last-child { border-color:#344239; }
.work-section .editorial-empty { min-height:250px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; border:0; border-top:1px solid rgba(41,44,38,.18); border-bottom:1px solid rgba(41,44,38,.18); background:transparent; }
.work-section .editorial-empty h3 { max-width:660px; }
.work-section .editorial-empty .editorial-text-link { margin-top:8px; color:#a64e37; border-color:rgba(166,78,55,.42); }
.work-section .editorial-empty .editorial-text-link:hover { gap:19px; color:#344239; border-color:#344239; }
.work-section .editorial-empty .editorial-text-link:focus-visible,
.portfolio-bottom-cta .editorial-light-link:focus-visible { outline:3px solid #e1a17e; outline-offset:5px; }
.work-section + .portfolio-bottom-cta { padding:76px 0 82px; border-top:1px solid rgba(244,241,232,.16); background:radial-gradient(ellipse at 85% 47%,rgba(209,128,91,.28),transparent 36%),linear-gradient(112deg,#28372f 0%,#35473a 56%,#465044 100%); }
.portfolio-bottom-cta::before { opacity:.13; background-image:linear-gradient(rgba(244,241,232,.23) 1px,transparent 1px),linear-gradient(90deg,rgba(244,241,232,.23) 1px,transparent 1px),radial-gradient(ellipse at 82% 48%,rgba(238,187,146,.2),transparent 48%); background-size:46px 46px,46px 46px,auto; }
.portfolio-bottom-cta .container { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:18px 48px; }
.portfolio-bottom-cta .editorial-overline { grid-column:1/-1; color:#e1a17e; }
.portfolio-bottom-cta h2 { margin:0; font-size:clamp(48px,6.2vw,78px); }
.portfolio-bottom-cta .editorial-light-link { display:inline-flex; align-items:center; gap:17px; margin:0 0 6px; padding:15px 18px; border:1px solid rgba(244,241,232,.42); color:#f4f1e8; font-size:12px; transition:background .2s,color .2s,gap .2s; }
.portfolio-bottom-cta .editorial-light-link:hover { gap:23px; background:#f4f1e8; color:#344239; }
.portfolio-bottom-cta .cta-watermark { right:6%; font-size:clamp(190px,27vw,370px); }
.portfolio-bottom-cta::after { position:absolute; top:50%; right:12%; width:min(26vw,330px); height:72%; border-right:1px solid rgba(244,241,232,.13); border-left:1px solid rgba(244,241,232,.13); content:""; pointer-events:none; transform:translateY(-50%) skewX(-18deg); }
@media (max-width:700px) {
  .work-results-bar { margin-bottom:20px; }
  .work-section .editorial-section-head { margin-bottom:21px; }
  .work-project-grid { gap:36px 0; }
  .work-project-card { padding-top:11px; }
  .work-project-copy h3 { font-size:27px; }
  .work-project-art::after { right:9px; bottom:9px; padding:8px; font-size:6px; }
  .work-section .editorial-empty { min-height:220px; padding:45px 17px; }
  .work-section .editorial-select { width:auto; min-height:39px; padding:0; }
  .work-section .editorial-select select { min-height:39px; padding:0 30px 0 9px; font-size:10px; }
  .work-section .editorial-select > span:last-child { top:50%; right:13px; width:7px; height:7px; }
  .work-section + .portfolio-bottom-cta { padding:64px 0 70px; }
  .portfolio-bottom-cta .container { grid-template-columns:1fr; gap:20px; }
  .portfolio-bottom-cta .editorial-overline { grid-column:auto; font-size:8px; }
  .portfolio-bottom-cta h2 { font-size:clamp(44px,12vw,62px); }
  .portfolio-bottom-cta .editorial-light-link { justify-self:start; margin-top:2px; padding:13px 15px; }
  .portfolio-bottom-cta .cta-watermark { right:-6%; font-size:230px; }
  .portfolio-bottom-cta::after { right:-18%; width:220px; height:68%; }
}

/* Complete the Blog journal listing and its reading paths. */
.journal-results-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; padding-bottom:12px; border-bottom:1px solid rgba(41,44,38,.17); color:#77796e; font-size:8px; font-weight:750; letter-spacing:.14em; }
.journal-results-bar > span:last-child { display:flex; align-items:center; gap:8px; }
.journal-results-bar strong { color:#a6533c; font-family:"DM Serif Display",Georgia,serif; font-size:23px; font-weight:400; letter-spacing:-.04em; }
#journal-feed .editorial-section-head { margin-bottom:28px; }
.journal-filter-bar { margin-top:26px; }
.journal-filter-bar .editorial-select { width:220px; min-height:46px; padding:0 12px; border-left:0; }
.journal-filter-bar .editorial-select select { width:100%; min-height:44px; padding:0 38px 0 13px; border:1px solid rgba(52,66,57,.2); border-radius:3px; background:#f3f1e9; color:#344239; font-size:12px; font-weight:600; appearance:none; -webkit-appearance:none; -moz-appearance:none; background-image:none; cursor:pointer; transition:background .2s,border-color .2s,box-shadow .2s; }
.journal-filter-bar .editorial-select select:hover { border-color:rgba(166,78,55,.55); background:#fffdf7; }
.journal-filter-bar .editorial-select:focus-within select { border-color:#a6533c; background:#fffdf7; box-shadow:0 0 0 3px rgba(182,83,57,.13); outline:0; }
.journal-filter-bar .editorial-select select option { background:#fbfaf6; color:#303c32; }
.journal-filter-bar .editorial-select > span:last-child { position:absolute; top:50%; right:29px; display:block; width:8px; height:8px; padding:0; border-right:1.5px solid #a6533c; border-bottom:1.5px solid #a6533c; font-size:0; line-height:0; pointer-events:none; transform:translateY(-50%) rotate(45deg); }
.journal-filter-bar .editorial-select:focus-within > span:last-child { border-color:#344239; }
.journal-filter-bar .editorial-filter-submit:focus-visible,
.journal-filter-bar .editorial-clear:focus-visible,
#journal-feed .editorial-empty .editorial-text-link:focus-visible { outline:3px solid #b65339; outline-offset:4px; }
.journal-feature { grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); align-items:stretch; }
.journal-feature-art { min-height:390px; }
.journal-feature-art::after { position:absolute; right:15px; bottom:15px; padding:9px 11px; background:#f7f5ed; color:#344239; content:"READ FEATURED NOTE  ↗"; font-size:7px; font-weight:750; letter-spacing:.1em; transition:background .2s,color .2s; }
.journal-feature-art:hover::after { background:#344239; color:#f7f5ed; }
.journal-feature-copy { padding:clamp(28px,4.5vw,58px); }
.journal-feature-copy h2 { font-size:clamp(29px,3vw,42px); }
.journal-byline { margin-top:auto; padding-top:18px; }
.journal-grid { counter-reset:journal-note; gap:26px 22px; }
.journal-card { counter-increment:journal-note; padding:0 0 20px; border-bottom:1px solid rgba(41,44,38,.18); }
.journal-card-art { margin-bottom:17px; }
.journal-card-art::after { position:absolute; right:11px; bottom:11px; padding:7px 9px; background:#f7f5ed; color:#344239; content:"OPEN NOTE  ↗"; font-size:6px; font-weight:750; letter-spacing:.1em; transition:background .2s,color .2s; }
.journal-card-art:hover::after { background:#344239; color:#f7f5ed; }
.journal-card .editorial-meta::before { color:#a6533c; content:"NOTE / " counter(journal-note,decimal-leading-zero); font-size:8px; font-weight:750; letter-spacing:.1em; }
.journal-card h3 { font-size:clamp(20px,2vw,24px); }
.journal-card > p { font-size:12px; }
#journal-feed .editorial-empty { display:flex; min-height:270px; flex-direction:column; align-items:center; justify-content:center; gap:9px; border:0; border-top:1px solid rgba(41,44,38,.18); border-bottom:1px solid rgba(41,44,38,.18); background:transparent; }
#journal-feed .editorial-empty h3 { max-width:660px; }
#journal-feed .editorial-empty .editorial-text-link { margin-top:8px; color:#a64e37; border-color:rgba(166,78,55,.42); }
#journal-feed .editorial-empty .editorial-text-link:hover { gap:19px; color:#344239; border-color:#344239; }
.journal-bottom-cta { background:radial-gradient(ellipse at 83% 45%,rgba(209,128,91,.23),transparent 37%),linear-gradient(112deg,#28372f,#3c493b); }
.journal-bottom-cta::before { opacity:.12; background-size:46px 46px; }
.journal-bottom-cta .editorial-overline { color:#e1a17e; }
.journal-bottom-cta .editorial-light-link { display:inline-flex; align-items:center; gap:17px; padding:12px 0; border-color:rgba(244,241,232,.45); color:#f4f1e8; }
.journal-bottom-cta .editorial-light-link:hover { gap:23px; color:#fff; }
.journal-bottom-cta .cta-watermark { right:7%; font-size:clamp(220px,32vw,430px); }
@media (max-width:700px) {
  .journal-results-bar { margin-bottom:19px; }
  #journal-feed .editorial-section-head { margin-bottom:21px; }
  .journal-filter-bar { margin:23px 0 32px; }
  .journal-filter-bar .editorial-select { width:auto; min-height:39px; padding:0; }
  .journal-filter-bar .editorial-select select { min-height:39px; padding:0 30px 0 9px; font-size:10px; }
  .journal-filter-bar .editorial-select > span:last-child { right:13px; width:7px; height:7px; }
  .journal-feature { gap:0; }
  .journal-feature-art { min-height:0; aspect-ratio:1.35; }
  .journal-feature-copy { padding:25px 21px 22px; }
  .journal-byline { margin-top:25px; }
  .journal-grid { grid-template-columns:1fr; gap:28px; }
  .journal-card { padding-bottom:19px; }
  #journal-feed .editorial-empty { min-height:220px; padding:42px 18px; }
  .journal-bottom-cta .cta-watermark { right:-8%; font-size:250px; }
}

/* The Journal hero uses a warm editorial paper palette and a page-spread illustration. */
.editorial-hero-journal {
  background:linear-gradient(116deg,#f4f1e8 0%,#e9e9df 58%,#e2e7dc 100%);
  color:#292c26;
}
.editorial-hero-journal::before {
  opacity:.32;
  background-image:linear-gradient(rgba(48,60,50,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(48,60,50,.09) 1px,transparent 1px);
  mask-image:linear-gradient(90deg,#000 0%,transparent 95%);
}
.editorial-hero-journal::after { display:none; }
.editorial-hero-journal .breadcrumb,.editorial-hero-journal .breadcrumb a { color:#73766c; }
.editorial-hero-journal .breadcrumb span:last-child { color:#a64e37; }
.editorial-hero-journal .editorial-kicker { color:#98503b; }
.editorial-hero-journal .editorial-kicker i { background:#ad593d; box-shadow:0 0 0 4px rgba(173,89,61,.12); }
.editorial-hero-journal h1 { color:#292c26; }
.editorial-hero-journal h1 em { color:#a6533c; }
.editorial-hero-journal .editorial-hero-copy > p { color:#62665c; }
.editorial-hero-journal .editorial-text-link { color:#3d5143; border-color:rgba(61,81,67,.4); }
.editorial-hero-journal .editorial-text-link:hover { color:#a6533c; }
.editorial-hero-journal .editorial-hero-foot { border-color:rgba(41,44,38,.23); color:#74776b; }
.journal-orbit {
  position:relative;
  isolation:isolate;
  display:block;
  width:min(100%,430px);
  height:400px;
  justify-self:center;
  margin:auto;
  filter:none!important;
}
.journal-orbit::before,.journal-orbit::after { position:absolute; content:""; }
.journal-orbit::before { z-index:-2; inset:13% 8% 9% 13%; background:#b85e43; transform:rotate(4deg); }
.journal-orbit::after { z-index:-1; inset:8% 13% 13% 8%; border:1px solid rgba(48,60,50,.18); background:#f8f6ed; box-shadow:14px 17px 32px rgba(41,44,38,.1); transform:rotate(-4deg); }
.journal-orbit-ring { position:absolute; inset:14% 18%; border:1px solid rgba(52,66,57,.22); border-radius:0; transform:rotate(-8deg); }
.journal-orbit-ring.ring-two { inset:18% 13%; border-color:rgba(166,78,55,.32); border-right:0; border-left:0; transform:rotate(7deg); }
.journal-orbit .orbit-core { position:absolute; top:50%; left:50%; display:block; width:auto; height:auto; border:0; border-radius:0; background:transparent; box-shadow:none!important; color:#344239; font-family:"DM Serif Display",Georgia,serif; font-size:clamp(150px,17vw,210px); font-weight:400; letter-spacing:-.1em; line-height:.8; transform:translate(-50%,-54%) rotate(-5deg); }
.journal-orbit .orbit-core span { color:#a6533c; }
.journal-orbit .orbit-word { position:absolute; z-index:1; padding:8px 10px; border:1px solid rgba(48,60,50,.16); background:#f4f1e8; color:#526050; font-size:8px; font-weight:750; letter-spacing:.16em; }
.journal-orbit .orbit-one { top:18%; left:12%; }
.journal-orbit .orbit-two { top:48%; right:8%; }
.journal-orbit .orbit-three { bottom:15%; left:17%; color:#a6533c; }
.journal-orbit .orbit-index { position:absolute; right:14%; bottom:14%; color:#73766c; font-size:8px; font-weight:750; letter-spacing:.16em; }
.journal-bottom-cta { background:radial-gradient(ellipse at 82% 46%,rgba(229,167,128,.2),transparent 38%),linear-gradient(118deg,#8f4938 0%,#a8553b 55%,#784238 100%); }
.journal-bottom-cta::before { opacity:.11; background-image:linear-gradient(rgba(255,245,231,.27) 1px,transparent 1px),linear-gradient(90deg,rgba(255,245,231,.27) 1px,transparent 1px); background-size:48px 48px; }
.journal-bottom-cta .editorial-overline { color:#f0c3a1; }
.journal-bottom-cta h2 { max-width:820px; }
.journal-bottom-cta h2 em { color:#f0c3a1; }
.journal-bottom-cta .editorial-light-link { border-color:rgba(255,245,231,.55); color:#fff8ee; }
.journal-bottom-cta .editorial-light-link:hover { background:#fff8ee; color:#8f4938; }
@media (max-width:700px) {
  .journal-orbit { width:min(82vw,330px); height:310px; aspect-ratio:auto; }
  .journal-orbit .orbit-core { font-size:clamp(145px,42vw,185px); }
  .journal-orbit .orbit-two { right:5%; }
  .journal-orbit .orbit-index { right:11%; bottom:12%; }
}

/* Final Journal palette overrides: keep the hero and its closing prompt cohesive. */
.editorial-hero.editorial-hero-journal {
  background:linear-gradient(116deg,#f4f1e8 0%,#e9e7dd 58%,#e3e8dd 100%);
  color:#292c26;
}
.editorial-hero.editorial-hero-journal::before {
  opacity:.29;
  background-image:linear-gradient(rgba(48,60,50,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(48,60,50,.08) 1px,transparent 1px);
}
.editorial-hero.editorial-hero-journal::after { display:none; }
.editorial-hero.editorial-hero-journal .breadcrumb,
.editorial-hero.editorial-hero-journal .breadcrumb a { color:#73766c; }
.editorial-hero.editorial-hero-journal .breadcrumb span:last-child { color:#a64e37; }
.editorial-hero.editorial-hero-journal .editorial-kicker { color:#98503b; }
.editorial-hero.editorial-hero-journal .editorial-kicker i { background:#ad593d; box-shadow:0 0 0 4px rgba(173,89,61,.12); }
.editorial-hero.editorial-hero-journal h1 { color:#292c26; }
.editorial-hero.editorial-hero-journal h1 em { color:#a6533c; }
.editorial-hero.editorial-hero-journal .editorial-hero-copy > p { color:#62665c; }
.editorial-hero.editorial-hero-journal .editorial-text-link { color:#3d5143; border-color:rgba(61,81,67,.4); }
.editorial-hero.editorial-hero-journal .editorial-text-link:hover { color:#a6533c; }
.editorial-hero.editorial-hero-journal .editorial-hero-foot { border-color:rgba(41,44,38,.23); color:#74776b; }
.journal-bottom-cta {
  border-top:1px solid rgba(48,60,50,.2);
  background:linear-gradient(116deg,#f4f1e8 0%,#e9e7dd 58%,#e3e8dd 100%);
  color:#292c26;
}
.journal-bottom-cta::before {
  opacity:.28;
  background-image:linear-gradient(rgba(48,60,50,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(48,60,50,.08) 1px,transparent 1px);
  background-size:48px 48px;
}
.journal-bottom-cta .editorial-overline { color:#98503b; }
.journal-bottom-cta h2 { color:#292c26; }
.journal-bottom-cta h2 em { color:#a6533c; }
.journal-bottom-cta .editorial-light-link { border-color:rgba(61,81,67,.4); color:#344239; }
.journal-bottom-cta .editorial-light-link:hover { background:#344239; color:#f4f1e8; }
.journal-bottom-cta .cta-watermark { color:rgba(52,66,57,.055); }
@media(prefers-reduced-motion:reduce){.editorial-hero *, .editorial-section *, .industry-index-section *, .editorial-bottom-cta *{scroll-behavior:auto!important;transition:none!important}}

/* Public page heroes use the available viewport below the sticky navigation. */
@supports (height: 100svh) {
  .editorial-hero {
    min-height: calc(100svh - var(--nav-h));
    padding-top: clamp(34px, 5vh, 58px);
  }
  .editorial-hero-inner {
    min-height: calc(100svh - var(--nav-h) - 120px);
  }
  .page-hero {
    min-height: calc(100svh - var(--nav-h));
    display: flex;
    align-items: center;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(38px, 6vh, 72px) 0;
  }
  .page-hero::before,
  .page-hero::after {
    position: absolute;
    z-index: -1;
    content: "";
    pointer-events: none;
  }
  .page-hero::before {
    inset: 0;
    opacity: .3;
    background-image: linear-gradient(rgba(49,55,45,.075) 1px, transparent 1px), linear-gradient(90deg, rgba(49,55,45,.075) 1px, transparent 1px);
    background-size: 66px 66px;
    mask-image: linear-gradient(90deg, transparent 8%, #000 75%);
  }
  .page-hero::after {
    top: 50%;
    right: -110px;
    width: min(48vw, 610px);
    aspect-ratio: 1;
    border: 1px solid rgba(54,72,57,.12);
    border-radius: 50%;
    box-shadow: 0 0 0 48px rgba(54,72,57,.025), 0 0 0 96px rgba(54,72,57,.02);
    transform: translateY(-50%);
  }
  .page-hero .container { width: min(100% - 64px, 1180px); }
  .page-hero .page-hero-content { max-width: 780px; }
  .page-hero .hero-title { max-width: 760px; font-size: clamp(52px, 7vw, 88px); line-height: .98; }
  .page-hero .hero-subtitle { max-width: 550px; font-size: clamp(14px, 1.2vw, 16px); line-height: 1.85; }
  .page-hero .breadcrumb { margin-bottom: clamp(28px, 5vh, 48px); }
  .careers-hero::after { right: -150px; border-color: rgba(182,83,57,.16); }
}

@media (max-width: 700px) {
  @supports (height: 100svh) {
    .editorial-hero {
      min-height: calc(100svh - var(--nav-h));
      padding: 30px 0 18px;
    }
    .editorial-hero-inner,
    .editorial-hero-work .editorial-hero-inner,
    .editorial-hero-industries .editorial-hero-inner {
      min-height: calc(100svh - var(--nav-h) - 48px);
      padding-bottom: 52px;
    }
    .page-hero {
      min-height: calc(100svh - var(--nav-h));
      padding: 34px 0 48px;
    }
    .page-hero .container { width: calc(100% - 40px); }
    .page-hero .hero-title { font-size: clamp(48px, 12vw, 68px); }
    .page-hero .breadcrumb { margin-bottom: 30px; }
    .page-hero::after { right: -230px; width: 340px; }
  }
}

/* Refined visual identities for the requested service and company heroes. */
.editorial-hero-services {
  background:
    radial-gradient(ellipse at 76% 48%, rgba(181,105,76,.12), transparent 35%),
    linear-gradient(118deg, #eeede4 0%, #e4e7dc 58%, #dce3d7 100%);
  color: #292c26;
}
.editorial-hero-services::before {
  opacity: .42;
  background-image: linear-gradient(rgba(48,60,50,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(48,60,50,.09) 1px, transparent 1px);
  mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.74) 53%, transparent 100%);
}
.editorial-hero-services::after {
  display: none;
}
.editorial-hero-services .breadcrumb,
.editorial-hero-services .breadcrumb a { color: #74776b; }
.editorial-hero-services .breadcrumb span:last-child { color: #a64e37; }
.editorial-hero-services .editorial-kicker { color: #8f503b; }
.editorial-hero-services .editorial-kicker i { background: #ad593d; box-shadow: 0 0 0 4px rgba(173,89,61,.12); }
.editorial-hero-services h1 { color: #292c26; }
.editorial-hero-services h1 em { color: #a6533c; }
.editorial-hero-services .editorial-hero-copy > p { color: #62665c; }
.editorial-hero-services .editorial-text-link { color: #3d5143; border-color: rgba(61,81,67,.38); }
.editorial-hero-services .editorial-text-link:hover { color: #a6533c; }
.editorial-hero-services .editorial-hero-foot { border-color: rgba(41,44,38,.24); color: #74776b; }
.editorial-hero-services h1 { max-width: 760px; font-size: clamp(52px, 4vw, 76px); }
.service-hero-title-line { white-space: nowrap; }
.service-hero-title-line em { white-space: nowrap; }
.editorial-hero-services .editorial-hero-copy > p { max-width: 510px; }
.service-orbit { border-color: rgba(48,60,50,.26); }
.service-orbit.orbit-b { border-color: rgba(48,60,50,.22); }
.service-orbit.orbit-c { border-color: rgba(166,78,55,.5); }
.service-orbit-core { background: #dfa181; box-shadow: 0 0 0 12px rgba(223,161,129,.12), 0 0 75px rgba(223,161,129,.27); }
.service-orbit-label { border-color: rgba(48,60,50,.2); background: rgba(248,247,239,.94); color: #3d5143; box-shadow: 0 8px 24px rgba(41,44,38,.09); }
.service-orbit-caption { color: #586457; }
.service-hero-art {
  display: flex;
  width: min(100%, 470px);
  min-height: 470px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 8px;
  margin: 0 auto;
  aspect-ratio: auto;
}
.service-orbit-stage { position: relative; width: min(100%, 340px); aspect-ratio: 1; flex: 0 0 auto; }
.service-art-steps { display: grid; width: min(100%, 400px); grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid rgba(48,60,50,.16); background: rgba(248,247,239,.82); }
.service-art-steps > div { display: grid; grid-template-columns: 22px 1fr; gap: 3px 7px; padding: 12px 9px 10px; }
.service-art-steps > div + div { border-left: 1px solid rgba(48,60,50,.16); }
.service-art-steps span { grid-row: span 2; padding-top: 2px; color: #a6533c; font-size: 8px; font-weight: 750; letter-spacing: .08em; }
.service-art-steps strong { color: #344239; font-size: 10px; font-weight: 700; }
.service-art-steps small { color: #73766c; font-size: 8px; line-height: 1.45; }

.editorial-hero-journal {
  background:
    radial-gradient(ellipse at 72% 48%, rgba(126,99,72,.2), transparent 37%),
    linear-gradient(118deg, #202923 0%, #29342e 58%, #252f29 100%);
}
.editorial-hero-journal::before { opacity: .24; }
.editorial-hero-journal .journal-orbit { filter: drop-shadow(0 22px 45px rgba(7,13,9,.16)); }
.editorial-hero-journal .orbit-core { box-shadow: 0 0 0 16px rgba(227,177,139,.08), 0 0 70px rgba(227,177,139,.13); }

.about-page-hero::after {
  right: 1%;
  width: min(42vw, 540px);
  border-color: rgba(68,94,71,.15);
  background: radial-gradient(circle, rgba(94,119,89,.1), transparent 68%);
}
.about-page-hero .section-label { color: #49654e; }
.about-page-hero .section-label::before { background: #607c61; }
.about-page-hero .hero-title .serif-italic { color: #55715a; }
.careers-hero::after {
  background: radial-gradient(circle, rgba(182,83,57,.1), transparent 68%);
}
.careers-hero .hero-title .serif-italic { color: #a64d37; }
.careers-hero .careers-hero-link { padding-bottom: 8px; border-bottom: 1px solid rgba(61,81,67,.32); }
.contact-page-hero::after {
  right: 2%;
  width: min(43vw, 560px);
  border-color: rgba(182,83,57,.15);
  background: radial-gradient(circle, rgba(182,83,57,.1), transparent 68%);
}
.contact-page-hero .section-label { color: #9d4c38; }
.contact-page-hero .section-label::before { background: #b65339; }
.contact-page-hero .hero-title .serif-italic { color: #a64d37; }

@media (max-width: 700px) {
  .editorial-hero-services::after { display: none; }
  .editorial-hero-journal::after { right: -36%; width: 85vw; }
  .service-hero-art { width: 100%; min-height: 0; gap: 2px; margin: 0 auto; }
  .editorial-hero-services h1 { font-size: clamp(48px, 11vw, 66px); }
  .service-hero-title-line { white-space: normal; }
  .service-hero-title-line em { white-space: normal; }
  .service-orbit-stage { width: min(76vw, 300px); }
  .service-art-steps { width: min(100%, 400px); }
  .service-art-steps > div { grid-template-columns: 17px 1fr; gap: 3px 5px; padding: 10px 5px 3px; }
  .service-art-steps strong { font-size: 9px; }
  .service-art-steps small { font-size: 7px; }
}

/* Give Industries its own editorial sector board instead of a second orbit graphic. */
.industry-hero-map {
  display: grid;
  width: min(100%, 470px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: center;
  gap: 10px;
  aspect-ratio: auto;
  margin: auto;
  padding: 17px;
  border: 1px solid rgba(48,60,50,.15);
  background: rgba(248,247,239,.62);
  box-shadow: 0 24px 65px rgba(41,44,38,.055);
}
.industry-hero-map .industry-map-ring,
.industry-hero-map .industry-map-caption { display: none; }
.industry-hero-map .industry-map-center {
  position: static;
  inset: auto;
  display: flex;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: space-between;
  min-height: 62px;
  padding: 0 17px;
  border-radius: 0;
  background: #344239;
  color: #f4f1e8;
  box-shadow: none;
  font-size: 8px;
  text-align: left;
}
.industry-hero-map .industry-map-center::after {
  content: "SECTOR INDEX  /  12 FIELDS";
  color: #d7ad88;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .13em;
}
.industry-hero-map .industry-map-center span { line-height: 1.35; }
.industry-hero-map .industry-map-node {
  position: relative;
  inset: auto;
  display: flex;
  min-height: 112px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 11px;
  padding: 14px;
  border: 1px solid rgba(48,60,50,.14);
  background: #fbfaf6;
  color: #a6533c;
  font-size: 8px;
  letter-spacing: .13em;
  box-shadow: none;
}
.industry-hero-map .industry-map-node::after {
  color: #303c32;
  font-family: "DM Sans", sans-serif;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.04em;
}
.industry-hero-map .node-health::after { content: "Healthcare"; }
.industry-hero-map .node-learn::after { content: "Education"; }
.industry-hero-map .node-move::after { content: "Logistics"; }
.industry-hero-map .node-trade::after { content: "Commerce"; }
.industry-hero-map .industry-map-node::before {
  position: absolute;
  top: 13px;
  right: 13px;
  content: "↗";
  color: #75806f;
  font-size: 14px;
}
.industry-editorial-grid { align-items: start; }
.industry-editorial-card { align-self: start; }

@media (max-width: 700px) {
  .industry-hero-map { width: min(100%, 430px); gap: 8px; padding: 11px; }
  .industry-hero-map .industry-map-node { min-height: 96px; padding: 11px; }
  .industry-hero-map .industry-map-node::after { font-size: 15px; }
}

/* Industry hero poster: a typographic sector atlas, distinct from the service orbit. */
.industry-hero-map {
  position: relative;
  width: min(100%, 470px);
  grid-template-columns: .9fr 1.1fr;
  grid-template-rows: repeat(4, minmax(66px, auto));
  gap: 0 18px;
  padding: 26px 24px;
  overflow: hidden;
  border: 0;
  background: linear-gradient(145deg, #344239, #27342c);
  box-shadow: 0 28px 65px rgba(35,47,39,.15);
}
.industry-hero-map::before {
  position: absolute;
  top: 25px;
  left: 20px;
  content: "KRATVYA  /  SECTOR ATLAS";
  color: #d9b08e;
  font-size: 8px;
  font-weight: 750;
  letter-spacing: .17em;
}
.industry-hero-map::after {
  position: absolute;
  top: 58px;
  bottom: 25px;
  left: 43%;
  width: 1px;
  content: "";
  background: linear-gradient(transparent, rgba(243,238,224,.25) 15%, rgba(243,238,224,.25) 85%, transparent);
}
.industry-hero-map .industry-map-center {
  position: relative;
  inset: auto;
  display: flex;
  grid-column: 1;
  grid-row: 1 / 5;
  align-items: flex-start;
  justify-content: flex-end;
  min-height: 0;
  padding: 0 0 21px;
  border-radius: 0;
  background: transparent;
  color: #f4f1e8;
  box-shadow: none;
  font-size: 8px;
  text-align: left;
}
.industry-hero-map .industry-map-center::before {
  position: absolute;
  top: 52px;
  left: -7px;
  content: "12";
  color: #e1a17e;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(130px, 15vw, 178px);
  font-weight: 400;
  letter-spacing: -.12em;
  line-height: .85;
}
.industry-hero-map .industry-map-center span { position: relative; font-size: 9px; line-height: 1.5; letter-spacing: .13em; }
.industry-hero-map .industry-map-center::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "FIELDS OF WORK  /  01—12";
  color: rgba(244,241,232,.62);
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .1em;
}
.industry-hero-map .industry-map-node {
  position: relative;
  inset: auto;
  display: flex;
  grid-column: 2;
  min-height: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 5px;
  padding: 10px 18px 10px 0;
  border: 0;
  border-bottom: 1px solid rgba(244,241,232,.19);
  background: transparent;
  color: #e1a17e;
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .16em;
  box-shadow: none;
}
.industry-hero-map .industry-map-node::after {
  color: #f4f1e8;
  font-family: "DM Sans", sans-serif;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: -.035em;
}
.industry-hero-map .industry-map-node::before { top: 50%; right: 1px; color: rgba(244,241,232,.55); transform: translateY(-50%); }

@media (max-width: 700px) {
  .industry-hero-map { width: min(100%, 430px); grid-template-rows: repeat(4, minmax(61px, auto)); gap: 0 14px; padding: 25px 18px 20px; }
  .industry-hero-map::before { left: 16px; }
  .industry-hero-map::after { left: 43%; }
  .industry-hero-map .industry-map-center::before { top: 68px; left: -5px; font-size: clamp(118px, 31vw, 150px); }
  .industry-hero-map .industry-map-center::after { font-size: 6px; }
  .industry-hero-map .industry-map-node { padding-right: 15px; }
  .industry-hero-map .industry-map-node::after { font-size: 15px; }
}

/* About page purpose, mission and vision. */
.about-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .85fr);
  align-items: center;
  gap: clamp(36px, 6vw, 92px);
}
.about-page-hero .page-hero-content { max-width: 680px; }
.about-page-hero .hero-title { font-size: clamp(48px, 5.2vw, 72px); }
.about-page-hero .hero-subtitle { max-width: 530px; }
.about-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 23px; margin-top: 29px; }
.about-hero-actions .button-ink { min-height: 48px; }
.about-hero-visual {
  position: relative;
  display: flex;
  width: min(100%, 470px);
  min-height: 440px;
  flex-direction: column;
  justify-content: space-between;
  justify-self: end;
  overflow: hidden;
  padding: 20px 23px 17px;
  border: 1px solid rgba(48,60,50,.17);
  background: linear-gradient(145deg, #344239, #27342c);
  box-shadow: 0 26px 65px rgba(35,47,39,.11);
  color: #f4f1e8;
}
.about-hero-visual::before {
  position: absolute;
  top: 56px;
  right: -68px;
  width: 270px;
  height: 270px;
  border: 1px solid rgba(244,241,232,.13);
  border-radius: 50%;
  box-shadow: 0 0 0 24px rgba(244,241,232,.025), 0 0 0 49px rgba(244,241,232,.02);
  content: "";
}
.about-visual-top,.about-visual-foot { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 12px; color: rgba(244,241,232,.63); font-size: 8px; font-weight: 700; letter-spacing: .14em; }
.about-visual-top { padding-bottom: 13px; border-bottom: 1px solid rgba(244,241,232,.19); }
.about-visual-top span:last-child { color: #e1a17e; }
.about-visual-core { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 5px 16px; padding: 26px 0 22px; }
.about-visual-monogram { grid-column: 1/-1; color: #e1a17e; font-family: "DM Serif Display", Georgia, serif; font-size: clamp(84px, 10vw, 132px); letter-spacing: -.1em; line-height: .8; }
.about-visual-core p { margin: 0; color: #f4f1e8; font-size: clamp(30px, 3.4vw, 43px); font-weight: 500; letter-spacing: -.065em; line-height: .98; }
.about-visual-core p em { color: #e1a17e; font-family: "DM Serif Display", Georgia, serif; font-weight: 400; }
.about-visual-coordinate { align-self: end; padding-bottom: 3px; color: rgba(244,241,232,.6); font-size: 7px; font-weight: 700; letter-spacing: .14em; writing-mode: vertical-rl; }
.about-visual-services { position: relative; z-index: 1; border-top: 1px solid rgba(244,241,232,.19); }
.about-visual-services > div { display: grid; grid-template-columns: 33px 1fr 18px; align-items: center; min-height: 37px; border-bottom: 1px solid rgba(244,241,232,.13); }
.about-visual-services b { color: #e1a17e; font-size: 8px; letter-spacing: .1em; }
.about-visual-services span { color: #f4f1e8; font-size: 10px; font-weight: 600; }
.about-visual-services i { color: rgba(244,241,232,.6); font-size: 12px; font-style: normal; text-align: right; }
.about-visual-foot { padding-top: 14px; font-size: 7px; }
.about-beliefs { padding: 98px 0 108px; background: #f5f3ec; color: #292c26; }
.about-beliefs-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 35px; }
.about-beliefs-heading h2 { margin: 12px 0 0; font-size: clamp(40px, 5vw, 62px); font-weight: 500; letter-spacing: -.07em; line-height: 1.02; }
.about-beliefs-heading > p { max-width: 380px; margin: 0 0 5px; color: #686c61; font-size: 13px; line-height: 1.8; }
.about-beliefs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.about-belief-card { position: relative; display: flex; min-height: 330px; flex-direction: column; padding: 24px 27px 20px; border: 1px solid rgba(41,44,38,.14); background: #fbfaf6; }
.about-belief-card.about-mission { background: #344239; color: #f4f1e8; }
.about-belief-index { color: #a6533c; font-size: 8px; font-weight: 750; letter-spacing: .15em; }
.about-mission .about-belief-index { color: #e1a17e; }
.about-belief-mark { position: absolute; top: 19px; right: 23px; color: #9aa593; font-size: 20px; }
.about-mission .about-belief-mark { color: #e1a17e; }
.about-belief-card h3 { margin: 47px 0 12px; color: #292c26; font-size: clamp(29px, 3.4vw, 42px); font-weight: 500; letter-spacing: -.06em; line-height: 1.04; }
.about-mission h3 { color: #f4f1e8; }
.about-belief-card p { max-width: 490px; margin: 0; color: #686c61; font-size: 12px; line-height: 1.85; }
.about-mission p { color: rgba(244,241,232,.72); }
.about-belief-note { position: static; margin-top: auto; padding-top: 12px; border-top: 1px solid rgba(41,44,38,.14); color: #85877c; font-size: 7px; font-weight: 750; letter-spacing: .14em; }
.about-mission .about-belief-note { border-color: rgba(244,241,232,.2); color: #d9b08e; }
@media (max-width: 900px) {
  .about-hero-layout { grid-template-columns: 1fr; gap: 32px; }
  .about-hero-visual { width: min(100%, 520px); min-height: 400px; justify-self: start; }
}
@media (max-width: 700px) {
  .about-page-hero .hero-title { font-size: clamp(43px, 11vw, 62px); }
  .about-hero-layout { gap: 26px; }
  .about-hero-actions { align-items: flex-start; gap: 15px; }
  .about-hero-visual { min-height: 365px; padding: 17px 17px 14px; }
  .about-visual-core { padding: 22px 0 18px; }
  .about-visual-monogram { font-size: 92px; }
  .about-visual-core p { font-size: 34px; }
  .about-beliefs { padding: 70px 0 76px; }
  .about-beliefs-heading { display: block; margin-bottom: 25px; }
  .about-beliefs-heading > p { margin-top: 15px; font-size: 12px; }
  .about-beliefs-grid { grid-template-columns: 1fr; gap: 10px; }
  .about-belief-card { min-height: 0; padding: 21px 20px 19px; }
  .about-belief-card h3 { margin-top: 43px; font-size: 34px; }
  .about-belief-card p { font-size: 11px; }
  .about-belief-note { margin-top: 18px; }
}

/* Replace the About service-list tile with a people-first editorial composition. */
.about-hero-visual {
  isolation: isolate;
  display: flex;
  width: min(100%, 470px);
  min-height: 430px;
  justify-content: space-between;
  overflow: visible;
  padding: 23px 25px 19px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #30372f;
}
.about-hero-visual::before {
  inset: 9px 7px 0 0;
  width: auto;
  height: auto;
  border: 0;
  border-left: 3px solid #b65339;
  border-radius: 0;
  background: #e9e7dd;
  box-shadow: 12px 12px 0 rgba(48,60,50,.08);
  transform: rotate(-2deg);
}
.about-hero-visual::after {
  position: absolute;
  z-index: -1;
  right: -7px;
  bottom: 37px;
  width: 74px;
  height: 74px;
  border: 1px solid rgba(48,60,50,.28);
  content: "";
  transform: rotate(12deg);
}
.about-art-heading,.about-art-caption { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 12px; color: #74766b; font-size: 8px; font-weight: 750; letter-spacing: .14em; }
.about-art-heading { padding-bottom: 13px; border-bottom: 1px solid rgba(48,60,50,.2); }
.about-art-heading span:last-child { color: #a6533c; }
.about-art-statement { position: relative; z-index: 1; align-self: center; width: 100%; padding: 22px 0 25px 9px; }
.about-art-statement > span { display: block; margin-bottom: 8px; color: #596257; font-size: 10px; font-weight: 650; letter-spacing: .035em; }
.about-art-statement strong { display: block; color: #344239; font-size: clamp(66px, 7vw, 91px); font-weight: 650; letter-spacing: -.095em; line-height: .92; }
.about-art-statement em { display: block; margin: -1px 0 0 30px; color: #a6533c; font-family: "DM Serif Display", Georgia, serif; font-size: clamp(48px, 5vw, 65px); font-weight: 400; letter-spacing: -.055em; line-height: 1.05; }
.about-art-statement i { position: absolute; top: 29px; right: 8px; color: #75806f; font-size: 23px; font-style: normal; }
.about-art-process { position: relative; z-index: 1; display: flex; align-items: center; gap: 11px; padding: 13px 9px; border-top: 1px solid rgba(48,60,50,.2); border-bottom: 1px solid rgba(48,60,50,.2); color: #455347; font-size: 8px; font-weight: 750; letter-spacing: .12em; }
.about-art-process b { width: 25px; height: 1px; background: #b65339; }
.about-art-caption { padding: 13px 9px 0; color: #7b7d73; font-size: 7px; letter-spacing: .12em; }
@media (max-width: 700px) {
  .about-hero-visual { min-height: 360px; padding: 20px 20px 16px; }
  .about-art-statement { padding-left: 3px; }
  .about-art-statement strong { font-size: clamp(61px, 17vw, 83px); }
  .about-art-statement em { margin-left: 21px; font-size: clamp(45px, 12vw, 59px); }
  .about-art-statement i { right: 4px; }
  .about-art-process { gap: 8px; font-size: 7px; }
  .about-art-process b { width: 16px; }
  .about-art-caption { font-size: 6px; }
}
.about-page-hero::after { display: none; }

/* Careers receives a people-first studio poster rather than a generic page graphic. */
.careers-hero::after { display:none; }
.careers-hero .container.careers-hero-layout {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(350px,.82fr);
  align-items:center;
  gap:clamp(34px,5.5vw,78px);
}
.careers-hero .page-hero-content { max-width:680px; }
.careers-hero .hero-title { font-size:clamp(48px,5.2vw,72px); }
.careers-hero-art {
  position:relative;
  isolation:isolate;
  display:flex;
  width:min(100%,460px);
  min-height:445px;
  flex-direction:column;
  justify-content:space-between;
  justify-self:end;
  overflow:hidden;
  padding:22px 24px 20px;
  background:linear-gradient(145deg,#b45d43 0%,#9e4d38 68%,#844436 100%);
  box-shadow:12px 14px 0 rgba(48,60,50,.09),0 25px 55px rgba(80,53,42,.12);
  color:#f8f3e8;
}
.careers-hero-art::before {
  position:absolute;
  z-index:-1;
  top:43px;
  right:-38px;
  content:"✳";
  color:rgba(248,243,232,.07);
  font-size:280px;
  line-height:1;
  transform:rotate(12deg);
}
.careers-art-top,.careers-art-foot { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:8px; font-weight:750; letter-spacing:.14em; }
.careers-art-top { padding-bottom:13px; border-bottom:1px solid rgba(248,243,232,.3); color:rgba(248,243,232,.77); }
.careers-art-top span:last-child { color:#f3cfaa; }
.careers-art-main { position:relative; z-index:1; padding:25px 0 19px; }
.careers-art-main > span { color:#f3cfaa; font-size:8px; font-weight:750; letter-spacing:.16em; }
.careers-art-main h2 { margin:15px 0 13px; color:#fff9ed; font-size:clamp(37px,4.3vw,56px); font-weight:500; letter-spacing:-.07em; line-height:.98; }
.careers-art-main h2 em { color:#f3cfaa; font-family:"DM Serif Display",Georgia,serif; font-weight:400; }
.careers-art-main p { margin:0; color:rgba(248,243,232,.79); font-family:"DM Serif Display",Georgia,serif; font-size:17px; line-height:1.35; }
.careers-art-values { position:relative; z-index:1; display:flex; align-items:center; flex-wrap:wrap; gap:9px; padding:12px 0; border-top:1px solid rgba(248,243,232,.3); border-bottom:1px solid rgba(248,243,232,.3); color:#fff4e3; font-size:7px; font-weight:750; letter-spacing:.11em; }
.careers-art-values b { width:15px; height:1px; background:#f3cfaa; }
.careers-art-foot { position:relative; z-index:1; padding-top:15px; color:#f3cfaa; }
.careers-art-foot > span { display:flex; align-items:baseline; gap:7px; }
.careers-art-foot strong { color:#fff9ed; font-family:"DM Serif Display",Georgia,serif; font-size:24px; font-weight:400; letter-spacing:-.03em; }
.careers-art-foot a { display:inline-flex; align-items:center; gap:8px; padding-bottom:5px; border-bottom:1px solid rgba(248,243,232,.5); color:#fff9ed; font-size:7px; font-weight:750; letter-spacing:.1em; text-decoration:none; transition:gap .18s,color .18s; }
.careers-art-foot a:hover { gap:13px; color:#f3cfaa; }
.careers-art-foot a:focus-visible { outline:2px solid #fff9ed; outline-offset:4px; }
@media (max-width:900px) {
  .careers-hero .container.careers-hero-layout { grid-template-columns:1fr; gap:30px; }
  .careers-hero-art { width:min(100%,520px); min-height:390px; justify-self:start; }
}
@media (max-width:700px) {
  .careers-hero .hero-title { font-size:clamp(43px,11vw,62px); }
  .careers-hero .container.careers-hero-layout { gap:25px; }
  .careers-hero-art { min-height:355px; padding:18px 18px 16px; }
  .careers-art-main { padding:20px 0 15px; }
  .careers-art-main h2 { font-size:clamp(36px,9vw,48px); }
  .careers-art-main p { font-size:15px; }
  .careers-art-values { gap:6px; font-size:6px; }
  .careers-art-values b { width:9px; }
}

/* Contact uses a deliberate two-message composition, isolated from legacy note styles. */
.contact-page-hero::after { display:none; }
.contact-page-hero .container.contact-hero-layout {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(350px,.82fr);
  align-items:center;
  gap:clamp(34px,5.5vw,78px);
}
.contact-page-hero .page-hero-content { max-width:660px; }
.contact-page-hero .hero-title { font-size:clamp(50px,5.3vw,74px); }
.contact-hero-art {
  position:relative;
  z-index:0;
  display:grid;
  width:min(100%,460px);
  min-height:410px;
  box-sizing:border-box;
  grid-template-rows:auto minmax(96px,1fr) auto minmax(96px,1fr) auto;
  align-items:center;
  justify-self:end;
  gap:12px;
  margin:auto;
  padding:29px 36px 22px 38px;
  isolation:isolate;
}
.contact-hero-art::before {
  position:absolute;
  z-index:-1;
  inset:25px 0 12px 13px;
  border-left:3px solid #a6533c;
  background:#e9e7dd;
  box-shadow:11px 12px 0 rgba(48,60,50,.08);
  content:"";
  transform:rotate(-2deg);
}
.contact-conversation-head,.contact-conversation-foot {
  position:relative;
  z-index:1;
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#73766b;
  font-size:7px;
  font-weight:750;
  letter-spacing:.14em;
}
.contact-conversation-head { padding:0 1px 12px 3px; border-bottom:1px solid rgba(48,60,50,.2); }
.contact-conversation-head span:last-child,.contact-conversation-foot strong { color:#a6533c; }
.contact-bubble {
  position:relative;
  z-index:1;
  width:82%;
  min-width:0;
  box-sizing:border-box;
  padding:16px 19px 17px;
  box-shadow:0 10px 22px rgba(48,60,50,.09);
}
.contact-bubble::after {
  position:absolute;
  bottom:-8px;
  width:15px;
  height:15px;
  content:"";
  transform:rotate(45deg);
}
.contact-bubble-question {
  justify-self:start;
  margin-left:2px;
  border:1px solid rgba(48,60,50,.14);
  border-left:3px solid #a6533c;
  background:#fbfaf5;
}
.contact-bubble-question::after { left:22px; border-right:1px solid rgba(48,60,50,.14); border-bottom:1px solid rgba(48,60,50,.14); background:#fbfaf5; }
.contact-bubble-reply {
  justify-self:end;
  width:78%;
  margin-right:1px;
  background:#344239;
  color:#f8f3e8;
}
.contact-bubble-reply::after { right:23px; background:#344239; }
.contact-bubble > span { display:block; padding-right:28px; color:#a6533c; font-size:7px; font-weight:750; letter-spacing:.14em; }
.contact-bubble-reply > span { color:#e8b596; }
.contact-bubble p { margin:9px 0 0; color:#344239; font-size:clamp(22px,2.5vw,31px); font-weight:550; letter-spacing:-.055em; line-height:1.08; }
.contact-bubble-reply p { color:#fbfaf5; }
.contact-bubble p em { color:#a6533c; font-family:"DM Serif Display",Georgia,serif; font-weight:400; }
.contact-bubble-reply p em { color:#e8b596; }
.contact-bubble i { position:absolute; top:16px; right:15px; color:#828477; font-size:8px; font-style:normal; letter-spacing:.1em; }
.contact-bubble-reply i { color:rgba(248,243,232,.55); }
.contact-conversation-link { position:relative; z-index:1; display:flex; width:73%; align-items:center; justify-self:center; gap:10px; color:#687064; }
.contact-conversation-link span { height:1px; min-width:10px; flex:1; background:rgba(48,60,50,.25); }
.contact-conversation-link small { white-space:nowrap; font-size:6px; font-weight:750; letter-spacing:.12em; }
.contact-conversation-foot { min-width:0; padding:12px 1px 0 3px; border-top:1px solid rgba(48,60,50,.2); color:#85877c; font-size:6px; }
.contact-conversation-foot > span { min-width:0; overflow-wrap:anywhere; }
.contact-conversation-foot strong { flex:none; font-size:7px; }
@media (max-width:900px) {
  .contact-page-hero .container.contact-hero-layout { grid-template-columns:1fr; gap:29px; }
  .contact-hero-art { width:min(100%,520px); justify-self:start; }
}
@media (max-width:700px) {
  .contact-page-hero .hero-title { font-size:clamp(44px,11vw,64px); }
  .contact-page-hero .container.contact-hero-layout { gap:23px; }
  .contact-hero-art { min-height:355px; grid-template-rows:auto minmax(86px,1fr) auto minmax(86px,1fr) auto; gap:9px; padding:20px 25px 17px 27px; }
  .contact-hero-art::before { inset:20px 0 9px 10px; }
  .contact-bubble { width:88%; padding:13px 14px 14px; }
  .contact-bubble-reply { width:84%; }
  .contact-bubble p { font-size:clamp(21px,6.2vw,27px); }
  .contact-conversation-link { width:83%; gap:7px; }
  .contact-conversation-link small { font-size:5px; }
  .contact-conversation-head,.contact-conversation-foot { font-size:6px; letter-spacing:.08em; }
  .contact-conversation-foot { gap:7px; }
  .contact-conversation-foot > span { max-width:72%; line-height:1.5; }
}

/* Streamlined contact form paired with a distinct, studio-style invitation. */
.contact-form-wrap { padding:clamp(25px,4vw,42px); }
.contact-form-wrap > h2 { margin:0; color:#292c26; font-size:clamp(27px,3vw,36px); font-weight:550; letter-spacing:-.055em; }
.contact-form-wrap .contact-form-intro { margin:8px 0 25px; color:#696c62; font-size:13px; line-height:1.65; }
.contact-form-wrap .form-row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.contact-form-wrap .form-group { min-width:0; margin-bottom:18px; }
.contact-form-wrap .form-label { color:#3f493f; font-size:11px; font-weight:700; }
.contact-form-wrap .form-control { min-height:48px; border-radius:2px; background:#fffefa; }
.contact-form-wrap textarea.form-control { min-height:142px; }
.contact-form-wrap .contact-submit { display:inline-flex; min-height:49px; align-items:center; justify-content:center; gap:13px; padding:0 22px; }
.contact-note-studio {
  position:relative;
  min-height:100%;
  box-sizing:border-box;
  overflow:hidden;
  justify-content:space-between;
  padding:clamp(28px,4vw,46px);
  border:0;
  background:#344239;
  color:#f8f3e8;
  isolation:isolate;
}
.contact-note-studio::before {
  position:absolute;
  z-index:-1;
  right:-92px;
  top:105px;
  width:260px;
  height:260px;
  border:1px solid rgba(248,243,232,.13);
  border-radius:50%;
  box-shadow:0 0 0 22px rgba(248,243,232,.035),0 0 0 48px rgba(248,243,232,.025);
  content:"";
}
.contact-note-top,.contact-note-signoff { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.contact-note-top { padding-bottom:14px; border-bottom:1px solid rgba(248,243,232,.2); color:rgba(248,243,232,.7); font-size:8px; font-weight:750; letter-spacing:.14em; }
.contact-note-top span:last-child { display:grid; width:34px; height:34px; place-items:center; border:1px solid rgba(232,181,150,.65); border-radius:50%; color:#e8b596; font-family:"DM Serif Display",Georgia,serif; font-size:17px; }
.contact-note-top img { display:block; width:34px; height:34px; object-fit:contain; border-radius:50%; background:#f7f3e8; }
.contact-note-studio .atelier-label { margin-top:auto; padding-top:32px; color:#e8b596; font-size:9px; letter-spacing:.13em; }
.contact-note-studio h2 { margin:13px 0 0; color:#fbfaf5; font-size:clamp(40px,4.8vw,58px); font-weight:500; letter-spacing:-.065em; line-height:.98; }
.contact-note-studio h2 .serif-italic { color:#e8b596; }
.contact-note-studio > p { max-width:380px; margin:19px 0 23px; color:rgba(248,243,232,.76); font-size:13px; line-height:1.8; }
.contact-note-stages { display:grid; gap:0; border-top:1px solid rgba(248,243,232,.2); }
.contact-note-stages span { padding:12px 0; border-bottom:1px solid rgba(248,243,232,.16); color:#f8f3e8; font-size:8px; font-weight:700; letter-spacing:.12em; }
.contact-note-stages span::before { margin-right:12px; color:#e8b596; content:"—"; }
.contact-note-signoff { padding-top:18px; color:rgba(248,243,232,.62); font-size:7px; font-weight:750; letter-spacing:.13em; }
.contact-note-signoff span:last-child { color:#e8b596; font-size:17px; }
@media (max-width:700px) {
  .contact-form-wrap { padding:24px 19px; }
  .contact-form-wrap .form-row { grid-template-columns:1fr; gap:0; }
  .contact-note-studio { min-height:440px; padding:26px 23px; }
  .contact-note-studio h2 { font-size:clamp(43px,12vw,56px); }
}

/* Keep button labels legible through hover, focus and press states. */
.btn-primary,
.btn-primary:hover,
.btn-primary:focus-visible,
.btn-primary:active {
  background:#303c32;
  color:#fffefa;
}
.btn-primary::after { display:none; }
.btn-primary:hover { background:#a74d34; }
.btn-primary:active { background:#833f30; transform:translateY(0); }
.btn-primary:focus-visible { outline:3px solid #c75b3e; outline-offset:4px; }
.btn-primary > span { position:relative; z-index:1; }
.button-ink,.button-ink:hover,.button-ink:focus-visible { color:#fffefa; }
.button-ink:focus-visible,.button-paper:focus-visible,.nav-cta:focus-visible,
.editorial-filter-submit:focus-visible { outline:3px solid #b65339; outline-offset:4px; }
.button-paper:hover,.button-paper:focus-visible { color:#303c32; }
.nav-cta:hover span { color:#f1c29f; }
.editorial-filter-submit:hover,.editorial-filter-submit:focus-visible { color:#fffdf6; }

/* Privacy page follows the site's warm editorial palette. */
.privacy-page { min-height:70vh; padding:clamp(42px,6vw,76px) 0 105px; background:#f0eee6; }
.privacy-container { max-width:1100px; }
.privacy-page .breadcrumb { display:flex; align-items:center; gap:12px; margin-bottom:clamp(38px,6vw,68px); font-size:12px; }
.privacy-page .breadcrumb a { color:#565b51; text-decoration:none; }
.privacy-page .breadcrumb > span:nth-child(2) { color:#b65339; }
.privacy-heading { max-width:710px; padding-bottom:36px; border-bottom:1px solid rgba(48,60,50,.2); }
.privacy-heading .section-label { color:#9d4c38; }
.privacy-heading h1 { margin:22px 0 0; color:#292c26; font-size:clamp(54px,8vw,92px); font-weight:500; letter-spacing:-.075em; line-height:.92; }
.privacy-heading h1 .serif-italic { color:#a6533c; }
.privacy-heading > p { max-width:590px; margin:23px 0 19px; color:#666a60; font-size:15px; line-height:1.8; }
.privacy-updated { color:#85877c; font-size:8px; font-weight:700; letter-spacing:.14em; }
.privacy-layout { display:grid; grid-template-columns:minmax(210px,.65fr) minmax(0,1.35fr); align-items:start; gap:clamp(34px,7vw,90px); padding-top:38px; }
.privacy-summary { position:sticky; top:calc(var(--nav-h) + 28px); padding:25px; border-top:3px solid #b65339; background:#e8e6db; }
.privacy-summary-mark { display:grid; width:42px; height:42px; place-items:center; margin-bottom:26px; border:1px solid rgba(48,60,50,.24); border-radius:50%; color:#a6533c; font-family:"DM Serif Display",Georgia,serif; font-size:24px; }
.privacy-summary-mark img { display:block; width:27px; height:27px; object-fit:contain; }
.privacy-summary-kicker { color:#a6533c; font-size:8px; font-weight:750; letter-spacing:.14em; }
.privacy-summary p { margin:11px 0 22px; color:#3f493f; font-family:"DM Serif Display",Georgia,serif; font-size:21px; line-height:1.35; }
.privacy-summary a { display:inline-flex; align-items:center; gap:10px; padding-bottom:5px; border-bottom:1px solid rgba(48,60,50,.3); color:#344239; font-size:10px; font-weight:650; text-decoration:none; }
.privacy-summary a span { color:#a6533c; font-size:15px; }
.privacy-sections { min-width:0; }
.privacy-section { display:grid; grid-template-columns:30px minmax(0,1fr); gap:15px; padding:0 0 27px; margin-bottom:27px; border-bottom:1px solid rgba(48,60,50,.16); }
.privacy-index { padding-top:6px; color:#a6533c; font-size:8px; font-weight:750; letter-spacing:.1em; }
.privacy-section h2 { margin:0 0 10px; color:#30332c; font-size:22px; font-weight:550; letter-spacing:-.04em; }
.privacy-section p { margin:0 0 10px; color:#65695f; font-size:12px; line-height:1.85; }
.privacy-section p:last-child { margin-bottom:0; }
.privacy-section a { color:#9d4c38; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:900px) {
  .privacy-layout { grid-template-columns:minmax(190px,.7fr) minmax(0,1.3fr); gap:32px; }
  .privacy-summary { padding:21px; }
  .footer-bottom nav { flex-wrap:wrap; justify-content:center; }
}
@media (max-width:700px) {
  .privacy-page { padding:32px 0 72px; }
  .privacy-page .breadcrumb { margin-bottom:38px; }
  .privacy-heading { padding-bottom:27px; }
  .privacy-heading h1 { font-size:clamp(55px,15vw,78px); }
  .privacy-heading > p { font-size:13px; }
  .privacy-layout { grid-template-columns:1fr; gap:27px; padding-top:25px; }
  .privacy-summary { position:relative; top:auto; }
  .privacy-summary-mark { margin-bottom:18px; }
  .privacy-section { grid-template-columns:24px minmax(0,1fr); gap:10px; padding-bottom:21px; margin-bottom:21px; }
  .privacy-section h2 { font-size:20px; }
  .privacy-section p { font-size:11px; }
}
.terms-page .privacy-heading h1 .serif-italic { color:#55715a; }
.terms-page .terms-summary { border-top-color:#607c61; background:#e7e9df; }
.terms-page .terms-summary-mark { border-color:rgba(69,86,68,.32); color:#55715a; }
.terms-page .privacy-summary-kicker,.terms-page .terms-summary a span { color:#55715a; }
.terms-page .terms-summary a { border-bottom-color:rgba(69,86,68,.32); }

/* Give Company the same roomy, tile-based treatment as Industries. */
.mega-menu-company { width:min(920px,calc(100vw - 48px)) !important; grid-template-columns:230px minmax(0,1fr) !important; }
.company-menu-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-content:center; gap:8px; }
.company-menu-links a {
  min-width:0;
  min-height:74px;
  grid-template-columns:32px minmax(0,1fr) 14px;
  align-content:center;
  gap:3px 10px;
  padding:11px 12px;
  border:1px solid rgba(40,43,37,.1);
  border-radius:5px;
  background:#fffefa;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.company-menu-links a:hover,.company-menu-links a:focus-visible {
  transform:translateY(-2px);
  border-color:rgba(185,79,54,.34);
  background:#fff;
  box-shadow:0 8px 20px rgba(40,43,37,.07);
}
.company-menu-links a > span {
  display:grid;
  width:28px;
  height:28px;
  grid-row:1 / 3;
  place-items:center;
  border:1px solid rgba(182,83,57,.15);
  border-radius:50%;
  background:#f3e9df;
  color:#a6533c;
  font-size:8px;
  font-weight:750;
}
.company-menu-links strong { min-width:0; font-size:11px; }
.company-menu-links small { min-width:0; font-size:8px; line-height:1.45; }
.company-menu-links b { grid-column:3; grid-row:1 / 3; }
.nav-text-trigger svg {
  flex:none;
  box-sizing:border-box;
  width:29px;
  height:29px;
  padding:7px;
  border:1px solid rgba(40,43,37,.14);
  border-radius:50%;
  background:rgba(255,254,250,.72);
  transition:background .2s ease,border-color .2s ease,stroke .2s ease,transform .2s ease;
}
.nav-has-menu:hover > .nav-text-trigger svg,
.nav-has-menu.is-open > .nav-text-trigger svg,
.nav-text-trigger:focus-visible svg { border-color:#ba5b3f; background:#ba5b3f; stroke:#fffefa; }
.nav-has-menu > .nav-text-trigger:hover,
.nav-has-menu.is-open > .nav-text-trigger { border-color:transparent; background:transparent; }
.nav-has-menu > .nav-text-trigger:hover,
.nav-has-menu.is-open > .nav-text-trigger { color:#bf5237; }
.nav-has-menu .nav-mega.mega-menu-company { top:calc(100% - 2px); }
.mega-menu-company .mega-intro { padding:22px !important; }
.mega-menu-company .company-menu-links a { border-color:rgba(69,86,68,.18); background:#f0f1e9; }
.mega-menu-company .company-menu-links a:hover,
.mega-menu-company .company-menu-links a:focus-visible { border-color:rgba(69,86,68,.42); background:#e7ebe2; }
.mega-menu-company .company-menu-links b { color:#a6533c; opacity:.8; }
.mega-menu-company .company-menu-links a:hover b,
.mega-menu-company .company-menu-links a:focus-visible b { opacity:1; }
.mega-menu-company .company-menu-links a,
.mega-menu-company .company-menu-links a:hover,
.mega-menu-company .company-menu-links a:focus-visible { color:#30332c; }
.mega-menu-company .company-menu-links a:hover strong,
.mega-menu-company .company-menu-links a:focus-visible strong { color:#a74d34; }
.mega-menu-company .company-menu-links a:hover small,
.mega-menu-company .company-menu-links a:focus-visible small { color:#62665c; }
@media (max-width:1100px) and (min-width:1025px) {
  .mega-menu-company { grid-template-columns:200px minmax(0,1fr) !important; }
  .company-menu-links { gap:6px; }
  .company-menu-links a { grid-template-columns:28px minmax(0,1fr) 12px; gap:3px 7px; padding:9px; }
}

/* Homepage positioning: show the engineering behind the interface. */
.engineering-hero {
  background:
    radial-gradient(ellipse at 77% 47%,rgba(111,132,101,.15),transparent 34%),
    linear-gradient(118deg,#f0eee6 0%,#e8e9df 57%,#e1e7dc 100%);
}
.engineering-hero .atelier-hero-grid {
  opacity:.25;
  background-image:linear-gradient(rgba(49,55,45,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(49,55,45,.09) 1px,transparent 1px);
  mask-image:linear-gradient(90deg,transparent 0%,#000 62%,#000 100%);
}
.engineering-hero .atelier-hero-layout {
  min-height:700px;
  grid-template-columns:minmax(0,1fr) minmax(390px,.92fr);
  gap:clamp(36px,5vw,72px);
  padding-top:48px;
  padding-bottom:48px;
}
.engineering-hero .atelier-copy { max-width:660px; }
.engineering-hero .eyebrow { color:#62675d; }
.engineering-hero .atelier-hero h1,.engineering-hero h1 {
  max-width:700px;
  margin-top:26px;
  font-size:clamp(48px,5.35vw,72px);
  line-height:.98;
}
.engineering-hero h1 .serif-italic { color:#a6533c; }
.engineering-hero .atelier-intro { max-width:530px; margin-top:22px; font-size:14px; }
.engineering-hero .atelier-actions { gap:20px; margin-top:26px; }
.engineering-hero .hero-footnote { margin-top:43px; }
.engineering-visual {
  position:relative;
  z-index:1;
  display:flex;
  width:min(100%,540px);
  min-height:490px;
  flex-direction:column;
  justify-self:end;
  overflow:hidden;
  box-sizing:border-box;
  padding:24px 27px 20px;
  background:#303c32;
  box-shadow:12px 14px 0 rgba(48,60,50,.08),0 26px 60px rgba(48,60,50,.13);
  color:#f8f3e8;
  isolation:isolate;
}
.engineering-visual::before {
  position:absolute;
  z-index:-1;
  inset:0;
  background-image:linear-gradient(rgba(248,243,232,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(248,243,232,.045) 1px,transparent 1px);
  background-size:32px 32px;
  content:"";
  mask-image:linear-gradient(135deg,#000,transparent 82%);
}
.engineering-visual-head,.engineering-visual-foot { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:7px; font-weight:750; letter-spacing:.14em; }
.engineering-visual-head { padding-bottom:13px; border-bottom:1px solid rgba(248,243,232,.24); color:rgba(248,243,232,.7); }
.engineering-visual-head span:last-child { color:#e8b596; }
.engineering-visual-intro { position:relative; z-index:1; padding:24px 2px 19px; }
.engineering-visual-intro > span { color:#e8b596; font-size:7px; font-weight:750; letter-spacing:.15em; }
.engineering-visual-intro strong { display:block; margin-top:11px; color:#fbfaf5; font-size:clamp(34px,3.7vw,47px); font-weight:500; letter-spacing:-.065em; line-height:.96; }
.engineering-visual-intro em { color:#e8b596; font-family:"DM Serif Display",Georgia,serif; font-weight:400; }
.engineering-layers { position:relative; z-index:1; display:grid; margin-top:auto; border-top:1px solid rgba(248,243,232,.24); }
.engineering-layers::before { position:absolute; top:25px; bottom:25px; left:12.5px; width:1px; background:rgba(232,181,150,.54); content:""; }
.engineering-layer { position:relative; display:grid; min-height:65px; grid-template-columns:35px minmax(0,1fr) 25px; align-items:center; gap:10px; border-bottom:1px solid rgba(248,243,232,.16); }
.engineering-layer > span { position:relative; z-index:1; display:grid; width:25px; height:25px; place-items:center; border:1px solid rgba(232,181,150,.62); border-radius:50%; background:#303c32; color:#e8b596; font-size:7px; font-weight:750; }
.engineering-layer > div { display:flex; min-width:0; flex-direction:column; gap:4px; }
.engineering-layer strong { color:#fbfaf5; font-size:11px; font-weight:650; }
.engineering-layer small { color:rgba(248,243,232,.69); font-size:9px; }
.engineering-layer i { color:rgba(248,243,232,.4); font-size:7px; font-style:normal; text-align:right; }
.engineering-visual-foot { justify-content:flex-start; padding-top:15px; color:rgba(248,243,232,.68); font-size:6px; }
.engineering-visual-foot b { width:23px; height:1px; background:#e8b596; }
.signal-inner > span:not(.signal-end) { color:#344239; }
.signal-inner > span:not(.signal-end)::before { display:inline-block; width:6px; height:6px; margin:0 10px 1px 0; border-radius:50%; background:#a6533c; content:""; }
.home-process-grid article > span { color:#a6533c; }
@media (max-width:1024px) {
  .engineering-hero .atelier-hero-layout { min-height:auto; grid-template-columns:1fr; gap:30px; padding-top:54px; padding-bottom:38px; }
  .engineering-hero .atelier-copy { max-width:780px; }
  .engineering-visual { width:min(100%,620px); min-height:450px; justify-self:center; }
}
@media (max-width:700px) {
  .engineering-hero .atelier-hero-layout { gap:28px; padding-top:43px; padding-bottom:31px; }
  .engineering-hero h1 { margin-top:23px; font-size:clamp(43px,11vw,64px); }
  .engineering-hero .atelier-intro { margin-top:17px; font-size:13px; }
  .engineering-hero .atelier-actions { align-items:flex-start; gap:14px; }
  .engineering-hero .hero-footnote { margin-top:27px; font-size:7px; }
  .engineering-visual { min-height:410px; padding:19px 19px 16px; }
  .engineering-visual-intro { padding:20px 2px 15px; }
  .engineering-visual-intro strong { font-size:clamp(34px,9vw,43px); }
  .engineering-layer { min-height:61px; grid-template-columns:31px minmax(0,1fr) 20px; gap:7px; }
  .engineering-layer small { font-size:8px; }
  .signal-inner { gap:10px 15px; }
  .signal-inner > span:not(.signal-end) { font-size:13px; }
  .signal-end { font-size:8px !important; }
}

/* Shared spacing and clear link tiles across every desktop mega menu. */
.nav-mega .mega-intro { padding:22px !important; }
.mega-menu-industries .mega-link-grid { gap:6px 8px; }
.mega-menu-industries .mega-link-grid a {
  min-width:0;
  border:1px solid rgba(69,86,68,.16);
  border-radius:5px;
  background:#f0f1e9;
  color:#344239;
}
.mega-menu-industries .mega-link-grid a:hover,
.mega-menu-industries .mega-link-grid a:focus-visible {
  border-color:rgba(69,86,68,.4);
  background:#e7ebe2;
  color:#a74d34;
}
.mega-menu-industries .mega-link-grid a span { opacity:.65; }
.mega-menu-industries .mega-link-grid a:hover span,
.mega-menu-industries .mega-link-grid a:focus-visible span { opacity:1; }
.nav-mega .mega-footer > a { color:#a6533c; }

/* Full-screen, page-specific legal heroes: privacy flow and terms manifesto. */
.privacy-page { padding:0 0 105px; }
.privacy-hero {
  display:grid;
  width:100%;
  max-width:none;
  min-height:calc(100svh - var(--nav-h));
  grid-template-columns:minmax(0,1fr) minmax(360px,.88fr);
  align-items:center;
  gap:clamp(38px,6vw,82px);
  box-sizing:border-box;
  padding:30px 0 48px;
  border:0;
}
.privacy-hero-copy { min-width:0; }
.privacy-hero-copy .breadcrumb { margin-bottom:clamp(38px,6vh,62px); }
.privacy-hero-copy .section-label { display:flex; }
.privacy-hero-copy h1 { max-width:670px; margin-top:22px; font-size:clamp(58px,7vw,88px); }
.privacy-hero-copy > p { max-width:520px; margin:22px 0 18px; font-size:14px; }
.privacy-hero-visual {
  position:relative;
  display:flex;
  min-width:0;
  min-height:455px;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  box-sizing:border-box;
  padding:24px 27px 20px;
  isolation:isolate;
}
.privacy-care-visual { border:1px solid rgba(48,60,50,.15); background:#e8e6db; }
.privacy-care-visual::before {
  position:absolute;
  z-index:-1;
  top:76px;
  right:-88px;
  width:260px;
  height:260px;
  border:1px solid rgba(48,60,50,.13);
  border-radius:50%;
  box-shadow:0 0 0 24px rgba(48,60,50,.035),0 0 0 52px rgba(48,60,50,.025);
  content:"";
}
.privacy-visual-top,.privacy-visual-foot,.terms-visual-top,.terms-visual-foot { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:7px; font-weight:750; letter-spacing:.14em; }
.privacy-visual-top { padding-bottom:13px; border-bottom:1px solid rgba(48,60,50,.2); color:#6e7268; }
.privacy-visual-top span:last-child { color:#a6533c; }
.privacy-care-core { display:flex; flex-direction:column; align-items:flex-start; padding:28px 0 24px 9px; }
.privacy-care-core > span { color:#a6533c; font-size:8px; font-weight:750; letter-spacing:.15em; }
.privacy-care-core strong { margin-top:10px; color:#344239; font-size:clamp(38px,4.7vw,59px); font-weight:500; letter-spacing:-.07em; line-height:.97; }
.privacy-care-core i { margin-top:14px; color:#74776d; font-size:7px; font-style:normal; font-weight:700; letter-spacing:.11em; }
.privacy-care-steps { display:grid; gap:0; padding:0 8px; border-top:1px solid rgba(48,60,50,.19); }
.privacy-care-steps > div { display:grid; grid-template-columns:29px minmax(0,1fr); gap:3px 8px; align-items:baseline; padding:10px 0; border-bottom:1px solid rgba(48,60,50,.14); }
.privacy-care-steps > div > span { grid-row:span 2; color:#a6533c; font-size:8px; font-weight:750; }
.privacy-care-steps strong { color:#39453b; font-size:8px; letter-spacing:.1em; }
.privacy-care-steps small { color:#74776d; font-size:9px; }
.privacy-care-steps > b { width:1px; height:9px; margin-left:12px; background:#b65339; }
.privacy-visual-foot { padding-top:15px; color:#73766c; font-size:6px; }
.privacy-visual-foot img { display:block; width:24px; height:24px; object-fit:contain; }
.privacy-visual-foot span:last-child { color:#a6533c; font-family:"DM Serif Display",Georgia,serif; font-size:17px; }
.terms-page .privacy-hero-copy .section-label { color:#55715a; }
.terms-page .privacy-hero-copy .section-label::before { background:#607c61; }
.terms-page .privacy-hero-copy h1 .serif-italic { color:#55715a; }
.terms-hero-visual { border-left:3px solid #607c61; background:#344239; color:#f8f3e8; }
.terms-hero-visual::before {
  position:absolute;
  z-index:-1;
  right:-61px;
  bottom:43px;
  color:rgba(248,243,232,.045);
  content:"§";
  font-family:"DM Serif Display",Georgia,serif;
  font-size:370px;
  line-height:.8;
}
.terms-visual-top { padding-bottom:13px; border-bottom:1px solid rgba(248,243,232,.22); color:rgba(248,243,232,.67); }
.terms-visual-top span:last-child { color:#e8b596; }
.terms-word-stack { display:grid; gap:0; padding:18px 4px; }
.terms-word-stack > div { display:grid; grid-template-columns:29px minmax(0,1fr); gap:0 7px; align-items:baseline; padding:7px 0 10px; border-bottom:1px solid rgba(248,243,232,.19); }
.terms-word-stack > div > span { grid-row:span 2; color:#e8b596; font-size:8px; font-weight:750; }
.terms-word-stack strong { color:#fbfaf5; font-size:clamp(42px,5.4vw,66px); font-weight:500; letter-spacing:-.075em; line-height:.95; }
.terms-word-stack strong span { color:#e8b596; font-family:"DM Serif Display",Georgia,serif; font-style:italic; }
.terms-word-stack small { color:rgba(248,243,232,.67); font-size:9px; }
.terms-visual-foot { justify-content:flex-start; padding-top:15px; border-top:1px solid rgba(248,243,232,.22); color:#e8b596; font-size:6px; }
.terms-visual-foot i { width:24px; height:1px; background:rgba(248,243,232,.5); }
@media (max-width:900px) {
  .privacy-hero { min-height:calc(100svh - var(--nav-h)); grid-template-columns:1fr; gap:30px; padding:30px 0 42px; }
  .privacy-hero-copy .breadcrumb { margin-bottom:32px; }
  .privacy-hero-copy h1 { font-size:clamp(57px,9vw,76px); }
  .privacy-hero-visual { width:min(100%,560px); min-height:390px; justify-self:center; }
}
@media (max-width:700px) {
  .privacy-page { padding:0 0 72px; }
  .privacy-hero { min-height:calc(100svh - var(--nav-h)); gap:25px; padding:25px 0 32px; }
  .privacy-hero-copy .breadcrumb { margin-bottom:32px; }
  .privacy-hero-copy h1 { font-size:clamp(54px,14vw,72px); }
  .privacy-hero-copy > p { margin:17px 0 14px; font-size:13px; }
  .privacy-hero-visual { min-height:350px; padding:19px 19px 16px; }
  .privacy-care-core { padding:20px 0 17px 5px; }
  .privacy-care-core strong { font-size:clamp(39px,11vw,53px); }
  .terms-word-stack strong { font-size:clamp(43px,12vw,58px); }
}

/* Keep the homepage capability icons centered and contained at every breakpoint. */
.atelier-services .cap-icon {
  box-sizing: border-box;
  min-width: 0;
  flex: none;
  place-self: center;
  padding: 0;
  line-height: 1;
  overflow: hidden;
}
.atelier-services .cap-icon > i {
  display: grid;
  width: 1em;
  height: 1em;
  place-items: center;
  line-height: 1;
}
@media (max-width: 700px) {
  .atelier-services .cap-icon { width: 34px; height: 34px; }
}
@media (max-width: 380px) {
  .atelier-services .cap-icon { width: 30px; height: 30px; }
}

/* Mobile and tablet layout hardening: keep content inside the actual viewport. */
@media (max-width: 1024px) {
  .editorial-hero-inner,
  .editorial-hero-copy,
  .page-hero-content,
  .about-hero-layout,
  .careers-hero .container.careers-hero-layout,
  .contact-page-hero .container.contact-hero-layout,
  .privacy-hero,
  .privacy-hero-copy,
  .privacy-hero-visual,
  .service-editorial-card,
  .industry-editorial-card,
  .journal-feature,
  .journal-feature > *,
  .work-project-card,
  .contact-layout > * {
    min-width: 0;
  }

  .journal-feature { width: 100%; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); }
  .journal-feature-art { width: 100%; min-width: 0; }
  .journal-feature-art > img { width: 100%; max-width: 100%; }
}

@media (max-width: 700px) {
  .editorial-hero .container,
  .page-hero .container { width: calc(100% - 36px); }

  .editorial-hero-inner { width: 100%; grid-template-columns: minmax(0, 1fr); }
  .editorial-hero-copy,
  .page-hero-content { width: 100%; max-width: 100%; }
  .editorial-hero h1,
  .page-hero .hero-title {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    font-size: clamp(38px, 10.8vw, 48px);
    overflow-wrap: break-word;
  }
  .editorial-hero-copy > p,
  .page-hero .hero-subtitle { width: 100%; max-width: 100%; overflow-wrap: break-word; }
  .editorial-hero-foot { min-width: 0; flex-wrap: wrap; gap: 8px 18px; line-height: 1.6; }

  .editorial-hero-services h1 { font-size: clamp(36px, 9.5vw, 43px); }
  .editorial-hero-services .service-hero-title-line,
  .editorial-hero-services .service-hero-title-line em { display: block; white-space: normal; }
  .service-hero-art,
  .service-art-steps { width: 100%; max-width: 100%; min-width: 0; }
  .service-orbit-stage { width: min(76vw, 280px); max-width: 100%; }
  .service-art-steps > div { min-width: 0; grid-template-columns: 15px minmax(0, 1fr); }
  .service-art-steps small { overflow-wrap: anywhere; }

  .industry-hero-map { width: 100%; min-width: 0; }
  .industry-hero-map .industry-map-center > span { display: none; }
  .industry-editorial-grid,
  .industry-editorial-card { min-width: 0; }
  .industry-editorial-card h3,
  .industry-editorial-card p { overflow-wrap: break-word; }

  .work-hero-art { width: min(100%, 330px); min-width: 0; overflow: hidden; }
  .work-art-window { width: 100%; }
  .work-project-grid { grid-template-columns: minmax(0, 1fr); }
  .work-project-wide { grid-template-columns: minmax(0, 1fr); }
  .work-project-copy,
  .work-project-copy h3,
  .work-project-copy p { min-width: 0; overflow-wrap: break-word; }
  .work-project-art { width: 100%; min-width: 0; }

  .journal-feature { width: 100%; grid-template-columns: minmax(0, 1fr); }
  .journal-feature > *,
  .journal-feature-art,
  .journal-feature-copy { width: 100%; min-width: 0; }
  .journal-feature-art { aspect-ratio: 1.35; }
  .journal-feature-art > img { width: 100%; height: 100%; max-width: 100%; object-fit: cover; }
  .journal-feature-copy h2,
  .journal-feature-copy p,
  .journal-card h3,
  .journal-card p { min-width: 0; overflow-wrap: break-word; }
  .journal-filter-bar,
  .editorial-filter-bar { width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .editorial-search,
  .editorial-select { min-width: 0; width: 100%; }
  .editorial-search input,
  .editorial-select select { min-width: 0; width: 100%; }

  .about-hero-layout,
  .careers-hero .container.careers-hero-layout,
  .contact-page-hero .container.contact-hero-layout { width: 100%; grid-template-columns: minmax(0, 1fr); }
  .about-page-hero .hero-title,
  .careers-hero .hero-title,
  .contact-page-hero .hero-title { font-size: clamp(38px, 10.8vw, 48px); }
  .about-page-hero .hero-subtitle,
  .careers-hero .hero-subtitle,
  .contact-page-hero .hero-subtitle { max-width: 100%; }
  .about-hero-actions { gap: 12px 18px; }
  .about-hero-visual,
  .careers-hero-art,
  .contact-hero-art { width: 100%; max-width: 100%; min-width: 0; }
  .about-art-top,
  .careers-art-top,
  .careers-art-foot { min-width: 0; flex-wrap: wrap; }
  .about-art-statement strong { font-size: clamp(52px, 15vw, 66px); }
  .about-art-statement em { font-size: clamp(42px, 11vw, 50px); }
  .careers-art-main > span { font-size: 7px; letter-spacing: .1em; overflow-wrap: anywhere; }
  .careers-art-values { min-width: 0; }
  .contact-hero-art { padding-right: 20px; padding-left: 22px; }
  .contact-bubble { max-width: 100%; }
  .contact-bubble p { font-size: clamp(19px, 5.7vw, 23px); overflow-wrap: break-word; }
  .contact-conversation-head,
  .contact-conversation-foot { min-width: 0; flex-wrap: wrap; }

  .privacy-hero { width: 100%; grid-template-columns: minmax(0, 1fr); }
  .privacy-hero-copy h1 { width: 100%; max-width: 100%; font-size: clamp(42px, 11vw, 50px); }
  .privacy-hero-copy > p { width: 100%; max-width: 100%; overflow-wrap: break-word; }
  .privacy-hero-visual { width: 100%; max-width: 100%; padding-right: 18px; padding-left: 18px; }
  .privacy-visual-top,
  .privacy-visual-foot,
  .terms-visual-top,
  .terms-visual-foot { min-width: 0; flex-wrap: wrap; gap: 6px 12px; letter-spacing: .09em; }
  .privacy-visual-top > *,
  .privacy-visual-foot > *,
  .terms-visual-top > *,
  .terms-visual-foot > * { min-width: 0; }
  .terms-word-stack strong { font-size: clamp(40px, 11vw, 50px); }

  .home-industry-grid { width: 100%; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-industry-grid a { min-width: 0; grid-template-columns: 20px minmax(0, 1fr) 14px; gap: 6px; padding: 11px 7px; }
  .home-industry-grid strong { min-width: 0; font-size: 10px; overflow-wrap: anywhere; }
  .home-industry-grid b { min-width: 0; }
  .home-process-grid { grid-template-columns: minmax(0, 1fr); }
  .home-process-grid article { min-width: 0; }
  .engineering-hero .atelier-copy,
  .engineering-hero .atelier-intro { width: 100%; max-width: 100%; min-width: 0; }
  .engineering-hero .atelier-actions { flex-direction: column; align-items: flex-start; }
  .engineering-visual { width: 100%; min-width: 0; }

  .contact-layout { grid-template-columns: minmax(0, 1fr); }
  .contact-form-wrap { width: 100%; min-width: 0; padding: 22px 18px; }
  .contact-form-wrap .form-row { grid-template-columns: minmax(0, 1fr); }
  .contact-form-wrap .form-group,
  .contact-form-wrap .form-control { width: 100%; min-width: 0; }
  .contact-note-studio { width: 100%; min-width: 0; padding-right: 20px; padding-left: 20px; }
  .contact-note-top { min-width: 0; flex-wrap: wrap; }
  .contact-note-studio h2 { font-size: clamp(38px, 10.8vw, 48px); }

  .section-heading-row,
  .editorial-section-head { grid-template-columns: minmax(0, 1fr); }
  .section-heading-row > *,
  .editorial-section-head > * { min-width: 0; }
  .atelier-heading,
  .manifesto-layout h2,
  .editorial-section-head h2 { max-width: 100%; overflow-wrap: break-word; }
  .manifesto-layout { grid-template-columns: minmax(0, 1fr) 78px; gap: 12px; }
  .manifesto-index { min-width: 0; }
  .manifesto-flower { width: 72px; height: 72px; min-width: 0; }
  .manifesto-flower::before,
  .manifesto-flower::after { width: 88px; height: 34px; }
  .contact-panel { width: 100%; min-width: 0; align-items: flex-start; padding: 26px 20px; }
  .contact-panel > div { width: 100%; min-width: 0; }
  .contact-panel h2 { max-width: 100%; font-size: clamp(29px, 8vw, 34px); overflow-wrap: break-word; }
  .contact-panel .button-paper { max-width: 100%; flex-wrap: wrap; }

  .career-role-card,
  .career-role-card > * { min-width: 0; }
  .career-role-meta { flex-wrap: wrap; gap: 8px 14px; }
  .career-role-meta > span { min-width: 0; overflow-wrap: anywhere; }
  .application-dialog { width: calc(100% - 24px); max-width: 520px; }
  .application-dialog form,
  .application-dialog .form-row { min-width: 0; grid-template-columns: minmax(0, 1fr); }

  .service-editorial-card h3,
  .service-editorial-card p,
  .service-deliverables,
  .editorial-card-link { min-width: 0; overflow-wrap: break-word; }
  .service-deliverables { gap: 6px; }
  .service-deliverables span { max-width: 100%; }
  .service-anchor-nav { max-width: 100%; }
  .service-anchor-nav a,
  .industry-jump-list a { min-height: 36px; }
}

@media (max-width: 380px) {
  .editorial-hero .container,
  .page-hero .container { width: calc(100% - 32px); }
  .editorial-hero h1,
  .page-hero .hero-title { font-size: clamp(36px, 10.5vw, 40px); }
  .editorial-hero-services h1 { font-size: 34px; }
  .contact-panel { padding-right: 16px; padding-left: 16px; }
  .contact-hero-art { padding-right: 15px; padding-left: 17px; }
  .privacy-hero-visual { padding-right: 14px; padding-left: 14px; }
  .service-orbit-caption { display: none; }
  .service-art-steps > div { grid-template-columns: 13px minmax(0, 1fr); gap: 3px; padding-right: 4px; padding-left: 4px; }
  .service-art-steps strong { font-size: 8px; }
  .service-art-steps small { font-size: 6px; }
}

@media (max-width: 700px) {
  .atelier-footer { padding: 34px 0 22px; }

  .atelier-footer > .container,
  .atelier-footer .footer-main,
  .atelier-footer .footer-bottom { min-width: 0; }

  .atelier-footer .footer-main {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding-bottom: 24px;
  }

  .atelier-footer .footer-main > .nav-logo {
    justify-self: start;
    width: max-content;
    max-width: 100%;
    min-width: 0;
    gap: 11px;
  }

  .atelier-footer .brand-mark {
    box-sizing: border-box;
    display: grid;
    flex: 0 0 42px;
    place-items: center;
    width: 42px;
    height: 42px;
    padding: 0;
    aspect-ratio: 1;
    font-size: 26px;
    line-height: 1;
  }

  .atelier-footer .brand-name { min-width: 0; font-size: 16px; }
  .atelier-footer .brand-name > span { font-size: 8px; line-height: 1.4; letter-spacing: .12em; }
  .atelier-footer .footer-main > p { display: none; }
  .atelier-footer .footer-hello { grid-column: auto; justify-self: end; text-align: right; }
  .atelier-footer .footer-bottom { flex-direction: column; align-items: center; gap: 16px; padding-top: 17px; text-align: center; }
  .atelier-footer .footer-bottom > span { width: auto; line-height: 1.5; }
  .atelier-footer .footer-bottom nav { display: grid; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); justify-items: center; gap: 12px 8px; }
  .atelier-footer .footer-bottom nav a { min-width: 0; text-align: center; }
  .atelier-footer .back-to-top { width: auto; height: auto; }
}

/* Readable type scale for public pages; preserve oversized editorial headings. */
body { font-size: 16px; }
.brand-name > span { font-size: 10px; }
.nav-menu .nav-link,
.nav-menu .nav-text-trigger { font-size: 14px; }
.nav-cta,
.button-ink,
.button-paper,
.text-link,
.manifesto-link { font-size: 14px; }
.atelier-label,
.eyebrow,
.section-label,
.editorial-kicker,
.editorial-overline { font-size: 11px; letter-spacing: .1em; }
.blog-category,
.blog-date,
.blog-read-time,
.preloader-coordinate,
.preloader-foot { font-size: 10px; }
.preloader-eyebrow,
.hero-footnote,
.cap-number,
.cap-tags,
.manifesto-index,
.company-menu-links a > span,
.career-role-type,
.career-role-index { font-size: 11px; }
.preloader-caption,
.signal-end { font-size: 12px; }
.preloader-copy strong { font-size: 23px; }
.orbit-caption,
.window-kicker,
.window-menu,
.note-index,
.journal-art-label,
.journal-art-number,
.work-art-top span,
.work-art-foot,
.work-project-placeholder > span { font-size: 9px; }
.window-brand,
.window-cta,
.journal-art-caption { font-size: 10px; }
.company-menu-links strong,
.service-mega-grid strong { font-size: 12px; }
.company-menu-links small,
.service-mega-grid small,
.mega-link-grid a { font-size: 11px; }
.home-process-grid article > span { font-size: 11px; }
.home-process-grid p { font-size: 15px; line-height: 1.75; }
.home-industry-grid strong,
.blog-meta,
.tech-badge { font-size: 12px; }
.hero-subtitle,
.section-subtitle,
.atelier-section-intro,
.atelier-intro,
.manifesto-layout > div:nth-child(2) > p:not(.atelier-label),
.editorial-hero-copy > p,
.editorial-section-head > p,
.journal-feature-copy > p,
.journal-card > p,
.work-project-copy > p,
.service-editorial-card > p,
.process-steps p,
.industry-editorial-card > p,
.industry-editorial-card details > div,
.about-beliefs-heading > p,
.about-belief-card p,
.careers-intro,
.career-role-card > p,
.career-note,
.application-heading > p,
.application-success > p,
.contact-note > p,
.contact-note-item p,
.contact-note-studio > p,
.contact-form-wrap .contact-form-intro,
.privacy-heading > p,
.privacy-section p { font-size: 15px; line-height: 1.75; }
.cap-copy > span { font-size: 14px; }
.editorial-hero-foot { font-size: 11px; letter-spacing: .09em; }
.editorial-meta,
.journal-byline,
.journal-list-head,
.work-results-bar,
.journal-results-bar,
.career-role-meta,
.privacy-updated,
.privacy-index,
.contact-note-item > span { font-size: 12px; letter-spacing: .06em; }
.editorial-card-link,
.career-apply-button,
.careers-hero-link,
.portfolio-bottom-cta .editorial-light-link,
.editorial-filter-submit,
.editorial-clear,
.service-anchor-nav a,
.industry-jump-list a,
.privacy-summary a,
.contact-form-wrap button { font-size: 14px; }

/* Direct contact details replace the former studio note on the contact form. */
.contact-details-card { min-height: 100%; }
.contact-details-card > p { display:none; }
.contact-details-card .atelier-label { margin-top: 25px; padding-top: 0; }
.contact-details-card h2 { max-width: 500px; font-size: clamp(36px,4vw,52px); }
.contact-offices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:22px; }
.contact-office { display:grid; align-content:start; gap:7px; min-width:0; padding:15px 14px; border:1px solid rgba(248,243,232,.2); background:rgba(248,243,232,.055); }
.contact-office .contact-detail-kicker { color:#e8b596; font-size:9px; font-weight:750; letter-spacing:.12em; }
.contact-office strong { color:#fbfaf5; font-size:19px; font-weight:550; letter-spacing:-.03em; }
.contact-office > span:last-child { color:rgba(248,243,232,.72); font-size:13px; }
.contact-direct-links { display:grid; gap:0; margin-top:18px; border-top:1px solid rgba(248,243,232,.2); }
.contact-direct-links a { display:grid; grid-template-columns:78px minmax(0,1fr) 18px; align-items:center; gap:10px; min-width:0; padding:13px 0; border-bottom:1px solid rgba(248,243,232,.16); color:#fbfaf5; text-decoration:none; }
.contact-direct-links a > span { color:rgba(248,243,232,.65); font-size:12px; }
.contact-direct-links a strong { min-width:0; overflow-wrap:anywhere; font-size:14px; font-weight:600; }
.contact-direct-links a b { color:#e8b596; font-size:16px; font-weight:500; }
.contact-direct-links a:hover strong,.contact-direct-links a:focus-visible strong { color:#e8b596; }
.contact-details-card .contact-note-signoff { margin-top:18px; }
@media (max-width:700px) {
  .contact-details-card { min-height:0; }
  .contact-details-card .atelier-label { margin-top:22px; }
  .contact-details-card h2 { font-size:clamp(36px,10vw,48px); }
  .contact-offices { gap:9px; }
  .contact-office { padding:12px 10px; }
  .contact-office .contact-detail-kicker { font-size:8px; letter-spacing:.08em; }
  .contact-office strong { font-size:17px; }
  .contact-direct-links a { grid-template-columns:67px minmax(0,1fr) 16px; gap:8px; }
}
.service-deliverables span,
.work-tech-list span { font-size: 12px; }
.service-card-top,
.industry-card-kicker,
.industry-card-index > b,
.industry-editorial-card details strong,
.journal-card-fallback span,
.work-project-copy::before,
.work-project-placeholder > span,
.journal-card .editorial-meta::before { font-size: 10px; }
.industry-editorial-card summary { font-size: 13px; }
.about-belief-index,
.about-belief-note,
.about-art-heading,
.about-art-caption,
.about-art-process,
.about-visual-top,
.about-visual-foot,
.about-visual-coordinate,
.careers-art-top,
.careers-art-foot,
.careers-art-main > span,
.careers-art-values,
.careers-art-foot a,
.contact-bubble > span,
.contact-bubble i,
.contact-conversation-head,
.contact-conversation-foot,
.contact-conversation-link small,
.contact-note-top,
.contact-note-stages span,
.contact-note-signoff { font-size: 10px; letter-spacing: .08em; }
.contact-note-studio .atelier-label { font-size: 11px; }
.application-form .form-label,
.contact-form-wrap .form-label { font-size: 13px; }
.application-form .form-control,
.contact-form-wrap .form-control { font-size: 16px; }
.resume-upload-help,
.application-privacy,
.application-validation,
.application-form .field-validation-error { font-size: 12px; }
.footer-main > p { font-size: 14px; }
.footer-hello { font-size: 12px; }
.footer-hello span { font-size: 15px; }
.footer-bottom,
.footer-bottom nav,
.back-to-top { font-size: 12px; }

.industry-map-node,
.industry-map-center,
.industry-map-caption,
.service-orbit-label,
.service-art-steps span,
.service-art-steps strong,
.service-art-steps small { font-size: 10px; }
.work-project-art::after,
.journal-feature-art::after,
.journal-card-art::after { font-size: 9px; letter-spacing: .04em; }
.editorial-hero .editorial-hero-foot,
.journal-feature-copy > .editorial-overline,
.journal-card .editorial-meta,
.portfolio-bottom-cta .editorial-overline,
.journal-bottom-cta .editorial-overline { font-size: 11px; }
.work-section .editorial-select select,
.journal-filter-bar .editorial-select select,
.editorial-search input,
.editorial-select select { font-size: 16px; }

main input:not([type="checkbox"]):not([type="radio"]),
main textarea,
main select { font-size: 16px; }

@media (max-width: 700px) {
  .atelier-footer .brand-name > span { font-size: 9px; }
  .atelier-footer .footer-main > p { font-size: 14px; }
  .footer-bottom { flex-wrap: wrap; font-size: 12px; }
  .footer-bottom nav { flex-wrap: wrap; gap: 10px 16px; }
  .hero-footnote { flex-wrap: wrap; row-gap: 8px; }
  .editorial-hero-foot,
  .work-results-bar,
  .journal-results-bar { flex-wrap: wrap; row-gap: 8px; }
  .editorial-hero-copy > p { font-size: 15px; }
  .editorial-section-head > p { font-size: 15px; }
  .editorial-filter-submit,
  .editorial-clear,
  .service-anchor-nav a,
  .industry-jump-list a { font-size: 13px; }
  .service-anchor-nav,
  .service-deliverables,
  .work-tech-list,
  .industry-jump-list { flex-wrap: wrap; }
  .service-deliverables span,
  .work-tech-list span,
  .tech-badge { font-size: 12px; }
  .home-industry-grid strong { font-size: 12px; overflow-wrap: anywhere; }
  .home-process-grid article > span { font-size: 11px; }
  .home-process-grid p { font-size: 15px; }
  .service-art-steps > div { min-width: 0; }
  .service-art-steps span,
  .service-art-steps strong,
  .service-art-steps small { font-size: 9px; }
  .career-role-meta { flex-wrap: wrap; }
  .work-section .editorial-select select,
  .journal-filter-bar .editorial-select select,
  .editorial-search input,
  .editorial-select select { font-size: 16px; }
}

/* Keep the mobile menu control crisp and the Services row aligned. */
@media (max-width: 1024px) {
  .nav-hamburger {
    position: relative;
    flex-direction: row;
    gap: 0;
  }

  .nav-hamburger span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 17px;
    height: 1.5px;
    opacity: 1;
    transform-origin: center;
    transition: transform .2s ease, opacity .2s ease;
  }

  .nav-hamburger span:first-child { transform: translate(-50%, calc(-50% - 3px)); }
  .nav-hamburger span:last-child { transform: translate(-50%, calc(-50% + 3px)); }
  .nav-hamburger.active span:first-child { opacity: 1; transform: translate(-50%, -50%) rotate(45deg); }
  .nav-hamburger.active span:last-child { opacity: 1; transform: translate(-50%, -50%) rotate(-45deg); }

  .drawer-group.drawer-services-group { display: block; border-bottom: 1px solid var(--border); }
  .drawer-services-head {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 64px;
  }
  .drawer-services-head > .nav-link {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    padding: 13px 0;
    border: 0;
    color: #30332c;
    font-size: 17px;
  }
  .drawer-services-head > .drawer-inline-toggle {
    display: flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: flex-end;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
  }
  .drawer-services-group > .drawer-submenu { grid-column: auto; }
}
.service-detail-hero{position:relative;display:flex;min-height:calc(100svh - var(--nav-h));overflow:hidden;background:#eeede6;padding:14px 0 16px;color:#292c26}
.service-detail-hero::before{position:absolute;inset:0;content:"";background:radial-gradient(ellipse at 78% 46%,rgba(172,89,61,.12),transparent 35%),linear-gradient(115deg,transparent 60%,rgba(41,44,38,.035) 60.1%,transparent 60.3%);pointer-events:none}
.service-detail-hero-inner{position:relative;display:grid;flex:1;grid-template-columns:1.1fr .9fr;align-items:center;gap:38px;min-height:0;padding-bottom:48px}
.service-detail-copy{max-width:680px}.service-detail-copy .breadcrumb{display:flex;gap:10px;align-items:center;margin:0 0 35px;color:#77796f;font-size:11px}.service-detail-copy .breadcrumb a{color:inherit;text-decoration:none}.service-detail-copy .breadcrumb span:last-child{color:#a6533c}.service-detail-copy .editorial-kicker{color:#8f503b}.service-detail-copy .editorial-kicker i{display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:#ad593d;vertical-align:middle}.service-detail-copy h1{max-width:690px;margin:24px 0 20px;font-size:clamp(50px,6vw,82px);font-weight:520;letter-spacing:-.075em;line-height:.98}.service-detail-copy>p{max-width:570px;color:#62665c;font-size:15px;line-height:1.9}.service-detail-copy .editorial-text-link{display:inline-flex;margin-top:18px;padding:12px 0;border-bottom:1px solid rgba(61,81,67,.38);color:#3d5143;text-decoration:none;font-size:12px;gap:12px}.service-detail-art{display:flex;justify-content:center;align-items:center;min-width:0}.detail-art-frame{position:relative;display:flex;width:min(100%,390px);aspect-ratio:1.08;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(41,44,38,.2);background:rgba(251,250,246,.62)}.detail-art-frame::before,.detail-art-frame::after{position:absolute;content:"";width:72%;height:72%;border:1px solid rgba(41,44,38,.12);transform:rotate(45deg)}.detail-art-frame::after{width:49%;height:49%;transform:rotate(22deg);border-color:rgba(166,83,60,.3)}.detail-art-index{position:absolute;top:18px;left:20px;color:#a6533c;font-size:11px;letter-spacing:.16em}.detail-art-mark{z-index:1;display:flex;width:122px;height:122px;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(41,44,38,.35);border-radius:50%;background:#eeede6}.detail-art-mark i{width:13px;height:52px;background:#a6533c;transform:rotate(25deg)}.detail-art-mark i:nth-child(2){height:74px;background:#3d5143;transform:rotate(-18deg)}.detail-art-mark i:nth-child(3){height:36px;background:#c4a875;transform:rotate(45deg)}.detail-art-caption{position:absolute;bottom:22px;left:22px;color:#292c26;font-size:12px;font-weight:650;line-height:1.6}.detail-art-caption small{color:#77796f;font-size:8px;letter-spacing:.16em}.detail-art-line{position:absolute;right:0;bottom:38px;width:32%;height:1px;background:rgba(41,44,38,.25)}.service-detail-hero-foot{position:absolute;right:0;bottom:0;left:0;display:flex;justify-content:space-between;padding:17px 0;border-top:1px solid rgba(41,44,38,.2);color:#77796f;font-size:9px;letter-spacing:.14em}.service-detail-hero-cloud{background:#e9eee9}.service-detail-hero-cloud .detail-art-mark i{background:#597765}.service-detail-hero-mobile-apps{background:#f0ece6}.service-detail-hero-mobile-apps .detail-art-mark{border-radius:28px}.service-detail-hero-ecommerce{background:#f2e9e3}.service-detail-hero-ecommerce .detail-art-mark{border-radius:15px}.service-detail-hero-ecommerce .detail-art-mark i{background:#b66043}.service-detail-hero-devops{background:#e9eceb}.service-detail-hero-devops .detail-art-mark i{height:12px;width:54px;transform:none}.service-detail-hero-ux-design{background:#eeece3}.service-detail-hero-ux-design .detail-art-mark{transform:rotate(45deg);border-radius:8px}.service-detail-hero-seo{background:#e8ede5}.service-detail-hero-seo .detail-art-mark{border-radius:8px}.service-detail-hero-seo .detail-art-mark i{align-self:flex-end;height:36px}.service-detail-hero-seo .detail-art-mark i:nth-child(2){height:60px}.service-detail-hero-seo .detail-art-mark i:nth-child(3){height:78px}
.service-detail-intro{padding:100px 0}.service-detail-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:start}.service-detail-intro-grid h2{max-width:550px;margin:20px 0 0;font-size:clamp(34px,4vw,54px);font-weight:520;letter-spacing:-.065em;line-height:1.08}.service-detail-intro-grid>div+div{padding-top:22px}.service-detail-intro-grid p{margin:0 0 18px;color:#686c61;font-size:14px;line-height:1.9}.service-detail-outcomes,.service-detail-process{padding:90px 0;background:#e9e8df}.service-outcome-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:42px;border-top:1px solid rgba(41,44,38,.2)}.service-outcome-grid article{min-height:170px;padding:20px 24px 20px 0;border-right:1px solid rgba(41,44,38,.17)}.service-outcome-grid article+article{padding-left:24px}.service-outcome-grid article:last-child{border-right:0}.service-outcome-grid span,.service-deliverable-list>div>span{color:#a6533c;font-size:10px;letter-spacing:.12em}.service-outcome-grid p{max-width:230px;margin-top:38px;color:#45483f;font-size:15px;line-height:1.6}.service-detail-deliverables{padding:96px 0}.service-deliverable-list{border-top:1px solid rgba(41,44,38,.2)}.service-deliverable-list>div{display:grid;grid-template-columns:75px 1fr 30px;align-items:center;gap:10px;padding:20px 5px;border-bottom:1px solid rgba(41,44,38,.17)}.service-deliverable-list h3{margin:0;font-size:clamp(17px,2vw,23px);font-weight:480;letter-spacing:-.035em}.service-deliverable-list b{color:#a6533c;font-size:16px}.service-detail-process{background:#303c32;color:#f4f1e8}.service-detail-process .editorial-overline,.service-detail-process .editorial-section-head>p{color:#c5cabe}.service-detail-process .editorial-section-head h2{color:#f4f1e8}.service-detail-process .process-steps article{border-color:rgba(245,241,232,.2)}.service-detail-process .process-steps article>span,.service-detail-process .process-steps p{color:#c5cabe}.service-detail-process .process-steps h3{color:#f4f1e8}.service-detail-faq{padding:95px 0}.service-detail-related{padding:60px 0;background:#eeede6}.service-related-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:26px}.service-related-head h2{margin:12px 0 0;font-size:clamp(30px,4vw,45px);font-weight:520;letter-spacing:-.06em}.service-related-links{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.service-related-links a{display:flex;justify-content:space-between;padding:15px;border:1px solid rgba(41,44,38,.15);color:#45483f;text-decoration:none;font-size:12px}.service-related-links a:hover{border-color:#a6533c;color:#a6533c}.service-detail-copy .editorial-text-link:hover{color:#a6533c}
@media(max-width:700px){.service-detail-hero{padding:calc(var(--nav-h) + 26px) 0 20px}.service-detail-hero-inner{min-height:0;grid-template-columns:1fr;gap:25px;padding-bottom:57px}.service-detail-copy .breadcrumb{margin-bottom:24px}.service-detail-copy h1{margin:21px 0 14px;font-size:clamp(44px,12vw,68px)}.service-detail-copy>p{font-size:13px}.service-detail-art{margin:auto;width:min(78vw,320px)}.detail-art-caption{font-size:10px}.service-detail-hero-foot{font-size:7px;letter-spacing:.1em}.service-detail-intro,.service-detail-deliverables,.service-detail-faq{padding:68px 0}.service-detail-intro-grid{grid-template-columns:1fr;gap:18px}.service-detail-intro-grid>div+div{padding-top:0}.service-detail-intro-grid h2{font-size:39px}.service-detail-outcomes,.service-detail-process{padding:66px 0}.service-outcome-grid{grid-template-columns:1fr 1fr;margin-top:25px}.service-outcome-grid article{min-height:135px;padding:15px 14px 15px 0}.service-outcome-grid article+article{padding-left:14px}.service-outcome-grid article:nth-child(2){border-right:0}.service-outcome-grid article:nth-child(n+3){border-top:1px solid rgba(41,44,38,.17)}.service-outcome-grid p{margin-top:24px;font-size:13px}.service-deliverable-list>div{grid-template-columns:40px 1fr 20px;padding:16px 2px}.service-related-head{align-items:start;gap:15px}.service-related-head h2{font-size:29px}.service-related-links{grid-template-columns:1fr 1fr}.service-related-links a{gap:7px;padding:12px;font-size:10px}}
.service-detail-hero-inner{min-height:540px}.service-detail-art{width:100%;min-height:420px}.service-art-browser,.service-art-cloud,.service-art-phones,.service-art-shop,.service-art-pipeline,.service-art-wireframe,.service-art-search{position:relative;width:min(100%,440px);height:365px;margin:auto;overflow:hidden}.service-art-browser{height:310px;border:1px solid rgba(41,44,38,.2);background:#fbfaf6;box-shadow:18px 20px 0 rgba(61,81,67,.09)}.browser-bar{height:39px;display:flex;align-items:center;gap:6px;padding:0 12px;border-bottom:1px solid rgba(41,44,38,.13)}.browser-bar i{width:7px;height:7px;border-radius:50%;background:#c47d65}.browser-bar i:nth-child(2){background:#d6b66f}.browser-bar i:nth-child(3){background:#78917d}.browser-bar span{margin-left:23px;color:#7b7c72;font-size:9px}.browser-content{padding:29px 30px}.browser-content small,.pipeline-label,.wireframe-label,.search-label{color:#a6533c;font-size:8px;letter-spacing:.14em}.browser-content>b{display:block;margin:13px 0;color:#303c32;font-size:38px;font-weight:500;letter-spacing:-.07em;line-height:.95}.browser-content>span{display:block;width:100px;height:8px;background:#c5d0c1}.browser-cards{display:flex;gap:9px;margin-top:19px}.browser-cards i{width:31%;height:48px;background:#e9e8df}.browser-cards i:nth-child(2){background:#dfe6dc}.browser-cards i:nth-child(3){background:#efe1d8}
.service-art-cloud{height:365px;border:1px solid rgba(41,44,38,.12);background:radial-gradient(ellipse at 50% 48%,#fbfaf6 0 25%,transparent 26%),linear-gradient(145deg,#e5ebe4,#f2f0e8)}.cloud-core{position:absolute;z-index:2;top:126px;left:calc(50% - 67px);display:grid;width:134px;height:98px;place-content:center;border-radius:45% 55% 50% 50%;background:#405846;color:white;text-align:center;font-size:12px;letter-spacing:.13em}.cloud-core small{margin-top:5px;color:#d5dfd3;font-size:7px}.cloud-node{position:absolute;z-index:2;display:grid;width:76px;height:76px;place-content:center;border:1px solid #95a894;border-radius:50%;background:#fbfaf6;color:#526c58;font-size:8px;letter-spacing:.08em}.node-one{top:28px;left:calc(50% - 38px)}.node-two{bottom:27px;left:35px}.node-three{right:35px;bottom:27px}.cloud-link{position:absolute;top:120px;left:50%;width:1px;height:80px;background:#8ea18f;transform-origin:top}.link-one{transform:rotate(0)}.link-two{transform:rotate(135deg)}.link-three{transform:rotate(-135deg)}
.service-art-phones{display:flex;height:365px;align-items:center;justify-content:center;gap:18px;background:radial-gradient(ellipse,#e8ded2,transparent 68%)}.phone{position:relative;width:142px;height:274px;border:5px solid #303c32;border-radius:25px;background:#f8f6f0;box-shadow:0 15px 32px rgba(41,44,38,.12)}.phone-back{height:238px;transform:translateY(20px) rotate(-8deg);background:#d8e1d6}.phone-front{padding:38px 15px 15px;transform:rotate(5deg)}.phone>span{position:absolute;top:12px;left:calc(50% - 18px);width:36px;height:5px;border-radius:5px;background:#303c32}.phone-front small{color:#7a806f;font-size:7px;letter-spacing:.14em}.phone-front strong{display:block;margin-top:18px;color:#303c32;font-size:22px;letter-spacing:-.07em;line-height:1}.phone-front>span{top:auto;left:15px;bottom:50px;width:102px;height:25px;padding:7px;border-radius:3px;background:#a6533c;color:white;text-align:center;font-size:8px}.phone-front>i,.phone-back>i{position:absolute;left:15px;right:15px;bottom:22px;height:8px;background:#e2e3d9}.phone-back>i{top:80px;bottom:auto;height:48px;background:#a0b19d}.phone-back>i:last-child{top:142px;height:48px;background:#b7c4b4}
.service-art-shop{height:365px;border:1px solid rgba(41,44,38,.17);background:#faf8f1}.shop-top{display:flex;height:42px;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid rgba(41,44,38,.12);color:#52624f;font-size:8px;letter-spacing:.15em}.shop-top b{font-size:14px}.shop-product{position:absolute;inset:42px 0 0;padding:24px 25px}.product-shape{float:right;display:grid;width:46%;height:186px;place-items:center;background:#eadfd2}.product-shape i{width:81px;height:116px;border-radius:35px 35px 12px 12px;background:linear-gradient(110deg,#b58b6e,#d3b69b 55%,#9d7259)}.shop-product small{display:block;margin-top:45px;color:#a6533c;font-size:7px;letter-spacing:.13em}.shop-product strong{display:block;margin-top:11px;color:#303c32;font-size:25px;font-weight:500;letter-spacing:-.06em;line-height:1}.shop-product>span{display:block;margin-top:18px;color:#56664f;font-size:9px}.shop-cart{position:absolute;bottom:16px;left:25px;color:#707368;font-size:7px;letter-spacing:.14em}.shop-cart b{margin-left:5px;color:#a6533c}
.service-art-pipeline{height:310px;padding:34px 24px;border:1px solid rgba(41,44,38,.16);background:#f7f7f1}.pipeline-label{display:block;margin-bottom:34px}.pipeline-step{display:inline-grid;width:72px;height:72px;align-content:center;justify-items:center;border:1px solid #9aaa99;border-radius:50%;background:#e9eee7;color:#354a39}.pipeline-step i{font-size:8px;font-style:normal}.pipeline-step b{margin-top:5px;font-size:8px;letter-spacing:.08em}.pipeline-arrow{display:inline-block;width:calc((100% - 216px)/2);color:#a6533c;text-align:center}.pipeline-health{position:absolute;right:22px;bottom:21px;left:22px;padding-top:12px;border-top:1px solid rgba(41,44,38,.15);color:#676d62;font-size:8px;letter-spacing:.11em}.pipeline-health i{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#679070}.pipeline-health b{float:right;color:#405846}
.service-art-wireframe{height:350px;padding:26px 30px;border:1px solid rgba(41,44,38,.16);background:#f7f5ed}.wireframe-screen{position:absolute;top:78px;left:calc(50% - 105px);width:210px;height:218px;padding:20px;border:1px solid #aeb6a8;background:#fbfaf6;box-shadow:12px 12px 0 #e4e4d9}.wireframe-screen>i{display:block;width:42px;height:9px;background:#a6533c}.wireframe-screen>b{display:block;width:130px;height:13px;margin:22px 0 14px;background:#566851}.wireframe-screen>span{display:block;width:100%;height:5px;margin:7px 0;background:#d8dbd0}.wireframe-screen>div{display:flex;gap:6px;margin-top:19px}.wireframe-screen em{width:49px;height:47px;background:#e6e7de}.wireframe-screen em:nth-child(2){background:#e8d8cc}.wireframe-note{position:absolute;padding:7px 10px;border:1px solid #b7beb1;background:#f7f5ed;color:#53644f;font-size:7px;letter-spacing:.1em}.note-a{top:98px;left:12px}.note-b{top:190px;right:5px}.note-c{bottom:24px;left:49px}
.service-art-search{height:340px;padding:30px;border:1px solid rgba(41,44,38,.16);background:#f8f8f2}.search-label{display:block;margin-bottom:20px}.search-box{height:42px;padding:12px;border:1px solid #bac1b5;background:#fff;color:#71756b;font-size:9px}.search-box b{float:right;color:#a6533c}.search-result{display:flex;gap:12px;margin-top:18px;padding:15px 12px;background:#fff}.search-result>i{width:32px;height:32px;flex:none;border-radius:50%;background:#dce6d9}.search-result span{display:grid;gap:6px}.search-result b{color:#435743;font-size:10px}.search-result small{color:#777b70;font-size:7px}.search-chart{position:absolute;right:30px;bottom:25px;left:30px;display:flex;height:92px;align-items:end;gap:12px;padding-bottom:22px;border-bottom:1px solid #b6c0b2}.search-chart i{flex:1;height:26%;background:#9fb49d}.search-chart i:nth-child(2){height:38%}.search-chart i:nth-child(3){height:33%}.search-chart i:nth-child(4){height:59%}.search-chart i:nth-child(5){height:70%}.search-chart i:nth-child(6){height:92%;background:#a6533c}.search-chart b{position:absolute;bottom:0;left:0;color:#7c8177;font-size:7px;letter-spacing:.13em}
.service-detail-focus{padding:92px 0;background:#f5f4ed}.service-focus-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 38px;margin-top:30px;border-top:1px solid rgba(41,44,38,.18)}.service-focus-grid article{position:relative;min-height:154px;padding:20px 0 20px 45px;border-bottom:1px solid rgba(41,44,38,.15)}.service-focus-grid article>span{position:absolute;top:24px;left:0;color:#a6533c;font-size:10px;letter-spacing:.12em}.service-focus-grid h3{margin:0 0 9px;color:#30352e;font-size:18px;font-weight:550;letter-spacing:-.04em}.service-focus-grid p{max-width:470px;margin:0;color:#686c61;font-size:12px;line-height:1.8}
/* Service-specific compositions keep one brand system without repeating one page skin. */
.service-detail-hero-cloud{background:linear-gradient(120deg,#e8eee8,#f4f1e8 70%)}.service-detail-hero-cloud::before{background:radial-gradient(ellipse at 77% 50%,rgba(87,117,95,.2),transparent 41%),linear-gradient(90deg,transparent 55%,rgba(87,117,95,.06) 55.1%,transparent 55.4%)}
.service-art-cloud{width:min(100%,440px);height:100%;border:1px solid rgba(65,88,70,.22);background:radial-gradient(ellipse at 50% 48%,#fbfaf6 0 25%,transparent 26%),linear-gradient(145deg,#dfe9df,#f5f3eb);box-shadow:0 22px 55px rgba(47,71,54,.1)}.cloud-core{top:calc(50% - 49px);left:calc(50% - 67px);box-shadow:0 12px 25px rgba(35,60,43,.2)}.cloud-node{width:72px;height:72px;box-shadow:0 6px 18px rgba(47,71,54,.1)}.node-one{top:20px}.node-two{bottom:20px;left:28px}.node-three{right:28px;bottom:20px}.cloud-link{z-index:1;top:calc(50% - 1px);height:1px;background:#7f9b83}.link-one{top:calc(50% - 109px);left:50%;height:60px;transform:none}.link-two{top:calc(50% + 5px);left:calc(50% - 126px);width:124px;height:1px;transform:rotate(39deg);transform-origin:right center}.link-three{top:calc(50% + 5px);left:50%;width:124px;height:1px;transform:rotate(-39deg);transform-origin:left center}
.service-art-pipeline{display:flex;height:100%;flex-direction:column;justify-content:center;padding:30px 24px;border:1px solid rgba(47,65,69,.16);background:linear-gradient(145deg,#f4f6f4,#e3e9e6);box-shadow:0 22px 55px rgba(46,65,68,.11)}.pipeline-label{margin:0 0 36px;color:#536d72}.pipeline-flow{display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr);align-items:center;gap:3px}.pipeline-step{width:min(100%,76px);aspect-ratio:1;justify-self:center;border-color:#9aaead;background:#fff;color:#3c5559;box-shadow:0 9px 22px rgba(46,65,68,.1)}.pipeline-step:nth-of-type(3){background:#dfeae4}.pipeline-step:nth-of-type(5){border-color:#9cae95;background:#e4ebe0}.pipeline-arrow{color:#a6533c;text-align:center;font-size:16px}.pipeline-health{position:static;margin-top:38px;padding-top:13px;border-color:rgba(47,65,69,.18);color:#5f6c68}.pipeline-health i{background:#688a71}.pipeline-health b{color:#486267}
.focus-cloud .service-focus-grid article,.focus-ecommerce .service-focus-grid article,.focus-mobile-apps .service-focus-grid article,.focus-seo .service-focus-grid article{margin:8px;padding:22px 18px 20px 54px;border:1px solid rgba(41,44,38,.13);background:#fbfaf6}.focus-cloud{background:#e8eee8}.focus-cloud .service-focus-grid{gap:10px;border:0}.focus-devops{background:#303c40;color:#f4f1e8}.focus-devops .editorial-section-head h2,.focus-devops .editorial-section-head>p,.focus-devops .service-focus-grid h3,.focus-devops .service-focus-grid p{color:#f4f1e8}.focus-devops .editorial-overline,.focus-devops .service-focus-grid article>span{color:#c4d3cb}.focus-devops .service-focus-grid{border-color:rgba(245,241,232,.2)}.focus-devops .service-focus-grid article{border-color:rgba(245,241,232,.18)}.outcomes-cloud{background:#dfe8df}.outcomes-devops{background:#e6eceb}.outcomes-mobile-apps{background:#f0e8df}.outcomes-ecommerce{background:#efe4da}.outcomes-ux-design{background:#e9e6dc}.outcomes-seo{background:#e3e9df}.focus-ux-design{background:#efede4}.focus-seo{background:#eaf0e6}.focus-ecommerce{background:#f4ece5}.focus-mobile-apps{background:#f3ece5}
@media(max-width:700px){.service-art-cloud{height:100%}.cloud-node{width:60px;height:60px;font-size:7px}.node-one{top:12px;left:calc(50% - 30px)}.node-two{left:15px;bottom:12px}.node-three{right:15px;bottom:12px}.cloud-core{left:calc(50% - 57px);width:114px;height:84px;top:calc(50% - 42px)}.link-one{top:calc(50% - 72px);height:40px}.link-two{left:calc(50% - 104px);width:100px}.link-three{width:100px}.service-art-pipeline{height:100%;padding:22px 12px}.pipeline-label{margin-bottom:26px;font-size:7px}.pipeline-flow{grid-template-columns:minmax(0,1fr) 17px minmax(0,1fr) 17px minmax(0,1fr);gap:1px}.pipeline-step{width:min(100%,58px)}.pipeline-step b{font-size:7px}.pipeline-arrow{font-size:13px}.pipeline-health{margin-top:25px;padding-top:10px}.focus-cloud .service-focus-grid article,.focus-ecommerce .service-focus-grid article,.focus-mobile-apps .service-focus-grid article,.focus-seo .service-focus-grid article{margin:4px;padding:17px 12px 17px 44px}}
@media(max-width:700px){.service-detail-hero-inner{min-height:0}.service-detail-art{width:min(92vw,390px);min-height:0;min-height:330px}.service-art-browser,.service-art-cloud,.service-art-phones,.service-art-shop,.service-art-pipeline,.service-art-wireframe,.service-art-search{width:min(100%,350px);height:300px}.service-art-pipeline{padding:30px 14px}.pipeline-step{width:62px;height:62px}.pipeline-arrow{width:calc((100% - 186px)/2)}.service-art-phones{height:320px}.phone{height:255px;width:132px}.phone-back{height:220px}.service-art-wireframe{height:310px}.wireframe-screen{top:70px;height:205px}.service-detail-focus{padding:67px 0}.service-focus-grid{grid-template-columns:1fr;gap:0;margin-top:23px}.service-focus-grid article{min-height:0;padding:18px 0 18px 40px}.service-focus-grid article>span{top:21px}}
/* Service detail hero: fit the first viewport and scale the illustration with it. */
.service-detail-hero{min-height:calc(100svh - var(--nav-h))!important;padding:14px 0 14px!important;display:flex!important}
.service-detail-hero-inner{min-height:0!important;flex:1!important;padding-bottom:48px!important;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important;gap:clamp(20px,3vw,42px)!important}
.service-detail-copy .breadcrumb{margin-bottom:18px!important}
.service-detail-copy h1{margin:14px 0!important;font-size:clamp(42px,5.2vw,70px)!important;line-height:.98!important}
.service-detail-copy>p{margin:0!important;line-height:1.65!important}
.service-detail-copy .editorial-text-link{margin-top:10px!important;padding:8px 0!important}
.service-detail-art{width:100%!important;height:clamp(250px,52svh,390px)!important;min-height:0!important;overflow:hidden!important}
.service-art-browser,.service-art-cloud,.service-art-phones,.service-art-shop,.service-art-pipeline,.service-art-wireframe,.service-art-search{height:100%!important;width:min(100%,440px)!important}
@media(max-width:700px){.service-detail-hero{min-height:calc(100svh - var(--nav-h))!important;padding:9px 0 10px!important}.service-detail-hero-inner{grid-template-columns:minmax(0,1fr)!important;gap:10px!important;padding-bottom:38px!important}.service-detail-copy .breadcrumb{margin-bottom:13px!important}.service-detail-copy h1{margin:10px 0!important;font-size:clamp(36px,9.5vw,54px)!important;line-height:1!important}.service-detail-copy>p{font-size:12px!important;line-height:1.55!important}.service-detail-copy .editorial-text-link{margin-top:7px!important}.service-detail-art{width:min(92vw,360px)!important;height:clamp(190px,31svh,255px)!important;min-height:0!important}.service-art-browser,.service-art-cloud,.service-art-phones,.service-art-shop,.service-art-pipeline,.service-art-wireframe,.service-art-search{width:min(100%,350px)!important;height:100%!important}.service-detail-hero-foot{padding:10px 0!important;font-size:7px!important}.service-art-pipeline{padding:22px 12px!important}.pipeline-step{width:58px!important;height:58px!important}.pipeline-arrow{width:calc((100% - 174px)/2)!important}.phone{height:220px!important;width:116px!important}.phone-back{height:194px!important}.phone-front{padding:34px 12px 12px!important}.phone-front>span{left:12px!important;width:82px!important}.service-art-phones{gap:12px!important}.wireframe-screen{top:38px!important;left:calc(50% - 90px)!important;width:180px!important;height:185px!important;padding:16px!important}.wireframe-note{padding:5px 7px!important;font-size:6px!important}.note-a{top:56px!important}.note-b{top:160px!important}.note-c{bottom:12px!important}.browser-content{padding:21px 24px!important}.browser-content>b{font-size:32px!important}.shop-product{padding:16px 18px!important}.product-shape{height:140px!important}.product-shape i{height:95px!important;width:63px!important}.shop-product small{margin-top:32px!important}.search-chart{right:20px!important;left:20px!important;bottom:18px!important}.cloud-core{top:calc(50% - 43px)!important;width:115px!important;height:86px!important;left:calc(50% - 57px)!important}.node-two{left:18px!important;bottom:18px!important}.node-three{right:18px!important;bottom:18px!important}}
/* Service page typography and individual section treatments. */
.service-detail-focus .editorial-section-head h2,.service-detail-outcomes .editorial-section-head h2{white-space:pre-line}
.service-detail-content{display:flex;flex-direction:column}
.service-page-devops .service-detail-process{order:1;background:#303c40}
.service-page-devops .service-detail-focus{order:2}
.service-page-devops .service-detail-deliverables{order:3;background:#edf0ef}
.service-page-devops .service-detail-outcomes{order:4}
.service-page-ecommerce .service-detail-outcomes{order:1}
.service-page-ecommerce .service-detail-focus{order:2}
.service-page-ecommerce .service-detail-deliverables{order:3;background:#f6f0e9}
.service-page-mobile-apps .service-detail-outcomes{order:1}
.service-page-mobile-apps .service-detail-focus{order:2}
.service-page-ux-design .service-detail-focus{order:1}
.service-page-ux-design .service-detail-intro{order:2}
.service-page-seo .service-detail-outcomes{order:1}
.service-page-seo .service-detail-focus{order:2}
.service-page-cloud .service-detail-intro{background:#f1f4ed}
.service-page-cloud .service-detail-process{background:#324a39}
.service-page-cloud .service-detail-deliverables{background:#f8f8f3}
.focus-devops .service-focus-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;border:0}
.focus-devops .service-focus-grid article{min-height:205px;padding:20px 15px;border:1px solid rgba(245,241,232,.2);background:rgba(255,255,255,.035)}
.focus-devops .service-focus-grid article>span{position:static;display:block;margin-bottom:28px}
.focus-devops .service-focus-grid h3{color:#f4f1e8;font-size:16px}
.focus-devops .service-focus-grid p{color:#c5cabe;font-size:11px}
.focus-cloud .service-focus-grid article{min-height:178px;border-left:2px solid #68846d}
.outcomes-cloud .service-outcome-grid article{border-color:rgba(52,77,58,.23)}
.outcomes-cloud .service-outcome-grid span{color:#4e7257}
@media(max-width:700px){.focus-devops .service-focus-grid{grid-template-columns:1fr 1fr;gap:7px}.focus-devops .service-focus-grid article{min-height:0;padding:16px 12px}.focus-devops .service-focus-grid article>span{margin-bottom:16px}.service-page-ux-design .service-detail-focus{order:2}.service-page-ux-design .service-detail-intro{order:1}}
.service-detail-content>.service-detail-hero{order:0}.service-detail-content>.service-detail-intro{order:1}.service-detail-content>.service-detail-focus{order:2}.service-detail-content>.service-detail-outcomes{order:3}.service-detail-content>.service-detail-deliverables{order:4}.service-detail-content>.service-detail-process{order:5}.service-detail-content>.service-detail-faq{order:6}.service-detail-content>.service-detail-related{order:7}.service-detail-content>.editorial-bottom-cta{order:8}
.service-page-devops>.service-detail-process{order:2}.service-page-devops>.service-detail-focus{order:3}.service-page-devops>.service-detail-deliverables{order:4}.service-page-devops>.service-detail-outcomes{order:5}
.service-page-ecommerce>.service-detail-outcomes{order:2}.service-page-ecommerce>.service-detail-focus{order:3}
.service-page-mobile-apps>.service-detail-outcomes{order:2}.service-page-mobile-apps>.service-detail-focus{order:3}
.service-page-ux-design>.service-detail-focus{order:2}.service-page-ux-design>.service-detail-deliverables{order:3}.service-page-ux-design>.service-detail-outcomes{order:4}
.service-page-seo>.service-detail-outcomes{order:2}.service-page-seo>.service-detail-focus{order:3}
.service-page-devops>.service-detail-hero{background:linear-gradient(115deg,#e6ecea 0%,#f4f1e8 65%,#dce7e4 100%)}.service-page-devops>.service-detail-hero::before{background:radial-gradient(ellipse at 78% 48%,rgba(72,98,103,.2),transparent 40%)}
.service-page-devops .service-detail-intro{background:#f1f3ef}.service-page-devops .service-detail-process{background:#303c40}.service-page-devops .service-detail-process .editorial-overline{color:#c4d3cb}
.service-page-ecommerce .service-detail-intro{background:#f7f0e8}.service-page-mobile-apps .service-detail-intro{background:#f5eee7}.service-page-ux-design .service-detail-intro{background:#f3f0e6}.service-page-seo .service-detail-intro{background:#eff3ec}
@media(max-width:700px){.service-detail-content>.service-detail-hero{order:0}.service-detail-content>.editorial-bottom-cta{order:8}.service-page-devops>.service-detail-process{order:2}}
/* Final refinements shared across every service page. */
.service-detail-hero-web-design{background:linear-gradient(110deg,#f0eee7,#f7f5ed 60%,#e8e9e0)}.service-detail-hero-mobile-apps{background:linear-gradient(120deg,#f2ece5,#f7f3ec 67%,#eadfd3)}.service-detail-hero-ecommerce{background:linear-gradient(120deg,#f4ebe2,#faf4ed 70%,#edddd0)}.service-detail-hero-ux-design{background:linear-gradient(120deg,#eeece3,#f8f6ef 68%,#e5e2d6)}.service-detail-hero-seo{background:linear-gradient(120deg,#e8ede5,#f6f6ef 68%,#dfe8dc)}
.service-detail-hero-cloud .service-detail-copy .editorial-kicker i{background:#5e7d64;box-shadow:0 0 0 4px rgba(94,125,100,.13)}.service-detail-hero-devops .service-detail-copy .editorial-kicker i{background:#55757a;box-shadow:0 0 0 4px rgba(85,117,122,.13)}
.service-art-cloud{overflow:hidden;border-radius:3px;background:radial-gradient(ellipse at 50% 53%,#fbfaf6 0 25%,transparent 26%),linear-gradient(145deg,#dfe9df,#f7f6ef)!important}
.cloud-art-label{position:absolute;top:22px;left:0;width:100%;color:#58735c;text-align:center;font-size:8px;letter-spacing:.14em}
.cloud-core{top:calc(50% - 47px)!important;width:128px;height:94px;border:1px solid rgba(255,255,255,.4);background:linear-gradient(145deg,#506d55,#344b39)!important;box-shadow:0 12px 26px rgba(35,60,43,.2)}
.cloud-node{z-index:2;width:74px;height:74px;border-color:#9cad99!important;color:#4e6851!important;box-shadow:0 7px 20px rgba(47,71,54,.12)}.node-one{top:50px!important;left:calc(50% - 37px)!important}.node-two{left:25px!important;bottom:23px!important}.node-three{right:25px!important;bottom:23px!important}
.cloud-link{z-index:1;height:1px!important;background:#789178!important;transform-origin:left center!important}.link-one{top:calc(50% - 96px)!important;left:50%!important;width:1px!important;height:48px!important;transform:none!important}.link-two{top:calc(50% + 39px)!important;left:calc(50% - 49px)!important;width:140px!important;transform:rotate(135deg)!important}.link-three{top:calc(50% + 39px)!important;left:calc(50% + 49px)!important;width:140px!important;transform:rotate(45deg)!important}
.service-detail-hero-devops{background:linear-gradient(115deg,#e6ecea 0%,#f4f1e8 65%,#dce7e4 100%)}.service-art-pipeline{border-radius:3px}.pipeline-step{transition:transform .2s ease}.service-art-pipeline:hover .pipeline-step:nth-child(odd){transform:translateY(-4px)}
.service-detail-deliverables .editorial-section-head h2,.service-detail-process .editorial-section-head h2{white-space:pre-line}
.service-page-web-design .service-detail-focus{background:#f4f2eb}.service-page-mobile-apps .service-detail-focus{background:#f2ebe3}.service-page-ecommerce .service-detail-focus{background:#f4ece5}.service-page-ux-design .service-detail-focus{background:#f0eee5}.service-page-seo .service-detail-focus{background:#eaf0e6}
@media(max-width:700px){.cloud-art-label{top:13px;font-size:7px}.cloud-core{top:calc(50% - 37px)!important;width:110px;height:74px}.node-one{top:38px!important;width:58px;height:58px}.node-two{left:12px!important;bottom:14px!important;width:58px;height:58px}.node-three{right:12px!important;bottom:14px!important;width:58px;height:58px}.link-one{top:calc(50% - 76px)!important;height:38px!important}.link-two{top:calc(50% + 22px)!important;left:calc(50% - 43px)!important;width:102px!important}.link-three{top:calc(50% + 22px)!important;left:calc(50% + 43px)!important;width:102px!important}.pipeline-flow{grid-template-columns:minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr)!important}}
@media(max-width:700px){.service-art-cloud{min-height:235px!important}.cloud-node.node-one{top:10%!important;left:calc(50% - 29px)!important;width:58px!important;height:58px!important}.cloud-node.node-two{top:calc(50% - 29px)!important;left:12px!important;bottom:auto!important;width:58px!important;height:58px!important}.cloud-node.node-three{top:calc(50% - 29px)!important;right:12px!important;bottom:auto!important;width:58px!important;height:58px!important}.cloud-core{top:calc(50% - 37px)!important;left:calc(50% - 55px)!important;width:110px!important;height:74px!important}.cloud-link.link-one{top:calc(10% + 58px)!important;left:50%!important;width:1px!important;height:10px!important}.cloud-link.link-two{top:50%!important;left:70px!important;width:calc(50% - 125px)!important;height:1px!important;transform:none!important}.cloud-link.link-three{top:50%!important;left:calc(50% + 55px)!important;width:calc(50% - 125px)!important;height:1px!important;transform:none!important}}
/* Cloud artwork rebuilt as one scalable vector so every connector terminates on its node. */
.service-detail-hero-cloud .service-detail-art{height:clamp(360px,52svh,450px)!important;overflow:visible!important}
.service-detail-hero-cloud .service-art-cloud{box-sizing:border-box;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(100%,500px)!important;height:100%!important;min-height:0!important;margin:auto;padding:20px 24px 16px;border:1px solid rgba(65,88,70,.24);border-radius:4px;background:linear-gradient(145deg,#e4ece3,#f4f4ec 78%)!important;box-shadow:0 20px 48px rgba(47,71,54,.10);overflow:hidden}
.cloud-art-label{position:static;width:100%;color:#5c765f;text-align:center;font-size:8px;letter-spacing:.16em}
.service-cloud-diagram{display:block;width:100%;height:100%;min-height:0;overflow:visible}
.service-cloud-diagram .cloud-connections path{fill:none;stroke:#789178;stroke-width:1.5;stroke-linecap:round}
.service-cloud-diagram .cloud-service-node circle{fill:#fbfaf6;stroke:#9caf9b;stroke-width:1.2;filter:drop-shadow(0 5px 8px rgba(45,68,49,.10))}
.service-cloud-diagram .cloud-service-node text{fill:#557056;font:italic 8px Arial,sans-serif;letter-spacing:1px;text-anchor:middle}
.service-cloud-diagram .cloud-hub rect{fill:url(#cloudHub);stroke:rgba(255,255,255,.35);stroke-width:1}
.service-cloud-diagram .cloud-hub path{fill:#f5f7f1}
.service-cloud-diagram .cloud-hub text{fill:#f5f7f1;font:600 8px Arial,sans-serif;letter-spacing:1.7px;text-anchor:middle}
.cloud-art-foot{display:flex;align-items:center;justify-content:center;gap:9px;color:#748371;font-size:7px;letter-spacing:.13em}.cloud-art-foot i{width:3px;height:3px;border-radius:50%;background:#a6533c}
@media(max-width:700px){.service-detail-hero-cloud .service-detail-art{width:min(100%,390px)!important;height:clamp(270px,34svh,310px)!important;min-height:0!important;margin:0 auto}.service-detail-hero-cloud .service-art-cloud{width:100%!important;height:100%!important;padding:14px 15px 12px}.cloud-art-label{font-size:7px}.cloud-art-foot{gap:6px;font-size:6px}.service-cloud-diagram{min-height:0}}
/* Cloud illustration sits in the hero as an open composition, not a framed panel. */
.service-detail-hero-cloud .service-detail-art{overflow:visible!important}
.service-detail-hero-cloud .service-art-cloud{position:relative;isolation:isolate;overflow:visible!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.service-detail-hero-cloud .service-art-cloud::before{position:absolute;z-index:-2;inset:8% 7%;border-radius:50%;background:radial-gradient(ellipse at 50% 48%,rgba(206,222,202,.74) 0,rgba(218,230,213,.42) 46%,rgba(231,237,224,.12) 72%,transparent 74%);content:""}
.service-detail-hero-cloud .service-art-cloud::after{position:absolute;z-index:-1;inset:5% 8%;border:1px solid rgba(83,112,84,.12);border-radius:50%;transform:rotate(-14deg);content:""}
.service-detail-hero-cloud .cloud-art-label{color:#5c765f}
.service-detail-hero-cloud .cloud-art-foot{color:#687b68}
.service-detail-hero-cloud .service-cloud-diagram .cloud-service-node circle{fill:rgba(250,250,245,.95);stroke:#9caf9b;filter:drop-shadow(0 7px 12px rgba(45,68,49,.12))}
.service-detail-hero-cloud .service-cloud-diagram .cloud-hub rect{stroke:rgba(255,255,255,.65);stroke-width:1.5}
/* Give the cloud diagram the full right-column canvas and remove split-panel artifacts. */
.service-detail-hero-cloud::before{background:radial-gradient(ellipse at 78% 48%,rgba(177,199,174,.22),transparent 43%)!important}
.service-detail-hero-cloud .service-detail-art{height:clamp(440px,64svh,560px)!important;overflow:visible!important}
.service-detail-hero-cloud .service-art-cloud{width:min(100%,640px)!important;height:100%!important;padding:14px 12px 10px!important}
.service-detail-hero-cloud .service-art-cloud::before{inset:10% 12%!important;background:radial-gradient(ellipse at 50% 50%,rgba(204,221,200,.64) 0,rgba(218,230,213,.3) 52%,rgba(231,237,224,.08) 72%,transparent 74%)!important}
.service-detail-hero-cloud .service-art-cloud::after{display:none!important}
.service-detail-hero-cloud .cloud-art-label{font-size:9px;letter-spacing:.19em}
.service-detail-hero-cloud .cloud-art-foot{font-size:8px;letter-spacing:.16em}
.service-detail-hero-cloud .service-cloud-diagram .cloud-service-node text{font-size:11px;letter-spacing:1.2px}
.service-detail-hero-cloud .service-cloud-diagram .cloud-hub text{font-size:10px;letter-spacing:2px}
@media(max-width:700px){.service-detail-hero-cloud .service-detail-art{width:min(100%,420px)!important;height:clamp(290px,42svh,340px)!important;min-height:0!important}.service-detail-hero-cloud .service-art-cloud{padding:12px 8px 8px!important}.service-detail-hero-cloud .cloud-art-label{font-size:7px}.service-detail-hero-cloud .cloud-art-foot{font-size:6px}.service-detail-hero-cloud .service-cloud-diagram .cloud-service-node text{font-size:11px}}
/* Enlarge the cloud composition and its labels without restoring the old panel. */
.service-detail-hero-cloud .service-detail-art{height:clamp(500px,72svh,650px)!important}
.service-detail-hero-cloud .service-art-cloud{width:min(100%,720px)!important;height:100%!important}
.service-detail-hero-cloud .service-cloud-diagram{transform:scale(1.18);transform-origin:50% 50%}
.service-detail-hero-cloud .cloud-art-label{font-size:10px;letter-spacing:.2em}
.service-detail-hero-cloud .cloud-art-foot{font-size:9px;letter-spacing:.17em}
.service-detail-hero-cloud .service-cloud-diagram .cloud-service-node text{font-size:13px;letter-spacing:1.4px}
.service-detail-hero-cloud .service-cloud-diagram .cloud-hub text{font-size:12px;letter-spacing:2.2px}
@media(max-width:700px){.service-detail-hero-cloud .service-detail-art{height:clamp(290px,42svh,340px)!important}.service-detail-hero-cloud .service-art-cloud{width:min(100%,420px)!important}.service-detail-hero-cloud .service-cloud-diagram{transform:scale(1.04)}.service-detail-hero-cloud .cloud-art-label{font-size:7px}.service-detail-hero-cloud .cloud-art-foot{font-size:6px}}
/* Keep the full cloud diagram inside its own canvas; no scaling over labels. */
.service-detail-hero-cloud .service-detail-art{height:clamp(390px,54svh,490px)!important}
.service-detail-hero-cloud .service-art-cloud{width:min(100%,650px)!important;height:100%!important;grid-template-rows:auto minmax(0,1fr) auto;row-gap:8px;padding:22px 12px 12px!important}
.service-detail-hero-cloud .service-art-cloud::before{inset:12% 18%!important;background:radial-gradient(ellipse at 50% 48%,rgba(204,221,200,.55) 0,rgba(218,230,213,.22) 54%,transparent 76%)!important}
.service-detail-hero-cloud .service-cloud-diagram{transform:none!important}
.service-detail-hero-cloud .cloud-art-label{font-size:9px;letter-spacing:.17em}
.service-detail-hero-cloud .cloud-art-foot{font-size:8px;letter-spacing:.13em}
@media(max-width:700px){.service-detail-hero-cloud .service-detail-art{height:clamp(270px,37svh,310px)!important}.service-detail-hero-cloud .service-art-cloud{padding:14px 8px 10px!important;row-gap:5px}.service-detail-hero-cloud .service-cloud-diagram{transform:none!important}.service-detail-hero-cloud .cloud-art-label{font-size:7px}.service-detail-hero-cloud .cloud-art-foot{font-size:6px}}
.service-detail-hero-cloud .service-detail-art{position:relative;top:clamp(24px,5svh,48px)!important}
@media(max-width:700px){.service-detail-hero-cloud .service-detail-art{top:0!important}}

/* Service detail pages: distinct editorial systems below each hero. */
.service-detail-content{--service-accent:#b95b40;--service-soft:#f5f1e9;--service-ink:#30352e}
.service-detail-intro-grid>div+div{position:relative;padding:25px 28px 24px!important;border-top:1px solid color-mix(in srgb,var(--service-accent) 45%,transparent);background:linear-gradient(135deg,var(--service-soft),transparent 82%)}
.service-detail-intro-grid>div+div:before{position:absolute;top:-4px;left:0;width:34px;height:6px;background:var(--service-accent);content:""}
.service-detail-focus{position:relative;overflow:hidden}
.service-detail-focus:after{position:absolute;top:44px;right:4vw;color:color-mix(in srgb,var(--service-accent) 10%,transparent);font-size:clamp(100px,17vw,230px);font-weight:650;letter-spacing:-.1em;line-height:1;content:"/";pointer-events:none}
.service-detail-focus .container,.service-detail-outcomes .container,.service-detail-deliverables .container,.service-detail-process .container{position:relative;z-index:1}
.service-focus-grid article,.service-outcome-grid article,.service-deliverable-list>div,.process-steps article{transition:transform .24s ease,border-color .24s ease,background-color .24s ease}
.service-detail-content .editorial-bottom-cta{position:relative;overflow:hidden;background:var(--service-ink)}
.service-page-web-design{--service-accent:#b75d42;--service-soft:#f7f1e9;--service-ink:#344338}
.service-page-cloud{--service-accent:#55785d;--service-soft:#edf2e9;--service-ink:#304b38}
.service-page-mobile-apps{--service-accent:#bd7355;--service-soft:#f5ece5;--service-ink:#493a34}
.service-page-ecommerce{--service-accent:#aa6747;--service-soft:#f5ece3;--service-ink:#493b32}
.service-page-devops{--service-accent:#568087;--service-soft:#eaf0ef;--service-ink:#303f43}
.service-page-ux-design{--service-accent:#9a8050;--service-soft:#f1eee2;--service-ink:#454337}
.service-page-seo{--service-accent:#68805b;--service-soft:#edf1e8;--service-ink:#354637}

/* Web: a crisp component-led system. */
.service-page-web-design .service-detail-focus{background:#f4f2eb}
.service-page-web-design .service-focus-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;border:0}
.service-page-web-design .service-focus-grid article{min-height:205px;padding:19px 16px;border:1px solid rgba(48,53,46,.13);background:#fbfaf6;box-shadow:0 8px 25px rgba(48,53,46,.035)}
.service-page-web-design .service-focus-grid article>span{position:static;display:grid;width:33px;height:33px;margin-bottom:25px;place-items:center;border-radius:50%;background:#f0e2d8;color:var(--service-accent)}
.service-page-web-design .service-detail-outcomes{background:#e9e8df}
.service-page-web-design .service-outcome-grid article{min-height:155px}
.service-page-web-design .service-detail-deliverables{background:#fbfaf6}
.service-page-web-design .service-deliverable-list>div:hover{padding-left:14px;background:#f5f1e9}

/* Cloud: connected, calm infrastructure blocks. */
.service-page-cloud .service-detail-intro{background:#f1f4ed}
.service-page-cloud .service-detail-outcomes{background:#e6ece3}
.service-page-cloud .service-outcome-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border:0}
.service-page-cloud .service-outcome-grid article{display:flex;min-height:118px;align-items:center;gap:22px;padding:20px 24px;border:1px solid rgba(67,99,72,.2);background:rgba(250,250,245,.58)}
.service-page-cloud .service-outcome-grid p{margin:0;max-width:340px}
.service-page-cloud .service-detail-focus{background:#f8f8f3}
.service-page-cloud .service-focus-grid article{min-height:160px;padding:20px 14px 20px 50px;border-bottom-color:rgba(67,99,72,.19);border-left:2px solid #78937a}
.service-page-cloud .service-detail-process{background:#324a39}
.service-page-cloud .service-detail-deliverables{background:#f3f5ef}
.service-page-cloud .service-deliverable-list>div:hover{padding-left:14px;background:#e9efe7}

/* Mobile: tactile, rounded cards with a warm product palette. */
.service-page-mobile-apps .service-detail-outcomes{background:#eee3d9}
.service-page-mobile-apps .service-outcome-grid{gap:10px;border:0}
.service-page-mobile-apps .service-outcome-grid article{min-height:145px;padding:18px;border:1px solid rgba(151,91,65,.18);border-radius:14px;background:#f8f3ed}
.service-page-mobile-apps .service-outcome-grid article+article{padding-left:18px}
.service-page-mobile-apps .service-outcome-grid p{margin-top:24px}
.service-page-mobile-apps .service-detail-focus{background:#faf7f2}
.service-page-mobile-apps .service-focus-grid{gap:11px;border:0}
.service-page-mobile-apps .service-focus-grid article{min-height:180px;padding:20px;border:1px solid rgba(151,91,65,.18);border-radius:14px;background:#f3eae1}
.service-page-mobile-apps .service-focus-grid article>span{position:static;display:block;margin-bottom:21px}
.service-page-mobile-apps .service-detail-deliverables{background:#f2ece5}
.service-page-mobile-apps .service-deliverable-list>div{border-color:rgba(151,91,65,.2)}
.service-page-mobile-apps .service-deliverable-list>div:hover{padding-left:14px;background:#faf6f0}

/* Commerce: catalogue-like two-column service scope. */
.service-page-ecommerce .service-detail-intro{background:#f7f0e8}
.service-page-ecommerce .service-detail-focus{background:#f4ece5}
.service-page-ecommerce .service-focus-grid{gap:0 22px}
.service-page-ecommerce .service-focus-grid article{min-height:175px;padding:23px 18px 20px 54px;border:1px solid rgba(145,91,62,.16);background:rgba(255,252,247,.62)}
.service-page-ecommerce .service-focus-grid article>span{top:26px;left:17px}
.service-page-ecommerce .service-detail-deliverables{background:#fbf6ef}
.service-page-ecommerce .service-deliverable-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;border:0}
.service-page-ecommerce .service-deliverable-list>div{grid-template-columns:38px 1fr 24px;min-height:84px;padding:14px 16px;border:1px solid rgba(145,91,62,.19);background:#f7eee4}
.service-page-ecommerce .service-deliverable-list>div:hover{transform:translateY(-3px);background:#fffaf4}
.service-page-ecommerce .service-detail-outcomes{background:#eee3d8}

/* DevOps: high-contrast operational sequence. */
.service-page-devops .service-detail-process{background:#303f43}
.service-page-devops .service-detail-process .process-steps{gap:10px}
.service-page-devops .service-detail-process .process-steps article{min-height:210px;padding:20px;border:1px solid rgba(221,235,232,.2);background:rgba(255,255,255,.035)}
.service-page-devops .service-detail-process .process-steps article>span{display:grid;width:36px;height:36px;margin-bottom:25px;place-items:center;border:1px solid rgba(195,219,214,.35);border-radius:50%;color:#c4d8d2}
.service-page-devops .service-detail-focus{background:#eaf0ef}
.service-page-devops .service-detail-outcomes{background:#dfe9e7}
.service-page-devops .service-outcome-grid article{border-color:rgba(64,105,111,.25)}
.service-page-devops .service-detail-deliverables{background:#f4f6f4}
.service-page-devops .service-deliverable-list>div:hover{padding-left:14px;background:#e8efed}

/* UX: research notes and a shared journey map. */
.service-page-ux-design .service-detail-intro{background:#f3f0e6}
.service-page-ux-design .service-detail-focus{background:#f0eee5}
.service-page-ux-design .service-focus-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;border:0}
.service-page-ux-design .service-focus-grid article{min-height:175px;padding:22px 20px 18px 67px;border:1px solid rgba(131,111,66,.2);background:#f9f7ef}
.service-page-ux-design .service-focus-grid article>span{top:22px;left:19px;font-size:16px;color:#9a8050}
.service-page-ux-design .service-detail-outcomes{background:#e9e5d8}
.service-page-ux-design .service-outcome-grid article{border-color:rgba(131,111,66,.25)}
.service-page-ux-design .service-detail-deliverables{background:#f8f6ee}
.service-page-ux-design .service-deliverable-list>div:hover{padding-left:14px;background:#eeeadc}

/* SEO: search-led growth dashboard treatment. */
.service-page-seo .service-detail-outcomes{background:#e6ece1}
.service-page-seo .service-outcome-grid{gap:10px;border:0}
.service-page-seo .service-outcome-grid article{min-height:145px;padding:18px;border:1px solid rgba(81,112,73,.2);background:#f4f6f0}
.service-page-seo .service-outcome-grid article+article{padding-left:18px}
.service-page-seo .service-outcome-grid p{margin-top:22px}
.service-page-seo .service-detail-focus{background:#edf1e8}
.service-page-seo .service-focus-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;border:0}
.service-page-seo .service-focus-grid article{min-height:215px;padding:18px 15px;border-top:2px solid #78906c;background:rgba(250,251,247,.72)}
.service-page-seo .service-focus-grid article>span{position:static;display:block;margin-bottom:30px}
.service-page-seo .service-detail-deliverables{background:#f7f8f3}
.service-page-seo .service-deliverable-list>div:hover{padding-left:14px;background:#edf2e8}

@media(max-width:900px){
 .service-page-web-design .service-focus-grid,.service-page-seo .service-focus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 .service-detail-intro-grid>div+div{padding:20px 16px!important}
 .service-detail-focus:after{top:20px;right:14px;font-size:100px}
 .service-page-web-design .service-focus-grid,.service-page-mobile-apps .service-focus-grid,.service-page-ux-design .service-focus-grid,.service-page-seo .service-focus-grid{grid-template-columns:1fr 1fr;gap:8px}
 .service-page-web-design .service-focus-grid article,.service-page-seo .service-focus-grid article{min-height:185px;padding:15px 12px}
 .service-page-web-design .service-focus-grid article>span,.service-page-seo .service-focus-grid article>span{margin-bottom:18px}
 .service-page-mobile-apps .service-focus-grid article{min-height:170px;padding:15px 12px}
 .service-page-ux-design .service-focus-grid article{min-height:180px;padding:17px 12px 15px 43px}
 .service-page-ux-design .service-focus-grid article>span{top:17px;left:12px;font-size:12px}
 .service-page-cloud .service-outcome-grid{grid-template-columns:1fr;gap:8px}
 .service-page-cloud .service-outcome-grid article{min-height:88px;padding:15px}
 .service-page-ecommerce .service-deliverable-list{grid-template-columns:1fr}
 .service-page-ecommerce .service-deliverable-list>div{min-height:70px;padding:12px}
 .service-page-devops .service-detail-process .process-steps article{min-height:0;padding:16px}
 .service-page-devops .service-detail-process .process-steps article>span{margin-bottom:15px}
 .service-page-seo .service-outcome-grid{grid-template-columns:1fr 1fr;gap:7px}
 .service-page-seo .service-outcome-grid article{min-height:125px;padding:13px}
 .service-page-seo .service-outcome-grid article+article{padding-left:13px}
}

/* Individually art-directed service detail bodies. */
.svc-page{--svc-accent:#b95b40;--svc-ink:#30352e;--svc-muted:#686c61;--svc-paper:#f5f2eb;color:var(--svc-ink)}
.svc-page section{position:relative;padding:clamp(70px,8vw,116px) 0;overflow:hidden}
.svc-page h2{margin:14px 0 20px;font-size:clamp(36px,5vw,66px);font-weight:520;letter-spacing:-.068em;line-height:1.02}
.svc-page h3{font-size:clamp(17px,1.7vw,22px);font-weight:550;letter-spacing:-.035em;line-height:1.18}
.svc-page p{color:var(--svc-muted);font-size:14px;line-height:1.85}
.svc-eyebrow{color:var(--svc-accent);font-size:9px;font-weight:650;letter-spacing:.16em;text-transform:uppercase}
.svc-link{display:inline-flex;gap:20px;align-items:center;margin-top:15px;padding:12px 0;border-bottom:1px solid currentColor;color:var(--svc-ink);font-size:12px;font-weight:600;text-decoration:none}
.svc-link span{color:var(--svc-accent);font-size:16px}
.svc-page .svc-heading{max-width:630px;margin-bottom:38px}
.svc-page .svc-heading p{max-width:500px}
.svc-page [class$="-cta"]{background:var(--svc-ink);color:#f5f2eb}
.svc-page [class$="-cta"] h2{max-width:800px;color:#f5f2eb}
.svc-page [class$="-cta"] h2 em{color:#d9b6a4;font-style:normal}
.svc-page [class$="-cta"] a{display:inline-flex;gap:25px;align-items:center;margin-top:14px;padding:14px 0;border-bottom:1px solid rgba(245,242,235,.45);color:#f5f2eb;font-size:13px;text-decoration:none}
.svc-page [class$="-cta"] a span{color:#e09b7c;font-size:17px}
.svc-page details{border-bottom:1px solid rgba(48,53,46,.2)}
.svc-page summary{position:relative;padding:19px 32px 19px 0;cursor:pointer;list-style:none;font-size:14px;font-weight:550}
.svc-page summary::-webkit-details-marker{display:none}
.svc-page summary:after{position:absolute;right:2px;content:"+";color:var(--svc-accent);font-size:21px;font-weight:400}
.svc-page details[open] summary:after{content:"−"}
.svc-page details p{margin:0;padding:0 28px 20px 0;font-size:13px}

/* Web: structured around the site system and launch stages. */
.svc-web{--svc-accent:#b95b40;--svc-ink:#303b33;--svc-muted:#666b61}
.svc-web .web-intro{background:#f5f1e9;padding-bottom:34px}
.web-intro-grid{display:grid;grid-template-columns:1fr .8fr;gap:12%;align-items:start}
.web-intro-grid h2{max-width:590px}
.web-intro-grid>div+div{padding:22px 26px;border-left:2px solid #b95b40;background:#fbfaf6}
.web-intro-grid p{margin:0 0 13px}.web-intro-grid .web-lead{color:#3b443b;font-size:16px}
.web-proof{display:flex;justify-content:space-between;gap:15px;margin-top:50px;padding-top:16px;border-top:1px solid rgba(48,59,51,.2);color:#79796e;font-size:9px;letter-spacing:.13em}
.web-system{background:#fbfaf6}.web-system-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.web-system-grid article{min-height:230px;padding:23px 19px;border:1px solid #e3dfd4;background:#f7f5ef}
.web-system-grid article>span{display:grid;width:36px;height:36px;place-items:center;border-radius:50%;background:#e9ddd2;color:#a9573d;font-size:10px;text-transform:uppercase}
.web-system-grid h3{margin:26px 0 10px}.web-system-grid p{font-size:12px}
.web-scope{background:#e9e8df}.web-scope-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:11%;align-items:start}
.web-scope-layout>div:first-child p{max-width:390px}.web-scope-list{border-top:1px solid rgba(48,59,51,.22)}
.web-scope-list>div{display:grid;grid-template-columns:50px 1fr 25px;gap:10px;align-items:center;padding:17px 4px;border-bottom:1px solid rgba(48,59,51,.18)}
.web-scope-list b{color:#ad5b40;font-size:10px}.web-scope-list span{font-size:14px}.web-scope-list i{color:#ad5b40;font-style:normal}
.web-outcomes{background:#f7f5ef}.web-outcome-grid{display:grid;grid-template-columns:1fr .8fr;gap:12%;align-items:start;margin-top:25px}
.web-outcome-grid h2{font-size:clamp(46px,7vw,90px)}.web-outcome-grid em{color:#a9563d;font-style:normal}
.web-outcome-grid>div>p{margin-top:8px}.web-outcome{padding:14px 0;border-bottom:1px solid #d9d7cd;color:#394139;font-size:13px}
.web-journey{background:#344338;color:#f7f5ef}.web-journey .svc-eyebrow{color:#d49a7d}.web-journey h2,.web-stage-grid h3{color:#f7f5ef}
.web-stage-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(247,245,239,.24)}
.web-stage-grid article{min-height:220px;padding:20px 20px 15px 0;border-right:1px solid rgba(247,245,239,.18)}.web-stage-grid article+article{padding-left:20px}
.web-stage-grid article:last-child{border:0}.web-stage-grid article>span{color:#d49a7d;font-size:11px}.web-stage-grid h3{margin-top:35px;font-size:18px}.web-stage-grid p{color:#d2d5cb;font-size:12px}
.web-faq{background:#f5f1e9}.web-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.web-faq-grid h2{font-size:clamp(40px,5vw,62px)}
.web-cta{--svc-accent:#d9967b}.web-cta .svc-eyebrow{color:#d9967b}

/* Cloud: connected layers and wave-based migration. */
.svc-cloud{--svc-accent:#5d7a60;--svc-ink:#304637;--svc-muted:#637064}
.cloud-opening{background:#edf1e9;padding-bottom:35px!important}.cloud-opening-grid{display:grid;grid-template-columns:1fr .82fr;gap:12%;align-items:start}
.cloud-opening-grid h2{max-width:620px}.cloud-opening-copy{padding:20px 0}.cloud-opening-copy p:first-child{color:#394c3c;font-size:16px}
.cloud-signal{display:flex;justify-content:space-between;gap:20px;margin-top:40px;padding-top:17px;border-top:1px solid rgba(48,70,55,.2);color:#61715e;font-size:11px}
.cloud-signal b{color:#395a40;font-size:9px;letter-spacing:.12em}
.cloud-foundation{background:#f8f8f3}.cloud-heading{display:grid;grid-template-columns:1fr .7fr;gap:10%;align-items:end;margin-bottom:42px}.cloud-heading>p{max-width:470px}
.cloud-pillar-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.cloud-pillar-grid article{position:relative;min-height:185px;padding:22px 25px 22px 74px;border:1px solid #dce4d9;background:#eff3ec}
.cloud-pillar-grid article>span{position:absolute;top:24px;left:24px;color:#628064;font-size:11px;letter-spacing:.1em}
.cloud-pillar-grid h3{margin:0 0 12px}.cloud-pillar-grid p{max-width:480px;margin:0;font-size:12px}.cloud-pillar-grid article>i{position:absolute;right:20px;bottom:16px;color:#668367;font-size:19px;font-style:normal}
.cloud-migration{background:#e1e9df}.cloud-migration-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:11%;align-items:start}
.cloud-migration-grid>div:first-child>p{max-width:450px}.cloud-migration-grid ul{display:grid;gap:10px;padding:20px 0 0;list-style:none}
.cloud-migration-grid li{position:relative;padding-left:23px;color:#4d5e4e;font-size:12px}.cloud-migration-grid li:before{position:absolute;left:0;color:#5c7a60;content:"✓"}
.cloud-wave-list{border-top:1px solid rgba(48,70,55,.2)}.cloud-wave-list article{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:17px 0;border-bottom:1px solid rgba(48,70,55,.17)}
.cloud-wave-list article>span{color:#416548;font-size:13px;font-weight:600}.cloud-wave-list p{margin:0;font-size:12px}
.cloud-scope{background:#f8f8f3}.cloud-scope h2{max-width:650px}.cloud-scope-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:34px}
.cloud-scope-grid>div{display:flex;gap:13px;align-items:center;min-height:76px;padding:15px;border-bottom:1px solid #dce4d9;background:#f0f3ed;font-size:12px}
.cloud-scope-grid i{color:#668367;font-style:normal}.cloud-results{background:#304637;color:#f2f4ed}.cloud-results-inner{display:grid;grid-template-columns:1fr .8fr;gap:12%}
.cloud-results h2{color:#f2f4ed}.cloud-results .svc-eyebrow{color:#b9d0b7}.cloud-results-inner>div+div{padding-top:20px}.cloud-results-inner p{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid rgba(240,244,237,.2);color:#e1e8dd;font-size:13px}.cloud-results-inner p b{color:#b3cfac}
.cloud-questions{background:#f5f6f1}.cloud-question-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.cloud-question-grid h2{font-size:clamp(40px,5vw,62px)}
.cloud-cta{--svc-accent:#bdd2b6;background:#304637!important}.cloud-cta .svc-eyebrow{color:#bdd2b6}.cloud-cta h2 em{color:#bdd2b6!important}

/* Mobile apps: product lifecycle, platform fit and release readiness. */
.svc-mobile{--svc-accent:#b66c50;--svc-ink:#493a34;--svc-muted:#70645c}
.mobile-intro{background:#f5eee8;padding-bottom:34px!important}.mobile-intro-grid{display:grid;grid-template-columns:1fr .82fr;gap:12%}
.mobile-intro-grid h2{max-width:610px}.mobile-intro-grid>div+div{padding-top:22px}.mobile-lead{color:#493a34!important;font-size:16px!important}
.mobile-platform-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:45px;padding:17px 20px;background:#eadcd1;color:#655347;font-size:9px;letter-spacing:.12em}.mobile-platform-strip i{color:#b66c50;font-style:normal}
.mobile-product{background:#fcf8f3}.mobile-section-title{max-width:650px}.mobile-section-title>p{max-width:490px}
.mobile-quality-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:38px}.mobile-quality-grid article{min-height:140px;padding:18px;border-radius:13px;background:#f3e9df}
.mobile-quality-grid article>span{color:#a95f45;font-size:13px;font-weight:650}.mobile-quality-grid p{margin-top:26px;color:#4d443d;font-size:12px}
.mobile-capabilities{background:#eee3d9}.mobile-cap-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:30px}.mobile-cap-head h2{max-width:550px}
.mobile-cap-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.mobile-cap-grid article{min-height:190px;padding:22px;border-radius:14px;background:#faf6f0}
.mobile-cap-grid article>span{color:#b66c50;font-size:10px}.mobile-cap-grid h3{margin:21px 0 8px}.mobile-cap-grid p{max-width:480px;margin:0;font-size:12px}
.mobile-release{background:#493a34;color:#faf5ef}.mobile-release h2{color:#faf5ef}.mobile-release .svc-eyebrow{color:#e0a68c}
.mobile-release-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:35px}
.mobile-release-flow article{min-height:155px;padding:18px;border-top:2px solid #cc8669;background:rgba(255,255,255,.055)}
.mobile-release-flow small{color:#e0a68c;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.mobile-release-flow p{color:#e5dcd5;font-size:12px}
.mobile-outcomes{background:#f7f1ea}.mobile-outcomes-grid{display:grid;grid-template-columns:1fr .85fr;gap:12%}.mobile-outcomes h2 em{color:#b66c50;font-style:normal}
.mobile-outcomes ul{display:grid;gap:0;padding:0;list-style:none}.mobile-outcomes li{padding:15px 0;border-bottom:1px solid #ddd2c7;color:#4e4941;font-size:13px}
.mobile-faq{background:#fcf8f3}.mobile-faq-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.mobile-faq h2{font-size:clamp(40px,5vw,62px)}
.mobile-cta{--svc-accent:#e0a68c}.mobile-cta .svc-eyebrow{color:#e0a68c}

/* E-commerce: the shopping funnel joined to back-office operations. */
.svc-commerce{--svc-accent:#a96747;--svc-ink:#493a31;--svc-muted:#71665d}
.commerce-intro{background:#f6eee6;padding-bottom:32px!important}.commerce-intro-grid{display:grid;grid-template-columns:1fr .82fr;gap:12%}
.commerce-intro-grid h2{max-width:650px}.commerce-intro-grid>div+div{padding-top:22px}.commerce-lead{color:#493a31!important;font-size:16px!important}
.commerce-index{display:grid;grid-template-columns:repeat(3,1fr);margin-top:42px;border-top:1px solid #d8c9bb;border-bottom:1px solid #d8c9bb}
.commerce-index span{padding:14px 0;color:#765e4d;font-size:9px;letter-spacing:.12em}.commerce-index span+span{padding-left:18px;border-left:1px solid #d8c9bb}
.commerce-journey{background:#fbf8f3}.commerce-heading{display:grid;grid-template-columns:.8fr 1.2fr;gap:10%;align-items:end;margin-bottom:38px}.commerce-funnel{border-top:1px solid #d8c9bb}
.commerce-funnel article{display:grid;grid-template-columns:70px 1fr 40px;gap:15px;align-items:center;padding:21px 10px;border-bottom:1px solid #d8c9bb}
.commerce-funnel article>span{color:#a96747;font-size:11px;letter-spacing:.1em}.commerce-funnel h3{margin:0 0 5px}.commerce-funnel p{margin:0;font-size:12px}.commerce-funnel article>b{color:#a96747;font-size:19px;font-weight:400}
.commerce-engine{background:#eadfd3}.commerce-engine-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.commerce-engine-grid>div:first-child p{max-width:440px}
.commerce-ops{display:grid;grid-template-columns:1fr 1fr;gap:10px}.commerce-ops article{display:grid;gap:13px;min-height:125px;padding:18px;background:#f8f3ec}.commerce-ops b{color:#9e6245;font-size:11px;letter-spacing:.12em;text-transform:uppercase}.commerce-ops span{color:#655c53;font-size:12px;line-height:1.6}
.commerce-scope{background:#faf7f1}.commerce-scope>div>h2{max-width:600px}.commerce-service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:32px}
.commerce-service-grid article{min-height:155px;padding:18px;border:1px solid #e3d8cc;background:#f6eee6}.commerce-service-grid i{color:#a96747;font-size:18px;font-style:normal}.commerce-service-grid h3{margin:17px 0 7px}.commerce-service-grid p{margin:0;font-size:11px}
.commerce-success{background:#493a31;color:#fbf6ef}.commerce-success-grid{display:grid;grid-template-columns:1fr .9fr;gap:12%}.commerce-success h2{color:#fbf6ef}.commerce-success .svc-eyebrow{color:#dfaa8d}
.commerce-success-grid>div+div{padding-top:18px}.commerce-success-grid p{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid rgba(251,246,239,.2);color:#e9ded3;font-size:13px}.commerce-success-grid p>b{color:#dfa785}
.commerce-faq{background:#f6eee6}.commerce-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.commerce-faq h2{font-size:clamp(40px,5vw,62px)}
.commerce-cta{--svc-accent:#dfaa8d}.commerce-cta .svc-eyebrow{color:#dfaa8d}

/* DevOps: dark production delivery system with reliability signals. */
.svc-devops{--svc-accent:#6e9495;--svc-ink:#303e42;--svc-muted:#606c6d}
.devops-intro{background:#edf1ef;padding-bottom:32px!important}.devops-intro-grid{display:grid;grid-template-columns:1fr .82fr;gap:12%}
.devops-intro-grid h2{max-width:620px}.devops-intro-grid>div+div{padding-top:20px}.devops-lead{color:#34464a!important;font-size:16px!important}
.devops-status{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:40px;padding:15px 18px;background:#dfe8e6;color:#496367;font-size:9px;letter-spacing:.12em}
.devops-status i{display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:#5c8c7b}.devops-status>b{font-size:10px}
.devops-pipeline{background:#303e42;color:#f1f5f1}.devops-heading{max-width:640px;margin-bottom:40px}.devops-pipeline h2{color:#f1f5f1}.devops-pipeline .svc-eyebrow{color:#a8c8c3}.devops-heading p{color:#c3d0cc}
.devops-gates{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;counter-reset:gate}
.devops-gates article{position:relative;min-height:150px;padding:22px;border:1px solid rgba(203,224,220,.2);background:rgba(255,255,255,.035)}
.devops-gates article>span{color:#9ec0bb;font-size:12px;font-weight:600;letter-spacing:.1em}.devops-gates p{margin-top:30px;color:#e0e8e4;font-size:12px}
.devops-practice{background:#e5ecea}.devops-practice-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:12%}.devops-practice-grid>div:first-child p{max-width:470px}
.devops-practice ul{display:grid;gap:9px;padding:10px 0 0;list-style:none}.devops-practice li{padding:10px 0;border-bottom:1px solid #cbd8d4;color:#4d5f60;font-size:12px}
.devops-signals{display:grid;gap:9px}.devops-signals article{padding:17px 20px;border-left:3px solid #6e9495;background:#f3f6f4}
.devops-signals small{color:#527578;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.devops-signals p{margin:8px 0 0;font-size:12px}
.devops-scope{background:#f7f8f6}.devops-scope-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 26px;margin-top:26px;border-top:1px solid #d9e0dd}
.devops-scope-grid>div{display:flex;gap:13px;align-items:center;padding:17px 5px;border-bottom:1px solid #d9e0dd;font-size:12px}.devops-scope-grid b{color:#527b7d;font-size:18px;font-weight:400}
.devops-results{background:#dce7e5}.devops-results-inner{display:grid;grid-template-columns:1fr .9fr;gap:12%}.devops-results-inner>div+div{padding-top:18px}
.devops-results-inner p{display:flex;gap:13px;padding:12px 0;border-bottom:1px solid #c4d3d0;color:#465b5e;font-size:13px}.devops-results-inner b{color:#54807b}
.devops-faq{background:#f7f8f6}.devops-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.devops-faq h2{font-size:clamp(40px,5vw,62px)}
.devops-cta{--svc-accent:#a8c8c3}.devops-cta .svc-eyebrow{color:#a8c8c3}.devops-cta h2 em{color:#a8c8c3!important}

/* UX: research layers and iterative learning. */
.svc-ux{--svc-accent:#9a8050;--svc-ink:#454337;--svc-muted:#6e6b5e}
.ux-intro{background:#f1efe5;padding-bottom:32px!important}.ux-intro-grid{display:grid;grid-template-columns:1fr .82fr;gap:12%}
.ux-intro-grid h2{max-width:630px}.ux-intro-grid>div+div{padding-top:21px}.ux-lead{color:#4c4a3f!important;font-size:16px!important}
.ux-question{display:grid;grid-template-columns:190px 1fr 30px;align-items:center;gap:15px;margin-top:42px;padding:17px 20px;border:1px solid #ddd7c4;background:#f9f7ef}
.ux-question span{color:#8f7b50;font-size:9px;letter-spacing:.13em}.ux-question b{font-size:14px;font-weight:520}.ux-question i{color:#9a8050;font-style:normal;font-size:20px}
.ux-method{background:#f9f7ef}.ux-method-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:12%;align-items:start}.ux-method-grid>div:first-child>p{max-width:460px}
.ux-layers{border-top:1px solid #dcd7c7}.ux-layers article{display:grid;grid-template-columns:100px 1fr;gap:18px;padding:15px 0;border-bottom:1px solid #dcd7c7}
.ux-layers article>span{color:#8f7b50;font-size:11px;font-weight:650}.ux-layers p{margin:0;font-size:12px}
.ux-cycle{background:#eae6d8}.ux-cycle-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:35px}.ux-cycle-heading h2{max-width:570px}
.ux-cycle-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.ux-cycle-grid article{min-height:165px;padding:18px;border-top:2px solid #aa9665;background:#f4f1e7}
.ux-cycle-grid b{color:#837349;font-size:12px}.ux-cycle-grid p{margin-top:24px;color:#555448;font-size:11px}
.ux-work{background:#f8f6ef}.ux-work>div>h2{max-width:600px}.ux-work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:30px}
.ux-work-grid article{min-height:150px;padding:17px;border:1px solid #e1ddcf}.ux-work-grid i{color:#9a8050;font-style:normal}.ux-work-grid h3{margin:15px 0 6px}.ux-work-grid p{margin:0;font-size:11px}
.ux-value{background:#454337;color:#f5f3ea}.ux-value-grid{display:grid;grid-template-columns:1fr .9fr;gap:12%}.ux-value h2{color:#f5f3ea}.ux-value .svc-eyebrow{color:#d3c18e}.ux-value-grid>div+div{padding-top:18px}
.ux-value-grid p{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid rgba(245,243,234,.2);color:#e4e0d0;font-size:13px}.ux-value-grid b{color:#d3c18e}
.ux-faq{background:#f8f6ef}.ux-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.ux-faq h2{font-size:clamp(40px,5vw,62px)}
.ux-cta{--svc-accent:#d3c18e}.ux-cta .svc-eyebrow{color:#d3c18e}.ux-cta h2 em{color:#d3c18e!important}

/* SEO: search foundation, audit and measurement loop. */
.svc-seo{--svc-accent:#69835e;--svc-ink:#374739;--svc-muted:#657061}
.seo-intro{background:#edf1e9;padding-bottom:32px!important}.seo-intro-grid{display:grid;grid-template-columns:1fr .82fr;gap:12%}
.seo-intro-grid h2{max-width:630px}.seo-intro-grid>div+div{padding-top:21px}.seo-lead{color:#3f5140!important;font-size:16px!important}
.seo-query{display:flex;align-items:center;gap:20px;margin-top:42px;padding:15px 19px;border:1px solid #d4dece;border-radius:4px;background:#f8faf5}
.seo-query span{color:#6c8462;font-size:9px;letter-spacing:.13em}.seo-query b{flex:1;color:#445344;font-size:13px;font-weight:500}.seo-query i{color:#69835e;font-style:normal}
.seo-foundation{background:#f8faf5}.seo-heading{display:grid;grid-template-columns:1fr .8fr;gap:10%;align-items:end;margin-bottom:38px}.seo-heading>p{max-width:470px}
.seo-layer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.seo-layer-grid article{min-height:180px;padding:20px 17px;border-top:3px solid #7b956f;background:#edf2e9}
.seo-layer-grid article>span{color:#4e6649;font-size:12px;font-weight:650}.seo-layer-grid p{margin-top:25px;font-size:12px}
.seo-audit{background:#e5ecdf}.seo-audit-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:12%}.seo-audit-grid>div:first-child>p{max-width:460px}
.seo-audit-list{border-top:1px solid #c7d4c1}.seo-audit-list article{display:flex;gap:15px;padding:15px 0;border-bottom:1px solid #c7d4c1;color:#4b5d48;font-size:12px}
.seo-audit-list b{color:#66835d;font-size:18px;font-weight:400}
.seo-cycle{background:#f8faf5}.seo-cycle-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:35px}
.seo-cycle-grid article{min-height:160px;padding:18px;border:1px solid #dce4d6;background:#f0f4ec}.seo-cycle-grid b{color:#5e7857;font-size:12px}.seo-cycle-grid p{margin-top:25px;font-size:11px}
.seo-outcomes{background:#374739;color:#f4f6ef}.seo-outcomes-grid{display:grid;grid-template-columns:1fr .9fr;gap:12%}.seo-outcomes h2{color:#f4f6ef}.seo-outcomes .svc-eyebrow{color:#b9d1ad}
.seo-outcomes-grid>div+div{padding-top:18px}.seo-outcomes-grid p{display:flex;gap:13px;padding:12px 0;border-bottom:1px solid rgba(244,246,239,.2);color:#e1e9dc;font-size:13px}.seo-outcomes-grid b{color:#b9d1ad}
.seo-faq{background:#edf1e9}.seo-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%}.seo-faq h2{font-size:clamp(40px,5vw,62px)}
.seo-cta{--svc-accent:#b9d1ad}.seo-cta .svc-eyebrow{color:#b9d1ad}.seo-cta h2 em{color:#b9d1ad!important}

@media(max-width:900px){
 .web-system-grid,.mobile-quality-grid,.seo-layer-grid{grid-template-columns:repeat(2,1fr)}
 .ux-cycle-grid{grid-template-columns:repeat(3,1fr)}
 .commerce-service-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
 .svc-page section{padding:66px 0}
 .svc-page h2{font-size:clamp(36px,10vw,52px)}
 .web-intro-grid,.web-scope-layout,.web-outcome-grid,.web-faq-grid,.cloud-opening-grid,.cloud-heading,.cloud-migration-grid,.cloud-results-inner,.cloud-question-grid,.mobile-intro-grid,.mobile-outcomes-grid,.mobile-faq-layout,.commerce-intro-grid,.commerce-heading,.commerce-engine-grid,.commerce-success-grid,.commerce-faq-grid,.devops-intro-grid,.devops-practice-grid,.devops-results-inner,.devops-faq-grid,.ux-intro-grid,.ux-method-grid,.ux-value-grid,.ux-faq-grid,.seo-intro-grid,.seo-heading,.seo-audit-grid,.seo-outcomes-grid,.seo-faq-grid{grid-template-columns:1fr;gap:20px}
 .web-intro-grid>div+div,.mobile-intro-grid>div+div,.commerce-intro-grid>div+div,.devops-intro-grid>div+div,.ux-intro-grid>div+div,.seo-intro-grid>div+div{padding-top:0}
 .web-proof,.cloud-signal{flex-wrap:wrap;justify-content:flex-start;column-gap:22px;row-gap:10px;margin-top:28px}
 .web-system-grid,.cloud-pillar-grid,.mobile-cap-grid,.commerce-ops,.commerce-service-grid,.devops-gates,.devops-scope-grid,.ux-work-grid,.seo-layer-grid{grid-template-columns:1fr 1fr}
 .web-system-grid article{min-height:205px;padding:16px 13px}.web-system-grid h3{margin-top:20px}
 .web-stage-grid{grid-template-columns:1fr 1fr}.web-stage-grid article{min-height:185px;padding:16px 12px 14px 0}.web-stage-grid article+article{padding-left:12px}.web-stage-grid article:nth-child(2){border-right:0}.web-stage-grid article:nth-child(n+3){border-top:1px solid rgba(247,245,239,.18)}
 .cloud-scope-grid{grid-template-columns:1fr 1fr}.cloud-pillar-grid article{min-height:190px;padding:17px 13px 17px 47px}.cloud-pillar-grid article>span{top:20px;left:13px}.cloud-wave-list article{grid-template-columns:82px 1fr;gap:10px}
 .mobile-platform-strip{flex-wrap:wrap;justify-content:flex-start;gap:10px;margin-top:28px;padding:13px;font-size:8px}.mobile-platform-strip i{display:none}
 .mobile-quality-grid{gap:7px}.mobile-quality-grid article{min-height:132px;padding:13px}.mobile-quality-grid p{margin-top:18px;font-size:11px}.mobile-cap-head{display:block}.mobile-release-flow{grid-template-columns:1fr 1fr}.mobile-release-flow article{min-height:130px;padding:14px}
 .commerce-index{gap:8px}.commerce-index span{font-size:7px;line-height:1.5}.commerce-index span+span{padding-left:8px}.commerce-funnel article{grid-template-columns:36px 1fr 20px;gap:10px;padding:16px 2px}.commerce-ops article{min-height:120px;padding:13px}.commerce-service-grid{gap:7px}.commerce-service-grid article{min-height:165px;padding:13px}.commerce-service-grid h3{font-size:15px}
 .devops-status{align-items:flex-start;flex-direction:column;gap:9px;padding:13px}.devops-gates{gap:7px}.devops-gates article{min-height:145px;padding:13px}.devops-gates p{margin-top:20px;font-size:11px}.devops-scope-grid{gap:0 10px}.devops-scope-grid>div{align-items:flex-start;font-size:11px}
 .ux-question{grid-template-columns:1fr 25px;gap:8px;margin-top:28px;padding:14px}.ux-question span{grid-column:1/-1}.ux-layers article{grid-template-columns:75px 1fr;gap:10px}.ux-cycle-heading{display:block}.ux-cycle-grid{grid-template-columns:1fr 1fr;gap:7px}.ux-cycle-grid article{min-height:145px;padding:14px}.ux-cycle-grid p{margin-top:18px}.ux-work-grid{gap:7px}.ux-work-grid article{min-height:170px;padding:13px}
 .seo-query{gap:10px;margin-top:28px;padding:13px}.seo-query span{font-size:7px}.seo-query b{font-size:11px}.seo-layer-grid{gap:7px}.seo-layer-grid article{min-height:160px;padding:14px 12px}.seo-layer-grid p{margin-top:18px;font-size:11px}.seo-cycle-grid{grid-template-columns:1fr 1fr;gap:7px}.seo-cycle-grid article{min-height:145px;padding:14px}.seo-cycle-grid p{margin-top:18px}
}

/* Final editorial refinement: quiet surfaces, sharper hierarchy and service-led composition. */
.svc-page{--svc-accent:#b95b40;--svc-ink:#292c26;--svc-muted:#686c61;color:var(--svc-ink);background:#f7f5ee}
.svc-page section{padding:clamp(66px,7vw,100px) 0;overflow:clip}
.svc-page h2{max-width:760px;margin:15px 0 20px;font-family:var(--font-head),Arial,sans-serif;font-size:clamp(38px,4.7vw,62px);font-weight:520;letter-spacing:-.065em;line-height:1.04}
.svc-page h2 em{color:var(--svc-accent);font-family:"DM Serif Display",Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-.045em}
.svc-page h3{margin:0 0 10px;font-family:var(--font-head),Arial,sans-serif;font-size:18px;font-weight:560;letter-spacing:-.035em;line-height:1.25}
.svc-page p{margin:0 0 14px;color:var(--svc-muted);font-size:13px;line-height:1.82}
.svc-eyebrow{display:inline-block;color:var(--svc-accent);font-size:9px;font-weight:650;letter-spacing:.17em;line-height:1.5;text-transform:uppercase}
.svc-link{display:inline-flex;gap:22px;align-items:center;margin-top:12px;padding:10px 0;border-bottom:1px solid rgba(41,44,38,.35);color:var(--svc-ink);font-size:11px;font-weight:600;text-decoration:none}
.svc-link span{color:var(--svc-accent);font-size:15px;transition:transform .2s ease}.svc-link:hover span{transform:translate(2px,2px)}
.svc-page .svc-heading{max-width:680px;margin-bottom:36px}.svc-page .svc-heading p{max-width:520px}
.svc-page details{border-top:1px solid rgba(41,44,38,.17);border-bottom:0}
.svc-page details:last-child{border-bottom:1px solid rgba(41,44,38,.17)}
.svc-page summary{padding:17px 34px 17px 0;color:#30332c;cursor:pointer;list-style:none;font-size:13px;font-weight:550;line-height:1.5}
.svc-page summary::-webkit-details-marker{display:none}.svc-page summary:after{right:3px;color:var(--svc-accent);font-size:17px}
.svc-page details[open] summary{color:var(--svc-accent)}
.svc-page details p{max-width:700px;margin:0;padding:0 35px 18px 0;font-size:12px}
.svc-page [class$="-cta"]{padding:76px 0 82px;background:#303c32;color:#f4f1e8}
.svc-page [class$="-cta"] .svc-eyebrow{color:#dfa084}
.svc-page [class$="-cta"] h2{max-width:850px;margin:17px 0 10px;color:#f4f1e8;font-size:clamp(44px,6vw,74px)}
.svc-page [class$="-cta"] h2 em{color:#dfa084}
.svc-page [class$="-cta"] a{display:inline-flex;gap:23px;align-items:center;margin-top:14px;padding:11px 0;border-bottom:1px solid rgba(244,241,232,.44);color:#f4f1e8;font-size:12px;text-decoration:none}
.svc-page [class$="-cta"] a span{color:#dfa084;font-size:16px}
.svc-page [class$="-cta"]:after{position:absolute;right:8%;bottom:-.5em;color:rgba(246,242,231,.035);font-family:"DM Serif Display",Georgia,serif;font-size:clamp(200px,32vw,440px);line-height:1;content:"K";pointer-events:none}
.svc-page [class$="-cta"] .container{position:relative;z-index:1}

/* Web design: editorial four-part system, with ruled rather than boxed modules. */
.svc-web{--svc-accent:#b85e43;background:#f7f5ee}
.svc-web .web-intro{background:#f0eee6;padding-bottom:30px}
.web-intro-grid{grid-template-columns:1.04fr .76fr;gap:11%;align-items:center}.web-intro-grid>div+div{padding:5px 0 5px 25px;border-left:1px solid #b85e43;background:none}
.web-intro-grid h2{max-width:620px}.web-intro-grid p{max-width:530px}.web-intro-grid .web-lead{color:#41443d;font-size:15px}
.web-proof{margin-top:38px;padding-top:13px;border-top:1px solid rgba(41,44,38,.21)}
.web-proof span{font-size:8px;letter-spacing:.14em}
.web-system{background:#faf9f4}.web-system .svc-heading{display:grid;grid-template-columns:.75fr 1fr;column-gap:8%;align-items:end;max-width:none}
.web-system .svc-heading .svc-eyebrow{grid-column:1/-1}.web-system .svc-heading h2{margin-bottom:0}
.web-system .svc-heading p{margin:0 0 4px}.web-system-grid{gap:0;border-top:1px solid rgba(41,44,38,.19)}
.web-system-grid article{min-height:195px;padding:18px 22px 16px 0;border:0;border-bottom:1px solid rgba(41,44,38,.19);background:none}
.web-system-grid article+article{padding-left:20px;border-left:1px solid rgba(41,44,38,.14)}
.web-system-grid article>span{display:block;width:auto;height:auto;padding:0;border-radius:0;background:none;color:#b85e43;font-size:9px;letter-spacing:.13em;text-transform:uppercase}
.web-system-grid h3{margin:27px 0 9px;font-size:16px}.web-system-grid p{font-size:11px;line-height:1.75}
.web-scope{background:#e9e8df}.web-scope-layout{grid-template-columns:.72fr 1.28fr;gap:12%;align-items:start}
.web-scope-layout>div:first-child p{max-width:380px}.web-scope-list>div{grid-template-columns:42px 1fr 20px;padding:15px 3px}
.web-scope-list span{font-size:13px}.web-outcomes{background:#faf9f4}.web-outcome-grid{grid-template-columns:1fr .78fr;gap:10%;margin-top:20px}
.web-outcome-grid h2{font-size:clamp(49px,6.8vw,82px)}.web-outcome-grid>div>p{font-size:12px}
.web-outcome{padding:12px 0;border-color:rgba(41,44,38,.18);font-size:12px}
.web-journey{background:#303c32}.web-journey .svc-heading{display:flex;align-items:end;justify-content:space-between;max-width:none;gap:20px}
.web-journey .svc-heading h2{max-width:520px;margin-bottom:0;color:#f4f1e8}.web-journey .svc-eyebrow{color:#dfa084}
.web-stage-grid{border-color:rgba(244,241,232,.22)}.web-stage-grid article{min-height:200px;padding:18px 16px 13px 0;border-color:rgba(244,241,232,.16)}
.web-stage-grid article+article{padding-left:16px}.web-stage-grid h3{font-size:16px}.web-stage-grid p{font-size:11px;line-height:1.7}
.web-faq{background:#f0eee6}.web-faq-grid{grid-template-columns:.72fr 1.28fr;gap:12%}.web-faq-grid h2{font-size:clamp(40px,4.8vw,58px)}
.web-page-cta{--svc-accent:#dfa084}

/* Cloud: architecture layers and migration sequence, in restrained green. */
.svc-cloud{--svc-accent:#54765a;background:#f5f6ef}
.cloud-opening{background:#e9eee7;padding-bottom:29px!important}.cloud-opening-grid{grid-template-columns:1.05fr .78fr;gap:11%;align-items:center}
.cloud-opening-copy{padding:0 0 0 25px;border-left:1px solid #7d987d}.cloud-opening-copy p:first-child{color:#38493a;font-size:15px}
.cloud-signal{margin-top:36px;padding-top:14px;border-color:rgba(48,70,55,.19)}.cloud-signal span{font-size:10px}
.cloud-foundation{background:#f7f8f3}.cloud-heading{grid-template-columns:1fr .72fr;align-items:end}.cloud-heading>p{margin-bottom:7px}
.cloud-pillar-grid{grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(48,70,55,.2);border-bottom:1px solid rgba(48,70,55,.2)}
.cloud-pillar-grid article{min-height:210px;padding:18px 17px 15px 0;border:0;background:none}
.cloud-pillar-grid article+article{padding-left:17px;border-left:1px solid rgba(48,70,55,.15)}
.cloud-pillar-grid article>span{position:static;color:#648168;font-size:9px}.cloud-pillar-grid h3{margin:27px 0 9px;font-size:16px}.cloud-pillar-grid p{font-size:11px;line-height:1.72}.cloud-pillar-grid article>i{display:none}
.cloud-migration{background:#e7ece4}.cloud-migration-grid{grid-template-columns:.82fr 1.18fr;gap:11%}
.cloud-migration-grid li{padding:9px 0 9px 20px;border-bottom:1px solid rgba(48,70,55,.13);font-size:11px}
.cloud-wave-list article{grid-template-columns:95px 1fr;padding:14px 0}.cloud-wave-list article>span{font-size:12px}.cloud-wave-list p{font-size:11px}
.cloud-scope{background:#f7f8f3}.cloud-scope-grid{grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(48,70,55,.18)}
.cloud-scope-grid>div{min-height:60px;padding:12px 12px 12px 0;border-bottom:1px solid rgba(48,70,55,.16);background:none;font-size:11px}
.cloud-scope-grid>div:nth-child(3n+2),.cloud-scope-grid>div:nth-child(3n){padding-left:15px;border-left:1px solid rgba(48,70,55,.13)}
.cloud-results{background:#304637}.cloud-results-inner p{font-size:12px}.cloud-question-grid{grid-template-columns:.72fr 1.28fr;gap:12%}
.cloud-questions{background:#f1f3ed}.cloud-cta{background:#304637!important}

/* Mobile: product stages and release details, no toy-like rounded cards. */
.svc-mobile{--svc-accent:#a95c43;background:#f8f4ee}
.mobile-intro{background:#f0e9e1;padding-bottom:29px!important}.mobile-intro-grid{grid-template-columns:1.03fr .78fr;gap:11%;align-items:center}
.mobile-intro-grid>div+div{padding:0 0 0 24px;border-left:1px solid #b9775e}.mobile-lead{font-size:15px!important}
.mobile-platform-strip{margin-top:35px;padding:14px 0;border-top:1px solid #d5c8bb;border-bottom:1px solid #d5c8bb;background:none;font-size:8px}
.mobile-product{background:#faf8f3}.mobile-section-title{display:grid;grid-template-columns:.9fr 1fr;column-gap:10%;max-width:none;align-items:end}
.mobile-section-title .svc-eyebrow{grid-column:1/-1}.mobile-section-title h2{margin-bottom:0}.mobile-section-title>p{margin-bottom:4px}
.mobile-quality-grid{gap:0;margin-top:34px;border-top:1px solid rgba(73,58,52,.18);border-bottom:1px solid rgba(73,58,52,.18)}
.mobile-quality-grid article{min-height:115px;padding:16px 19px 14px 0;border-radius:0;background:none}.mobile-quality-grid article+article{padding-left:18px;border-left:1px solid rgba(73,58,52,.14)}
.mobile-quality-grid article>span{font-size:9px;letter-spacing:.12em;text-transform:uppercase}.mobile-quality-grid p{margin-top:18px;font-size:11px}
.mobile-capabilities{background:#eee7de}.mobile-cap-head{margin-bottom:29px}.mobile-cap-head h2{font-size:clamp(38px,4.7vw,62px)}
.mobile-cap-grid{grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(73,58,52,.18);border-bottom:1px solid rgba(73,58,52,.18)}
.mobile-cap-grid article{min-height:225px;padding:17px 15px 14px 0;border-radius:0;background:none}.mobile-cap-grid article+article{padding-left:15px;border-left:1px solid rgba(73,58,52,.13)}
.mobile-cap-grid article>span{font-size:9px}.mobile-cap-grid h3{margin:25px 0 8px;font-size:15px}.mobile-cap-grid p{font-size:10px;line-height:1.7}
.mobile-release{background:#493a34}.mobile-release .svc-eyebrow{color:#dda088}.mobile-release-flow{gap:0;border-top:1px solid rgba(250,245,239,.24);border-bottom:1px solid rgba(250,245,239,.24)}
.mobile-release-flow article{min-height:135px;padding:16px 16px 12px 0;border:0;background:none}.mobile-release-flow article+article{padding-left:16px;border-left:1px solid rgba(250,245,239,.18)}
.mobile-release-flow small{font-size:9px;letter-spacing:.14em}.mobile-release-flow p{font-size:11px}
.mobile-outcomes{background:#faf8f3}.mobile-outcomes-grid{grid-template-columns:1fr .82fr;gap:11%}.mobile-outcomes li{padding:13px 0;font-size:12px}
.mobile-faq{background:#f0e9e1}.mobile-faq-layout{grid-template-columns:.72fr 1.28fr;gap:12%}

/* E-commerce: editorial funnel and operational catalogue. */
.svc-commerce{--svc-accent:#a15f42;background:#f8f4ee}
.commerce-intro{background:#f1e9e0;padding-bottom:28px!important}.commerce-intro-grid{grid-template-columns:1.03fr .78fr;gap:11%;align-items:center}
.commerce-intro-grid>div+div{padding:0 0 0 24px;border-left:1px solid #bd8162}.commerce-lead{font-size:15px!important}
.commerce-index{margin-top:35px;border-color:#d6c7b9}.commerce-index span{font-size:8px}
.commerce-journey{background:#faf8f3}.commerce-heading{grid-template-columns:.82fr 1.18fr;align-items:end}.commerce-heading h2{margin-bottom:0}
.commerce-funnel{border-top:1px solid rgba(73,58,49,.2)}.commerce-funnel article{grid-template-columns:52px 1fr 26px;padding:18px 4px;border-color:rgba(73,58,49,.18)}
.commerce-funnel article>span{font-size:10px}.commerce-funnel h3{font-size:16px}.commerce-funnel p{font-size:11px}
.commerce-engine{background:#ebe1d7}.commerce-engine-grid{grid-template-columns:.8fr 1.2fr;gap:12%}.commerce-engine-grid>div:first-child p{font-size:12px}
.commerce-ops{grid-template-columns:1fr 1fr;gap:0;border-top:1px solid rgba(73,58,49,.2)}.commerce-ops article{min-height:95px;padding:14px 12px 12px 0;border-bottom:1px solid rgba(73,58,49,.16);background:none}
.commerce-ops article:nth-child(even){padding-left:15px;border-left:1px solid rgba(73,58,49,.14)}.commerce-ops b{font-size:9px}.commerce-ops span{font-size:11px}
.commerce-scope{background:#faf8f3}.commerce-service-grid{grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(73,58,49,.18)}
.commerce-service-grid article{min-height:165px;padding:17px 17px 14px 0;border:0;border-bottom:1px solid rgba(73,58,49,.18);background:none}
.commerce-service-grid article+article{padding-left:17px;border-left:1px solid rgba(73,58,49,.14)}.commerce-service-grid i{font-size:13px}
.commerce-service-grid h3{margin:20px 0 7px;font-size:15px}.commerce-service-grid p{font-size:10px;line-height:1.7}
.commerce-success{background:#493a31}.commerce-success-grid p{font-size:12px}.commerce-faq{background:#f1e9e0}.commerce-faq-grid{grid-template-columns:.72fr 1.28fr;gap:12%}

/* DevOps: a technical release rail, with a focused dark section. */
.svc-devops{--svc-accent:#557a7d;background:#f4f6f4}
.devops-intro{background:#e9eeec;padding-bottom:28px!important}.devops-intro-grid{grid-template-columns:1.03fr .78fr;gap:11%;align-items:center}
.devops-intro-grid>div+div{padding:0 0 0 24px;border-left:1px solid #769394}.devops-lead{font-size:15px!important}
.devops-status{margin-top:34px;padding:13px 0;border-top:1px solid #cbd7d4;border-bottom:1px solid #cbd7d4;background:none;font-size:8px}
.devops-status>b{font-size:9px;letter-spacing:.1em}
.devops-pipeline{background:#303e42}.devops-heading{display:grid;grid-template-columns:.8fr 1fr;column-gap:10%;align-items:end;max-width:none;margin-bottom:34px}
.devops-heading .svc-eyebrow{grid-column:1/-1}.devops-heading h2{margin-bottom:0}.devops-heading p{margin-bottom:5px;font-size:12px}
.devops-gates{grid-template-columns:repeat(6,1fr);gap:0;border-top:1px solid rgba(203,224,220,.25);border-bottom:1px solid rgba(203,224,220,.25)}
.devops-gates article{min-height:170px;padding:16px 12px 12px 0;border:0;background:none}.devops-gates article+article{padding-left:12px;border-left:1px solid rgba(203,224,220,.18)}
.devops-gates article>span{font-size:9px}.devops-gates p{margin-top:24px;font-size:10px;line-height:1.65}
.devops-practice{background:#e9eeec}.devops-practice-grid{grid-template-columns:.82fr 1.18fr;gap:12%}.devops-practice li{font-size:11px}
.devops-signals{gap:0;border-top:1px solid #cbd7d4}.devops-signals article{padding:15px 0;border:0;border-bottom:1px solid #cbd7d4;background:none}.devops-signals small{font-size:9px}.devops-signals p{font-size:11px}
.devops-scope{background:#f4f6f4}.devops-scope-grid{gap:0 25px}.devops-scope-grid>div{padding:14px 2px;font-size:11px}
.devops-results{background:#dfe8e6}.devops-results-inner{grid-template-columns:1fr .82fr;gap:11%}.devops-results-inner p{font-size:12px}
.devops-faq{background:#f4f6f4}.devops-faq-grid{grid-template-columns:.72fr 1.28fr;gap:12%}

/* UX: research methods presented as a clear journey, not a card collection. */
.svc-ux{--svc-accent:#8d7747;background:#f7f5ec}
.ux-intro{background:#eeece2;padding-bottom:28px!important}.ux-intro-grid{grid-template-columns:1.03fr .78fr;gap:11%;align-items:center}
.ux-intro-grid>div+div{padding:0 0 0 24px;border-left:1px solid #a99b70}.ux-lead{font-size:15px!important}
.ux-question{grid-template-columns:160px 1fr 25px;margin-top:33px;padding:13px 0;border:0;border-top:1px solid #d6d1c1;border-bottom:1px solid #d6d1c1;background:none}
.ux-question span{font-size:8px}.ux-question b{font-size:13px}.ux-method{background:#f7f5ec}
.ux-method-grid{grid-template-columns:.82fr 1.18fr;gap:12%}.ux-layers{border-top:1px solid rgba(69,67,55,.2)}
.ux-layers article{grid-template-columns:90px 1fr;padding:14px 0;border-color:rgba(69,67,55,.16)}.ux-layers article>span{font-size:10px}.ux-layers p{font-size:11px}
.ux-cycle{background:#e9e6d9}.ux-cycle-heading{align-items:end}.ux-cycle-heading h2{font-size:clamp(38px,4.7vw,62px)}
.ux-cycle-grid{gap:0;border-top:1px solid rgba(69,67,55,.2);border-bottom:1px solid rgba(69,67,55,.2)}
.ux-cycle-grid article{min-height:155px;padding:15px 13px 12px 0;border:0;background:none}.ux-cycle-grid article+article{padding-left:13px;border-left:1px solid rgba(69,67,55,.14)}
.ux-cycle-grid b{font-size:10px}.ux-cycle-grid p{margin-top:22px;font-size:10px;line-height:1.7}
.ux-work{background:#f7f5ec}.ux-work-grid{grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(69,67,55,.18)}
.ux-work-grid article{min-height:142px;padding:15px 15px 12px 0;border:0;border-bottom:1px solid rgba(69,67,55,.16)}
.ux-work-grid article+article{padding-left:15px;border-left:1px solid rgba(69,67,55,.13)}.ux-work-grid i{font-size:11px}.ux-work-grid h3{margin:13px 0 6px;font-size:14px}.ux-work-grid p{font-size:10px}
.ux-value{background:#454337}.ux-value-grid p{font-size:12px}.ux-faq{background:#eeece2}.ux-faq-grid{grid-template-columns:.72fr 1.28fr;gap:12%}

/* SEO: technical layers and measurement steps, using the site's green accent. */
.svc-seo{--svc-accent:#65805a;background:#f4f6ef}
.seo-intro{background:#e9eee5;padding-bottom:28px!important}.seo-intro-grid{grid-template-columns:1.03fr .78fr;gap:11%;align-items:center}
.seo-intro-grid>div+div{padding:0 0 0 24px;border-left:1px solid #829778}.seo-lead{font-size:15px!important}
.seo-query{gap:17px;margin-top:34px;padding:13px 0;border:0;border-top:1px solid #ccd7c7;border-bottom:1px solid #ccd7c7;border-radius:0;background:none}
.seo-query span{font-size:8px}.seo-query b{font-size:12px}
.seo-foundation{background:#f4f6ef}.seo-heading{grid-template-columns:.85fr 1.15fr;align-items:end}.seo-heading h2{margin-bottom:0}.seo-heading>p{margin-bottom:5px;font-size:12px}
.seo-layer-grid{gap:0;border-top:1px solid rgba(55,71,57,.2);border-bottom:1px solid rgba(55,71,57,.2)}
.seo-layer-grid article{min-height:155px;padding:16px 15px 13px 0;border:0;border-top:0;background:none}
.seo-layer-grid article+article{padding-left:15px;border-left:1px solid rgba(55,71,57,.14)}.seo-layer-grid article>span{font-size:10px}.seo-layer-grid p{margin-top:21px;font-size:11px}
.seo-audit{background:#e5ebdf}.seo-audit-grid{grid-template-columns:.82fr 1.18fr;gap:12%}.seo-audit-grid>div:first-child>p{font-size:12px}
.seo-audit-list{border-top:1px solid #c6d2bf}.seo-audit-list article{padding:13px 0;border-color:#c6d2bf;font-size:11px}.seo-audit-list b{font-size:15px}
.seo-cycle{background:#f4f6ef}.seo-cycle-grid{gap:0;border-top:1px solid rgba(55,71,57,.2);border-bottom:1px solid rgba(55,71,57,.2)}
.seo-cycle-grid article{min-height:140px;padding:15px 15px 12px 0;border:0;background:none}
.seo-cycle-grid article+article{padding-left:15px;border-left:1px solid rgba(55,71,57,.14)}.seo-cycle-grid b{font-size:10px}.seo-cycle-grid p{margin-top:21px;font-size:10px}
.seo-outcomes{background:#374739}.seo-outcomes-grid p{font-size:12px}.seo-faq{background:#e9eee5}.seo-faq-grid{grid-template-columns:.72fr 1.28fr;gap:12%}

@media(max-width:900px){
 .web-system-grid,.cloud-pillar-grid,.mobile-cap-grid,.devops-gates,.seo-layer-grid{grid-template-columns:repeat(2,1fr)}
 .web-system-grid article:nth-child(3),.cloud-pillar-grid article:nth-child(3),.mobile-cap-grid article:nth-child(3),.seo-layer-grid article:nth-child(3){padding-left:0;border-left:0}
 .devops-gates article:nth-child(odd){padding-left:0;border-left:0}
 .ux-cycle-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:700px){
 .svc-page section{padding:58px 0}
 .svc-page h2{font-size:clamp(36px,9vw,48px);line-height:1.06}
 .svc-page p{font-size:12px;line-height:1.75}
 .web-intro-grid,.web-scope-layout,.web-outcome-grid,.web-faq-grid,.cloud-opening-grid,.cloud-heading,.cloud-migration-grid,.cloud-results-inner,.cloud-question-grid,.mobile-intro-grid,.mobile-outcomes-grid,.mobile-faq-layout,.commerce-intro-grid,.commerce-heading,.commerce-engine-grid,.commerce-success-grid,.commerce-faq-grid,.devops-intro-grid,.devops-practice-grid,.devops-results-inner,.devops-faq-grid,.ux-intro-grid,.ux-method-grid,.ux-value-grid,.ux-faq-grid,.seo-intro-grid,.seo-heading,.seo-audit-grid,.seo-outcomes-grid,.seo-faq-grid{grid-template-columns:1fr;gap:17px}
 .web-intro-grid>div+div,.mobile-intro-grid>div+div,.commerce-intro-grid>div+div,.devops-intro-grid>div+div,.ux-intro-grid>div+div,.seo-intro-grid>div+div,.cloud-opening-copy{padding:0;border:0}
 .web-proof,.cloud-signal{flex-wrap:wrap;justify-content:flex-start;gap:10px 18px;margin-top:27px}
 .web-proof span,.cloud-signal span{font-size:8px}
 .web-system .svc-heading,.mobile-section-title,.devops-heading,.seo-heading{display:block}
 .web-system-grid,.cloud-pillar-grid,.mobile-cap-grid,.devops-gates,.seo-layer-grid{grid-template-columns:1fr 1fr}
 .web-system-grid article,.cloud-pillar-grid article,.mobile-cap-grid article,.seo-layer-grid article{min-height:0;padding:14px 11px 14px 0}
 .web-system-grid article+article,.cloud-pillar-grid article+article,.mobile-cap-grid article+article,.seo-layer-grid article+article{padding-left:11px}
 .web-system-grid article:nth-child(odd),.cloud-pillar-grid article:nth-child(odd),.mobile-cap-grid article:nth-child(odd),.seo-layer-grid article:nth-child(odd){padding-left:0;border-left:0}
 .web-system-grid h3,.cloud-pillar-grid h3,.mobile-cap-grid h3{margin:17px 0 7px;font-size:14px}
 .web-stage-grid{grid-template-columns:1fr 1fr}.web-stage-grid article{min-height:0;padding:14px 10px 12px 0}.web-stage-grid article+article{padding-left:10px}.web-stage-grid article:nth-child(2){border-right:0}.web-stage-grid article:nth-child(3){padding-left:0;border-left:0}.web-stage-grid h3{margin-top:20px;font-size:14px}
 .web-journey .svc-heading{display:block}.web-outcome-grid h2{font-size:clamp(45px,12vw,66px)}
 .cloud-scope-grid{grid-template-columns:1fr 1fr}.cloud-scope-grid>div{min-height:55px;font-size:10px}.cloud-wave-list article{grid-template-columns:75px 1fr;gap:8px}
 .mobile-platform-strip{justify-content:flex-start;gap:8px 15px;margin-top:25px;padding:12px 0;font-size:7px}.mobile-quality-grid{grid-template-columns:1fr 1fr}
 .mobile-quality-grid article{min-height:0;padding:13px 10px 13px 0}.mobile-quality-grid article+article{padding-left:10px}.mobile-quality-grid article:nth-child(odd){padding-left:0;border-left:0}.mobile-quality-grid p{margin-top:13px;font-size:10px}
 .mobile-cap-grid article{min-height:155px}.mobile-cap-grid p{font-size:10px}.mobile-release-flow{grid-template-columns:1fr 1fr}.mobile-release-flow article{min-height:110px;padding:13px 10px 10px 0}.mobile-release-flow article+article{padding-left:10px}.mobile-release-flow article:nth-child(odd){padding-left:0;border-left:0}.mobile-release-flow p{font-size:10px}
 .commerce-index{margin-top:23px}.commerce-index span{font-size:7px}.commerce-funnel article{grid-template-columns:32px 1fr 16px;gap:8px;padding:14px 0}.commerce-funnel h3{font-size:14px}
 .commerce-ops{gap:0}.commerce-ops article{min-height:90px;padding:12px 8px 10px 0}.commerce-ops article:nth-child(even){padding-left:9px}.commerce-ops span{font-size:10px}
 .commerce-service-grid{grid-template-columns:1fr 1fr}.commerce-service-grid article{min-height:145px;padding:13px 9px 11px 0}.commerce-service-grid article+article{padding-left:9px}.commerce-service-grid article:nth-child(odd){padding-left:0;border-left:0}.commerce-service-grid h3{font-size:13px}
 .devops-status{margin-top:24px}.devops-status>b{font-size:8px}.devops-gates article{min-height:135px;padding:13px 9px 10px 0}.devops-gates article+article{padding-left:9px}.devops-gates article:nth-child(odd){padding-left:0}.devops-gates p{margin-top:19px;font-size:9px}
 .devops-scope-grid{grid-template-columns:1fr 1fr;gap:0 12px}.devops-scope-grid>div{font-size:10px}
 .ux-question{grid-template-columns:1fr 20px;margin-top:24px}.ux-question span{grid-column:1/-1}.ux-layers article{grid-template-columns:72px 1fr;gap:9px}.ux-cycle-heading{display:block}
 .ux-cycle-grid{grid-template-columns:1fr 1fr}.ux-cycle-grid article{min-height:120px;padding:13px 9px 10px 0}.ux-cycle-grid article+article{padding-left:9px}.ux-cycle-grid article:nth-child(odd){padding-left:0;border-left:0}.ux-cycle-grid p{margin-top:14px}
 .ux-work-grid{grid-template-columns:1fr 1fr}.ux-work-grid article{min-height:125px;padding:13px 9px 10px 0}.ux-work-grid article+article{padding-left:9px}.ux-work-grid article:nth-child(odd){padding-left:0;border-left:0}
 .seo-query{margin-top:24px}.seo-query span{font-size:7px}.seo-query b{font-size:10px}.seo-layer-grid article{min-height:125px}.seo-layer-grid p{margin-top:13px;font-size:10px}
 .seo-cycle-grid{grid-template-columns:1fr 1fr}.seo-cycle-grid article{min-height:120px;padding:13px 9px 10px 0}.seo-cycle-grid article+article{padding-left:9px}.seo-cycle-grid article:nth-child(odd){padding-left:0;border-left:0}.seo-cycle-grid p{margin-top:14px}
 .svc-page [class$="-cta"]{padding:59px 0 64px}.svc-page [class$="-cta"]:after{right:-1%;font-size:200px}
 .svc-page summary{padding:14px 30px 14px 0;font-size:12px}
}

/* Service page readability and CTA cleanup. */
.svc-page h2{font-size:clamp(37px,4.35vw,56px)}
.svc-page p{font-size:14px}
.svc-page .web-outcome-grid h2{font-size:clamp(44px,5.4vw,68px)}
.svc-page .web-system-grid p,.svc-page .web-stage-grid p,.svc-page .cloud-pillar-grid p,.svc-page .cloud-wave-list p,.svc-page .mobile-quality-grid p,.svc-page .mobile-cap-grid p,.svc-page .mobile-release-flow p,.svc-page .commerce-funnel p,.svc-page .commerce-ops span,.svc-page .commerce-service-grid p,.svc-page .devops-gates p,.svc-page .devops-signals p,.svc-page .ux-cycle-grid p,.svc-page .ux-work-grid p,.svc-page .seo-layer-grid p,.svc-page .seo-cycle-grid p{font-size:13px;line-height:1.72}
.svc-page .web-system-grid h3,.svc-page .cloud-pillar-grid h3,.svc-page .mobile-cap-grid h3,.svc-page .commerce-funnel h3,.svc-page .commerce-service-grid h3,.svc-page .ux-work-grid h3{font-size:16px}
@media(max-width:700px){
 .svc-page h2{font-size:clamp(33px,8vw,41px)}
 .svc-page p{font-size:13px}
 .svc-page .web-outcome-grid h2{font-size:clamp(40px,10vw,52px)}
 .svc-page .web-system-grid p,.svc-page .web-stage-grid p,.svc-page .cloud-pillar-grid p,.svc-page .cloud-wave-list p,.svc-page .mobile-quality-grid p,.svc-page .mobile-cap-grid p,.svc-page .mobile-release-flow p,.svc-page .commerce-funnel p,.svc-page .commerce-ops span,.svc-page .commerce-service-grid p,.svc-page .devops-gates p,.svc-page .devops-signals p,.svc-page .ux-cycle-grid p,.svc-page .ux-work-grid p,.svc-page .seo-layer-grid p,.svc-page .seo-cycle-grid p{font-size:12px;line-height:1.65}
 .svc-page .web-system-grid h3,.svc-page .cloud-pillar-grid h3,.svc-page .mobile-cap-grid h3,.svc-page .commerce-funnel h3,.svc-page .commerce-service-grid h3,.svc-page .ux-work-grid h3{font-size:15px}
}

/* Growth icon uses the site's local glyph system; no external icon font needed. */
.fa-chart-line::before{content:"↗";font-size:1.15em;font-weight:700}
.service-mega-grid a:nth-child(7)>i{color:#a6533c;background:#f2e8df}

/* Final service-page contrast pass. */
.svc-page .svc-eyebrow{font-size:10px}
.svc-page .web-proof span,.svc-page .cloud-signal span,.svc-page .commerce-index span,.svc-page .devops-status,.svc-page .mobile-platform-strip{font-size:9px}
.svc-page .cloud-scope-grid>div,.svc-page .devops-scope-grid>div{font-size:12px}
.svc-page .seo-query span{font-size:9px}
.svc-page .mobile-release p{color:#e8ded7}
.svc-page .devops-pipeline p{color:#d5e0dd}
.svc-page .cloud-results p,.svc-page .commerce-success p,.svc-page .ux-value p,.svc-page .seo-outcomes p{color:#e7e9df}
.svc-page .web-journey p{color:#d9ded5}
@media(max-width:700px){
 .svc-page .svc-eyebrow{font-size:9px}
 .svc-page .web-proof span,.svc-page .cloud-signal span,.svc-page .commerce-index span,.svc-page .devops-status,.svc-page .mobile-platform-strip,.svc-page .seo-query span{font-size:8px}
 .svc-page .cloud-scope-grid>div,.svc-page .devops-scope-grid>div{font-size:11px}
}


/* Tablet and narrow-phone layouts for every service detail body. */
@media (min-width:701px) and (max-width:1024px){
 .web-system-grid,.cloud-pillar-grid,.mobile-quality-grid,.mobile-cap-grid,.seo-layer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .web-system-grid article:nth-child(odd),.cloud-pillar-grid article:nth-child(odd),.mobile-quality-grid article:nth-child(odd),.mobile-cap-grid article:nth-child(odd),.seo-layer-grid article:nth-child(odd){padding-left:0;border-left:0}
 .web-system-grid article,.cloud-pillar-grid article,.mobile-quality-grid article,.mobile-cap-grid article,.seo-layer-grid article{min-height:165px}
 .web-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .web-stage-grid article{min-height:170px;padding:17px 14px 14px 0}
 .web-stage-grid article+article{padding-left:14px}
 .web-stage-grid article:nth-child(odd){padding-left:0;border-left:0}
 .cloud-scope-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cloud-scope-grid>div:nth-child(3n+2),.cloud-scope-grid>div:nth-child(3n){padding-left:0;border-left:0}
 .cloud-scope-grid>div:nth-child(even){padding-left:14px;border-left:1px solid rgba(48,70,55,.13)}
 .commerce-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .commerce-service-grid article:nth-child(odd){padding-left:0;border-left:0}
 .commerce-service-grid article:nth-child(even){padding-left:16px}
 .devops-gates{grid-template-columns:repeat(3,minmax(0,1fr))}
 .devops-gates article:nth-child(3n+1){padding-left:0;border-left:0}
 .devops-gates article:nth-child(3n+2),.devops-gates article:nth-child(3n){padding-left:14px;border-left:1px solid rgba(203,224,220,.18)}
 .ux-cycle-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:380px){
 .web-system-grid,.cloud-pillar-grid,.mobile-quality-grid,.mobile-cap-grid,.commerce-ops,.commerce-service-grid,.devops-gates,.devops-scope-grid,.ux-work-grid,.ux-cycle-grid,.seo-layer-grid,.seo-cycle-grid,.cloud-scope-grid{grid-template-columns:1fr}
 .web-system-grid article,.cloud-pillar-grid article,.mobile-quality-grid article,.mobile-cap-grid article,.commerce-ops article,.commerce-service-grid article,.devops-gates article,.devops-scope-grid>div,.ux-work-grid article,.ux-cycle-grid article,.seo-layer-grid article,.seo-cycle-grid article,.cloud-scope-grid>div{min-height:0;padding:14px 0;border-left:0}
 .web-system-grid article+article,.cloud-pillar-grid article+article,.mobile-quality-grid article+article,.mobile-cap-grid article+article,.commerce-ops article:nth-child(even),.commerce-service-grid article+article,.devops-gates article+article,.ux-work-grid article+article,.ux-cycle-grid article+article,.seo-layer-grid article+article,.seo-cycle-grid article+article{padding-left:0;border-left:0}
 .mobile-quality-grid p,.mobile-cap-grid p,.ux-cycle-grid p,.ux-work-grid p,.seo-layer-grid p,.seo-cycle-grid p{margin-top:10px}
 .commerce-index span{font-size:7px;letter-spacing:.08em}
 .seo-query{gap:8px}.seo-query b{font-size:9px}
 .devops-status>b{letter-spacing:.05em;line-height:1.6}
}

/* Service hero overflow and overlap fixes across desktop, tablet and phones. */
.service-detail-hero{overflow:clip}
.service-detail-hero-inner{width:min(100% - 72px,1200px);grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)!important;gap:clamp(22px,3vw,44px)!important}
.service-detail-copy{width:100%;min-width:0}
.service-detail-copy .breadcrumb{flex-wrap:wrap;row-gap:7px;min-width:0}
.service-detail-copy .breadcrumb span:last-child{min-width:0;overflow-wrap:anywhere}
.service-detail-copy h1{max-width:100%;text-wrap:balance;overflow-wrap:normal}
.service-detail-copy>p{max-width:62ch}
.service-detail-art{width:100%;max-width:100%;min-width:0;min-height:0}
.service-detail-art>div{box-sizing:border-box;max-width:100%}
.service-detail-hero-foot{min-width:0;gap:16px}
.service-detail-hero-foot span{min-width:0}
/* The hero width already includes its outer gutter; avoid applying .container padding twice. */
.service-detail-hero-inner{box-sizing:border-box;width:calc(100% - 72px);max-width:1200px;padding-inline:0}
.service-detail-hero-inner>*{min-width:0}
.service-detail-art>*,.service-detail-art svg{box-sizing:border-box;max-width:100%;min-width:0}
@media (min-width:701px) and (max-width:1024px){
 .service-detail-hero{height:auto!important;min-height:calc(100svh - var(--nav-h))!important;overflow:clip}
 .service-detail-hero-inner{box-sizing:border-box;width:100%;max-width:960px;flex:1 0 auto!important;grid-template-columns:minmax(0,1fr) minmax(0,.86fr)!important;gap:clamp(16px,2.5vw,28px)!important;padding:0 clamp(24px,4vw,40px) 72px!important}
 .service-detail-copy .breadcrumb{margin-bottom:20px}
 .service-detail-copy h1{margin:18px 0 15px;font-size:clamp(43px,5.25vw,58px);line-height:1.01}
 .service-detail-copy>p{font-size:14px;line-height:1.7}
 .service-detail-copy .editorial-text-link{max-width:100%;flex-wrap:wrap;gap:8px;font-size:11px}
 .service-detail-art{align-self:center;height:clamp(280px,43svh,360px)!important}
 .service-detail-art>div{height:100%;max-height:100%}
 .service-detail-hero-cloud .service-detail-art{display:flex!important;height:clamp(300px,43svh,390px)!important;top:0!important}
 .service-detail-hero-cloud .service-art-cloud{height:100%!important;padding:12px 8px!important}
 .service-detail-hero-foot{right:clamp(88px,10vw,104px);left:clamp(24px,4vw,40px);gap:18px;line-height:1.5}
}
@media(max-width:700px){
 .service-detail-hero{box-sizing:border-box;min-height:calc(100svh - var(--nav-h))!important;height:auto!important;padding:10px 0 12px!important;overflow:clip}
 .service-detail-hero-inner{box-sizing:border-box;width:100%;max-width:560px;flex:1 0 auto!important;min-height:0!important;grid-template-columns:minmax(0,1fr)!important;align-content:start;align-items:start;gap:clamp(14px,2.5svh,22px)!important;padding:0 clamp(18px,5vw,24px) 24px!important}
 .service-detail-copy{align-self:start}
 .service-detail-copy .breadcrumb{gap:7px;margin:0 0 16px!important;font-size:10px;line-height:1.4}
 .service-detail-copy .editorial-kicker{font-size:9px;letter-spacing:.12em}
 .service-detail-copy h1{max-width:100%;margin:13px 0 12px!important;font-size:clamp(34px,8.8vw,49px)!important;line-height:1.02!important;letter-spacing:-.065em;text-wrap:pretty;overflow-wrap:anywhere}
 .service-detail-copy>p{max-width:60ch;margin:0;font-size:13px!important;line-height:1.62!important;overflow-wrap:anywhere}
 .service-detail-copy .editorial-text-link{max-width:100%;flex-wrap:wrap;gap:8px;margin-top:10px!important;padding:8px 0;font-size:11px;line-height:1.45}
 .service-detail-art{align-self:start;width:100%!important;max-width:410px;height:clamp(190px,32svh,245px)!important;min-height:0!important;margin:0 auto!important;overflow:hidden!important}
 .service-detail-art>div{box-sizing:border-box;width:min(100%,410px)!important;height:100%!important;max-height:100%;margin:auto;overflow:hidden}
 .service-detail-art .service-art-browser{height:100%!important}
 .service-detail-art .service-art-cloud{height:100%!important;min-height:0!important;padding:8px 6px!important;grid-template-rows:auto minmax(0,1fr) auto;row-gap:3px}
 .service-detail-hero-cloud .service-detail-art{display:flex!important;align-self:start;width:min(100%,410px)!important;height:clamp(210px,34svh,260px)!important;min-height:0!important;top:0!important}
 .service-detail-hero-cloud .service-art-cloud{width:100%!important;height:100%!important;padding:8px 6px!important}
 .service-detail-hero-cloud .service-cloud-diagram{width:100%;height:100%;min-height:0;transform:none!important}
 .service-detail-hero-cloud .cloud-art-label{font-size:7px;letter-spacing:.12em}
 .service-detail-hero-cloud .cloud-art-foot{gap:5px;font-size:6px;letter-spacing:.08em}
 .service-detail-art .service-art-phones{height:100%!important;gap:clamp(8px,3vw,14px)}
 .service-detail-art .phone{width:clamp(96px,31vw,120px);height:82%;max-height:220px}
 .service-detail-art .phone-back{height:72%}
 .service-detail-art .phone-front{padding:32px 10px 10px}
 .service-detail-art .phone-front strong{font-size:19px}
 .service-detail-art .phone-front>span{left:10px;width:calc(100% - 20px)}
 .service-detail-art .service-art-shop{height:100%!important}
 .service-detail-art .shop-product{padding:13px 14px}
 .service-detail-art .product-shape{height:60%;max-height:132px}
 .service-detail-art .product-shape i{width:clamp(45px,17vw,66px);height:78%;max-height:95px}
 .service-detail-art .shop-product small{margin-top:25px;font-size:7px}
 .service-detail-art .shop-product strong{font-size:clamp(18px,5vw,23px)}
 .service-detail-art .shop-product>span{max-width:62%;margin-top:12px;font-size:8px}
 .service-detail-art .service-art-pipeline{height:100%!important;padding:18px 12px!important}
 .service-detail-art .pipeline-label{margin-bottom:20px;font-size:7px}
 .service-detail-art .pipeline-flow{grid-template-columns:minmax(0,1fr) 13px minmax(0,1fr) 13px minmax(0,1fr)!important;gap:0}
 .service-detail-art .pipeline-step{width:min(100%,54px);min-width:0}
 .service-detail-art .pipeline-step b{font-size:7px}
 .service-detail-art .pipeline-health{margin-top:17px;padding-top:8px;font-size:7px}
 .service-detail-art .service-art-wireframe{height:100%!important;padding:15px}
 .service-detail-art .wireframe-screen{top:43px;left:calc(50% - 78px);width:156px;height:calc(100% - 62px);min-height:130px;padding:12px}
 .service-detail-art .wireframe-screen>b{max-width:100%;margin:14px 0 10px}
 .service-detail-art .wireframe-screen>div{margin-top:12px}
 .service-detail-art .wireframe-screen em{flex:1;min-width:0;height:32px}
 .service-detail-art .wireframe-note{font-size:6px}
 .service-detail-art .note-a{top:30px;left:5px}.service-detail-art .note-b{top:48%;right:3px}.service-detail-art .note-c{bottom:8px;left:18px}
 .service-detail-art .service-art-search{height:100%!important;padding:17px 15px}
 .service-detail-art .search-label{margin-bottom:11px;font-size:7px}
 .service-detail-art .search-box{height:36px;padding:10px;font-size:8px}
 .service-detail-art .search-result{gap:8px;margin-top:10px;padding:10px 8px}
 .service-detail-art .search-result b{font-size:9px}.service-detail-art .search-result small{font-size:7px}
 .service-detail-art .search-chart{right:15px;bottom:14px;left:15px;height:65px;padding-bottom:17px}
 .service-detail-art .search-chart b{font-size:6px}
 .service-detail-hero-foot{position:relative;inset:auto;width:100%;grid-column:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:8px;padding:12px 0 0!important;font-size:7px!important;line-height:1.45;letter-spacing:.07em!important}
 .service-detail-hero-foot span:last-child{padding-right:clamp(48px,15vw,60px);text-align:right;overflow-wrap:anywhere}
}
@media(max-width:380px){
 .service-detail-hero-inner{padding-right:16px!important;padding-left:16px!important}
 .service-detail-copy .breadcrumb{gap:6px;font-size:9px}
 .service-detail-copy h1{font-size:34px!important}
 .service-detail-art{height:clamp(180px,30svh,220px)!important}
 .service-detail-hero-cloud .service-detail-art{height:220px!important}
 .service-detail-art .service-art-pipeline{padding:14px 8px!important}
 .service-detail-art .pipeline-flow{grid-template-columns:minmax(0,1fr) 9px minmax(0,1fr) 9px minmax(0,1fr)!important}
 .service-detail-art .pipeline-step{width:46px}
 .service-detail-art .pipeline-step b{font-size:6px}
 .service-detail-art .service-art-shop{padding-left:0;padding-right:0}
 .service-detail-hero-foot{font-size:6px!important}
}
/* The cloud artwork shares its class with its outer wrapper; size that wrapper explicitly. */
@media (min-width:701px) and (max-width:1024px){
 .service-detail-hero-cloud>.service-detail-hero-inner>.service-detail-art{display:flex!important;align-self:center!important;height:clamp(300px,43svh,390px)!important;min-height:0!important;max-height:390px!important;overflow:hidden!important}
}
@media(max-width:700px){
 .service-detail-hero-cloud>.service-detail-hero-inner>.service-detail-art{display:flex!important;align-self:start!important;height:clamp(210px,34svh,260px)!important;min-height:0!important;max-height:260px!important;overflow:hidden!important}
}
/* Preserve readable copy and artwork on short-height phones and tablets; let the hero scroll. */
@media(max-width:700px) and (max-height:600px){
 .service-detail-hero-inner{gap:24px!important}
 .service-detail-art{height:220px!important}
 .service-detail-hero-cloud>.service-detail-hero-inner>.service-detail-art{height:240px!important;max-height:240px!important}
}
@media (min-width:701px) and (max-width:1024px) and (max-height:700px){
 .service-detail-hero-inner{grid-template-columns:minmax(0,1fr)!important;align-content:start;align-items:start;gap:24px!important;padding-bottom:84px!important}
 .service-detail-copy{width:100%;max-width:680px;justify-self:start}
 .service-detail-art{align-self:start;width:min(100%,440px)!important;margin:0 auto!important}
 .service-detail-hero-cloud>.service-detail-hero-inner>.service-detail-art{align-self:start!important;height:340px!important;max-height:340px!important}
}
@media(max-width:1024px){
 .service-detail-hero{height:auto!important;min-height:0!important}
 .service-detail-hero-inner{flex:0 0 auto!important;padding-bottom:16px!important}
 .service-detail-hero-foot{display:none!important}
}

/* Brand mark assets */
.byline-mark { background:#f7f3e8; }
.byline-mark { overflow:hidden; color:transparent; font-size:0; background:#f7f3e8 url('/images/kratvya-logo.svg') center/21px 21px no-repeat; }
.service-orbit-core { inset:auto; top:50%; left:50%; width:16%; aspect-ratio:1; transform:translate(-50%,-50%); }
.service-orbit-core span { display:grid; width:100%; height:100%; place-items:center; overflow:hidden; border-radius:50%; color:transparent; font-size:0; background:#f7f3e8 url('/images/kratvya-logo.svg') center calc(50% - 3px)/72% 72% no-repeat; }
.journal-art-glyph { width:clamp(110px,18vw,220px); height:clamp(110px,18vw,220px); color:transparent; font-size:0; background:url('/images/kratvya-logo.svg') center/contain no-repeat; }
.journal-orbit .orbit-core { aspect-ratio:1; color:transparent; font-size:0; background:url('/images/kratvya-logo.svg') center/contain no-repeat; }
.cta-watermark { display:block; right:7%; bottom:0; width:clamp(190px,36vw,510px); height:auto; aspect-ratio:1; color:transparent; font-size:0; background:url('/images/kratvya-logo.svg') center/contain no-repeat; opacity:.055; }
.public-top>b { color:transparent; font-size:0; background:#f7f3e8 url('/images/kratvya-logo.svg') center/19px 19px no-repeat; }
.contact-note-top img { display:block; width:34px; height:34px; object-fit:contain; border-radius:50%; background:#f7f3e8; }
.privacy-summary-mark img { display:block; width:27px; height:27px; object-fit:contain; }
.privacy-visual-foot img { display:block; width:24px; height:24px; object-fit:contain; }
@media(max-width:700px) { .journal-orbit .orbit-core { width:clamp(145px,42vw,185px); } }

/* Navigation states: no white hover tile; keep the current route easy to spot. */
.navbar .nav-link:hover,
.navbar .nav-item:hover > .nav-link:not(.active),
.navbar .nav-text-trigger:hover,
.navbar .nav-has-menu.is-open > .nav-text-trigger {
  background:transparent !important;
  color:#a6533c !important;
}
.navbar .nav-link.active,
.navbar .nav-item.active > .nav-link,
.navbar .nav-has-menu.active > .nav-text-trigger {
  background:transparent !important;
  color:#a6533c !important;
}
.navbar .nav-item.is-open > .nav-link:not(.active) {
  background:transparent !important;
  color:#a6533c !important;
}
.nav-mega a.is-current {
  border-color:rgba(182,83,57,.48) !important;
  background:#e9e5d9 !important;
  color:#963f2e !important;
  box-shadow:inset 3px 0 0 #b65339;
}
.nav-mega .mega-link-grid a.is-current { padding-left:14px; }
.nav-mega .company-menu-links a.is-current strong,
.nav-mega .service-mega-grid a.is-current strong { color:#963f2e; }

/* Home hero engineering panel: give the system layers a clearer visual hierarchy. */
.engineering-visual {
  border:1px solid rgba(248,243,232,.17);
  border-radius:5px;
  background:linear-gradient(148deg,#35483a 0%,#2e3b32 54%,#26342c 100%);
  box-shadow:0 24px 65px rgba(34,48,38,.2),12px 14px 0 rgba(48,60,50,.07);
}
.engineering-visual::before {
  opacity:.62;
  background-size:38px 38px;
  mask-image:linear-gradient(135deg,rgba(0,0,0,.5),transparent 76%);
}
.engineering-visual::after {
  position:absolute;
  z-index:-1;
  top:68px;
  right:18px;
  width:210px;
  height:210px;
  border:1px solid rgba(232,181,150,.12);
  border-radius:50%;
  background:url('/images/kratvya-logo.svg') center/78px 78px no-repeat,
    radial-gradient(circle,#f7f3e8 0 47px,rgba(248,243,232,.16) 48px 53px,transparent 54px),
    radial-gradient(circle,rgba(192,111,78,.12),rgba(192,111,78,.035) 46%,transparent 70%);
  box-shadow:0 0 0 22px rgba(232,181,150,.025),0 0 0 46px rgba(232,181,150,.018);
  content:"";
  pointer-events:none;
}
.engineering-visual-intro { padding-top:25px; padding-bottom:23px; }
.engineering-visual-intro > span { letter-spacing:.18em; }
.engineering-visual-intro strong { text-shadow:0 2px 18px rgba(0,0,0,.12); }
.engineering-layers {
  gap:8px;
  border-top:0;
}
.engineering-layers::before { display:none; }
.engineering-layer {
  min-height:62px;
  grid-template-columns:35px minmax(0,1fr) 25px;
  gap:11px;
  padding:0 11px;
  border:1px solid rgba(248,243,232,.13);
  border-radius:4px;
  background:linear-gradient(100deg,rgba(248,243,232,.075),rgba(248,243,232,.025));
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.engineering-layer:hover {
  transform:translateX(3px);
  border-color:rgba(232,181,150,.35);
  background:linear-gradient(100deg,rgba(248,243,232,.11),rgba(248,243,232,.045));
}
.engineering-layer > span { background:#35483a; }
.engineering-layer strong { font-size:12px; }
.engineering-layer small { font-size:10px; }
.engineering-visual-foot { padding-top:18px; font-size:7px; letter-spacing:.13em; }
@media(max-width:700px) {
  .engineering-visual::after { top:72px; right:-45px; width:180px; height:180px; }
  .engineering-layer { min-height:60px; }
}

/* Give the journal hero's central illustration a visible focal point. */
.editorial-hero-journal .journal-orbit-ring {
  inset:14% 18%;
  border:1px solid rgba(52,66,57,.3);
  border-radius:50%;
  transform:none;
}
.editorial-hero-journal .journal-orbit-ring.ring-two {
  inset:23% 27%;
  border:1px dashed rgba(166,78,55,.46);
  transform:none;
}
.editorial-hero-journal .journal-orbit .orbit-core {
  display:grid;
  width:clamp(156px,15vw,190px);
  height:clamp(156px,15vw,190px);
  place-items:center;
  overflow:visible;
  border:1px solid rgba(244,241,232,.36);
  border-radius:50%;
  background:linear-gradient(145deg,#435a49 0%,#303d34 76%);
  box-shadow:0 0 0 12px rgba(48,61,52,.08),0 20px 48px rgba(34,46,37,.2);
  transform:translate(-50%,-50%);
}
.editorial-hero-journal .journal-orbit .orbit-core::before {
  display:block;
  width:58%;
  height:58%;
  border:1px solid rgba(166,78,55,.3);
  border-radius:50%;
  background:#f7f3e8 url('/images/kratvya-logo.svg') center/68% no-repeat;
  box-shadow:0 0 0 8px rgba(244,241,232,.1);
  content:"";
}
@media(max-width:700px) {
  .editorial-hero-journal .journal-orbit .orbit-core {
    width:clamp(148px,42vw,176px);
    height:clamp(148px,42vw,176px);
  }
}
/* Final portfolio overrides keep project cards image-led after the global editorial refinements. */
.work-section .work-project-art::after{display:none!important;content:none!important}
.work-section .work-project-copy::before{display:none}
.work-section .work-project-card,.work-section .work-project-wide{position:relative;display:block;padding:0;border:0}
.work-section .work-project-art,.work-section .work-project-wide .work-project-art{aspect-ratio:1.42;margin:0}
.work-section .work-project-copy,.work-section .work-project-wide .work-project-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:clamp(18px,3vw,32px);background:linear-gradient(180deg,rgba(29,39,32,0) 20%,rgba(29,39,32,.26) 47%,rgba(29,39,32,.94) 100%);color:#f7f4e9;opacity:0;transform:translateY(5px);transition:opacity .25s ease,transform .25s ease;pointer-events:none}
.work-section .work-project-card:hover .work-project-copy,.work-section .work-project-card:focus-within .work-project-copy{opacity:1;transform:none}
.work-section .work-project-copy .editorial-meta{color:#f1c1a4}
.work-section .work-project-copy h3{color:#fffdf6}
.work-section .work-project-copy>p{display:none}
.work-section .work-project-copy .work-tech-list span{border-color:rgba(255,255,255,.42);background:rgba(31,47,37,.9);color:#fffdf6}
.work-section .work-project-copy .editorial-card-link{margin-top:16px;padding:10px 13px;border:0;background:#f5f3ec;color:#303c32;pointer-events:auto}
@media(max-width:700px){
  .work-section .work-project-grid{grid-template-columns:1fr;gap:18px}
  .work-section .work-project-art,.work-section .work-project-wide .work-project-art{aspect-ratio:1.22}
  .work-section .work-project-copy,.work-section .work-project-wide .work-project-copy{padding:20px;opacity:1;transform:none;background:linear-gradient(180deg,rgba(29,39,32,0) 7%,rgba(29,39,32,.34) 36%,rgba(29,39,32,.95) 100%)}
}
@media(hover:none){.work-section .work-project-copy,.work-section .work-project-wide .work-project-copy{opacity:1;transform:none}}
/* Make the portfolio hover category legible over every cover image. */
.work-section .work-project-copy .editorial-meta{align-self:flex-start;flex-wrap:wrap;gap:7px;margin:0 0 12px;padding:7px 10px;border:1px solid rgba(255,255,255,.34);background:rgba(35,49,40,.82);color:#f1c1a4;font-size:10px;line-height:1.2;letter-spacing:.12em;text-shadow:0 1px 8px rgba(0,0,0,.25);backdrop-filter:blur(8px)}
.work-section .work-project-copy .editorial-meta span+span{padding-left:9px;border-left:1px solid rgba(255,255,255,.38);color:#fffaf0;font-size:10px}
.work-section .work-project-copy{background:linear-gradient(180deg,rgba(29,39,32,.08) 4%,rgba(29,39,32,.18) 32%,rgba(29,39,32,.95) 100%)}
.work-section .work-project-card:focus-within .work-project-copy{opacity:1;transform:none}
@media(max-width:700px){
  .work-section .work-project-copy .editorial-meta{margin-bottom:10px;padding:6px 9px;font-size:9px}
}

/* Friendly, branded fallback for missing pages and temporary server errors. */
.site-error-page { position:relative; display:grid; min-height:min(690px,calc(100svh - var(--nav-h,88px))); grid-template-columns:minmax(0,1.05fr) minmax(280px,.75fr); align-items:center; gap:clamp(36px,8vw,120px); overflow:hidden; padding:clamp(54px,8vw,100px) max(24px,calc((100vw - 1200px)/2)); background:linear-gradient(120deg,#f4f2e9 0%,#eceee5 100%); color:#292c26; isolation:isolate; }
.site-error-page::before { position:absolute; z-index:-1; inset:0; background-image:linear-gradient(rgba(49,55,45,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(49,55,45,.055) 1px,transparent 1px); background-size:58px 58px; content:""; mask-image:linear-gradient(90deg,transparent,#000 70%); }
.site-error-copy { max-width:700px; }
.site-error-copy .atelier-label { color:#a6533c; font-size:10px; letter-spacing:.15em; }
.site-error-copy h1 { margin:25px 0 17px; font-size:clamp(47px,6vw,76px); font-weight:550; letter-spacing:-.07em; line-height:.98; }
.site-error-copy > p:not(.site-error-reference) { max-width:540px; margin:0; color:#62665d; font-size:clamp(16px,1.6vw,19px); line-height:1.75; }
.site-error-actions { display:flex; align-items:center; flex-wrap:wrap; gap:23px; margin-top:29px; }
.site-error-reference { margin-top:24px; color:#77796f; font-size:11px; }
.site-error-reference code { color:#344239; font-size:11px; }
.site-error-orbit { position:relative; display:grid; width:min(100%,380px); aspect-ratio:1; place-items:center; justify-self:center; border:1px solid rgba(52,66,57,.22); border-radius:50%; background:radial-gradient(circle,#fffdf7 0 21%,rgba(220,226,211,.82) 21.2% 43%,transparent 43.2%); box-shadow:0 0 0 22px rgba(52,66,57,.025),0 0 0 54px rgba(52,66,57,.02); }
.site-error-orbit::before,.site-error-orbit::after { position:absolute; inset:12%; border:1px dashed rgba(166,78,55,.26); border-radius:50%; content:""; }
.site-error-orbit::after { inset:27%; border-style:solid; border-color:rgba(52,66,57,.18); }
.site-error-orbit span { color:#344239; font-family:"DM Serif Display",Georgia,serif; font-size:clamp(84px,12vw,142px); letter-spacing:-.06em; }
@media(max-width:700px) {
  .engineering-hero .atelier-hero-layout { gap:23px; padding-top:31px; padding-bottom:26px; }
  .engineering-hero .eyebrow { max-width:100%; font-size:9px; line-height:1.6; }
  .engineering-hero h1 { font-size:clamp(42px,10.7vw,58px); }
  .engineering-hero .hero-footnote { flex-wrap:wrap; gap:8px 12px; margin-top:22px; font-size:8px; }
  .engineering-visual { min-height:370px; padding:17px 16px 14px; }
  .engineering-visual::after { top:64px; right:14px; width:116px; height:116px; background:url('/images/kratvya-logo.svg') center/52px 52px no-repeat,radial-gradient(circle,#f7f3e8 0 33px,rgba(248,243,232,.15) 34px 40px,transparent 41px),radial-gradient(circle,rgba(192,111,78,.1),rgba(192,111,78,.025) 56%,transparent 72%); box-shadow:0 0 0 14px rgba(232,181,150,.025); }
  .engineering-visual-intro { max-width:calc(100% - 96px); padding:18px 0 14px; }
  .engineering-visual-intro > span { font-size:8px; line-height:1.5; }
  .engineering-visual-intro strong { font-size:clamp(30px,8vw,37px); }
  .engineering-layers { gap:6px; }
  .engineering-layer { min-height:57px; grid-template-columns:30px minmax(0,1fr) 18px; gap:6px; }
  .engineering-layer strong { font-size:12px; }
  .engineering-layer small { font-size:9px; }
  .engineering-visual-foot { flex-wrap:wrap; gap:8px; font-size:8px; }
  .site-error-page { min-height:0; grid-template-columns:minmax(0,1fr); gap:38px; padding:58px 22px 72px; }
  .site-error-copy h1 { font-size:clamp(43px,11vw,58px); }
  .site-error-actions { align-items:flex-start; flex-direction:column; gap:17px; }
  .site-error-orbit { width:min(76vw,270px); }
}
@media(max-width:380px) {
  .engineering-hero h1 { font-size:41px; }
  .engineering-visual { min-height:350px; padding-right:13px; padding-left:13px; }
  .engineering-visual::after { right:11px; width:102px; height:102px; background-size:46px 46px,auto,auto; }
  .engineering-visual-intro { max-width:calc(100% - 86px); }
  .engineering-visual-intro strong { font-size:29px; }
}

/* Long-form article and case-study pages: editorial hierarchy, room to read, and a deliberate close. */
.journal-article{overflow:hidden;background:#f7f6f1;color:#292c26}
.journal-article-hero{position:relative;isolation:isolate;overflow:hidden;padding:calc(var(--nav-h) + 48px) 0 65px;background:#303c32;color:#f5f2e9}
.journal-article-hero::after{position:absolute;z-index:-1;top:-245px;right:-80px;width:680px;height:680px;border:1px solid rgba(243,237,220,.12);border-radius:50%;box-shadow:0 0 0 65px rgba(243,237,220,.025),0 0 0 130px rgba(243,237,220,.02);content:""}
.journal-article-container{position:relative;z-index:1;max-width:950px}
.journal-article .breadcrumb{margin-bottom:54px;color:rgba(245,242,233,.57)}
.journal-article .breadcrumb a{color:rgba(245,242,233,.7)}
.journal-article .breadcrumb span:last-child{color:#e3a184}
.journal-article-category,.journal-aside-label{display:flex;align-items:center;gap:10px;color:#e4a184;font-size:10px;font-weight:750;letter-spacing:.16em;text-transform:uppercase}
.journal-article-category span{color:rgba(245,242,233,.48)}
.journal-article-hero h1{max-width:900px;margin:23px 0 18px;color:#fbf9f2;font-size:clamp(48px,7.8vw,92px);font-weight:500;letter-spacing:-.075em;line-height:.98}
.journal-article-excerpt{max-width:710px;margin:0;color:rgba(245,242,233,.72);font-size:clamp(17px,2.1vw,21px);line-height:1.75}
.journal-article-byline{display:flex;align-items:center;gap:12px;margin-top:30px;padding-top:19px;border-top:1px solid rgba(245,242,233,.18);color:rgba(245,242,233,.66);font-size:12px}
.journal-article-byline .byline-mark{width:38px;height:38px;background:#b65339;color:#fff8ec;font-size:20px}
.journal-article-byline strong,.journal-article-byline small{display:block;color:#f5f2e9}
.journal-article-byline small{margin-top:4px;color:rgba(245,242,233,.55);font-size:11px}
.journal-article-cover{position:relative;width:min(1120px,calc(100% - 64px));margin:-1px auto 0;overflow:hidden;background:#e6e3d7}
.journal-article-cover img{display:block;width:100%;max-height:690px;aspect-ratio:1.85;object-fit:cover}
.journal-article-cover figcaption{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid rgba(41,44,38,.14);border-top:0;color:#73766b;font-size:9px;font-weight:750;letter-spacing:.13em}
.journal-reading-layout{display:grid;grid-template-columns:190px minmax(0,720px);justify-content:space-between;gap:clamp(35px,7vw,100px);max-width:1050px;padding-block:65px 90px}
.journal-reading-aside{position:sticky;top:calc(var(--nav-h) + 28px);align-self:start;padding:19px 0;border-top:2px solid #b65339}
.journal-reading-aside .journal-aside-label{font-size:9px;color:#a6533b}
.journal-reading-aside strong{display:block;margin-top:18px;color:#303c32;font-family:"DM Serif Display",Georgia,serif;font-size:24px;font-weight:400}
.journal-reading-aside p{margin:9px 0 16px;color:#73766b;font-size:12px;line-height:1.75}
.journal-reading-aside>a{color:#984b36;font-size:11px;font-weight:700;text-decoration:none}
.journal-article-body{min-width:0;color:#454a41;font-size:17px;line-height:1.95;white-space:pre-wrap;overflow-wrap:anywhere}
.journal-article-footer{padding:70px 0 78px;background:#e9e7dd}
.journal-article-footer .container{max-width:1050px}
.journal-article-footer h2,.case-study-footer h2{margin:15px 0 22px;color:#292c26;font-size:clamp(38px,5.7vw,65px);font-weight:500;letter-spacing:-.07em;line-height:.99}
.journal-article-footer h2 em,.case-study-footer h2 em,.case-study-overview h2 em{color:#a9533b;font-family:"DM Serif Display",Georgia,serif;font-weight:400}
.journal-article-actions{display:flex;flex-wrap:wrap;gap:10px}
.case-study-page{overflow:hidden;background:#f6f4ed;color:#292c26}
.case-study-hero{position:relative;isolation:isolate;overflow:hidden;padding:calc(var(--nav-h) + 38px) 0 45px;background:#303c32;color:#f5f2e9}
.case-study-hero::before{position:absolute;z-index:-1;inset:0;opacity:.3;background-image:linear-gradient(rgba(245,242,233,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(245,242,233,.09) 1px,transparent 1px);background-size:62px 62px;content:"";mask-image:linear-gradient(90deg,#000,transparent 90%)}
.case-study-hero::after{position:absolute;z-index:-1;top:-260px;right:-80px;width:700px;height:700px;border:1px solid rgba(245,242,233,.12);border-radius:50%;box-shadow:0 0 0 70px rgba(245,242,233,.025),0 0 0 140px rgba(245,242,233,.02);content:""}
.case-study-container{position:relative;z-index:1;max-width:1160px}
.case-study-page .breadcrumb{margin-bottom:50px;color:rgba(245,242,233,.58)}
.case-study-page .breadcrumb a{color:rgba(245,242,233,.72)}
.case-study-page .breadcrumb span:last-child{color:#e1a083}
.case-study-eyebrow,.case-study-section-label{display:flex;align-items:center;gap:10px;color:#dfa082;font-size:10px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}
.case-study-eyebrow i{width:7px;height:7px;border-radius:50%;background:#dfa082;box-shadow:0 0 0 4px rgba(223,160,130,.13)}
.case-study-eyebrow>span{color:rgba(245,242,233,.45)}
.case-study-hero h1{max-width:1000px;margin:23px 0 38px;color:#fbf9f2;font-size:clamp(50px,8vw,100px);font-weight:500;letter-spacing:-.08em;line-height:.93}
.case-study-hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:25px;padding-top:19px;border-top:1px solid rgba(245,242,233,.2)}
.case-study-hero-bottom p{max-width:540px;margin:0;color:rgba(245,242,233,.68);font-size:16px;line-height:1.7}
.case-study-scroll{display:inline-flex;align-items:center;gap:14px;color:#efb495;font-size:9px;font-weight:750;letter-spacing:.14em;text-decoration:none}
.case-study-cover{position:relative;width:min(1240px,calc(100% - 64px));margin:0 auto;overflow:hidden;background:#e7e4d9}
.case-study-cover img{display:block;width:100%;max-height:740px;aspect-ratio:1.85;object-fit:cover}
.case-study-cover figcaption{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid rgba(41,44,38,.14);border-top:0;color:#74766c;font-size:9px;font-weight:750;letter-spacing:.13em}
.case-study-content{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(270px,.7fr);gap:clamp(35px,8vw,115px);max-width:1080px;padding-block:85px 96px}
.case-study-section-label{margin-bottom:22px;color:#9e5039;font-size:9px}
.case-study-overview h2,.case-study-toolkit h2{margin:0 0 20px;color:#292c26;font-size:clamp(38px,5vw,59px);font-weight:500;letter-spacing:-.07em;line-height:1.02}
.case-study-overview>p{max-width:660px;margin:0;color:#60655b;font-size:17px;line-height:1.9}
.case-study-facts{display:flex;flex-wrap:wrap;gap:0;margin-top:35px;padding-top:19px;border-top:1px solid rgba(41,44,38,.17)}
.case-study-facts>div{min-width:160px;padding-right:25px}
.case-study-facts>div+div{padding-left:25px;border-left:1px solid rgba(41,44,38,.16)}
.case-study-facts span,.case-study-facts strong{display:block}
.case-study-facts span{margin-bottom:7px;color:#a6533b;font-size:9px;font-weight:750;letter-spacing:.14em}
.case-study-facts strong{color:#343a32;font-size:13px;font-weight:650}
.case-study-toolkit{align-self:start;padding:25px 24px 22px;border:1px solid rgba(41,44,38,.14);background:#eeece3}
.case-study-toolkit h2{font-size:clamp(28px,3.4vw,39px)}
.case-study-tech-list{display:grid;gap:0;margin-top:20px;border-top:1px solid rgba(41,44,38,.15)}
.case-study-tech-list span{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid rgba(41,44,38,.13);color:#495046;font-size:13px;font-weight:600}
.case-study-tech-list i{color:#ac563b;font-size:16px;font-style:normal}
.case-study-toolkit>p{color:#656a5f;font-size:13px;line-height:1.7}
.case-study-live-link{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;padding:14px 15px;background:#303c32;color:#f7f4e9;font-size:10px;font-weight:750;letter-spacing:.1em;text-decoration:none;transition:background .2s}
.case-study-live-link:hover{background:#a94f37}
.case-study-footer{padding:75px 0 82px;background:#e9e7dd}
.case-study-footer .container{max-width:1080px}
.case-study-footer .case-study-section-label{margin:0;color:#9e5039}
.case-study-footer h2{margin-top:17px}
.case-study-footer .container>div{display:flex;flex-wrap:wrap;gap:10px}
@media(max-width:760px){
  .journal-article-hero,.case-study-hero{padding-top:calc(var(--nav-h) + 30px)}
  .journal-article .breadcrumb,.case-study-page .breadcrumb{margin-bottom:34px}
  .journal-article-hero h1,.case-study-hero h1{font-size:clamp(44px,12vw,70px)}
  .journal-article-cover,.case-study-cover{width:calc(100% - 32px)}
  .journal-article-cover img,.case-study-cover img{aspect-ratio:1.22}
  .journal-reading-layout{grid-template-columns:1fr;gap:25px;padding-block:40px 60px}
  .journal-reading-aside{position:static;display:grid;grid-template-columns:1fr 1fr;column-gap:12px;padding:14px 0}
  .journal-reading-aside .journal-aside-label,.journal-reading-aside strong{grid-column:1/-1}
  .journal-reading-aside strong{margin-top:10px}
  .journal-reading-aside p{margin:7px 0 0}
  .journal-reading-aside>a{align-self:center;justify-self:end;text-align:right}
  .journal-article-body{font-size:16px;line-height:1.85}
  .journal-article-footer,.case-study-footer{padding:54px 0 62px}
  .case-study-hero-bottom{align-items:flex-start;flex-direction:column}
  .case-study-content{grid-template-columns:1fr;gap:35px;padding-block:55px 65px}
  .case-study-toolkit{width:100%;padding:21px}
  .case-study-facts>div{min-width:50%;padding-right:12px}
  .case-study-facts>div+div{padding-left:15px}
}
/* Detail hero and cover spacing refinements. */
.journal-article-hero,.case-study-hero{min-height:clamp(460px,64svh,680px);display:flex;align-items:center}
.journal-article-container,.case-study-container{width:100%;padding-block:34px}
.journal-article .breadcrumb,.case-study-page .breadcrumb{margin-bottom:clamp(32px,5vh,54px)}
.journal-article-hero h1,.case-study-hero h1{max-width:950px;text-wrap:balance}
.journal-article-cover,.case-study-cover{margin:clamp(22px,4vw,42px) auto 0;border:1px solid rgba(41,44,38,.13);box-shadow:0 26px 65px rgba(41,44,38,.13)}
.journal-article-cover img,.case-study-cover img{display:block;width:100%;aspect-ratio:1.9;object-fit:cover}
@media(max-width:760px){
  .journal-article-hero,.case-study-hero{min-height:0;display:block;padding-bottom:38px}
  .journal-article-container,.case-study-container{padding-block:0}
  .journal-article-cover,.case-study-cover{width:calc(100% - 32px);margin-top:20px}
  .journal-article-cover img,.case-study-cover img{aspect-ratio:1.2}
}
/* Compact, balanced detail-page first view: readable summary first, image second, details close behind. */
.journal-article-hero,.case-study-hero{min-height:clamp(390px,51svh,550px);padding-top:calc(var(--nav-h) + 28px);padding-bottom:34px}
.journal-article-container,.case-study-container{padding-block:18px}
.case-study-hero{background:#e9e7dd;color:#292c26}
.case-study-hero::before{opacity:.24;background-image:linear-gradient(rgba(41,44,38,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(41,44,38,.1) 1px,transparent 1px)}
.case-study-hero::after{top:-320px;right:-140px;border-color:rgba(48,60,50,.12);box-shadow:0 0 0 62px rgba(48,60,50,.035),0 0 0 124px rgba(48,60,50,.025)}
.case-study-page .breadcrumb,.case-study-page .breadcrumb a{color:#74766d}
.case-study-page .breadcrumb span:last-child{color:#a6533b}
.case-study-eyebrow{color:#9e5039}
.case-study-eyebrow i{background:#b65339;box-shadow:0 0 0 4px rgba(182,83,57,.12)}
.case-study-eyebrow>span{color:#96968b}
.case-study-hero h1{margin-block:20px 24px;color:#292c26;font-size:clamp(48px,6.7vw,82px);line-height:.98}
.case-study-hero-bottom{border-color:rgba(41,44,38,.2)}
.case-study-hero-bottom p{max-width:690px;color:#5e6359;font-size:clamp(15px,1.6vw,18px);line-height:1.7}
.case-study-scroll{flex-shrink:0;color:#984b36}
.journal-article-hero{min-height:clamp(400px,53svh,570px);padding-top:calc(var(--nav-h) + 28px);padding-bottom:38px}
.journal-article-hero h1{font-size:clamp(46px,6.6vw,80px)}
.journal-article-excerpt{max-width:650px;font-size:clamp(16px,1.8vw,19px)}
.journal-article-cover,.case-study-cover{width:min(1080px,calc(100% - 72px));margin-top:26px}
.journal-article-cover img,.case-study-cover img{height:clamp(260px,34vw,470px);max-height:470px;aspect-ratio:auto;object-fit:cover}
.journal-reading-layout{padding-block:44px 66px}
.case-study-content{padding-block:46px 70px;gap:clamp(30px,6vw,78px)}
@media(max-width:760px){
  .journal-article-hero,.case-study-hero{min-height:0;padding-top:calc(var(--nav-h) + 26px);padding-bottom:30px}
  .journal-article-container,.case-study-container{padding-block:0}
  .case-study-hero h1,.journal-article-hero h1{font-size:clamp(42px,11.5vw,64px)}
  .case-study-hero-bottom p{font-size:15px}
  .journal-article-cover,.case-study-cover{width:calc(100% - 32px);margin-top:18px}
  .journal-article-cover img,.case-study-cover img{height:clamp(210px,62vw,330px);max-height:330px;aspect-ratio:auto}
  .journal-reading-layout,.case-study-content{padding-block:34px 52px}
}
/* Case-study hero: a composed title column paired with a readable project snapshot. */
.case-study-hero-grid{display:grid;width:100%;grid-template-columns:minmax(0,1.1fr) minmax(340px,.78fr);align-items:center;gap:clamp(30px,6vw,84px)}
.case-study-hero-copy{min-width:0}
.case-study-hero-copy h1{max-width:720px;margin:22px 0 27px;font-size:clamp(46px,6.2vw,78px);line-height:.98;overflow-wrap:anywhere}
.case-study-hero-copy .case-study-scroll{padding-top:15px;border-top:1px solid rgba(41,44,38,.2)}
.case-study-project-visual{position:relative;isolation:isolate;min-width:0;overflow:hidden;padding:clamp(20px,2.7vw,30px);border:1px solid rgba(245,242,233,.16);background:#303c32;color:#f5f2e9;box-shadow:0 24px 58px rgba(41,44,38,.16)}
.case-study-project-visual::before,.case-study-project-visual::after{position:absolute;z-index:-1;right:-104px;bottom:-160px;width:360px;height:360px;border:1px solid rgba(238,232,212,.12);border-radius:50%;content:""}
.case-study-project-visual::after{right:-54px;bottom:-110px;width:260px;height:260px;border-color:rgba(220,151,119,.22)}
.project-visual-orbit{position:absolute;z-index:-1;top:48px;right:54px;width:72px;height:72px;border:1px solid rgba(225,160,130,.48);border-radius:50%;box-shadow:0 0 0 10px rgba(225,160,130,.07),0 0 0 22px rgba(225,160,130,.035)}
.project-visual-top{display:flex;justify-content:space-between;gap:16px;padding-bottom:15px;border-bottom:1px solid rgba(245,242,233,.18);color:#e7a88a;font-size:9px;font-weight:750;letter-spacing:.13em}
.project-visual-top span+span{color:rgba(245,242,233,.52);font-weight:600}
.case-study-project-visual>p{position:relative;max-width:590px;margin:22px 0 21px;color:rgba(245,242,233,.85);font-size:clamp(14px,1.25vw,16px);line-height:1.75}
.project-visual-divider{height:1px;margin-bottom:15px;background:rgba(245,242,233,.16)}
.project-visual-label{display:block;margin-bottom:11px;color:rgba(245,242,233,.58);font-size:9px;font-weight:750;letter-spacing:.14em}
.project-visual-tech{display:flex;flex-wrap:wrap;gap:7px}
.project-visual-tech span{padding:7px 9px;border:1px solid rgba(245,242,233,.26);background:rgba(245,242,233,.07);color:#fffaf0;font-size:11px;font-weight:600;line-height:1.15}
.project-visual-no-tech{color:rgba(245,242,233,.7);font-size:12px}
.project-visual-link{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:20px;padding-top:14px;border-top:1px solid rgba(245,242,233,.16);color:#efb495;font-size:9px;font-weight:750;letter-spacing:.12em;text-decoration:none}
.project-visual-link:hover{color:#fff}
.case-study-cover{width:min(1080px,calc(100% - 72px));margin-top:30px}
.case-study-content{grid-template-columns:1fr;padding-block:42px 58px}
.case-study-overview h2{font-size:clamp(32px,4vw,46px)}
.case-study-facts{max-width:620px;margin-top:24px}
@media(max-width:900px){
  .case-study-hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:25px}
  .case-study-hero-copy h1{font-size:clamp(42px,6vw,62px)}
}
@media(max-width:760px){
  .case-study-hero-grid{grid-template-columns:1fr;gap:25px}
  .case-study-hero-copy h1{max-width:650px;margin-block:17px 20px;font-size:clamp(42px,11.5vw,64px)}
  .case-study-project-visual{padding:21px}
  .case-study-project-visual>p{font-size:14px}
  .case-study-cover{width:calc(100% - 32px);margin-top:20px}
  .case-study-content{padding-block:32px 46px}
}
/* Portfolio case-study page follows a clear title → description → artwork reading order. */
.case-study-intro{position:relative;isolation:isolate;overflow:hidden;padding:calc(var(--nav-h) + 30px) 0 35px;background:#e9e7dd;color:#292c26}
.case-study-intro::after{position:absolute;z-index:-1;top:-270px;right:-160px;width:600px;height:600px;border:1px solid rgba(48,60,50,.11);border-radius:50%;box-shadow:0 0 0 55px rgba(48,60,50,.025),0 0 0 110px rgba(48,60,50,.02);content:""}
.case-study-intro-container{position:relative;z-index:1;max-width:1120px}
.case-study-intro .breadcrumb{margin-bottom:42px;color:#74766d}
.case-study-intro .breadcrumb a{color:#74766d}
.case-study-intro .breadcrumb span:last-child{color:#a6533b}
.case-study-intro-label{display:flex;align-items:center;gap:11px;color:#9e5039;font-size:10px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}
.case-study-intro-label i{width:5px;height:5px;border-radius:50%;background:#b65339}
.case-study-intro h1{max-width:980px;margin:20px 0 17px;color:#292c26;font-size:clamp(48px,7.4vw,88px);font-weight:500;letter-spacing:-.078em;line-height:.96;text-wrap:balance;overflow-wrap:anywhere}
.case-study-description{max-width:790px;margin:0;color:#5d6258;font-size:clamp(16px,1.8vw,20px);line-height:1.8}
.case-study-intro-meta{display:flex;flex-wrap:wrap;gap:0;margin-top:27px;padding-top:16px;border-top:1px solid rgba(41,44,38,.18)}
.case-study-intro-meta>span{display:flex;flex-direction:column;gap:6px;padding:0 22px;color:#a6533b;font-size:8px;font-weight:750;letter-spacing:.12em}
.case-study-intro-meta>span:first-child{padding-left:0}
.case-study-intro-meta>span+span{border-left:1px solid rgba(41,44,38,.16)}
.case-study-intro-meta strong{color:#3b4138;font-size:11px;font-weight:650;letter-spacing:.02em}
.case-study-cover{width:min(1120px,calc(100% - 64px));margin:28px auto 0;border:1px solid rgba(41,44,38,.13);box-shadow:0 24px 58px rgba(41,44,38,.13)}
.case-study-cover img{display:block;width:100%;height:clamp(270px,38vw,520px);max-height:520px;aspect-ratio:auto;object-fit:cover}
.case-study-content{grid-template-columns:minmax(0,1fr) minmax(300px,.82fr);align-items:start;gap:clamp(28px,6vw,76px);max-width:1050px;padding-block:48px 68px}
.case-study-overview h2{margin:0;color:#292c26;font-size:clamp(35px,4.6vw,55px);letter-spacing:-.07em;line-height:1.02}
.case-study-overview h2 em{color:#a9533b;font-family:"DM Serif Display",Georgia,serif;font-weight:400}
.case-study-section-label{margin-bottom:18px;color:#9e5039;font-size:9px}
.case-study-section-label i{width:24px;height:1px;background:#b65339}
.case-study-toolkit{padding:24px;border:1px solid rgba(41,44,38,.14);background:#f0eee6}
.case-study-toolkit .case-study-section-label{margin-bottom:14px}
.case-study-tech-list{display:flex;flex-wrap:wrap;gap:8px;margin:0;border:0}
.case-study-tech-list span{display:inline-flex;width:auto;padding:8px 10px;border:1px solid rgba(48,60,50,.17);background:#faf9f4;color:#394238;font-size:11px;font-weight:650;line-height:1.25}
.case-study-toolkit>p{margin:0;color:#656a5f;font-size:13px;line-height:1.7}
.case-study-live-link{margin-top:18px}
@media(max-width:760px){
  .case-study-intro{padding:calc(var(--nav-h) + 24px) 0 26px}
  .case-study-intro .breadcrumb{margin-bottom:31px}
  .case-study-intro h1{font-size:clamp(42px,11.6vw,64px)}
  .case-study-description{font-size:16px;line-height:1.72}
  .case-study-intro-meta{gap:12px 0;margin-top:22px}
  .case-study-intro-meta>span{padding-inline:12px}
  .case-study-intro-meta>span:first-child{padding-left:0}
  .case-study-intro-meta>span:nth-child(3){display:none}
  .case-study-cover{width:calc(100% - 32px);margin-top:18px}
  .case-study-cover img{height:clamp(210px,62vw,340px);max-height:340px}
  .case-study-content{grid-template-columns:1fr;gap:24px;padding-block:34px 48px}
  .case-study-toolkit{padding:20px}
}
/* Keep the portfolio image and technology panel together in a 3:1 desktop layout. */
@media(min-width:761px){
  .case-study-page{display:grid;grid-template-columns:clamp(26px,5vw,84px) minmax(0,3fr) minmax(230px,1fr) clamp(26px,5vw,84px);column-gap:clamp(16px,1.8vw,26px);align-items:start}
  .case-study-intro,.case-study-footer{grid-column:1/-1}
  .case-study-cover{grid-column:2;grid-row:2;width:100%;height:auto;box-sizing:border-box;margin:28px 0 0}
  .case-study-cover img{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}
  .case-study-content{grid-column:3;grid-row:2;display:block;width:auto;max-width:none;margin:28px 0 0;padding:0;align-self:stretch}
  .case-study-toolkit{height:auto;min-height:clamp(290px,34vw,500px);box-sizing:border-box;align-self:stretch;margin:0;padding:clamp(20px,2vw,28px);border-color:rgba(48,60,50,.18);background:linear-gradient(155deg,#f5f3eb 0%,#e9e8de 100%);box-shadow:0 18px 42px rgba(41,44,38,.08)}
  .case-study-toolkit .case-study-section-label{display:flex;min-width:0;align-items:center;gap:10px;margin-bottom:22px;color:#8f4c37;font-size:10px;letter-spacing:.15em;overflow-wrap:anywhere}
  .case-study-toolkit .case-study-section-label::after{height:1px;flex:1;background:rgba(41,44,38,.15);content:""}
  .case-study-tech-list{gap:9px}
  .case-study-tech-list span{padding:9px 11px;background:#fbfaf5;font-size:12px}
  .case-study-footer{grid-row:3;margin-top:28px;padding-top:40px}
}
.case-study-footer{margin-top:0;padding-top:40px}
@media(max-width:760px){
  .case-study-page{display:block}
  .case-study-cover{width:calc(100% - 40px);margin:18px auto 30px}
  .case-study-cover img{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}
  .case-study-content{display:block;width:calc(100% - 40px);max-width:none;margin:0 auto;padding:0}
  .case-study-toolkit{grid-row:1;margin:0;padding:22px 22px 30px;background:linear-gradient(155deg,#f5f3eb 0%,#e9e8de 100%)}
  .case-study-footer{margin-top:28px;padding-top:30px}
  .case-study-overview{grid-row:2}
}
/* Balanced portfolio detail intro spacing and a softer branded backdrop. */
.case-study-intro{
  padding:clamp(34px,4.2vw,58px) 0 clamp(28px,3.6vw,46px);
  background:radial-gradient(ellipse at 78% 34%,rgba(212,220,205,.62),transparent 42%),linear-gradient(118deg,#f2f0e8 0%,#e9e7dd 54%,#efede5 100%);
}
.case-study-intro-container{width:min(calc(100% - 48px),1120px);padding-inline:0}
.case-study-intro::after{top:-300px;right:-115px;border-color:rgba(48,60,50,.1);box-shadow:0 0 0 58px rgba(48,60,50,.025),0 0 0 116px rgba(48,60,50,.018)}
@media(min-width:761px){
  .case-study-cover{margin-bottom:0}
}
@media(max-width:760px){
  .case-study-intro{padding:30px 0 26px}
  .case-study-intro-container{width:calc(100% - 40px)}
  .case-study-intro .breadcrumb{margin-bottom:25px}
}
@media(min-width:761px){
  .case-study-footer{margin-top:28px}
}
/* Refined long-form journal article layout. */
.journal-article{background:#f6f4ed}
.journal-article-hero{min-height:0;display:block;padding:clamp(38px,4.6vw,64px) 0 38px;background:radial-gradient(ellipse at 82% 34%,rgba(210,219,202,.68),transparent 42%),linear-gradient(118deg,#f2f0e8 0%,#e9e7dd 54%,#efede5 100%);color:#292c26}
.journal-article-hero::after{top:-320px;right:-120px;border-color:rgba(48,60,50,.1);box-shadow:0 0 0 58px rgba(48,60,50,.025),0 0 0 116px rgba(48,60,50,.018)}
.journal-article-container{width:min(calc(100% - 48px),920px);max-width:none;padding:0}
.journal-article .breadcrumb{margin-bottom:clamp(26px,3.4vw,38px);color:#74766d}
.journal-article .breadcrumb a{color:#74766d}
.journal-article .breadcrumb span:last-child{color:#a6533b}
.journal-article-category{color:#9e5039}
.journal-article-category span{color:#929387}
.journal-article-hero h1{max-width:850px;margin:19px 0 16px;color:#292c26;font-size:clamp(46px,6.4vw,78px);line-height:.99;text-wrap:balance;overflow-wrap:anywhere}
.journal-article-excerpt{max-width:700px;color:#5d6258;font-size:clamp(16px,1.7vw,19px);line-height:1.8}
.journal-article-byline{max-width:700px;margin-top:25px;padding-top:15px;border-color:rgba(41,44,38,.17);color:#74766d}
.journal-article-byline strong{color:#303c32}
.journal-article-byline small{color:#77796f}
.journal-article-cover{width:min(1100px,calc(100% - 48px));margin:0 auto;border:1px solid rgba(41,44,38,.13);box-shadow:0 22px 54px rgba(41,44,38,.12)}
.journal-article-cover img{width:100%;height:clamp(280px,38vw,500px);max-height:500px;aspect-ratio:auto;object-fit:cover}
.journal-article-cover figcaption{background:#f0eee6;font-size:10px}
.journal-reading-layout{width:min(calc(100% - 48px),1080px);max-width:none;grid-template-columns:minmax(170px,220px) minmax(0,720px);gap:clamp(38px,7vw,96px);padding-block:clamp(46px,6vw,72px) clamp(58px,7vw,88px)}
.journal-reading-aside{padding:20px 18px;border:1px solid rgba(41,44,38,.13);border-top:2px solid #b65339;background:#f0eee6}
.journal-reading-aside p{font-size:13px}
.journal-article-body{font-size:clamp(17px,1.35vw,19px);line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere}
.journal-article-footer{padding:52px 0 70px;border-top:1px solid rgba(41,44,38,.12);background:#e9e7dd}
.journal-article-footer .container{width:min(calc(100% - 48px),1080px);max-width:none}
@media(max-width:760px){
  .journal-article-hero{padding:28px 0 28px}
  .journal-article-container{width:calc(100% - 40px)}
  .journal-article .breadcrumb{margin-bottom:24px}
  .journal-article-hero h1{font-size:clamp(42px,11.5vw,62px)}
  .journal-article-excerpt{font-size:16px;line-height:1.72}
  .journal-article-cover{width:calc(100% - 40px);margin:0 auto}
  .journal-article-cover img{height:clamp(220px,64vw,350px)}
  .journal-reading-layout{width:calc(100% - 40px);grid-template-columns:1fr;gap:27px;padding-block:36px 50px}
  .journal-reading-aside{position:static;display:grid;grid-template-columns:1fr;gap:6px;padding:17px}
  .journal-reading-aside .journal-aside-label,.journal-reading-aside strong{grid-column:auto}
  .journal-reading-aside strong{margin-top:5px}
  .journal-reading-aside>a{justify-self:start;text-align:left}
  .journal-article-body{font-size:16px;line-height:1.82}
  .journal-article-footer{padding:42px 0 52px}
  .journal-article-footer .container{width:calc(100% - 40px)}
}
/* Final spacing pass for the journal detail hero and its cover artwork. */
.journal-article-hero{padding-bottom:26px}
.journal-article-cover{margin-top:24px;padding:12px;background:#eeece3}
.journal-article-cover img{border:1px solid rgba(41,44,38,.1)}
.journal-article-cover figcaption{margin-top:8px;padding:10px 4px 2px;border:0;background:transparent}
@media(max-width:760px){
  .journal-article-hero{padding-bottom:20px}
  .journal-article-cover{width:calc(100% - 40px);margin-top:20px;padding:8px}
  .journal-article-cover img{height:clamp(220px,64vw,350px)}
  .journal-article-cover figcaption{gap:8px;padding-top:9px;font-size:8px}
}
/* Structured portfolio stories use the same editorial palette as the case study cover. */
.case-study-toolkit-subhead{display:flex;margin-top:24px;padding-top:20px;border-top:1px solid rgba(41,44,38,.14)}
.case-study-capability-list{display:grid;gap:0;margin:0;padding:0;list-style:none}
.case-study-capability-list li{position:relative;padding:11px 0 11px 17px;border-bottom:1px solid rgba(41,44,38,.12);color:#394238;font-size:13px;line-height:1.5}
.case-study-capability-list li::before{position:absolute;top:18px;left:0;width:5px;height:5px;border-radius:50%;background:#b65339;content:""}
.case-study-story{grid-column:2/4;grid-row:3;width:auto;max-width:1050px;margin:0;padding:clamp(42px,6vw,76px) 0 68px;border-top:1px solid rgba(41,44,38,.16)}
.case-study-story-heading{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:end;gap:30px;margin-bottom:34px}
.case-study-story-heading .case-study-section-label{grid-column:1/-1;margin:0}
.case-study-story-heading h2{grid-column:1/-1;margin:0;color:#292c26;font-size:clamp(36px,5vw,62px);font-weight:500;letter-spacing:-.07em;line-height:1.01}
.case-study-story-heading h2 em{color:#a9533b;font-family:"DM Serif Display",Georgia,serif;font-weight:400}
.case-study-story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 34px;border-top:1px solid rgba(41,44,38,.16)}
.case-study-story-block{min-width:0;padding:23px 0 26px;border-bottom:1px solid rgba(41,44,38,.16)}
.case-study-story-block>span{display:block;margin-bottom:14px;color:#a6533b;font-size:9px;font-weight:750;letter-spacing:.14em}
.case-study-story-block>p{margin:0;color:#555b51;font-size:15px;line-height:1.82}
.case-study-story-block ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.case-study-story-block li{position:relative;padding-left:16px;color:#555b51;font-size:14px;line-height:1.62}
.case-study-story-block li::before{position:absolute;top:.7em;left:0;width:5px;height:5px;border-radius:50%;background:#b65339;content:""}
.case-study-story-wide{grid-column:1/-1}
.case-study-delivery-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 26px}
.case-study-delivery-list p{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;margin:0;color:#555b51;font-size:14px;line-height:1.68}
.case-study-delivery-list b{color:#a6533b;font-size:11px;letter-spacing:.08em}
@media(min-width:761px){.case-study-footer{grid-row:4}}
@media(max-width:760px){
  .case-study-story{width:calc(100% - 40px);max-width:none;margin:36px auto 0;padding:32px 0 44px}
  .case-study-story-heading{display:block;margin-bottom:23px}
  .case-study-story-heading .case-study-section-label{margin-bottom:14px}
  .case-study-story-grid{grid-template-columns:1fr}
  .case-study-story-wide{grid-column:auto}
  .case-study-delivery-list{grid-template-columns:1fr;gap:12px}
}
/* Keep portfolio card labels and actions inside the cover on narrow screens. */
@media(max-width:700px){
  .work-section .work-project-art,
  .work-section .work-project-wide .work-project-art{height:clamp(300px,88vw,360px);min-height:0;aspect-ratio:auto}
  .work-section .work-project-copy,
  .work-section .work-project-wide .work-project-copy{inset:0;min-width:0;overflow:hidden;padding:clamp(15px,5vw,20px);}
  .work-section .work-project-copy .editorial-meta{max-width:100%;flex-wrap:wrap;overflow-wrap:anywhere}
  .work-section .work-project-copy .editorial-meta span{min-width:0;overflow-wrap:anywhere}
  .work-section .work-project-copy h3{max-width:100%;font-size:clamp(22px,6.5vw,27px);line-height:1.08;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .work-section .work-project-copy .work-tech-list{max-width:100%;max-height:52px;overflow:hidden;gap:5px}
  .work-section .work-project-copy .work-tech-list span{max-width:100%;overflow-wrap:anywhere;font-size:9px}
  .work-section .work-project-copy .editorial-card-link{max-width:100%;gap:8px;margin-top:12px;padding:9px 11px;line-height:1.3;white-space:normal}
}