@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Inter:wght@300;400;500;600&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#0A0008;
  --ink2:#1A0A22;
  --paper:#FAFAF8;
  --cream:#F3EEFF;
  --p:#7B00CC;
  --pd:#3D0066;
  --pm:#9B00CC;
  --pl:#E8D5FF;
  --mag:#CC00AA;
  --muted:#7A6888;
  --border:rgba(123,0,204,0.12);
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter',sans-serif;
}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);overflow-x:hidden;cursor:none}

/* CURSOR */
.cursor{position:fixed;width:8px;height:8px;background:var(--p);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width 0.3s,height 0.3s,background 0.3s}
.cursor-ring{position:fixed;width:36px;height:36px;border:1px solid var(--p);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:all 0.08s;opacity:0.5}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:1.5rem 5rem;transition:all 0.4s}
nav.scrolled{background:rgba(10,0,8,0.96);backdrop-filter:blur(20px);padding:1rem 5rem;border-bottom:1px solid rgba(123,0,204,0.2)}
.nav-logo{display:flex;align-items:center;gap:0.6rem;text-decoration:none}
.nav-logo img{height:34px;filter:brightness(0) invert(1)}
.nav-logo-text{font-family:var(--serif);font-size:1.3rem;font-weight:400;color:white;letter-spacing:0.02em}
.nav-links{display:flex;gap:2.5rem;list-style:none}
.nav-links a{font-size:0.72rem;font-weight:400;color:rgba(255,255,255,0.55);text-decoration:none;letter-spacing:0.1em;text-transform:uppercase;transition:color 0.2s}
.nav-links a:hover{color:white}
.nav-cta{font-size:0.72rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;padding:0.65rem 1.5rem;border:1px solid rgba(255,255,255,0.25);color:white;text-decoration:none;transition:all 0.3s}
.nav-cta:hover{background:white;color:var(--ink)}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:none;background:none;border:none;padding:4px}
.hamburger span{display:block;width:22px;height:1px;background:white;transition:all 0.3s}

/* MOBILE MENU */
.mobile-menu{display:none;position:fixed;inset:0;background:var(--ink);z-index:200;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem}
.mobile-menu.open{display:flex}
.mobile-menu a{font-family:var(--serif);font-size:2.5rem;font-weight:300;color:white;text-decoration:none;transition:color 0.2s}
.mobile-menu a:hover{color:var(--pl)}
.mobile-close{position:absolute;top:1.5rem;right:2rem;background:none;border:none;color:white;font-size:2rem;cursor:none}

/* HERO */
.hero{min-height:100vh;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:8rem 2rem 4rem}
.hero-marquee-text{font-family:var(--serif);font-size:clamp(5rem,16vw,18rem);font-weight:300;color:rgba(123,0,204,0.08);white-space:nowrap;line-height:1;position:absolute;top:50%;transform:translateY(-50%);letter-spacing:-0.02em;pointer-events:none;animation:slideLeft 20s linear infinite}
@keyframes slideLeft{from{transform:translateY(-50%) translateX(0)}to{transform:translateY(-50%) translateX(-30%)}}
.hero-logo-center{width:clamp(140px,18vw,260px);filter:drop-shadow(0 0 100px rgba(155,0,204,0.7));animation:floatC 7s ease-in-out infinite;position:relative;z-index:2;margin-bottom:3rem}
@keyframes floatC{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-20px) rotate(1deg)}}
.hero-content{text-align:center;position:relative;z-index:2;max-width:800px}
.hero-eyebrow{font-size:0.68rem;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:rgba(232,213,255,0.6);margin-bottom:1.5rem;display:flex;align-items:center;justify-content:center;gap:1rem}
.hero-eyebrow::before,.hero-eyebrow::after{content:'';display:block;width:32px;height:1px;background:var(--p)}
.hero h1{font-family:var(--serif);font-size:clamp(2.5rem,5vw,4.5rem);font-weight:300;line-height:1.1;color:white;margin-bottom:1.5rem;letter-spacing:-0.02em}
.hero h1 em{font-style:italic;color:var(--pl)}
.hero-sub{font-size:0.9rem;color:rgba(255,255,255,0.45);line-height:1.85;max-width:520px;margin:0 auto 2.5rem;font-weight:300}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.btn-white{display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2.2rem;background:white;color:var(--ink);font-size:0.75rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;transition:all 0.3s;cursor:none}
.btn-white:hover{background:var(--pl);color:var(--pd)}
.btn-ghost-white{display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2.2rem;background:transparent;color:rgba(255,255,255,0.5);font-size:0.75rem;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;border:1px solid rgba(255,255,255,0.15);transition:all 0.3s;cursor:none}
.btn-ghost-white:hover{border-color:rgba(255,255,255,0.4);color:white}
.hero-scroll{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);font-size:0.65rem;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.2);display:flex;flex-direction:column;align-items:center;gap:0.75rem}
.hero-scroll::after{content:'';display:block;width:1px;height:40px;background:rgba(255,255,255,0.15);animation:scrollPulse 2s ease-in-out infinite}
@keyframes scrollPulse{0%,100%{opacity:0.3;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.3)}}

