/* =============================================================================
   Profezzo brand layer (profezzo-brand.css), loads last.
   Colours from the logo itself: deep green-black #001f1f and red #ce1117 on white,
   the letterhead's soft grey ground. Replaces the brown/cream "theme" palette.
   Texture: a fine grid ("checks") and a faint honeycomb, never louder than the copy.
   ============================================================================= */
:root{
  --brand-ink:#001f1f; --brand-red:#ce1117;
  --accent:#ce1117; --accent-ink:#ffffff; --accent-text:#b30e13;
  --bg:#f7f8f8; --bg2:#eef2f1; --card:#ffffff; --card2:#f4f7f6;
  --line:rgba(0,31,31,.11); --line-strong:rgba(0,31,31,.2);
  --text:#001f1f; --muted:#3f5454; --faint:#566a6a;
  --shadow:rgba(0,31,31,.13);
  --ink:#001f1f; --ink-2:#062b2a; --ink-line:rgba(230,245,243,.12); --ink-line-2:rgba(230,245,243,.24);
  --ink-text:#f1f6f5; --ink-muted:#b3c6c4; --ink-faint:#93abaa; --ember:#ff5a5f;
  --tex-grid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M32 0H0V32' fill='none' stroke='%23001f1f' stroke-opacity='.08' stroke-width='1'/%3E%3C/svg%3E");
  --tex-hex:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 1 L55 16.5 L55 47.5 L28 63 L1 47.5 L1 16.5 Z M28 63 L28 96 M1 96.5 L1 80 M55 96.5 L55 80' fill='none' stroke='%23001f1f' stroke-opacity='.08' stroke-width='1'/%3E%3C/svg%3E");
  --tex-hex-light:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 1 L55 16.5 L55 47.5 L28 63 L1 47.5 L1 16.5 Z M28 63 L28 96 M1 96.5 L1 80 M55 96.5 L55 80' fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='1'/%3E%3C/svg%3E");
  color-scheme:light;
}
body{ background:var(--bg); color:var(--text); }
.topbar{ background:var(--brand-ink); color:#f1f6f5; }
.topbar a{ color:#fff; }
.topbar .tb-strong{ color:#ff6b6f; }

/* Hero: grid checks fading out from the wheel, honeycomb behind the wheel */
.hero{ background:var(--bg); }
.hero::before{
  top:0; right:0; left:0; bottom:0; width:auto; height:auto; border-radius:0;
  background:var(--tex-grid); opacity:.9;
  -webkit-mask:radial-gradient(ellipse 75% 85% at 72% 45%, #000 30%, transparent 75%);
          mask:radial-gradient(ellipse 75% 85% at 72% 45%, #000 30%, transparent 75%);
}
.hero-visual::before{
  content:""; position:absolute; inset:-14%; background:var(--tex-hex); opacity:.9; pointer-events:none;
  -webkit-mask:radial-gradient(circle, #000 35%, transparent 70%); mask:radial-gradient(circle, #000 35%, transparent 70%);
}

/* The wheel in brand colours, the real two-colour mark at its centre */
.ring-1{ border-color:var(--line-strong); }
.orbit-sweep{ background:conic-gradient(from 20deg, transparent 0deg, color-mix(in srgb, var(--brand-red) 13%, transparent) 70deg, transparent 100deg); }
.node-ic{ --icon-stroke:var(--brand-ink); }
.node-ai .node-ic{ background:var(--brand-ink); border-color:var(--brand-ink); --icon-stroke:#fff; box-shadow:0 8px 24px var(--shadow); }
.orbit-core{ background:#fff; border:1px solid var(--line-strong); box-shadow:0 0 0 10px color-mix(in srgb, var(--brand-ink) 5%, transparent), 0 24px 48px var(--shadow); }
.orbit-core .core-mark{ width:60%; height:60%; }

/* Alternating sections carry the honeycomb, very faint */

/* Numbers screen and flow in brand tones */
.numbers-screen{ background-image:var(--tex-grid); background-color:#fff; }
.ns-row i::after{ background:var(--brand-ink); }
.ns-row:last-child i::after{ background:var(--brand-red); }
.order-flow li{ border-top-color:var(--brand-ink); }
.order-flow li:last-child{ border-top-color:var(--brand-red); }
.order-flow li::before{ color:var(--brand-red); }

/* Closing on the brand ink with the honeycomb */
.closing-simple{ background-color:var(--brand-ink); background-image:var(--tex-hex-light); text-align:center; color:#f1f6f5; }
.closing-simple .closing-left{ position:relative; }
.closing-simple h2{ color:#fff; }
.closing-simple .accent{ color:#ff6b6f; }
.closing-simple .closing-foot{ color:#b3c6c4; }

.section-alt{ background-color:var(--bg2); background-image:var(--tex-hex); }
/* new home sections: headline over intro, not side by side */
#order .section-head,#numbers .section-head,#how .section-head{ display:block; max-width:720px; }
#numbers .section-head h2{ margin-bottom:16px; }
.closing-simple .hero-ctas .btn-accent{ box-shadow:none; }
.closing-simple .closing-left{ max-width:760px; margin:0 auto; }
.closing-simple .hero-ctas{ justify-content:center; }
.closing-simple .closing-foot{ margin-top:22px; }

/* UX pass: content visible on load, tighter rhythm */
.hero .reveal,.hero-visual.reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
:root{ --sec:84px; --sec-sm:56px; }
.hero{ padding:64px 0 48px; }
#how .section-head{ max-width:760px; }
#how .section-sub{ margin-top:14px; }
#customers{ padding-top:24px; }
.flagship-wall .tile-name{ margin-top:6px; }
.closing-simple .closing-left{ max-width:none; width:100%; }
.closing-simple .closing-foot{ text-align:center; max-width:none; }
#faq .section-head{ display:block; text-align:center; }
.closing-simple .container{ display:block; text-align:center; }
.marquee-item{ gap:12px; padding:0 28px; border-right:1px solid var(--line); }
.mq-name{ font-size:14px; color:var(--muted); font-weight:600; }
.client-marquee{ padding-bottom:64px; }
.client-marquee{ padding-top:8px; padding-bottom:56px; }
#customers{ padding-bottom:24px; }

/* Inner pages: same grid "checks" behind the page header */
.page-hero{ position:relative; background-color:var(--bg); }
.page-hero::after{ content:""; position:absolute; inset:0; background:var(--tex-grid); opacity:.9; pointer-events:none;
  -webkit-mask:radial-gradient(ellipse 70% 90% at 50% 40%, #000 20%, transparent 75%); mask:radial-gradient(ellipse 70% 90% at 50% 40%, #000 20%, transparent 75%); }
.page-hero > .container{ position:relative; z-index:1; }
.radar-pill span{ font-size:13px; padding:6px 14px; }
.page-hero .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }