/* =====================================================================
   Fitzmann Advisory & Consulting — logo-matched theme
   Load AFTER the page's own <style>:
   <link rel="stylesheet" href="fitzmann-theme.css">
   Palette taken from the logo:
   Aubergine #4b0873 · Lavender #b273f2 · Cobalt #1763d6 · Navy #04286a
   ===================================================================== */

:root{
  /* surfaces: cool, faintly violet whites instead of cream */
  --paper:#f8f7fc;
  --paper-deep:#eeebf7;
  --card:#ffffff;

  /* text */
  --ink:#120a22;
  --ink-soft:#4b4562;

  /* old "teal" slots -> cobalt / navy */
  --teal:#1763d6;
  --teal-deep:#04286a;
  --teal-mist:#e2ebfb;

  /* old "clay" slots -> violet family */
  --clay:#7b2fd1;          /* buttons, icons (white text passes AA) */
  --clay-deep:#4b0873;     /* logo aubergine: dark panels, headings accents */
  --clay-mist:#ece0fb;     /* lavender tint */

  --line:rgba(18,10,34,.13);
  --lav:#b273f2;           /* logo lavender, decorative only */

  /* one signature shape from the logo: square corners, one big curve */
  --r-lg:0 44px 0 0;
  --r-xl:0 72px 0 0;
}