/* MARQUEE BAR */
.marquee-bar{background:var(--p);padding:0.9rem 0;overflow:hidden;white-space:nowrap}
.marquee-inner{display:inline-block;animation:marquee 30s linear infinite}
.marquee-inner span{font-size:0.65rem;font-weight:500;letter-spacing:0.2em;text-transform:uppercase;color:rgba(232,213,255,0.75);margin:0 2rem}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* NUMBERS */
.numbers{background:var(--ink2);padding:6rem 5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;border-bottom:1px solid rgba(255,255,255,0.05)}
.num-item{text-align:center;padding:2rem}
.num-val{font-family:var(--serif);font-size:4rem;font-weight:300;color:white;line-height:1;margin-bottom:0.5rem}
.num-label{font-size:0.65rem;letter-spacing:0.16em;text-transform:uppercase;color:rgba(255,255,255,0.3)}

/* PHILOSOPHY */
.philosophy{padding:10rem 5rem;background:var(--paper);display:grid;grid-template-columns:200px 1fr;gap:6rem;align-items:center}
.phil-side{display:flex;flex-direction:column;gap:1rem}
.phil-side-label{font-size:0.65rem;font-weight:500;letter-spacing:0.18em;text-transform:uppercase;color:var(--p);writing-mode:vertical-rl;transform:rotate(180deg);align-self:flex-start}
.phil-quote{font-family:var(--serif);font-size:clamp(1.8rem,3.5vw,3rem);font-weight:300;font-style:italic;color:var(--ink);line-height:1.4;letter-spacing:-0.01em}
.phil-quote em{color:var(--p);font-style:normal}
.phil-attr{font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);margin-top:2rem;display:flex;align-items:center;gap:0.75rem}
.phil-attr::before{content:'';display:block;width:24px;height:1px;background:var(--muted)}

/* SERVICES */
.services{padding:8rem 5rem;background:var(--ink)}
.services-top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:5rem}
.services-top h2{font-family:var(--serif);font-size:clamp(2.5rem,4vw,4rem);font-weight:300;color:white;line-height:1.05;letter-spacing:-0.02em}
.services-top h2 em{font-style:italic;color:var(--pl)}
.services-top a{font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.35);text-decoration:none;transition:color 0.2s;white-space:nowrap;margin-bottom:0.5rem;cursor:none}
.services-top a:hover{color:white}
.svc-list{display:flex;flex-direction:column}
.svc-item{display:grid;grid-template-columns:60px 1fr auto;gap:2rem;padding:1.75rem 0;border-bottom:1px solid rgba(255,255,255,0.05);transition:all 0.35s;cursor:none;align-items:start}
.svc-item:first-child{border-top:1px solid rgba(255,255,255,0.05)}
.svc-item:hover{padding-left:1.5rem;background:rgba(123,0,204,0.06)}
.svc-n{font-family:var(--serif);font-size:0.8rem;color:rgba(255,255,255,0.15);padding-top:0.4rem;font-weight:300}
.svc-name{font-family:var(--serif);font-size:clamp(1.4rem,2.5vw,2rem);font-weight:300;color:white;margin-bottom:0;transition:color 0.3s;line-height:1.2}
.svc-item:hover .svc-name{color:var(--pl)}
.svc-desc{font-size:0.8rem;color:rgba(255,255,255,0.3);line-height:1.75;max-width:480px;margin-top:0.5rem;height:0;overflow:hidden;transition:height 0.35s,opacity 0.35s;opacity:0;font-weight:300}
.svc-item:hover .svc-desc{height:3.5rem;opacity:1}
.svc-price{font-size:0.72rem;letter-spacing:0.06em;color:rgba(255,255,255,0.25);text-align:right;padding-top:0.4rem;transition:color 0.3s;white-space:nowrap}
.svc-item:hover .svc-price{color:var(--pl)}

/* ABOUT SPLIT */
.about-split{display:grid;grid-template-columns:1fr 1fr;min-height:85vh}
.about-visual{background:var(--pd);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6rem 4rem;position:relative;overflow:hidden}
.about-visual::before{content:'';position:absolute;width:600px;height:600px;border:1px solid rgba(232,213,255,0.06);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}
.about-visual::after{content:'';position:absolute;width:350px;height:350px;border:1px solid rgba(232,213,255,0.1);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}
.about-logo{width:200px;filter:drop-shadow(0 0 80px rgba(155,0,204,0.6));position:relative;z-index:1}
.about-chips{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:3rem;width:100%;max-width:280px;position:relative;z-index:1}
.about-chip{padding:0.75rem 1rem;border:1px solid rgba(232,213,255,0.12);font-size:0.65rem;letter-spacing:0.12em;text-transform:uppercase;color:rgba(232,213,255,0.45);text-align:center}
.about-right{padding:7rem 5rem;display:flex;flex-direction:column;justify-content:center;background:var(--paper)}
.eyebrow{font-size:0.65rem;font-weight:500;letter-spacing:0.2em;text-transform:uppercase;color:var(--p);margin-bottom:1.5rem;display:flex;align-items:center;gap:0.75rem}
.eyebrow::before{content:'';display:block;width:24px;height:1px;background:var(--p)}
.about-right h2{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3rem);font-weight:300;line-height:1.15;color:var(--ink);margin-bottom:1.5rem;letter-spacing:-0.01em}
.about-right h2 em{font-style:italic;color:var(--p)}
.about-right p{font-size:0.88rem;color:var(--muted);line-height:1.9;margin-bottom:1.25rem;font-weight:300}
.text-link{display:inline-flex;align-items:center;gap:0.75rem;font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--p);text-decoration:none;margin-top:1rem;transition:gap 0.25s;cursor:none}
.text-link:hover{gap:1.25rem}

