*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
    --black: #1d1d1d;
    --dark: #1a1a1a;
    --dark2: #202020;
    --card-dark: #232323;
    --white: #ffffff;
    --offwhite: #f7f7f7;
    --lightgray: #e7e7e7;
    /* Agitech mauve — official wordmark accent (#984895), reused as the site's single accent color. */
    --violet: #984895;
    --violet-light: #b671b3;
    --violet-soft: rgba(152,72,149,0.08);
    --ink: #16151a;
    --muted: #6b6b76;
    --muted-onDark: #b7b0c2;
    --border: rgba(20,20,20,0.09);
    --border-onDark: rgba(255,255,255,0.1);
    --font-display: 'Space Grotesk', sans-serif;
    --font-body: 'DM Sans', sans-serif;
  }
  html { scroll-behavior: smooth; }
  body { font-family: var(--font-body); color: var(--ink); background: var(--white); line-height: 1.6; overflow-x: hidden; }
  img { max-width: 100%; display: block; }
  /* Raw WP editor images surfacing inside rich-text content blocks (case insights,
     why-join, cms pages, etc) carry these WP classes — constrain them, they otherwise
     render at native pixel size and blow out the layout. */
  img[class*="wp-image"], img.aligncenter, img.alignleft, img.alignright,
  img.size-large, img.size-full, img.size-medium {
    height: auto; max-width: 100%; border-radius: 12px; margin: 1.5rem auto; display: block;
  }
  a { color: inherit; text-decoration: none; }
  ul { list-style: none; }
  .container { max-width: 1428px; margin: 0 auto; padding: 0 30px; }
  .container-sm { max-width: 1198px; margin: 0 auto; padding: 0 30px; }

  /* Minimal grid fallback for the ported WP markup's Bootstrap-style .row/.col-lg-*
     classes (Bootstrap itself was dropped when moving to the agifid design system).
     Blocks with a bespoke `display:grid` rule on their own .row (e.g. .why-section
     .row) override this by selector specificity — this only fills the gap for blocks
     that never got one, so their columns don't just stack full-width. */
  .row { display: flex; flex-wrap: wrap; margin: 0 -0.75rem; }
  .row > [class*="col-"] { padding: 0 0.75rem; box-sizing: border-box; width: 100%; }
  .col-lg-1 { flex: 0 0 8.3333%; max-width: 8.3333%; }
  .col-lg-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
  .col-lg-3 { flex: 0 0 25%; max-width: 25%; }
  .col-lg-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
  .col-lg-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
  .col-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-lg-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
  .col-lg-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
  .col-lg-9 { flex: 0 0 75%; max-width: 75%; }
  .col-lg-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
  .col-lg-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
  .col-lg-12 { flex: 0 0 100%; max-width: 100%; }
  @media (max-width: 900px) {
    .row > [class*="col-lg-"] { flex: 0 0 100%; max-width: 100%; }
  }
  /* Several blocks give their own .row a bespoke `display:grid` (why-section, talk-section,
     credite-section, odoo-expertise-content, our-services-content, help-fields,
     key-features-section .row, custom-development-section .content). Their children still
     carry the ported col-lg-* classes for markup fidelity, but the col-lg-N percentage
     max-width above would then shrink each child to N% of its own already-N%-wide grid
     track (e.g. 25% of a 25% track = ~6% of the page) — double-constrained. Neutralize the
     fallback's sizing inside those containers so the grid's own track sizing wins. */
  .why-section .row > [class*="col-"],
  .talk-section .row > [class*="col-"],
  .credite-section .row > [class*="col-"],
  .odoo-expertise-content > [class*="col-"],
  .our-services-content > [class*="col-"],
  .help-fields > [class*="col-"],
  .key-features-section .row > [class*="col-"],
  .custom-development-section .content > [class*="col-"] {
    max-width: none; flex-basis: auto; width: 100%;
  }
  h1,h2,h3,h4,h5,h6 { font-family: var(--font-display); font-weight: 300; letter-spacing: -0.01em; }
  h2 { font-size: clamp(1.7rem, 1.1rem + 2vw, 3rem); line-height: 1.25; }
  h3 { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.4rem); line-height: 1.3; }
  h4 { font-size: clamp(1.2rem, 1rem + 0.8vw, 2rem); line-height: 1.35; }
  .eyebrow { font-size: 0.8rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--violet); margin-bottom: 0.75rem; }

  /* Buttons */
  .btn { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.85rem 1.8rem; border-radius: 100px; font-weight: 500; font-size: 0.95rem; transition: all 0.25s ease; }
  .btn-light { background: transparent; color: var(--white); border: 1px solid var(--white); }
  .btn-light:hover { background: var(--violet); border-color: var(--violet); color: var(--white); transform: translateY(-2px); }
  .btn-violet { background: var(--violet); color: var(--white); }
  .btn-violet:hover { background: var(--violet-light); transform: translateY(-2px); }
  .btn-outline { border: 1.5px solid var(--border); color: var(--ink); }
  .btn-outline:hover { border-color: var(--violet); color: var(--violet); }
  .primary-btn a, .light-btn a, .dark-link a, .dark-link .learn-more-link, .light-page-link, .page-link {
    display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 100px; font-weight: 500; transition: all 0.25s ease;
  }
  .primary-btn a { background: var(--violet); color: var(--white); padding: 0.85rem 1.8rem; font-size: 0.95rem; }
  .primary-btn a:hover { background: var(--violet-light); transform: translateY(-2px); }
  .light-btn a { background: transparent; color: var(--white); border: 1px solid var(--white); padding: 0.85rem 1.8rem; font-size: 0.95rem; }
  .light-btn a:hover { background: var(--violet); border-color: var(--violet); transform: translateY(-2px); }
  .dark-link a, .dark-link .learn-more-link { color: var(--violet); font-weight: 600; cursor: pointer; }

  /* Header */
  header { position: sticky; top: 0; z-index: 100; background: var(--black); border-bottom: 1px solid #fff; }
  .brand-bar { height: 4px; background: linear-gradient(90deg, #984895, #b671b3, #984895); }
  .header-wrap { display: flex; align-items: center; justify-content: space-between; padding-top: 0.75rem; padding-bottom: 0.75rem; }
  .logo img { height: 34px; width: auto; }
  .main_menu { display: flex; align-items: center; gap: 2.5rem; }
  .main_menu > ul { display: flex; gap: 2rem; }
  .main_menu > ul > li > a { color: #fff; font-size: 12px; letter-spacing: 0.6px; text-transform: uppercase; white-space: nowrap; transition: color 0.2s, letter-spacing 0.3s ease-in-out; }
  .main_menu > ul > li:hover > a { letter-spacing: 1px; }
  .main_menu ul a { color: var(--muted-onDark); font-size: 0.92rem; transition: color 0.2s; }
  .main_menu ul a:hover { color: var(--white); }
  .has-submenu { position: relative; }
  .submenu-toggle { display: none; }
  .has-submenu .submenu {
    display: none; position: absolute; top: 100%; left: -1rem; margin-top: 0;
    padding-top: 0.75rem; background: none; border: none;
    min-width: 240px; flex-direction: column; gap: 0; z-index: 50;
  }
  .has-submenu .submenu-inner {
    background: var(--dark2); border: 1px solid var(--border-onDark); border-radius: 12px;
    padding: 0.5rem;
  }
  .has-submenu:hover .submenu { display: flex; }
  .has-submenu .submenu li { width: 100%; }
  .has-submenu .submenu a { display: block; padding: 0.6rem 0.75rem; border-radius: 8px; font-size: 0.87rem; }
  .has-submenu .submenu a:hover { background: rgba(255,255,255,0.06); }
  .has-submenu .submenu .submenu-all a { color: var(--violet-light); font-weight: 500; border-top: 1px solid var(--border-onDark); margin-top: 0.25rem; padding-top: 0.75rem; }
  .discuss-btn a { background: var(--violet); color: var(--white); padding: 14px 32px; border-radius: 200px; font-size: 12px; letter-spacing: 0.6px; text-transform: uppercase; font-weight: 400; transition: background 0.2s; }
  .discuss-btn a:hover { background: var(--violet-light); }
  .lines-button { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 6px; }
  .lines-button .lines, .lines-button .lines::before, .lines-button .lines::after { content:''; display:block; width: 22px; height: 2px; background: var(--white); transition: 0.3s; }
  .lines-button .lines::before { transform: translateY(-7px); }
  .lines-button .lines::after { transform: translateY(5px); }
  .lang-flag { display: inline-flex; align-items: center; padding: 3px; border: 1px solid rgba(255,255,255,0.35); border-radius: 100px; font-size: 11px; letter-spacing: 0.06em; }
  .lang-flag .lang-opt { padding: 4px 9px; border-radius: 100px; color: var(--muted-onDark); transition: background 0.2s, color 0.2s; line-height: 1.2; }
  .lang-flag a.lang-opt:hover { color: var(--white); background: rgba(255,255,255,0.12); }
  .lang-flag .active { color: var(--white); background: var(--violet); font-weight: 600; }

  /* Corner glow — agifid pattern: hero only (not every section), two swept glows.
     Agifid's home: teal top-right + mauve bottom-left. Agitech home: same spot, colors
     swapped (mauve top-right + green bottom-left). Every other page: mauve only. */
  .banner-sec { position: relative; overflow: hidden; z-index: 0; }
  .banner-sec::after {
    content: ''; position: absolute; width: 700px; height: 700px;
    background: radial-gradient(circle, rgba(152,72,149,0.28) 0%, transparent 70%);
    top: -220px; right: -180px; pointer-events: none; z-index: 0;
  }
  .is-home .banner-sec::before {
    content: ''; position: absolute; width: 650px; height: 650px;
    background: radial-gradient(circle, rgba(0,210,174,0.24) 0%, transparent 70%);
    bottom: -260px; left: -200px; pointer-events: none; z-index: 0;
  }

  /* Hero */
  .home-banner, .banner-sec { background: var(--black); color: var(--white); padding: 6rem 0 7rem; }
  .banner-sec .row { position: relative; z-index: 2; }
  .banner-sec .text h6 { font-family: var(--font-body); color: var(--muted-onDark); font-size: 0.85rem; font-weight: 500; letter-spacing: 0.04em; margin-bottom: 1.25rem; }
  .banner-sec .text h1, .banner-sec .text h2 { font-size: clamp(1.6rem, 5vw, 2.7rem); line-height: 1.12; max-width: 680px; margin-bottom: 2.25rem; }
  /* agifid's hero is text + gradient glow only, no side artwork — dropping the WP
     decorative background SVGs (banner-bg-*.svg) kept in .right-img for brand consistency. */
  .banner-sec .right-img { display: none; }
  .banner-sec.inner-pages-banner { padding: 4.5rem 0; }
  .hero-cta-group { display: flex; align-items: center; gap: 1.75rem; flex-wrap: wrap; }
  .hero-cta-secondary a { color: var(--white); font-weight: 500; font-size: 0.95rem; text-decoration: underline; text-underline-offset: 3px; }
  .hero-cta-secondary a:hover { color: var(--violet-light); }

  /* Experts */
  .certified-experts-section { padding: 4rem 0; background: var(--white); }
  .certified-experts-section h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 0.6rem; }
  .certified-experts-section h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 2.5rem; }
  .experts-marquee { overflow: hidden; }
  .experts-slider { display: flex; gap: 1.5rem; width: max-content; animation: experts-scroll 40s linear infinite; }
  .experts-marquee:hover .experts-slider { animation-play-state: paused; }
  @keyframes experts-scroll { to { transform: translateX(calc(-50% - 0.75rem)); } }
  @media (prefers-reduced-motion: reduce) { .experts-marquee { overflow-x: auto; } .experts-slider { animation: none; } }
  .certified-experts-section .primary-btn { text-align: left; margin-top: 2.5rem; }
  .expert-member { flex: 0 0 220px; }
  .expert-member img { width: 100%; height: 260px; object-fit: cover; border-radius: 14px; margin-bottom: 1rem; }
  .expert-info h5 { font-size: 1.05rem; margin-bottom: 0.15rem; }
  .expert-info h6 { color: var(--muted); font-size: 0.85rem; font-weight: 400; }

  /* Why section */
  .why-section { padding: 4rem 0; background: var(--offwhite); }
  .why-section .row { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
  .why-title { grid-column: 1 / -1; }
  .why-title h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 2.5rem; max-width: 640px; }
  .why-image h3 { display: none; }
  .why-img img { border-radius: 16px; width: 100%; height: 420px; object-fit: cover; }
  .why-content .item { padding: 1.5rem 0; border-top: 1px solid var(--border); }
  .why-content .item:last-of-type { border-bottom: 1px solid var(--border); }
  .why-content h4 { color: var(--violet); font-size: 0.85rem; font-weight: 600; margin-bottom: 0.4rem; }
  .why-content h5 { font-size: 1.15rem; margin-bottom: 0.6rem; }
  .why-content ul li { color: var(--muted); font-size: 0.92rem; margin-bottom: 0.3rem; padding-left: 1rem; position: relative; }
  .why-content ul li::before { content: '—'; position: absolute; left: 0; color: var(--violet); }
  /* Bootstrap flex utilities the ported WP markup still relies on (Bootstrap
     itself was dropped). Only the handful actually used across the blocks. */
  .d-flex { display: flex; }
  .align-items-center { align-items: center; }
  .justify-content-between { justify-content: space-between; }

  .badge-oodo-img { gap: 1.25rem; margin-bottom: 1.75rem; width: fit-content; padding: 0.75rem 1.25rem; background: var(--offwhite); border: 1px solid var(--border); border-radius: 14px; }
  .badge-oodo-img .badge-img { gap: 0.75rem; }
  .badge-oodo-img .badge-img img { max-width: 40px; height: 40px; width: auto; object-fit: contain; }
  .badge-oodo-img .badge-img { flex-wrap: wrap; }
  .badge-oodo-img .img-odoo { padding-left: 1.25rem; border-left: 1px solid var(--border); }
  .badge-oodo-img .img-odoo img { max-width: 110px; height: auto; width: auto; display: block; }

  /* Odoo expertise / ideas */
  .odoo-expertise-section { padding: 4rem 0; background: var(--white); }
  .odoo-expertise-section h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 2.75rem; text-align: center; }
  .odoo-expertise-content { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.75rem; }
  .odoo-expertise-content .item { padding: 2rem; border: 1px solid var(--border); border-radius: 16px; transition: border-color 0.25s, transform 0.25s; }
  .odoo-expertise-content .item:hover { border-color: var(--violet); transform: translateY(-4px); }
  .odoo-expertise-content .icon img { width: 42px; height: 42px; margin-bottom: 1.25rem; }
  .odoo-expertise-content h5, .odoo-expertise-content h6 { font-size: 1.05rem; margin-bottom: 0.9rem; font-family: var(--font-display); }
  .odoo-expertise-content ul li, .odoo-expertise-content p { font-size: 0.88rem; color: var(--muted); margin-bottom: 0.5rem; }
  /* Free-text lists: global reset strips bullets, restore a consistent marker + rhythm */
  .odoo-expertise-content ul, .perks-list ul, .needs-section .solution ul { margin: 0 0 0.75rem; padding: 0; }
  .odoo-expertise-content li, .perks-list li, .needs-section .solution li { position: relative; padding-left: 1.1rem; margin-bottom: 0.45rem; line-height: 1.5; }
  .odoo-expertise-content li::before, .perks-list li::before, .needs-section .solution li::before { content: ''; position: absolute; left: 0; top: 0.6em; width: 5px; height: 5px; border-radius: 50%; background: var(--violet); }
  .odoo-expertise-section .item p { margin: 0 0 0.75rem; line-height: 1.55; }
  .odoo-expertise-section .item p:last-child, .odoo-expertise-section .item ul:last-child { margin-bottom: 0; }
  .ideas-software-section { background: var(--offwhite); }
  .ideas-software-section .odoo-expertise-content { grid-template-columns: 1fr 1fr; }
  .ideas-software-section h4 { color: var(--violet); font-family: var(--font-display); font-size: 1.5rem; margin-bottom: 0.5rem; }

  /* Services */
  .our-services-section { padding: 4rem 0; background: var(--black); color: var(--white); }
  .our-services-section .title { text-align: center; max-width: 620px; margin: 0 auto 3rem; }
  .our-services-section .title h2 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 0.9rem; }
  .our-services-section .title h6 { color: var(--muted-onDark); font-weight: 400; font-size: 1rem; }
  .our-services-content { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; max-width: 760px; margin: 0 auto; }
  .our-services-content .item-wrap { display: block; background: var(--card-dark); border: 1px solid var(--border-onDark); border-radius: 18px; padding: 2.25rem; height: 100%; transition: border-color 0.25s, transform 0.25s; }
  .our-services-content .item-wrap:hover { border-color: var(--violet); transform: translateY(-4px); }
  .our-services-content h4 { font-size: 1.2rem; margin-bottom: 1.25rem; }
  .our-services-content ul { margin-bottom: 1.75rem; }
  .our-services-content ul li { font-size: 0.87rem; color: var(--muted-onDark); margin-bottom: 0.55rem; }
  .our-services-content ul li a { color: inherit; }
  .our-services-content ul li a:hover { color: var(--violet-light); }
  .light-page-link { font-family: var(--font-display); font-size: 1.3rem; font-weight: 600; color: var(--violet-light); padding-top: 1rem; border-top: 1px solid var(--border-onDark); }
  .price-vat { font-size: 0.65rem; font-weight: 400; color: var(--muted-onDark); margin-left: 0.35rem; letter-spacing: 0.03em; vertical-align: middle; }
  .our-services-content .tier-price { font-family: var(--font-display); font-size: 1.1rem; font-weight: 600; color: var(--white); padding-top: 1rem; border-top: 1px solid var(--border-onDark); }
  .our-services-content .light-page-link { display: block; font-size: 0.85rem; font-weight: 500; border-top: none; padding-top: 0.5rem; }

  /* Full image */
  .ful-image-section { position: relative; }
  .ful-image-section img { width: 100%; height: 420px; object-fit: cover; }
  .ful-image-section.black-overlay::after { content:''; position:absolute; inset:0; background: rgba(20,20,20,0.35); }

  /* Trust / logos */
  .trust-us-section { padding: 4rem 0; background: var(--lightgray); }
  .trust-us-section .title { text-align: center; max-width: 680px; margin: 0 auto 2.5rem; }
  .trust-us-section .title h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 0.9rem; }
  .trust-us-section .title h6 { font-weight: 400; color: var(--muted); font-size: 1rem; }
  .companies-logos { display: flex; flex-wrap: wrap; justify-content: center; gap: 2.5rem; margin-bottom: 2.5rem; }
  .companies-logos .item { flex: 0 0 auto; display: flex; align-items: center; height: 38px; }
  .companies-logos .item img { height: 100%; width: auto; max-width: 120px; object-fit: contain; filter: grayscale(1); opacity: 0.6; transition: 0.2s; }
  .companies-logos .item img:hover { filter: none; opacity: 1; }
  .trust-us-section .primary-btn { text-align: center; }

  /* Talk section */
  .talk-section { padding: 4rem 0; background: var(--white); }
  .talk-section .row { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 3.5rem; align-items: center; }
  .talk-section .person-img img { border-radius: 16px; width: 100%; height: 420px; object-fit: cover; }
  .talk-section h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 0.75rem; }
  .talk-section h4 { font-size: 1.75rem; margin-bottom: 1.1rem; }
  .talk-section p { color: var(--muted); margin-bottom: 1.75rem; max-width: 480px; }

  /* Team members grid */
  .our-team-section { padding: 4rem 0; background: var(--white); }
  .our-team-section .left-content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; }
  .our-team-section .title h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 2rem; }
  .our-team-section .items-wrap .item { padding-bottom: 1.5rem; }
  .our-team-section .items-wrap .item-wrap { display: flex; flex-direction: column; height: 100%; background: var(--white); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; }
  .our-team-section .items-wrap .item-wrap .img img { display: block; width: 100%; height: 300px; object-fit: cover; object-position: 50% 15%; }
  @media (max-width: 900px) { .our-team-section .items-wrap .item-wrap .img img { height: 340px; object-position: 50% 12%; } }
  .our-team-section .content { display: flex; flex-direction: column; flex: 1; padding: 1.25rem 1.25rem 1.1rem; }
  .our-team-section .content h6 { font-size: 1.1rem; margin-bottom: 0.15rem; }
  .our-team-section .content .role { color: var(--violet); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.03em; margin-bottom: 0.85rem; padding-bottom: 0.85rem; border-bottom: 1px solid var(--border); }
  .our-team-section .content p { color: var(--muted); font-size: 0.88rem; line-height: 1.55; margin-bottom: 1rem; }
  .our-team-section .content .role { text-transform: none; }
  .our-team-section .content .dark-link { margin-top: auto; padding-top: 0.25rem; }

  /* Recruiting CTA */
  .recruiting-section { padding: 4rem 0; background: var(--offwhite); }
  .recruiting-section .content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; }
  .recruiting-section .content h4 { font-size: 1.6rem; margin: 0.75rem 0 1rem; }
  .recruiting-section .content p { color: var(--muted); margin-bottom: 1.5rem; }
  .recruiting-section img { border-radius: 16px; width: 100%; height: 320px; object-fit: cover; }

  /* FAQ (ported from agifid) */
  .faq-section { padding: 4rem 0; background: var(--offwhite); }
  .faq-section .title { text-align: center; max-width: 620px; margin: 0 auto 3rem; }
  .faq-section h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 0.75rem; }
  .faq-section .title p { color: var(--muted); }
  .faq-list { display: flex; flex-direction: column; gap: 0.75rem; max-width: 820px; margin: 0 auto; }
  .faq-item { background: var(--white); border: 1px solid var(--border); border-radius: 16px; padding: 1.25rem 1.5rem; }
  .faq-item summary { font-family: var(--font-display); font-size: 1.05rem; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
  .faq-item summary::-webkit-details-marker { display: none; }
  .faq-item summary::after { content: '+'; font-size: 1.4rem; color: var(--violet); flex-shrink: 0; transition: transform 0.2s; }
  .faq-item[open] summary::after { transform: rotate(45deg); }
  .faq-item p { color: var(--muted); margin-top: 1rem; line-height: 1.7; }
  @media (max-width: 560px) {
    .faq-section { padding: 3.5rem 0; }
    .faq-section h3 { font-size: 1.5rem; }
    .faq-item { padding: 1rem 1.1rem; }
    .faq-item summary { font-size: 0.92rem; line-height: 1.4; align-items: flex-start; }
  }

  /* Contact hero (homepage bottom, ported from agifid — trust list + Calendly + form) */
  .contact-hero { padding: 4rem 0 5rem; background: var(--white); }
  .contact-hero-intro { max-width: 640px; margin-bottom: 3rem; }
  .contact-hero-intro h1, .contact-hero-intro h2 { font-size: 2.3rem; margin-bottom: 1.5rem; }
  .contact-hero-intro h1 span, .contact-hero-intro h2 span { color: var(--violet); text-decoration: underline; text-decoration-color: var(--violet-soft); text-underline-offset: 6px; }
  .trust-list { margin-bottom: 2.5rem; }
  .trust-list li { color: var(--ink); font-size: 0.95rem; font-weight: 500; margin-bottom: 0.6rem; padding-left: 1.6rem; position: relative; }
  .trust-list li::before { content: '✓'; position: absolute; left: 0; color: var(--violet); font-weight: 700; }
  .contact-hero-intro h5 { font-size: 1.2rem; margin-bottom: 0.5rem; }
  .contact-hero-intro > p { color: var(--muted); margin-bottom: 0; }
  .contact-hero-row { display: grid; grid-template-columns: 1.05fr 1fr; gap: 3.5rem; align-items: start; }
  .calendly-embed-wrap { border-radius: 16px; overflow: hidden; border: 1px solid var(--border); }
  .calendly-fallback { text-align: center; padding: 2rem; }
  @media (max-width: 900px) { .contact-hero-row { grid-template-columns: 1fr; } }

  /* Thank you pages */
  .thank-you-section { padding: 8rem 0; }
  .thank-you-box { max-width: 560px; margin: 0 auto; text-align: center; }
  .thank-you-icon { width: 64px; height: 64px; margin: 0 auto 1.5rem; border-radius: 50%; background: var(--violet-soft); color: var(--violet); font-size: 1.6rem; display: flex; align-items: center; justify-content: center; }
  .thank-you-box h1 { font-size: 2rem; margin-bottom: 1rem; }
  .thank-you-box p { color: var(--muted); margin-bottom: 2rem; }
  .thank-you-box .btn { margin: 0 0.5rem; }

  /* Contact us section */
  .contact-us-section { padding: 4rem 0; background: var(--white); }
  .contact-us-section .left-content h2 { font-size: 2rem; margin-bottom: 1.5rem; }
  .contact-us-section .left-content ul { margin-bottom: 2rem; }
  .contact-us-section .left-content ul li { color: var(--muted); font-size: 0.95rem; margin-bottom: 0.6rem; padding-left: 1.4rem; position: relative; }
  .contact-us-section .left-content ul li::before { content: '✓'; position: absolute; left: 0; color: var(--violet); font-weight: 700; }
  .contact-us-section .chat-with h6 { font-size: 1.1rem; margin-bottom: 0.4rem; }
  .contact-us-section .chat-with p { color: var(--muted); margin-bottom: 1rem; }
  .contact-us-section .chat-link { display: flex; align-items: center; gap: 1rem; }

  /* Contact form (ported from agifid — was missing entirely, form rendered unstyled) */
  .contact-card { background: var(--offwhite); border: 1px solid var(--border); border-radius: 16px; padding: 2.5rem; }
  .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  .form-field { margin-bottom: 1.5rem; }
  .form-field label { display: block; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); margin-bottom: 0.5rem; }
  .form-field input, .form-field textarea, .form-field select {
    width: 100%; border: none; border-bottom: 1px solid var(--border); border-radius: 0;
    padding: 0.5rem 0; font-family: var(--font-body); font-size: 0.95rem; color: var(--ink); background: transparent;
  }
  .form-field input:focus, .form-field textarea:focus, .form-field select:focus { outline: none; border-color: var(--violet); }
  .form-field textarea { resize: vertical; }
  .form-field select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 1.75rem; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23984895' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right 0.25rem center; }
  .contact-form button[type="submit"] { width: 100%; justify-content: center; border: none; cursor: pointer; margin-top: 0.5rem; }
  @media (max-width: 560px) { .form-row { grid-template-columns: 1fr; } .contact-card { padding: 1.75rem; } }
  .chat-with h6 { font-size: 1.1rem; margin-bottom: 0.4rem; }
  .chat-with p { color: var(--muted); margin-bottom: 1rem; }
  .chat-link { display: flex; align-items: center; gap: 1rem; }
  .btn-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }

  /* Expertise */
  .expertises-section { padding: 4rem 0; background: var(--white); }
  .expertises-section .title h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); }
  .expertises-content { padding: 1.5rem 0; }
  .expertises-content .item .icon img { width: 36px; height: 36px; margin-bottom: 1rem; }
  .expertises-content h5 { font-size: 1.1rem; margin-bottom: 0.5rem; }
  .expertises-content p { color: var(--muted); font-size: 0.9rem; }

  /* Recruitment / why join */
  .recruitment-section { padding: 4rem 0; background: var(--white); }
  .recruitment-section .left-content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; }
  .recruitment-section .right-content h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 1rem; }
  .recruitment-section .right-content p { margin-bottom: 1.25rem; }
  .lists-wrap { margin-top: 2rem; }
  .perks-list { padding: 1.5rem 0; }
  .perks-list .img img { height: 32px; margin-bottom: 0.75rem; }
  .perks-list h6 { font-size: 1.05rem; margin-bottom: 0.5rem; }
  .image-container img { width: 100%; border-radius: 16px; margin-top: 2rem; height: 380px; object-fit: cover; }

  /* Open positions */
  .open-positions-section { padding: 4rem 0 2.5rem; }
  .open-positions-section h6 { color: var(--violet-light); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 2rem; }
  .open-positions-section .left-content h3 { color: var(--white); font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); }
  .open-positions-section .right-content ul li { margin-bottom: 0.75rem; }
  .open-positions-section .right-content ul li a { color: var(--white); border-bottom: 1px solid var(--border-onDark); display: block; padding-bottom: 0.75rem; }
  .open-positions-section .right-content ul li a:hover { color: var(--violet-light); }

  /* Selection process */
  .selection-process-section { padding: 2.5rem 0 4rem; }
  .selection-process-section .left-content h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); }
  .selection-process-section .content { padding: 1.5rem 0; border-top: 1px solid var(--border); }
  .selection-process-section .content h4 { color: var(--violet); }
  .selection-process-section .content h6 { font-size: 1.05rem; margin-bottom: 0.5rem; }
  .selection-process-section .content p { color: var(--muted); font-size: 0.9rem; }

  /* CMS page (legal/plain text) */
  .cms-wrp { padding: 4rem 0; }
  .cms-wrp h1 { font-size: 2.2rem; margin-bottom: 2rem; }
  .cms-wrp h3, .cms-wrp h4 { margin: 1.75rem 0 0.75rem; }
  .cms-wrp p { color: var(--muted); margin-bottom: 1rem; max-width: 760px; }
  .cms-wrp ul, .cms-wrp ol { color: var(--muted); margin: 0 0 1rem 1.25rem; padding-left: 0.5rem; max-width: 760px; }
  .cms-wrp ul { list-style: disc; }
  .cms-wrp ol { list-style: decimal; }
  .cms-wrp li { margin-bottom: 0.4rem; line-height: 1.6; }
  .cms-wrp ul ul { list-style: circle; margin-top: 0.4rem; }

  /* Blog article + listing */
  .blog-details-section { padding: 4rem 0; }
  .blog-details-section .purple-text { color: var(--violet); font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
  .blog-details-section h1 { font-size: 2.1rem; margin: 1rem 0; max-width: 800px; }
  .blog-details-section .content-area h2 { font-size: 1.5rem; }
  .blog-details-section .content-area h3 { font-size: 1.2rem; }
  .blog-details-section .name-date p { color: var(--muted); font-size: 0.85rem; }
  .blog-details-section .content-area { margin-top: 2rem; align-items: start; }
  .blog-details-section .content-area > div:not(.toc-sidebar) { max-width: 760px; }
  .toc-sidebar { position: sticky; top: 6rem; }
  .toc-sidebar h6 { color: var(--violet); font-size: 0.78rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.9rem; }
  .toc-sidebar ol { list-style: decimal; margin-left: 1.1rem; }
  .toc-sidebar li { margin-bottom: 0.6rem; }
  .toc-sidebar a { color: var(--muted); font-size: 0.85rem; line-height: 1.4; }
  .toc-sidebar a:hover { color: var(--violet); }
  @media (max-width: 900px) { .toc-sidebar { position: static; margin-bottom: 2rem; } }
  .blog-details-section .content-area h2, .blog-details-section .content-area h3 { margin: 2rem 0 1rem; }
  .blog-details-section .content-area p { color: var(--muted); margin-bottom: 1.25rem; line-height: 1.7; }
  .blog-details-section .content-area ul, .blog-details-section .content-area ol { color: var(--muted); margin: 0 0 1.25rem 1.25rem; }
  .blog-listing-section { padding: 4rem 0; }
  .blog-wrap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
  .blog-wrap .field { background: var(--white); border: 1px solid var(--border); border-radius: 16px; padding: 1.75rem; height: 100%; transition: border-color 0.25s, transform 0.25s; }
  .blog-wrap .field:hover { border-color: var(--violet); transform: translateY(-4px); }
  .blog-wrap h6 { font-size: 1.1rem; margin: 0.5rem 0 0.75rem; }
  .blog-wrap p { color: var(--muted); font-size: 0.88rem; margin-bottom: 0.75rem; }
  .blog-wrap .post-date { color: var(--muted); font-size: 0.78rem; }
  @media (max-width: 900px) { .blog-wrap { grid-template-columns: 1fr; } }

  /* Key features (why-odoo) */
  .full-width-text-section { padding: 4rem 0 0; background: var(--white); }
  .full-width-text-section h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 0.75rem; }
  .full-width-text-section h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); }
  .key-features-section { padding: 2.5rem 0 4rem; background: var(--white); }
  .key-features-section .row { display: grid; grid-template-columns: 100px 1fr; gap: 1.5rem; padding: 2.5rem 0; border-top: 1px solid var(--border); align-items: start; }
  .key-features-section .sr-number h2 { color: var(--violet); font-size: 2rem; }
  .one-platform-content .title h5 { font-size: 1.3rem; margin-bottom: 0.75rem; }
  .one-platform-content .title p { color: var(--muted); margin-bottom: 1rem; }
  .one-platform-content .advantages p { font-size: 0.9rem; color: var(--muted); }
  .one-platform-content .advantages strong { color: var(--ink); }
  .key-features-section .logo-wrp { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; margin-top: 1.5rem; }
  .key-features-section .logo-wrp .item { background: var(--offwhite); border-radius: 12px; padding: 1rem; text-align: center; }
  .key-features-section .logo-wrp .item img { height: 28px; width: auto; margin: 0 auto 0.5rem; }
  .key-features-section .logo-wrp .item p { font-size: 0.72rem; color: var(--muted); }
  .customization-step-image img { border-radius: 16px; width: 100%; margin-top: 1.5rem; }
  .affordable-video { margin-top: 1.5rem; border-radius: 16px; overflow: hidden; }
  .affordable-video iframe { width: 100%; aspect-ratio: 16/9; height: auto; }
  .key-features-section .row { margin: 0; }
  .key-features-section .row > [class*="col-"] { max-width: 100%; min-width: 0; }
  @media (max-width: 900px) { .key-features-section .row { grid-template-columns: 1fr; } .key-features-section .logo-wrp { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; } .key-features-section .logo-wrp .item { padding: 0.75rem 0.4rem; } .key-features-section .logo-wrp .item p { overflow-wrap: anywhere; } }

  /* Feedback (client testimonial on business case pages) */
  .feedback-section { padding: 4rem 0; background: var(--offwhite); }
  .feedback-content { max-width: 720px; margin: 0 auto; text-align: center; }
  .feedback-content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 1rem; }
  .feedback-content h4 { font-size: 1.4rem; font-weight: 300; line-height: 1.5; margin-bottom: 1.75rem; }
  .feedback-content .client-details { display: flex; align-items: center; justify-content: center; gap: 1rem; }
  .feedback-content .client-details img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
  .feedback-content .details { text-align: left; }
  .feedback-content .details h5 { font-size: 1rem; margin-bottom: 0.1rem; }
  .feedback-content .details p { color: var(--muted); font-size: 0.85rem; }

  /* Case overview (metrics band on business case pages) */
  .overview-section { padding: 3rem 0; border-bottom: 1px solid var(--border); }
  .overview-section .items-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1.5rem; }
  .overview-section .item { text-align: center; flex: 1 1 auto; }
  .overview-section .item h6 { color: var(--muted); font-size: 0.8rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.5rem; }
  .overview-section .item h5 { font-family: var(--font-display); font-size: 1.5rem; }
  .overview-section .item .counter { color: var(--violet); font-weight: 600; }
  @media (max-width: 900px) { .overview-section .items-wrap { justify-content: flex-start; } .overview-section .item { flex: 0 0 45%; } }

  /* Case insights (business case detail pages) */
  .custom-development-section { padding: 4rem 0; }
  .custom-development-section .content { display: grid; grid-template-columns: 1fr 2fr; gap: 2.5rem; padding: 2.5rem 0; border-top: 1px solid var(--border); align-items: start; }
  .custom-development-section .left-content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; }
  .custom-development-section .right-content .text { color: var(--muted); }
  .custom-development-section .right-content .text p { margin-bottom: 1rem; }
  .custom-development-section .right-content .text img { max-width: 100%; height: auto; border-radius: 12px; margin: 1rem 0; }
  .custom-development-section .img { display: flex; gap: 1rem; margin-top: 1.5rem; }
  .custom-development-section .img img { max-width: 320px; width: 100%; height: auto; border-radius: 12px; object-fit: cover; }
  @media (max-width: 900px) {
    .custom-development-section .content { grid-template-columns: 1fr; }
    .custom-development-section .img { flex-direction: column; }
    .custom-development-section .img img { max-width: 100%; }
  }

  /* Needs / case intro */
  .needs-section { padding: 4rem 0; background: var(--offwhite); }
  .needs-section .left-content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 1.25rem; }
  .needs-section .left-content ul li { color: var(--muted); font-size: 0.92rem; margin-bottom: 0.6rem; padding-left: 1rem; position: relative; }
  .needs-section .left-content ul li::before { content: '—'; position: absolute; left: 0; color: var(--violet); }
  .needs-section .right-content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 1rem; }
  .needs-section .right-content p { color: var(--muted); font-size: 0.92rem; margin-bottom: 1rem; }
  .needs-section .right-content p strong { color: var(--ink); }
  .needs-section .solution { margin-top: 1.75rem; }

  /* Applications used */
  .applications-section { padding: 5rem 0; background: var(--offwhite); }
  .applications-section .left-content h3 { font-size: 1.4rem; margin-bottom: 1.25rem; }
  .logo-wrp { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
  .logo-wrp .item { background: var(--white); border: 1px solid var(--border); border-radius: 14px; padding: 1.5rem 1rem; text-align: center; }
  .logo-wrp .item img { height: 36px; width: auto; margin: 0 auto 0.75rem; }
  .logo-wrp .item p { font-size: 0.82rem; color: var(--muted); }
  @media (max-width: 900px) { .logo-wrp { grid-template-columns: repeat(2, 1fr); } }

  /* Odoo intro (company-intro block) */
  .odoo-intro-section { padding: 4rem 0; background: var(--white); }
  .odoo-intro-section .row { align-items: center; }
  .odoo-intro-section .left-img { position: relative; }
  .odoo-intro-section .left-img img { border-radius: 16px; width: 100%; height: 380px; object-fit: cover; }
  .odoo-intro-section .left-img.black-overlay::after { content:''; position:absolute; inset:0; background: rgba(20,20,20,0.15); border-radius: 16px; }
  .odoo-intro-content { display: flex; flex-direction: column; justify-content: center; padding-left: 3.5rem; }
  .odoo-intro-content h3 { font-size: 2.1rem; line-height: 1.25; margin: 0 0 2rem; max-width: 520px; }
  @media (max-width: 900px) { .odoo-intro-content { padding-left: 0.75rem; margin-top: 1.75rem; } .odoo-intro-content h3 { font-size: 1.7rem; } }
  .odoo-intro-content .primary-btn { align-self: flex-start; }

  /* Methodology */
  .methodology-section { padding: 4rem 0; background: var(--offwhite); }
  .methodology-section .title h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); }
  .methodology-section .para-text h6 { font-weight: 400; color: var(--muted); font-size: 1.05rem; margin-bottom: 2rem; max-width: 520px; }
  .methodology-content { margin-top: 1.5rem; display: flex; }
  .methodology-content .item { width: 100%; background: var(--white); border: 1px solid var(--border); border-radius: 16px; padding: 1.5rem; }
  .methodology-content .item h4 { color: var(--violet); font-size: 0.85rem; margin-bottom: 0.5rem; }
  .methodology-content .item h5 { font-size: 1.15rem; margin-bottom: 0.6rem; }
  .methodology-content .item p { font-size: 0.9rem; color: var(--muted); margin-bottom: 0.75rem; }
  .methodology-content .item ul { margin: 0; padding: 0; }
  .methodology-content .item li { position: relative; padding-left: 1.1rem; font-size: 0.88rem; color: var(--ink); margin-bottom: 0.4rem; }
  .methodology-content .item li::before { content: ''; position: absolute; left: 0; top: 0.55em; width: 6px; height: 6px; border-radius: 50%; background: var(--violet); }
  @media (max-width: 900px) { .methodology-section > .container > .row { grid-template-columns: 1fr; } }

  /* Help block */
  .help-section { padding: 4rem 0; background: var(--offwhite); }
  .help-section h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; text-align: center; margin-bottom: 0.75rem; }
  .help-section h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); text-align: center; margin-bottom: 3rem; }
  .help-fields { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-bottom: 2.5rem; }
  .service-card { display: block; background: var(--white); border: 1px solid var(--border); border-radius: 16px; padding: 1.75rem; height: 100%; transition: border-color 0.25s, transform 0.25s; }
  .service-card:hover { border-color: var(--violet); transform: translateY(-4px); }
  .service-card h5 { font-size: 1.05rem; margin-bottom: 0.75rem; }
  .service-card p { font-size: 0.87rem; color: var(--muted); margin-bottom: 1.25rem; }
  .service-card .page-link { color: var(--violet); font-weight: 600; font-size: 0.88rem; }
  .help-fields .primary-btn { grid-column: 1 / -1; text-align: center; }
  .help-section.dark-cards { background: var(--black); color: var(--white); }
  .help-section.dark-cards h6 { color: var(--violet-light); }
  .help-section.dark-cards h3 { color: var(--white); }
  .help-section.dark-cards .service-card { background: var(--card-dark); border-color: var(--border-onDark); }
  .help-section.dark-cards .service-card:hover { border-color: var(--violet); }
  .help-section.dark-cards .service-card h5 { color: var(--white); }
  .help-section.dark-cards .service-card p { color: var(--muted-onDark); }
  .help-section.dark-cards .service-card .page-link { color: var(--violet-light); }

  /* Credited assistance */
  .credite-section { padding: 4rem 0; background: var(--white); }
  .credite-section .row { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
  .credite-content h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 0.75rem; }
  .credite-content h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); margin-bottom: 1.75rem; }
  .range-area { display: flex; flex-direction: column; gap: 1.5rem; }
  .range-area .item { display: flex; align-items: center; gap: 1.25rem; padding: 1.25rem; background: var(--offwhite); border-radius: 14px; }
  .range-area .img img { height: 36px; width: auto; }
  .range-area .text p { font-weight: 500; }

  /* Featured business cases */
  .we-implemented-section { padding: 4rem 0; background: rgba(152,72,149,0.2); }
  .we-implemented-section .title { text-align: center; max-width: 620px; margin: 0 auto 3rem; }
  .we-implemented-section .title h6 { color: var(--violet); font-size: 1.05rem; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 0.5rem; }
  .we-implemented-section .title h3 { font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem); }
  .we-implemented-section .items-wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-bottom: 2.5rem; }
  .we-implemented-section .item .field { background: var(--white); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; transition: border-color 0.25s, transform 0.25s; height: 100%; }
  .we-implemented-section .item .field:hover { border-color: var(--violet); transform: translateY(-4px); }
  .we-implemented-section .item a { display: block; height: 100%; }
  .we-implemented-section .img { height: 200px; overflow: hidden; }
  .we-implemented-section .img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform 0.5s ease-in-out; }
  .we-implemented-section .item:hover .img img { transform: scale(1.1); }
  .we-implemented-section .item .field:hover { box-shadow: 0 0 20px rgba(0,0,0,0.15); }
  .we-implemented-section .content { padding: 1.75rem 1.75rem 2rem; }
  .case_types { margin-bottom: 0.6rem; }
  .case_types .green-text { color: var(--violet); font-size: 0.78rem; font-weight: 600; text-transform: uppercase; }
  .we-implemented-section h6 { font-size: 1.1rem; margin-bottom: 0.75rem; }
  .we-implemented-section ul li { font-size: 0.82rem; color: var(--muted); margin-bottom: 0.3rem; padding-left: 0.9rem; position: relative; }
  .we-implemented-section ul li::before { content: '—'; position: absolute; left: 0; color: var(--violet); }
  .we-implemented-section .primary-btn { text-align: center; }

  /* Footer */
  footer { background: var(--black); color: var(--white); padding: 4.5rem 0 1.75rem; }
  footer .row.main-row { display: grid; grid-template-columns: 0.9fr 0.9fr 2.2fr; gap: 3rem; margin-bottom: 3.5rem; }
  .ft-nav-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem; }
  .ft-nav-cols h6 a { color: inherit; }
  @media (max-width: 1100px) { footer .row.main-row { grid-template-columns: 1fr 1fr; } .ft-links { grid-column: 1 / -1; } }
  @media (max-width: 600px) { footer .row.main-row { grid-template-columns: 1fr; } .ft-nav-cols { grid-template-columns: 1fr 1fr; } }
  .ft-logo img { height: 26px; margin-bottom: 1.5rem; }
  footer .content h6 { font-family: var(--font-body); font-size: 0.95rem; margin-bottom: 1rem; font-weight: 500; }
  .top-text h5 { font-size: 1.05rem; margin-bottom: 1.5rem; font-weight: 500; }
  .content .address h6 { font-family: var(--font-body); font-size: 0.9rem; margin-bottom: 0.4rem; font-weight: 500; }
  .address p { color: var(--muted-onDark); font-size: 0.88rem; margin: 0; }
  .address p + p { margin-top: 0.15rem; }
  .other-offices-link { display: inline-block; margin-top: 0.75rem; color: var(--violet-light); font-size: 0.85rem; font-weight: 500; }
  .other-offices-link:hover { text-decoration: underline; }
  .tnp-subscription form { display: flex; border-bottom: 1px solid var(--border-onDark); max-width: 280px; }
  .tnp-email { background: none; border: none; color: var(--white); font-family: var(--font-body); padding: 0.6rem 0; flex: 1; font-size: 0.9rem; }
  .tnp-email::placeholder { color: var(--muted-onDark); }
  .tnp-submit { background: none; border: none; color: var(--violet-light); font-size: 1.1rem; cursor: pointer; padding: 0.6rem 0.5rem; }
  .address-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
  .shiftingpact-logo img { height: 32px; width: auto; opacity: 0.85; filter: grayscale(1) brightness(1.6); transition: 0.2s; }
  .shiftingpact-logo:hover img { opacity: 1; filter: none; }
  .social-icons { display: flex; gap: 1.1rem; }
  .copy-left { display: flex; flex-direction: column; gap: 0.9rem; }
  .copy-left p { margin: 0; }
  .social-icons img { width: 34px; height: 34px; opacity: 0.85; transition: 0.2s; }
  .social-icons a:hover img { opacity: 1; }
  .ft-links .content ul li { margin-bottom: 0.55rem; }
  .ft-links .content ul a { color: var(--muted-onDark); font-size: 0.88rem; transition: color 0.2s; }
  .ft-links .content ul a:hover { color: var(--white); }
  .copy-right { display: flex; justify-content: space-between; align-items: center; padding-top: 1.75rem; border-top: 1px solid var(--border-onDark); font-size: 0.82rem; color: var(--muted-onDark); flex-wrap: wrap; gap: 0.75rem; }
  .privacy-links a { color: var(--muted-onDark); }
  .privacy-links a:hover { color: var(--white); }

  @media (max-width: 900px) {
    /* Drawer scrolls (100dvh) so long menus are never cut off; language switch sits on top. */
    .main_menu { position: fixed; inset: 0 0 0 auto; width: 84%; max-width: 360px; height: 100dvh; overflow-y: auto; overscroll-behavior: contain; background: var(--dark); flex-direction: column; align-items: stretch; gap: 1.25rem; padding: 4.75rem 1.5rem 2rem; transform: translateX(100%); transition: transform 0.3s ease; }
    .main_menu.open { transform: translateX(0); }
    .main_menu > ul { flex-direction: column; gap: 0; width: 100%; }
    .main_menu > ul > li > a { display: block; padding: 0.85rem 0; font-size: 14px; }
    .main_menu > ul > li:hover > a { letter-spacing: 0.6px; }
    .main_menu .lang-flag { order: -1; display: flex; width: 100%; padding: 4px; font-size: 15px; }
    .main_menu .lang-flag .lang-opt { flex: 1; text-align: center; padding: 0.7rem 0; min-height: 44px; display: flex; align-items: center; justify-content: center; }
    /* Hover doesn't exist on touch: sub-menus are accordions opened by the chevron. */
    .has-submenu { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; width: 100%; }
    .has-submenu > a { flex: 1; }
    .submenu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: none; border: 0; color: #fff; cursor: pointer; }
    .submenu-toggle::before { content: ''; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform 0.2s; }
    .has-submenu.open .submenu-toggle::before { transform: rotate(-135deg); }
    .has-submenu .submenu { display: none; flex-basis: 100%; position: static; background: none; border: none; padding: 0 0 0.5rem 0.75rem; margin-top: 0; min-width: 0; }
    .has-submenu.open .submenu { display: flex; }
    .has-submenu .submenu a { padding: 0.7rem 0.5rem; font-size: 0.95rem; }
    .has-submenu .submenu-inner { background: none; border: none; padding: 0; }
    .lines-button { display: flex; }
    .discuss-btn { margin-top: 0.5rem; }
    .discuss-btn a { display: block; text-align: center; }
    .why-section .row, .talk-section .row, .credite-section .row { grid-template-columns: 1fr; }
    .odoo-expertise-content, .our-services-content, .help-fields, .we-implemented-section .items-wrap { grid-template-columns: 1fr 1fr; }
    footer .row.main-row { grid-template-columns: 1fr; gap: 2.5rem; }
    .copy-right { flex-direction: column; align-items: flex-start; }
  }
  @media (max-width: 560px) {
    .odoo-expertise-content, .our-services-content, .help-fields, .we-implemented-section .items-wrap { grid-template-columns: 1fr; }
  }

/* Cookie consent banner */
.cookie-banner[hidden] { display: none; }
.cookie-banner { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 1000; max-width: 880px; margin: 0 auto; display: flex; gap: 1.25rem; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 1rem 1.25rem; background: #16151a; color: #fff; border: 1px solid rgba(255,255,255,0.14); border-radius: 14px; box-shadow: 0 12px 40px rgba(0,0,0,0.3); font-size: 0.88rem; line-height: 1.5; }
.cookie-banner p { margin: 0; flex: 1 1 320px; color: rgba(255,255,255,0.85); }
.cookie-banner a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.cookie-actions { display: flex; gap: 0.6rem; }
.cookie-actions button { cursor: pointer; border-radius: 100px; padding: 0.6rem 1.3rem; font-size: 0.88rem; font-weight: 500; border: 1px solid rgba(255,255,255,0.35); background: transparent; color: #fff; transition: background 0.2s; }
.cookie-actions button.cookie-accept { background: var(--violet, #984895); border-color: var(--violet, #984895); }
.cookie-actions button:hover { background: rgba(255,255,255,0.12); }
.cookie-actions button.cookie-accept:hover { background: #7f3b7c; }