:root {
      --cream: #F2EDE4;
      --cream-2: #ECE5D6;
      --ink: #0E0E0C;
      --ink-soft: #1A1A18;
      --accent: #E55B2B;     /* signature burnt orange */
      --accent-2: #C8451F;
      --sand: #D4C5A9;
      --line: rgba(14,14,12,0.12);
    }
    * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
    html { scroll-behavior: smooth; }
    body {
      font-family: 'Manrope', sans-serif;
      background: var(--cream);
      color: var(--ink);
      overflow-x: hidden;
    }
    .font-display { font-family: 'Fraunces', serif; font-optical-sizing: auto; letter-spacing: -0.02em; }
    .font-body { font-family: 'Manrope', sans-serif; }
    .text-ink { color: var(--ink); }
    .text-ink-soft { color: var(--ink-soft); }
    .bg-cream { background-color: var(--cream); }
    .bg-cream-2 { background-color: var(--cream-2); }
    .bg-ink { background-color: var(--ink); }
    .bg-accent { background-color: var(--accent); }
    .text-accent { color: var(--accent); }
    .text-cream { color: var(--cream); }
    .border-ink { border-color: var(--ink); }
    .border-soft { border-color: var(--line); }

    /* Noise texture overlay */
    .noise::before {
      content: '';
      position: fixed;
      inset: 0;
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.35'/></svg>");
      opacity: 0.04;
      pointer-events: none;
      z-index: 100;
      mix-blend-mode: multiply;
    }

    /* Marquee */
    .marquee { display: flex; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
    .marquee-track { display: flex; animation: scroll 38s linear infinite; gap: 3rem; flex-shrink: 0; }
    @keyframes scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

    /* Reveal on scroll */
    .reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.9s cubic-bezier(.2,.7,.2,1), transform 0.9s cubic-bezier(.2,.7,.2,1); }
    .reveal.is-visible { opacity: 1; transform: translateY(0); }

    /* Pill button */
    .btn-pill {
      display: inline-flex; align-items: center; gap: 0.6rem;
      padding: 0.95rem 1.6rem; border-radius: 999px;
      background: var(--ink); color: var(--cream);
      font-weight: 600; font-size: 0.92rem; letter-spacing: 0.02em;
      transition: transform .3s ease, background .3s ease;
    }
    .btn-pill:hover { background: var(--accent); transform: translateY(-2px); }
    .btn-pill .arrow { transition: transform .3s ease; }
    .btn-pill:hover .arrow { transform: translate(3px,-3px); }

    .btn-outline {
      display: inline-flex; align-items: center; gap: 0.6rem;
      padding: 0.9rem 1.55rem; border-radius: 999px;
      border: 1.5px solid var(--ink); color: var(--ink); background: transparent;
      font-weight: 600; font-size: 0.92rem;
      transition: all .3s ease;
    }
    .btn-outline:hover { background: var(--ink); color: var(--cream); }

    /* Service card */
    .service-card { position: relative; overflow: hidden; border-radius: 28px; transition: transform .5s cubic-bezier(.2,.7,.2,1); }
    .service-card:hover { transform: translateY(-6px); }
    .service-card .img-wrap { overflow: hidden; }
    .service-card .img-wrap img { transition: transform 1.1s cubic-bezier(.2,.7,.2,1); }
    .service-card:hover .img-wrap img { transform: scale(1.06); }

    /* Hero blob/shape */
    .shape-blob {
      position: absolute;
      background: var(--accent);
      border-radius: 47% 53% 67% 33% / 38% 45% 55% 62%;
      filter: blur(60px);
      opacity: 0.35;
      z-index: 0;
      animation: morph 14s ease-in-out infinite alternate;
    }
    @keyframes morph {
      0%   { border-radius: 47% 53% 67% 33% / 38% 45% 55% 62%; }
      50%  { border-radius: 60% 40% 30% 70% / 55% 35% 65% 45%; }
      100% { border-radius: 35% 65% 55% 45% / 50% 60% 40% 50%; }
    }

    /* Diagonal divider */
    .arrow-link { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; }
    .arrow-link svg { transition: transform .3s ease; }
    .arrow-link:hover svg { transform: translate(4px,-4px); }

    /* Stat number */
    .stat-num { font-family: 'Fraunces', serif; font-weight: 500; line-height: 1; letter-spacing: -0.04em; }

    /* Process step */
    .step-row { border-top: 1px solid var(--line); transition: background .3s ease; }
    .step-row:hover { background: rgba(229,91,43,0.04); }

    /* Form */
    .field {
      width: 100%;
      background: transparent;
      border: none;
      border-bottom: 1.5px solid rgba(242,237,228,0.25);
      padding: 1rem 0;
      color: var(--cream);
      font-family: 'Manrope', sans-serif;
      font-size: 1.05rem;
      outline: none;
      transition: border-color .3s ease;
    }
    .field::placeholder { color: rgba(242,237,228,0.45); }
    .field:focus { border-bottom-color: var(--accent); }
    textarea.field { resize: vertical; min-height: 90px; }

    /* Hero image card subtle float */
    @keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
    .float-slow { animation: float 7s ease-in-out infinite; }

    /* Tag chip */
    .chip {
      display: inline-flex; align-items: center; gap: .5rem;
      padding: .4rem .8rem; border: 1px solid var(--line);
      border-radius: 999px; font-size: .78rem; font-weight: 500;
      background: rgba(255,255,255,0.4);
    }
    .chip .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); }

    /* Custom selection */
    ::selection { background: var(--accent); color: var(--cream); }

    /* Mobile menu */
    .mobile-menu { transform: translateY(-100%); transition: transform .5s cubic-bezier(.2,.7,.2,1); }
    .mobile-menu.open { transform: translateY(0); }

    /* Image grid for hero */
    .hero-stack { position: relative; height: 100%; min-height: 380px; }
    .hero-img { position: absolute; border-radius: 18px; overflow: hidden; box-shadow: 0 30px 60px -20px rgba(14,14,12,0.25); }
    .hero-img img { width:100%; height:100%; object-fit: cover; }
    .hero-img-1 { top: 0; right: 0; width: 64%; height: 62%; }
    .hero-img-2 { bottom: 0; left: 0; width: 58%; height: 50%; }
    .hero-img-3 { top: 36%; right: 16%; width: 40%; height: 32%; transform: rotate(-4deg); }

    @media (min-width: 640px) { .hero-stack { min-height: 460px; } .hero-img { border-radius: 22px; } }
    @media (min-width: 1024px) { .hero-stack { min-height: 540px; } }

    /* Fluid typography helpers */
    .h-hero { font-size: clamp(2.5rem, 8vw, 5.5rem); }
    .h-section { font-size: clamp(2rem, 7vw, 5rem); }
    .h-quote { font-size: clamp(1.5rem, 4.2vw, 3.25rem); }

    /* Process step responsive */
    @media (max-width: 1023px) {
      .step-row .step-meta { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
    }

    /* Smaller section spacing on mobile */
    @media (max-width: 640px) {
      .marquee-track > span { font-size: 1.85rem !important; }
    }