/* PROCESS */
.process{padding:8rem 5rem;background:var(--cream)}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--border);margin-top:4rem}
.process-card{padding:2.5rem 2rem;border-right:1px solid var(--border);transition:background 0.3s}
.process-card:last-child{border-right:none}
.process-card:hover{background:white}
.process-n{font-family:var(--serif);font-size:3.5rem;font-weight:300;color:var(--pl);line-height:1;margin-bottom:1rem}
.process-t{font-size:0.85rem;font-weight:500;color:var(--ink);margin-bottom:0.6rem;letter-spacing:0.02em}
.process-d{font-size:0.8rem;color:var(--muted);line-height:1.75;font-weight:300}

/* PRICING */
.pricing{padding:8rem 5rem;background:var(--ink2)}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,0.06);margin-top:4rem}
.pricing-card{background:var(--ink2);padding:3rem 2.5rem;transition:background 0.3s;position:relative}
.pricing-card.featured{background:var(--pd)}
.pricing-card:hover{background:rgba(123,0,204,0.15)}
.pricing-card.featured:hover{background:var(--p)}
.pricing-badge{font-size:0.6rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--pl);margin-bottom:1.5rem;display:block}
.pricing-name{font-family:var(--serif);font-size:1.8rem;font-weight:300;color:white;margin-bottom:0.5rem}
.pricing-desc{font-size:0.8rem;color:rgba(255,255,255,0.4);line-height:1.7;margin-bottom:2rem;font-weight:300}
.pricing-price{font-family:var(--serif);font-size:2.5rem;font-weight:300;color:white;margin-bottom:0.25rem;line-height:1}
.pricing-period{font-size:0.72rem;color:rgba(255,255,255,0.3);letter-spacing:0.06em;margin-bottom:2rem}
.pricing-features{list-style:none;display:flex;flex-direction:column;gap:0.75rem;margin-bottom:2.5rem}
.pricing-features li{font-size:0.8rem;color:rgba(255,255,255,0.55);display:flex;gap:0.75rem;align-items:flex-start;font-weight:300;line-height:1.5}
.pricing-features li::before{content:'→';color:var(--p);flex-shrink:0}
.pricing-card.featured .pricing-features li::before{color:var(--pl)}
.btn-pricing{display:block;width:100%;padding:1rem;font-size:0.72rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;text-align:center;text-decoration:none;border:1px solid rgba(255,255,255,0.15);color:rgba(255,255,255,0.6);transition:all 0.3s;cursor:none}
.btn-pricing:hover{background:white;color:var(--ink);border-color:white}
.pricing-card.featured .btn-pricing{background:var(--pl);color:var(--pd);border-color:var(--pl)}
.pricing-card.featured .btn-pricing:hover{background:white;border-color:white}

/* CONVERSATIONAL FORM */
.conv-section{padding:8rem 5rem;background:var(--paper)}
.conv-form{max-width:700px;margin:4rem auto 0}
.conv-line{font-family:var(--serif);font-size:clamp(1.5rem,2.5vw,2.2rem);font-weight:300;color:var(--ink);line-height:1.6;margin-bottom:1.5rem}
.conv-input{font-family:var(--serif);font-size:clamp(1.5rem,2.5vw,2.2rem);font-weight:300;color:var(--p);background:transparent;border:none;border-bottom:2px solid var(--border);outline:none;padding:0.25rem 0.5rem;width:auto;min-width:120px;transition:border-color 0.2s;font-style:italic}
.conv-input:focus{border-bottom-color:var(--p)}
.conv-input::placeholder{color:var(--pl);opacity:0.6}
.conv-select{font-family:var(--serif);font-size:clamp(1.5rem,2.5vw,2.2rem);font-weight:300;color:var(--p);background:transparent;border:none;border-bottom:2px solid var(--border);outline:none;padding:0.25rem 0.5rem;cursor:none;font-style:italic;-webkit-appearance:none}
.conv-submit{margin-top:3rem;display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2.5rem;background:var(--ink);color:white;font-size:0.75rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;border:none;cursor:none;transition:background 0.3s}
.conv-submit:hover{background:var(--p)}

