/* AI Franchise brand layer for the low-ticket funnel. Loaded after index.css. */
@import url('/fonts/gilroy/gilroy.css');
:root{
  --app-font-display:'Gilroy',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --app-font-sans:'Gilroy',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --app-font-serif:'Gilroy',Georgia,serif;
  --af-gold:#D9B64A; --af-gold-ui:#C9A961; --af-gold-deep:#9C7E3B; --af-gold-light:#F1D98A;
  --af-ink:#0E0E10; --af-ink2:#4F4B45; --af-ink3:#8C867C; --af-canvas:#F1EEE8; --af-panel:#FBFAF7; --af-card:#F5F2EC; --af-line:#E3DDD2;
}
body{font-family:var(--app-font-sans);font-weight:400;letter-spacing:0}
[style*="app-font-display"]{font-weight:800;letter-spacing:-.02em}
[style*="app-font-display"].uppercase,[style*="app-font-display"] .uppercase{letter-spacing:-.005em}
h1,h2,h3{font-family:var(--app-font-display)}

/* Primary action stays the original purple gradient (Greg, 2026-09-15). */

/* Hero banner: layered "dark SaaS" scene. rebrand.py injects <div class="af-hero-bg"> as first child. */
.af-hero{position:relative;isolation:isolate;background:linear-gradient(180deg,#0C0B09 0%,#0A0A0C 100%)!important;box-shadow:inset 0 -1px 0 rgba(217,182,74,.28)}
.af-hero>.-z-10{background:transparent!important}
.af-hero-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.af-hero-bg i{position:absolute;display:block}
.af-hero-bg .floor{left:-20%;right:-20%;bottom:-6%;height:62%;transform-origin:50% 100%;transform:perspective(520px) rotateX(58deg);
  background-image:linear-gradient(rgba(217,182,74,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(217,182,74,.22) 1px,transparent 1px);background-size:64px 64px;
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 45%,#000 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 45%,#000 100%)}
.af-hero-bg .horizon{left:0;right:0;bottom:36%;height:2px;background:linear-gradient(90deg,transparent 5%,rgba(241,217,138,.55) 50%,transparent 95%);filter:blur(1px)}
.af-hero-bg .horizon2{left:15%;right:15%;bottom:36%;height:120px;background:radial-gradient(ellipse 60% 100% at 50% 100%,rgba(217,182,74,.28),transparent 70%)}
.af-hero-bg .dots{inset:0;background-image:radial-gradient(rgba(241,217,138,.32) 1.2px,transparent 1.6px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse 65% 55% at 50% 0%,#000 0%,transparent 100%);mask-image:radial-gradient(ellipse 65% 55% at 50% 0%,#000 0%,transparent 100%)}
.af-hero-bg .glow{left:50%;top:-38%;width:min(1200px,140%);aspect-ratio:1.6;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(closest-side,rgba(241,217,138,.26),rgba(217,182,74,.10) 45%,transparent 72%);filter:blur(18px)}
.af-hero-bg .orb1,.af-hero-bg .orb2,.af-hero-bg .orb3{border-radius:50%;filter:blur(64px);opacity:.6;will-change:transform}
.af-hero-bg .orb1{width:46%;aspect-ratio:1;left:-12%;top:18%;background:radial-gradient(circle,rgba(217,182,74,.46),transparent 65%);animation:afDrift 22s ease-in-out infinite alternate}
.af-hero-bg .orb2{width:40%;aspect-ratio:1;right:-10%;top:4%;background:radial-gradient(circle,rgba(180,140,60,.50),transparent 65%);animation:afDrift 27s ease-in-out infinite alternate-reverse}
.af-hero-bg .orb3{width:34%;aspect-ratio:1;left:30%;bottom:-14%;background:radial-gradient(circle,rgba(241,217,138,.20),transparent 65%);animation:afDrift 31s ease-in-out infinite alternate}
.af-hero-bg .beam{left:50%;top:-10%;width:2px;height:70%;transform:translateX(-50%) rotate(24deg);transform-origin:top;
  background:linear-gradient(180deg,rgba(241,217,138,.55),transparent);filter:blur(1px);opacity:.7}
.af-hero-bg .beam2{left:50%;top:-10%;width:2px;height:60%;transform:translateX(-50%) rotate(-19deg);transform-origin:top;
  background:linear-gradient(180deg,rgba(241,217,138,.35),transparent);filter:blur(1px);opacity:.6}
.af-hero-bg .ring{left:50%;top:-52%;width:min(980px,120%);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;
  border:1px solid rgba(241,217,138,.26);box-shadow:0 0 0 90px rgba(241,217,138,.035),0 0 0 180px rgba(241,217,138,.025),0 0 60px rgba(241,217,138,.12)}
.af-hero-bg .noise{inset:0;opacity:.07;mix-blend-mode:overlay;
  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='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.af-hero-bg .hair{left:50%;top:0;width:min(760px,84%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(241,217,138,.95),transparent)}
.af-hero-bg .shade{inset:0;background:radial-gradient(ellipse 58% 62% at 50% 42%,rgba(10,10,12,.82) 0%,rgba(10,10,12,.55) 45%,transparent 78%)}
.af-hero-bg .vig{inset:0;background:radial-gradient(ellipse 80% 75% at 50% 40%,transparent 55%,rgba(10,10,12,.85) 100%)}
@keyframes afDrift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(9%,7%,0) scale(1.12)}}
@media (prefers-reduced-motion:reduce){.af-hero-bg .orb1,.af-hero-bg .orb2,.af-hero-bg .orb3{animation:none}}
.af-hero-layer{background:linear-gradient(180deg,#0C0B09 0%,#0A0A0C 60%)!important}

/* Light sections: warm greige canvas, ink type, floating panels */
.af-light{background:var(--af-canvas)!important;color:var(--af-ink);border-color:var(--af-line)!important}
.af-light .text-white,.af-light .text-white\/95,.af-light .text-white\/90,.af-light .text-white\/85,.af-light .text-white\/80,.af-light .text-\[\#F0EDE5\]{color:var(--af-ink)!important}
.af-light .text-white\/75,.af-light .text-white\/70,.af-light .text-white\/65,.af-light .text-white\/60,.af-light .text-\[\#F0EDE5\]\/80,.af-light .text-\[\#F0EDE5\]\/75,.af-light .text-\[\#F0EDE5\]\/70{color:var(--af-ink2)!important}
.af-light .text-white\/55,.af-light .text-white\/50,.af-light .text-white\/45,.af-light .text-white\/40,.af-light .text-white\/35,.af-light .text-white\/30,.af-light .text-\[\#F0EDE5\]\/55,.af-light .text-\[\#F0EDE5\]\/50,.af-light .text-\[\#F0EDE5\]\/45,.af-light .text-\[\#F0EDE5\]\/40,.af-light .text-\[\#F0EDE5\]\/35,.af-light .text-gray-400{color:var(--af-ink3)!important}
.af-light .text-\[\#C9A44C\],.af-light .text-\[\#D4A843\],.af-light .text-\[\#E8CC78\],.af-light .text-\[\#F4E0A0\],.af-light .text-\[\#BFA37A\],.af-light .text-\[\#C9A44C\]\/80,.af-light .text-\[\#C9A44C\]\/70{color:var(--af-gold-deep)!important}
.af-light .bg-\[\#0A0A0A\],.af-light .bg-\[\#0a0a0a\],.af-light .bg-\[\#0F0F0F\],.af-light .bg-\[\#101010\],.af-light .bg-\[\#0f0f0f\],.af-light .bg-\[\#1F1F1F\],.af-light .bg-\[\#161616\],.af-light .bg-\[\#141414\],.af-light .bg-\[\#181818\],.af-light .bg-\[\#1A1A1A\],.af-light .bg-\[\#121212\],.af-light .bg-\[\#111\],.af-light .bg-\[\#111111\],.af-light .bg-black,.af-light .bg-black\/50,.af-light .bg-black\/40,.af-light .bg-black\/30,.af-light .bg-black\/60,.af-light .bg-white\/5,.af-light .bg-white\/\[0\.03\],.af-light .bg-white\/\[0\.04\],.af-light .bg-white\/\[0\.02\],.af-light .bg-white\/\[0\.06\]{background-color:var(--af-panel)!important}
.af-light .bg-gradient-to-b,.af-light .bg-gradient-to-br,.af-light .bg-gradient-to-r,.af-light .bg-gradient-to-t{background-image:none!important;background-color:var(--af-panel)}
.af-light .bg-\[\#C9A44C\]\/10,.af-light .bg-\[\#C9A44C\]\/15,.af-light .bg-\[\#C9A44C\]\/\[0\.06\],.af-light .bg-\[\#C9A44C\]\/\[0\.08\],.af-light .bg-\[\#C9A44C\]\/5{background-color:#F3EAD3!important}
.af-light .border-white\/10,.af-light .border-white\/15,.af-light .border-white\/20,.af-light .border-white\/5,.af-light .border-white\/\[0\.04\],.af-light .border-white\/\[0\.06\],.af-light .border-white\/\[0\.08\],.af-light .border-white\/\[0\.1\],.af-light .border-white\/\[0\.12\],.af-light .ring-white\/5,.af-light .ring-white\/10{border-color:var(--af-line)!important;--tw-ring-color:var(--af-line)}
.af-light .border-\[\#C9A44C\]\/20,.af-light .border-\[\#C9A44C\]\/25,.af-light .border-\[\#C9A44C\]\/30,.af-light .border-\[\#C9A44C\]\/40{border-color:rgba(156,126,59,.45)!important}
.af-light [class*="shadow-\[0_"]{--tw-shadow:0 1px 2px rgba(14,14,16,.06),0 12px 32px rgba(14,14,16,.08)}
.af-light [style*="rgba(255, 255, 255, 0.0"],.af-light [style*="rgba(255,255,255,0.0"]{background-color:var(--af-panel)!important;border-color:var(--af-line)!important}
.af-light [style*="color: rgba(255, 255, 255"]{color:var(--af-ink2)!important}
.af-light [style*="background: rgb(10, 10, 10)"],.af-light [style*="background-color: rgb(10, 10, 10)"],.af-light [style*="background: rgb(15, 15, 15)"],.af-light [style*="background-color: rgb(15, 15, 15)"],.af-light [style*="background: rgb(16, 16, 16)"],.af-light [style*="background-color: rgb(16, 16, 16)"],.af-light [style*="background: rgb(20, 20, 20)"],.af-light [style*="background-color: rgb(20, 20, 20)"]{background-color:var(--af-panel)!important}
.af-light .text-\[\#0A0A0A\],.af-light .text-black{color:var(--af-ink)!important}
.af-light img{border-color:var(--af-line)}
button[style*="background: rgb(201, 164, 76)"]{background:#D9B64A!important;color:#0E0E10!important}
.af-light [style*="color: rgb(255, 255, 255)"]{color:var(--af-ink)!important}
.af-light [style*="background: rgb(255, 59, 59)"],.af-light [style*="background: rgba(10, 10, 10, 0.7"] .text-white,.af-light [style*="background: rgba(10, 10, 10, 0.7"] .text-white *{color:#fff!important}
.af-light img[src*="signature"]{filter:invert(1) brightness(.2)}
.af-light img[src="/funnels/room30/guarantee-180-v2.png"]{content:url("/funnels/room30/guarantee-180-v2-light.png")}
.af-light img[src="/funnels/room30/guarantee-180-banner.png"]{content:url("/funnels/room30/guarantee-180-banner-light.png")}
/* Greg review 2026-09-15: purple CTA text stays white on light sections, gold labels go solid gold-deep on light */
.af-light .cta-purple-grad,.af-light .cta-purple-grad .text-white,.af-light .cta-purple-grad .text-white\/95,.af-light .cta-purple-grad .text-white\/90,.af-light .cta-purple-grad span{color:#fff!important}
.af-light .cta-purple-grad .text-\[\#5A1370\]{color:#5A1370!important}
.af-light .gold-grad-text{background-image:none!important;-webkit-text-fill-color:var(--af-gold-deep);color:var(--af-gold-deep)!important}
.af-light .gold-grad-bg{color:#0E0E10}
.af-light .text-\[\#0E0E10\]{color:#0E0E10!important}
/* Real portal screenshots in a slim laptop frame, same in dark and light */
.af-shot{position:relative;border-radius:8px;background:linear-gradient(180deg,#2a2a2a,#0d0d0d);padding:3px;box-shadow:0 4px 14px rgba(0,0,0,.35);overflow:hidden}
.af-shot-bar{height:12px;background:#0a0a0a;display:flex;align-items:center;gap:3px;padding:0 6px;border-radius:5px 5px 0 0}
.af-shot-bar span{display:block;width:5px;height:5px;border-radius:50%}
.af-shot img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:0 0 5px 5px;background:#F1EEE8}
.af-light .af-shot{box-shadow:0 1px 2px rgba(14,14,16,.08),0 12px 32px rgba(14,14,16,.12)}
.af-mod-btn:hover h3{color:var(--af-gold-deep)}
.af-light .af-mod-btn{border-color:var(--af-line)!important}