::selection{background:var(--lav);color:#fff}
:focus-visible{outline-color:var(--teal)}
.grain{opacity:.035}

/* ---------- Header: four-colour rule lifted from the logo ---------- */
.site-head{background:rgba(248,247,252,.94)}
.site-head::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:4px;
  background:linear-gradient(90deg,
    #4b0873 0 25%, #b273f2 25% 50%, #1763d6 50% 75%, #04286a 75% 100%);
}
.brand-name{letter-spacing:-.03em;color:var(--clay-deep)}
.main-nav a:hover,.mobile-menu a:hover{color:var(--teal)}

/* ---------- Type: editorial, quieter labels ---------- */
h1,h2,h3,.font-display{font-weight:500;letter-spacing:-.025em}
.hero h1{font-weight:500;font-size:clamp(2.6rem,5.8vw,4.3rem);line-height:1.04}
.hl{color:var(--clay);font-style:italic}

/* eyebrows: sentence case with a short logo-coloured bar, not shouty caps */
.eyebrow{
  text-transform:none;letter-spacing:.01em;font-size:15px;font-weight:600;
  color:var(--clay-deep);display:flex;align-items:center;gap:12px;
}
.eyebrow::before{content:"";width:36px;height:4px;background:linear-gradient(90deg,var(--clay-deep) 50%,var(--lav) 50%)}
.pill{border-radius:0 12px 0 0}
.pillar-tag{text-transform:none;letter-spacing:.02em;font-size:12px;border-radius:0 10px 0 0}
.foot-grid h4{text-transform:none;letter-spacing:.01em;font-size:15px}
.section-head h2{max-width:20ch}

/* ---------- Buttons ---------- */
.btn{border-radius:0 18px 0 0;padding:15px 28px}
.btn-clay{background:var(--clay-deep)}
.btn-clay:hover{background:var(--clay)}
.btn-teal{background:var(--teal)}
.btn-light{background:#fff;color:var(--teal-deep)}
.main-nav a.btn,.mobile-menu a.btn{background:var(--clay-deep);color:#fff}
.link-arrow:hover{color:var(--teal)}

/* ---------- Hero ---------- */
.hero{background:
  radial-gradient(60% 50% at 88% 8%, rgba(178,115,242,.22), transparent 70%),
  radial-gradient(50% 45% at 0% 100%, rgba(23,99,214,.10), transparent 70%),
  var(--paper)}
.glow{background:var(--lav);opacity:.45}
.art-frame{border:0;box-shadow:0 30px 60px -28px rgba(75,8,115,.45)}
/* recolour the hand-coloured illustration */
.art-frame svg rect[fill="#fbf7ee"]{fill:#fff}
.art-frame svg rect[fill="#fffdf7"]{fill:#fff}
.art-frame svg rect[stroke="#e3d9c4"]{stroke:#d9d2ee}
.art-frame svg rect[fill="#e3d9c4"]{fill:#ddd6f1}
.float-card{
  background:linear-gradient(135deg,var(--clay-deep),var(--teal-deep));
  border-radius:0 28px 0 0;box-shadow:0 24px 44px -20px rgba(4,40,106,.7);
}
.float-card p{color:#d9c8f7}
.float-chip{border-radius:0 16px 0 0}

/* ---------- Cards ---------- */
.card{background:var(--card);border-color:var(--line);transition:transform .2s ease,border-color .2s ease}
.card:hover{border-color:var(--lav)}
.card .ic-lg,.pillar .ic-lg,.client .ic-lg{color:var(--teal)}
.card h3{font-weight:600}
.pillar li .ic{color:var(--teal)}
.pillar ul,.pillar-wide-lists{border-top-color:var(--line)}

/* Pillar section sits on a tinted field so white cards read as paper */
#pillars,#process{background:var(--paper-deep)!important}

/* ---------- Vision & mission ---------- */
.vm-dark{background:linear-gradient(150deg,var(--clay-deep) 0%,#2d0a55 55%,var(--teal-deep) 120%)}
.vm-dark .ic-lg{color:var(--lav)}
.vm-dark .vm-quote{color:#e3d1fb}
.vm-light{background:#fff}
.vm-light .ic-lg{color:var(--teal)}
.vm-quote{font-weight:400}
.vm-light .vm-quote{color:var(--clay-deep)}

/* ---------- Process steps: big editorial numerals ---------- */
.step{background:#fff}
.step .n{
  width:auto;height:auto;border-radius:0;background:none;justify-content:flex-start;
  font-size:56px;font-weight:400;line-height:1;color:transparent;
  -webkit-text-stroke:1.5px var(--clay);
}
.step:nth-child(2) .n{-webkit-text-stroke-color:var(--lav)}
.step:nth-child(3) .n{-webkit-text-stroke-color:var(--teal)}
.step:nth-child(4) .n{-webkit-text-stroke-color:var(--teal-deep)}

/* ---------- Clients ---------- */
.client{background:#fff}
.client:hover{box-shadow:0 24px 44px -24px rgba(75,8,115,.4)}

/* ---------- Teal band -> navy-to-aubergine band ---------- */
.band{background:linear-gradient(120deg,var(--teal-deep) 10%,var(--clay-deep) 100%)}
.band .pill{background:rgba(255,255,255,.14);color:#e7d9fb}
.band p{color:rgba(255,255,255,.86)}

/* ---------- Form (if you re-add the contact section) ---------- */
.field input,.field select,.field textarea{border-color:#d9d2ee;background:#fff;border-radius:0 12px 0 0}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--teal);border-color:transparent}
.form-done .big-check{background:var(--teal-mist);color:var(--teal-deep)}
.rfp-note{background:var(--clay-mist);color:var(--clay-deep);border-radius:0 12px 0 0}
.meta-row .ic{color:var(--teal)}

/* ---------- Footer ---------- */
footer.site-foot{background:var(--teal-deep);color:#fff;border-top:0;position:relative}
footer.site-foot::before{
  content:"";position:absolute;left:0;right:0;top:0;height:6px;
  background:linear-gradient(90deg,#4b0873 0 25%,#b273f2 25% 50%,#1763d6 50% 75%,#8fb4f0 75% 100%);
}
.foot-brand{color:#fff}
.foot-grid p,.foot-bottom{color:rgba(255,255,255,.75)}
.foot-grid h4{color:var(--lav)!important}
.foot-grid ul a:hover{color:var(--lav)}
.foot-grid a[href="index.html"]{color:#fff!important}
.foot-bottom{border-top-color:rgba(255,255,255,.2)}

/* ---------- Mobile ---------- */
@media(max-width:960px){
  :root{--r-lg:0 32px 0 0;--r-xl:0 48px 0 0}
}