/* TESTIMONIAL */
.testimonial{padding:10rem 5rem;background:var(--ink);text-align:center;position:relative;overflow:hidden}
.testimonial::before{content:'\201C';font-family:var(--serif);font-size:30vw;color:rgba(123,0,204,0.06);position:absolute;top:-10%;left:50%;transform:translateX(-50%);line-height:1;pointer-events:none}
.testimonial blockquote{font-family:var(--serif);font-size:clamp(1.6rem,3.5vw,2.8rem);font-weight:300;font-style:italic;color:white;line-height:1.45;max-width:900px;margin:0 auto 2.5rem;position:relative;z-index:1;border:none}
.testimonial cite{font-size:0.7rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--pl);font-style:normal}

/* FAQ */
.faq{padding:8rem 5rem;background:var(--cream)}
.faq-list{margin-top:4rem;display:flex;flex-direction:column}
.faq-item{border-bottom:1px solid var(--border);overflow:hidden}
.faq-item:first-child{border-top:1px solid var(--border)}
.faq-q{display:flex;justify-content:space-between;align-items:center;padding:1.75rem 0;cursor:none;font-family:var(--serif);font-size:1.2rem;font-weight:400;color:var(--ink);transition:color 0.2s}
.faq-q:hover{color:var(--p)}
.faq-icon{font-size:1.2rem;color:var(--p);transition:transform 0.3s;flex-shrink:0;margin-left:1rem}
.faq-item.open .faq-icon{transform:rotate(45deg)}
.faq-a{font-size:0.875rem;color:var(--muted);line-height:1.85;font-weight:300;max-height:0;overflow:hidden;transition:max-height 0.4s ease,padding 0.3s;padding-bottom:0}
.faq-item.open .faq-a{max-height:300px;padding-bottom:1.75rem}

/* BLOG */
.blog{padding:8rem 5rem;background:var(--ink2)}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,0.05);margin-top:4rem}
.blog-card{background:var(--ink2);padding:2.5rem;transition:background 0.3s;cursor:none}
.blog-card:hover{background:rgba(123,0,204,0.12)}
.blog-tag{font-size:0.62rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--p);margin-bottom:1rem}
.blog-title{font-family:var(--serif);font-size:1.3rem;font-weight:300;color:white;line-height:1.3;margin-bottom:1rem}
.blog-excerpt{font-size:0.8rem;color:rgba(255,255,255,0.35);line-height:1.75;font-weight:300;margin-bottom:1.5rem}
.blog-link{font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--pl);text-decoration:none;transition:letter-spacing 0.2s}
.blog-link:hover{letter-spacing:0.16em}

/* AUDIT SECTION */
.audit-strip{background:var(--pd);padding:6rem 5rem;display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.audit-strip h2{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3rem);font-weight:300;color:white;line-height:1.15;letter-spacing:-0.01em;margin-bottom:1rem}
.audit-strip h2 em{font-style:italic;color:var(--pl)}
.audit-strip p{font-size:0.875rem;color:rgba(232,213,255,0.6);line-height:1.85;font-weight:300;margin-bottom:2rem}
.audit-features{list-style:none;display:flex;flex-direction:column;gap:0.75rem;margin-bottom:2.5rem}
.audit-features li{font-size:0.8rem;color:rgba(232,213,255,0.55);display:flex;gap:0.75rem;align-items:center;font-weight:300}
.audit-features li::before{content:'✦';color:var(--pl);font-size:0.6rem}
.btn-audit{display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2.2rem;background:var(--pl);color:var(--pd);font-size:0.75rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;transition:all 0.3s;cursor:none}
.btn-audit:hover{background:white}
.audit-preview{background:rgba(0,0,0,0.3);padding:2rem;border:1px solid rgba(232,213,255,0.1)}
.audit-dim{display:flex;align-items:center;gap:1rem;padding:0.75rem 0;border-bottom:1px solid rgba(255,255,255,0.05)}
.audit-dim:last-child{border-bottom:none}
.audit-dim-name{font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(232,213,255,0.45);width:100px;flex-shrink:0}
.audit-dim-bar{flex:1;height:3px;background:rgba(255,255,255,0.08);border-radius:2px;overflow:hidden}
.audit-dim-fill{height:3px;background:var(--p);border-radius:2px}
.audit-dim-val{font-size:0.72rem;color:rgba(232,213,255,0.4);width:36px;text-align:right}

/* CLIENTS */
.clients{padding:5rem;background:var(--paper);border-top:1px solid var(--border)}
.clients-label{font-size:0.65rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--muted);text-align:center;margin-bottom:3rem}
.clients-grid{display:flex;flex-wrap:wrap;gap:0;justify-content:center;border:1px solid var(--border)}
.client-slot{padding:2rem 3rem;border-right:1px solid var(--border);border-bottom:1px solid var(--border);font-family:var(--serif);font-size:1.1rem;font-weight:300;color:rgba(10,0,8,0.2);letter-spacing:0.05em;transition:color 0.3s}
.client-slot:hover{color:var(--p)}

/* FOOTER */
footer{background:var(--ink);padding:7rem 5rem 3rem}
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:4rem;padding-bottom:5rem;border-bottom:1px solid rgba(255,255,255,0.05);margin-bottom:3rem}
.footer-big{font-family:var(--serif);font-size:clamp(2rem,4vw,3.5rem);font-weight:300;color:white;line-height:1.2;margin-bottom:1.5rem;letter-spacing:-0.01em}
.footer-big em{font-style:italic;color:var(--pl)}
.footer-tagline{font-size:0.8rem;color:rgba(255,255,255,0.25);line-height:1.7;font-weight:300;max-width:280px}
.footer-col h4{font-size:0.62rem;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.25);margin-bottom:1.5rem}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:0.75rem}
.footer-col a{font-size:0.83rem;color:rgba(255,255,255,0.4);text-decoration:none;transition:color 0.2s;font-weight:300}
.footer-col a:hover{color:white}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer-bottom p{font-size:0.72rem;color:rgba(255,255,255,0.18);font-weight:300}

/* GPT WIDGET */
.gpt-widget{position:fixed;bottom:2rem;right:2rem;z-index:500}
.gpt-btn{width:56px;height:56px;background:var(--p);border-radius:50%;border:none;cursor:none;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 24px rgba(123,0,204,0.4);transition:all 0.3s;font-size:1.2rem;color:white}
.gpt-btn:hover{background:var(--pm);transform:scale(1.08)}
.gpt-panel{position:absolute;bottom:70px;right:0;width:340px;background:var(--ink2);border:1px solid rgba(123,0,204,0.3);box-shadow:0 16px 48px rgba(0,0,0,0.4);display:none;flex-direction:column;overflow:hidden}
.gpt-panel.open{display:flex}
.gpt-header{background:var(--pd);padding:1rem 1.25rem;display:flex;align-items:center;justify-content:space-between}
.gpt-header-title{font-family:var(--serif);font-size:1rem;font-weight:400;color:white}
.gpt-header-sub{font-size:0.65rem;color:rgba(232,213,255,0.6);letter-spacing:0.08em}
.gpt-close{background:none;border:none;color:rgba(255,255,255,0.5);cursor:none;font-size:1.1rem;transition:color 0.2s}
.gpt-close:hover{color:white}
.gpt-messages{height:280px;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:0.75rem}
.gpt-msg{max-width:85%;padding:0.75rem 1rem;font-size:0.8rem;line-height:1.6;font-weight:300}
.gpt-msg.bot{background:rgba(123,0,204,0.15);color:rgba(232,213,255,0.85);align-self:flex-start;border-left:2px solid var(--p)}
.gpt-msg.user{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.7);align-self:flex-end}
.gpt-typing{display:flex;gap:4px;padding:0.5rem}
.gpt-typing span{width:5px;height:5px;border-radius:50%;background:var(--p);animation:typing 1.2s ease-in-out infinite}
.gpt-typing span:nth-child(2){animation-delay:0.2s}
.gpt-typing span:nth-child(3){animation-delay:0.4s}
@keyframes typing{0%,100%{opacity:0.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
.gpt-input-wrap{display:flex;gap:0;border-top:1px solid rgba(255,255,255,0.06)}
.gpt-input{flex:1;background:transparent;border:none;padding:0.9rem 1rem;font-family:var(--sans);font-size:0.8rem;color:white;outline:none;font-weight:300}
.gpt-input::placeholder{color:rgba(255,255,255,0.2)}
.gpt-send{background:var(--p);border:none;padding:0 1.25rem;color:white;cursor:none;font-size:0.8rem;transition:background 0.2s}
.gpt-send:hover{background:var(--pm)}

/* ANIMATIONS */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 0.75s ease,transform 0.75s ease}
.reveal.up{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-28px);transition:opacity 0.75s ease,transform 0.75s ease}
.reveal-left.up{opacity:1;transform:translateX(0)}

/* RESPONSIVE */
@media(max-width:1024px){
  nav,nav.scrolled{padding:1.2rem 2rem}
  .nav-links,.nav-cta{display:none}
  .hamburger{display:flex}
  .hero{padding:8rem 1.5rem 5rem}
  .numbers{grid-template-columns:repeat(2,1fr);padding:4rem 2rem}
  .philosophy{grid-template-columns:1fr;padding:6rem 2rem;gap:2rem}
  .phil-side-label{writing-mode:horizontal-tb;transform:none}
  .services{padding:6rem 2rem}
  .services-top{flex-direction:column;align-items:flex-start;gap:1rem;margin-bottom:3rem}
  .svc-item{grid-template-columns:40px 1fr;gap:1rem}
  .svc-price{display:none}
  .about-split{grid-template-columns:1fr}
  .about-visual{min-height:50vh}
  .about-right{padding:5rem 2rem}
  .process{padding:6rem 2rem}
  .process-grid{grid-template-columns:1fr 1fr}
  .process-card{border-bottom:1px solid var(--border)}
  .pricing{padding:6rem 2rem}
  .pricing-grid{grid-template-columns:1fr}
  .conv-section{padding:6rem 2rem}
  .testimonial{padding:7rem 2rem}
  .faq{padding:6rem 2rem}
  .blog{padding:6rem 2rem}
  .blog-grid{grid-template-columns:1fr}
  .audit-strip{grid-template-columns:1fr;padding:5rem 2rem;gap:3rem}
  .clients{padding:4rem 2rem}
  footer{padding:5rem 2rem 3rem}
  .footer-top{grid-template-columns:1fr 1fr;gap:3rem}
  body{cursor:auto}
  .cursor,.cursor-ring{display:none}
}

/* AFRICAN PATTERN BACKGROUNDS */
.pattern-adire {
  position: relative;
  overflow: hidden;
}
.pattern-adire::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('/wp-content/themes/artentopia/assets/images/pattern-adire.svg');
  background-repeat: repeat;
  background-size: 120px 120px;
  opacity: 0.6;
  pointer-events: none;
  z-index: 0;
}
.pattern-adire > * { position: relative; z-index: 1; }

.pattern-kente {
  position: relative;
  overflow: hidden;
}
.pattern-kente::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('/wp-content/themes/artentopia/assets/images/pattern-kente.svg');
  background-repeat: repeat;
  background-size: 80px 80px;
  opacity: 0.5;
  pointer-events: none;
  z-index: 0;
}
.pattern-kente > * { position: relative; z-index: 1; }

.pattern-ankara {
  position: relative;
  overflow: hidden;
}
.pattern-ankara::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('/wp-content/themes/artentopia/assets/images/pattern-ankara.svg');
  background-repeat: repeat;
  background-size: 100px 100px;
  opacity: 0.4;
  pointer-events: none;
  z-index: 0;
}
.pattern-ankara > * { position: relative; z-index: 1; }

/* PORTFOLIO PAGE */
.portfolio-hero {
  min-height: 60vh;
  background: var(--ink);
  display: flex;
  align-items: flex-end;
  padding: 10rem 5rem 5rem;
  position: relative;
  overflow: hidden;
}
.portfolio-hero::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0; right: 0;
  height: 80px;
  background: var(--paper);
  clip-path: ellipse(55% 100% at 50% 100%);
}
.portfolio-hero-text { position: relative; z-index: 1; }
.portfolio-hero h1 {
  font-family: var(--serif);
  font-size: clamp(3rem, 6vw, 5.5rem);
  font-weight: 300;
  color: white;
  line-height: 1.05;
  letter-spacing: -0.02em;
  max-width: 800px;
}
.portfolio-hero h1 em { font-style: italic; color: var(--pl); }
.portfolio-hero p {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.45);
  max-width: 480px;
  margin-top: 1.25rem;
  line-height: 1.85;
  font-weight: 300;
}
.portfolio-filter {
  padding: 2rem 5rem;
  background: var(--paper);
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border);
}
.filter-btn {
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 6px 16px;
  border: 1px solid var(--border);
  color: var(--muted);
  background: transparent;
  cursor: none;
  transition: all 0.2s;
}
.filter-btn:hover, .filter-btn.active {
  background: var(--p);
  border-color: var(--p);
  color: white;
}
.portfolio-grid {
  padding: 5rem;
  background: var(--paper);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  background-color: var(--border);
  border: 1px solid var(--border);
  margin: 0 5rem 5rem;
}
.portfolio-card {
  background: var(--paper);
  overflow: hidden;
  cursor: none;
  transition: all 0.4s;
  position: relative;
}
.portfolio-card:hover { background: var(--cream); }
.portfolio-card.large { grid-column: span 2; }
.portfolio-thumb {
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  position: relative;
  background: var(--ink2);
}
.portfolio-card.large .portfolio-thumb { aspect-ratio: 21/9; }
.portfolio-thumb-inner {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  transition: transform 0.5s ease;
}
.portfolio-card:hover .portfolio-thumb-inner { transform: scale(1.03); }
.portfolio-thumb-pattern {
  position: absolute;
  inset: 0;
  opacity: 0.15;
}
.portfolio-thumb-logo {
  width: 80px;
  opacity: 0.3;
  filter: brightness(0) invert(1);
  position: relative;
  z-index: 1;
  transition: opacity 0.3s, transform 0.3s;
}
.portfolio-card:hover .portfolio-thumb-logo { opacity: 0.6; transform: scale(1.1); }
.portfolio-thumb-label {
  position: absolute;
  bottom: 1rem;
  right: 1rem;
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  z-index: 1;
}
.portfolio-info { padding: 2rem 2.5rem; }
.portfolio-category {
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--p);
  margin-bottom: 0.5rem;
}
.portfolio-title {
  font-family: var(--serif);
  font-size: 1.5rem;
  font-weight: 300;
  color: var(--ink);
  margin-bottom: 0.5rem;
  line-height: 1.2;
}
.portfolio-desc {
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.7;
  font-weight: 300;
  margin-bottom: 1.25rem;
}
.portfolio-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 1.25rem; }
.portfolio-tag {
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 10px;
  border: 1px solid var(--border);
  color: var(--muted);
}
.portfolio-link {
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--p);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: gap 0.2s;
  cursor: none;
}
.portfolio-link:hover { gap: 0.9rem; }
.coming-soon-card {
  background: var(--ink);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4rem;
  text-align: center;
  min-height: 300px;
}
.coming-soon-card p {
  font-family: var(--serif);
  font-size: 1.2rem;
  font-weight: 300;
  font-style: italic;
  color: rgba(255,255,255,0.3);
  margin-top: 1rem;
}
.coming-soon-card a {
  margin-top: 1.5rem;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pl);
  text-decoration: none;
}

/* IMPROVED INNER PAGE HERO */
.inner-hero {
  min-height: 65vh;
  display: flex;
  align-items: flex-end;
  padding: 10rem 5rem 5rem;
  position: relative;
  overflow: hidden;
}
.inner-hero::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0; right: 0;
  height: 80px;
  clip-path: ellipse(55% 100% at 50% 100%);
}
.inner-hero-dark { background: var(--ink); }
.inner-hero-dark::after { background: var(--paper); }
.inner-hero-purple { background: var(--pd); }
.inner-hero-purple::after { background: var(--paper); }
.inner-hero-ink2 { background: var(--ink2); }
.inner-hero-ink2::after { background: var(--paper); }
.inner-hero-content { position: relative; z-index: 1; max-width: 860px; }
.inner-hero-content .eyebrow { color: var(--pl); }
.inner-hero-content .eyebrow::before { background: var(--pl); }
.inner-hero-content h1 {
  font-family: var(--serif);
  font-size: clamp(3rem, 6vw, 5.5rem);
  font-weight: 300;
  color: white;
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-top: 1rem;
}
.inner-hero-content h1 em { font-style: italic; color: var(--pl); }
.inner-hero-content p {
  font-size: 1rem;
  color: rgba(255,255,255,0.5);
  max-width: 540px;
  margin-top: 1.5rem;
  line-height: 1.85;
  font-weight: 300;
}

/* ABOUT PAGE IMPROVEMENTS */
.founder-section {
  padding: 8rem 5rem;
  background: var(--paper);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8rem;
  align-items: start;
}
.founder-visual {
  position: sticky;
  top: 8rem;
}
.founder-logo-wrap {
  background: var(--pd);
  padding: 4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1px;
  position: relative;
  overflow: hidden;
}
.founder-logo-wrap img {
  width: 160px;
  filter: drop-shadow(0 0 60px rgba(155,0,204,0.5));
  position: relative;
  z-index: 1;
}
.founder-values {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--border);
}
.founder-value {
  background: var(--cream);
  padding: 1.5rem;
  transition: background 0.3s;
}
.founder-value:hover { background: white; }
.founder-value-num {
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--p);
  margin-bottom: 0.4rem;
}
.founder-value-text {
  font-family: var(--serif);
  font-size: 1rem;
  font-weight: 400;
  color: var(--ink);
}
.founder-text h2 {
  font-family: var(--serif);
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 300;
  color: var(--ink);
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin-bottom: 2rem;
}
.founder-text h2 em { font-style: italic; color: var(--p); }
.founder-text p {
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.9;
  margin-bottom: 1.5rem;
  font-weight: 300;
}

/* SERVICES PAGE IMPROVEMENTS */
.services-page-body { padding: 6rem 5rem; background: var(--paper); }
.services-page-list { display: flex; flex-direction: column; margin-top: 4rem; }
.services-page-item {
  display: grid;
  grid-template-columns: 60px 1fr 220px;
  gap: 2rem;
  padding: 3rem 0;
  border-bottom: 1px solid var(--border);
  align-items: start;
  transition: padding-left 0.3s;
}
.services-page-item:first-child { border-top: 1px solid var(--border); }
.services-page-item:hover { padding-left: 1rem; }
.spi-num {
  font-family: var(--serif);
  font-size: 0.85rem;
  color: var(--muted);
  padding-top: 0.4rem;
}
.spi-name {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  font-weight: 300;
  color: var(--ink);
  margin-bottom: 0.75rem;
  transition: color 0.3s;
  line-height: 1.2;
}
.services-page-item:hover .spi-name { color: var(--p); }
.spi-desc {
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.8;
  max-width: 520px;
  font-weight: 300;
  margin-bottom: 1rem;
}
.spi-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.spi-tag {
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 10px;
  border: 1px solid var(--border);
  color: var(--p);
}
.spi-right { text-align: right; padding-top: 0.4rem; }
.spi-price {
  font-family: var(--serif);
  font-size: 1.5rem;
  font-weight: 300;
  color: var(--ink);
  margin-bottom: 0.5rem;
}
.services-page-item.featured { background: var(--pd); padding: 3rem 2rem; }
.services-page-item.featured .spi-num { color: rgba(232,213,255,0.3); }
.services-page-item.featured .spi-name { color: white; }
.services-page-item.featured:hover .spi-name { color: var(--pl); }
.services-page-item.featured .spi-desc { color: rgba(232,213,255,0.6); }
.services-page-item.featured .spi-tag { border-color: rgba(232,213,255,0.2); color: var(--pl); }
.services-page-item.featured .spi-price { color: white; }

/* CONTACT PAGE IMPROVEMENTS */
.contact-body-v5 {
  padding: 7rem 5rem;
  background: var(--paper);
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 8rem;
}
.contact-sidebar h3 {
  font-family: var(--serif);
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--ink);
  margin: 2.5rem 0 0.5rem;
}
.contact-sidebar h3:first-of-type { margin-top: 0; }
.contact-sidebar p, .contact-sidebar a {
  font-size: 0.875rem;
  color: var(--muted);
  text-decoration: none;
  line-height: 1.7;
  font-weight: 300;
}
.contact-sidebar a:hover { color: var(--p); }
.contact-note {
  margin-top: 3rem;
  padding: 2rem;
  border-left: 3px solid var(--p);
  background: var(--cream);
}
.contact-note-label {
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--p);
  margin-bottom: 0.75rem;
}
.contact-note blockquote {
  font-family: var(--serif);
  font-size: 1.05rem;
  font-weight: 300;
  font-style: italic;
  color: var(--ink);
  line-height: 1.65;
  border: none;
}
.contact-form-v5 { display: flex; flex-direction: column; gap: 2.5rem; }
.cfv5-group { display: flex; flex-direction: column; gap: 0.5rem; }
.cfv5-label {
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
}
.cfv5-input {
  font-family: var(--sans);
  font-size: 0.95rem;
  color: var(--ink);
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(10,0,8,0.15);
  padding: 0.75rem 0;
  outline: none;
  transition: border-color 0.2s;
  font-weight: 300;
  width: 100%;
}
.cfv5-input:focus { border-bottom-color: var(--p); }
.cfv5-input::placeholder { color: rgba(10,0,8,0.2); }
.cfv5-row { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.cfv5-submit {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 2.5rem;
  background: var(--ink);
  color: white;
  font-family: var(--sans);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border: none;
  cursor: none;
  transition: background 0.3s;
  align-self: flex-start;
}
.cfv5-submit:hover { background: var(--p); }

@media(max-width:1024px){
  .portfolio-grid { margin: 0 1.5rem 3rem; padding: 0; grid-template-columns: 1fr; }
  .portfolio-filter { padding: 1.5rem 1.5rem; }
  .portfolio-hero { padding: 8rem 1.5rem 4rem; }
  .portfolio-card.large { grid-column: span 1; }
  .founder-section { grid-template-columns: 1fr; gap: 3rem; padding: 5rem 1.5rem; }
  .founder-visual { position: static; }
  .services-page-body { padding: 5rem 1.5rem; }
  .services-page-item { grid-template-columns: 40px 1fr; gap: 1rem; }
  .spi-right { display: none; }
  .contact-body-v5 { grid-template-columns: 1fr; gap: 4rem; padding: 5rem 1.5rem; }
  .inner-hero { padding: 8rem 1.5rem 4rem; }
  .cfv5-row { grid-template-columns: 1fr; gap: 2rem; }
}

/* ===========================
   FSE BLOCK EDITOR OVERRIDES
   =========================== */

/* Remove default WP block margins */
.wp-block-group { margin: 0 !important; }
.wp-site-blocks { padding: 0 !important; }
.wp-block-template-part { display: contents; }

/* Block editor: navigation */
.wp-block-navigation__container {
  display: flex !important;
  gap: 2.5rem !important;
  list-style: none !important;
}
.wp-block-navigation-item__content {
  font-size: 0.72rem !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,0.55) !important;
  text-decoration: none !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  transition: color 0.2s !important;
  padding: 0 !important;
}
.wp-block-navigation-item__content:hover { color: white !important; }

/* Block editor: buttons */
.wp-block-button__link {
  border-radius: 0 !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

/* Block editor: headings inside dark sections */
.dark-bg h1,.dark-bg h2,.dark-bg h3 { color: white !important; }
.dark-bg p { color: rgba(255,255,255,0.5) !important; }
.dark-bg .wp-block-paragraph { color: rgba(255,255,255,0.5) !important; }

/* Block editor: cover blocks */
.wp-block-cover { min-height: 65vh !important; }
.wp-block-cover__inner-container { padding: 10rem 5rem 5rem !important; }

/* Patterns alignment */
.artentopia-pattern { position: relative; overflow: hidden; }
.artentopia-hero-section { padding: 0 !important; }

/* Fix WP admin bar spacing */
.admin-bar nav { top: 32px !important; }
@media (max-width: 782px) { .admin-bar nav { top: 46px !important; } }

/* Block editor: paragraph */
.wp-block-paragraph { font-weight: 300; line-height: 1.85; }

/* Block editor: columns */
.wp-block-columns { gap: 0 !important; }
.wp-block-column { padding: 0 !important; }

/* Remove default padding from aligned blocks */
.alignfull { margin-left: 0 !important; margin-right: 0 !important; }