﻿/* Rahul Gogi homepage — from rahulgogi-v8.html */
    html, body {
      direction: ltr;
      text-align: left;
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }

    :root {
      --bg:      #0a0a0a;
      --bg-2:    #111111;
      --bg-3:    #161616;
      --rule:    #1e1e1e;
      --rule-2:  #2a2a2a;

      /* White â€” used for ALL text */
      --white:   #f2f2f2;
      --white-2: #ffffff;
      /* Only for truly tertiary: timestamps, fine-print, inactive states */
      --sub:     #888888;

      --hind: 'Satoshi', system-ui, sans-serif;
      --mono: 'IBM Plex Mono', 'Courier New', monospace;

      --max: 900px;
    }

    body {
      background: var(--bg);
      color: var(--white);
      font-family: var(--mono);
      font-size: 13px;
      line-height: 1.82;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }

    a { color: inherit; text-decoration: none; }
    img { max-width: 100%; display: block; }

    .wrap {
      max-width: var(--max);
      margin: 0 auto;
      padding: 0 28px;
    }

    /* Scroll reveal */
    .r { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
    .r.on { opacity: 1; transform: none; }
    .d1 { transition-delay: .08s; }
    .d2 { transition-delay: .16s; }
    .d3 { transition-delay: .24s; }
    .d4 { transition-delay: .32s; }

    /* LOGO SUPREME STYLE */
    .logo {
      display: inline-block;
      text-decoration: none;
    }

    .logo-box {
      display: inline-block;
      background: #ED1C24;
      padding: 6px 14px 5px;
      font-family: var(--hind);
      font-size: 15px;
      font-weight: 900;
      font-style: normal;
      color: #ffffff;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      line-height: 1;
      white-space: nowrap;
    }

    /* Footer larger */
    .logo-box-lg {
      padding: 10px 20px 9px;
      font-size: 22px;
      letter-spacing: 0.05em;
    }

    /* 1. NAV */
    .rahul-home nav,
    .rahul-home .rahul-nav {
      position: sticky;
      top: 0; z-index: 200;
      background: rgba(10,10,10,.96);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      border-bottom: 1px solid var(--rule);
    }

    .nav-inner {
      max-width: var(--max);
      margin: 0 auto;
      padding: 0 28px;
      height: 56px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 26px;
    }

    .nav-links a {
      font-family: var(--mono);
      font-size: 12px;
      font-weight: 400;
      color: var(--white);
      transition: opacity .15s;
    }
    .nav-links a:hover { opacity: .5; }

    .nav-cta {
      font-family: var(--mono);
      font-size: 15px;
      font-weight: 500;
      color: var(--bg) !important;
      background: var(--white-2);
      padding: 6px 16px 5px;
      letter-spacing: .02em;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      transition: opacity .15s !important;
    }
    .nav-cta:hover { opacity: .8; }

    /*  2. TICKER STRIP */
    .ticker {
      background: var(--bg-2);
      border-bottom: 1px solid var(--rule);
      padding: 10px 0;
      overflow: hidden;
      white-space: nowrap;
    }

    .t-track {
      display: inline-flex;
      animation: tickmove 36s linear infinite;
    }

    .t-track span {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 400;
      color: var(--white);
      padding: 0 42px;
      letter-spacing: .06em;
    }

    .t-track .sep { color: var(--sub); padding: 0; }

    @keyframes tickmove {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }

    /* 3. HERO / BANNER */
    .hero {
      padding: 90px 0 76px;
      border-bottom: 1px solid var(--rule);
      position: relative;
      overflow: hidden;
    }

    /* subtle grid texture */
    .hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(var(--rule) 1px, transparent 1px),
        linear-gradient(90deg, var(--rule) 1px, transparent 1px);
      background-size: 60px 60px;
      opacity: .28;
      pointer-events: none;
    }

    .hero-inner { position: relative; z-index: 1; }

    .hero-eyebrow {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 400;
      color: var(--white);
      letter-spacing: .08em;
      margin-bottom: 22px;
    }

    .hero h1 {
      font-family: var(--hind);
      font-size: clamp(34px, 5.2vw, 62px);
      font-weight: 700;
      line-height: 1.08;
      letter-spacing: -.03em;
      color: var(--white-2);
      max-width: 740px;
      margin-bottom: 22px;
    }

    .hero-sub {
      font-family: var(--mono);
      font-size: 13px;
      font-weight: 400;
      color: var(--white);
      max-width: 480px;
      line-height: 1.85;
      margin-bottom: 36px;
    }

    .hero-form {
      display: flex;
      max-width: 410px;
    }

.hero-form .elementor-form .elementor-form-fields-wrapper {
	flex-wrap: nowrap;
	margin: 0 !important;
}
.hero-form .elementor-form {
	max-width: 410px !important;
	width: 100% !important;
}
.hero-form .elementor-form .elementor-field-type-submit {
	max-width: fit-content !important;
}
.hero-form .elementor-form .elementor-field-type-submit .elementor-button {
	min-height: 41px;
}
.hero-form .elementor-form .elementor-field-group input:focus {
  border-color: #FFFFFF !important;
}
.hero-form .elementor-form .elementor-field-group {
	padding: 0px !important;
	margin: 0px !important;
}


    .hero-form input[type="email"] {
      flex: 1;
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
      background: var(--bg-2);
      border: 1px solid var(--rule-2);
      border-right: none;
      padding: 12px 16px;
      outline: none;
      transition: border-color .15s;
    }
    .hero-form input::placeholder { color: var(--sub); }
    .hero-form input:focus { border-color: var(--white); }

    .hero-form button {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: .08em;
      background: var(--white-2);
      color: var(--bg);
      border: none;
      padding: 12px 20px;
      cursor: pointer;
      white-space: nowrap;
      transition: opacity .15s;
    }
    .hero-form button:hover { opacity: .85; }

    .hero-note {
      margin-top: 10px;
      font-family: var(--mono);
      font-size: 11px;
      color: var(--sub);
    }

    /*  4. FEATURED IN  */
    .feat-in {
      border-bottom: 1px solid var(--rule);
      padding: 30px 0;
      overflow: hidden;
    }

    .fi-label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 400;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--sub);
      text-align: center;
      margin-bottom: 20px;
    }

    .fi-wrap {
      position: relative;
    }
    .fi-wrap::before,
    .fi-wrap::after {
      content: '';
      position: absolute;
      top: 0; bottom: 0;
      width: 100px; z-index: 2;
      pointer-events: none;
    }
    .fi-wrap::before { left: 0;  background: linear-gradient(to right, var(--bg), transparent); }
    .fi-wrap::after  { right: 0; background: linear-gradient(to left,  var(--bg), transparent); }

    .fi-track {
      display: inline-flex;
      animation: tickmove 30s linear infinite;
    }

    .fi-pub {
      font-family: var(--mono);
      font-size: 14px;
      font-weight: 500;
      color: var(--white);
      padding: 0 52px;
      white-space: nowrap;
      letter-spacing: .02em;
      transition: opacity .15s;
    }
    .fi-pub:hover { opacity: .4; }

    /*  5. ABOUT  */
    .about {
      border-bottom: 1px solid var(--rule);
      padding: 72px 0;
    }

    .about-grid {
      display: grid;
      grid-template-columns: 100px 1fr;
      gap: 36px;
      align-items: start;
    }

    .about-photo {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      flex-shrink: 0;
      background: var(--bg-3);
      border: 1px solid var(--rule-2);
      object-fit: cover;
      filter: grayscale(100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: var(--mono);
      font-size: 9px;
      letter-spacing: .1em;
      color: var(--sub);
    }

    .about-kicker {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 400;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: var(--sub);
      margin-bottom: 10px;
    }

    .about h2 {
      font-family: var(--hind);
      font-size: clamp(24px, 3.2vw, 36px);
      font-weight: 700;
      letter-spacing: -.025em;
      color: var(--white-2);
      margin-bottom: 16px;
      line-height: 1.12;
    }

    .about-bio {
      font-family: var(--mono);
      font-size: 13px;
      font-weight: 400;
      color: var(--white);
      line-height: 1.85;
      max-width: 640px;
      margin-bottom: 10px;
    }

    .about-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin: 18px 0;
    }

    .about-tag {
      font-family: var(--mono);
      font-size: 10px;
      color: var(--white);
      border: 1px solid var(--rule-2);
      padding: 4px 10px;
      letter-spacing: .04em;
    }

    .about-links { display: flex; gap: 18px; }

    .about-links a {
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
      border-bottom: 1px solid var(--rule-2);
      padding-bottom: 2px;
      transition: border-color .15s;
    }
    .about-links a:hover { border-color: var(--white); }

    /*   SECTION HEAD UTIL  */
    .sh {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      margin-bottom: 28px;
    }

    .sh h2 {
      font-family: var(--hind);
      font-size: clamp(22px, 2.8vw, 32px);
      font-weight: 700;
      color: var(--white-2);
      letter-spacing: -.025em;
      line-height: 1.15;
    }

    .sh-link {
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
      transition: opacity .15s;
      white-space: nowrap;
    }
    .sh-link:hover { opacity: .5; }

    /*  6. LATEST ARTICLES  */
    .articles {
      border-bottom: 1px solid var(--rule);
      padding: 72px 0;
    }

    .article-list { display: flex; flex-direction: column; }

    .article {
      display: grid;
      grid-template-columns: 1fr 76px;
      gap: 20px;
      align-items: start;
      padding: 26px 0;
      border-top: 1px solid var(--rule);
      transition: opacity .15s;
    }
    .article:last-child { border-bottom: 1px solid var(--rule); }
    .article:hover { opacity: .5; text-decoration: none; }

    .art-topic {
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--sub);
      margin-bottom: 8px;
    }

    .article h3 {
      font-family: var(--hind);
      font-size: 20px;
      font-weight: 600;
      line-height: 1.28;
      color: var(--white-2);
      letter-spacing: -.02em;
      margin-bottom: 8px;
    }

    .article p {
      font-family: var(--mono);
      font-size: 12px;
      font-weight: 400;
      color: var(--white);
      line-height: 1.82;
    }

    .art-aside { text-align: right; padding-top: 3px; }

    .art-date {
      font-family: var(--mono);
      font-size: 10px;
      color: var(--sub);
      display: block;
      margin-bottom: 5px;
    }

    .art-min {
      font-family: var(--mono);
      font-size: 10px;
      color: var(--sub);
      border: 1px solid var(--rule-2);
      padding: 2px 5px;
      display: inline-block;
    }

    /*  7. SERVICES */
    .services {
      border-bottom: 1px solid var(--rule);
      padding: 72px 0;
      background: var(--bg-2);
    }

    .svc-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 1px;
      background: var(--rule);
      border: 1px solid var(--rule);
    }

    .svc-card {
      background: var(--bg-2);
      padding: 34px 28px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .svc-n {
      font-family: var(--mono);
      font-size: 10px;
      color: var(--sub);
    }

    .svc-card h3 {
      font-family: var(--hind);
      font-size: 18px;
      font-weight: 700;
      line-height: 1.25;
      color: var(--white-2);
      letter-spacing: -.02em;
    }

    .svc-card p {
      font-family: var(--mono);
      font-size: 12px;
      font-weight: 400;
      color: var(--white);
      line-height: 1.82;
      flex: 1;
    }

    .svc-cta {
      font-family: var(--mono);
      font-size: 11px;
      color: var(--white);
      border-bottom: 1px solid var(--rule-2);
      padding-bottom: 2px;
      display: inline-block;
      margin-top: 8px;
      transition: border-color .15s;
    }
    .svc-cta:hover { border-color: var(--white); text-decoration: none; }
    .svc-cta::after { content: ' â†’'; }

    /*  8. CONNECT  */
    .connect {
      border-bottom: 1px solid var(--rule);
      padding: 72px 0;
    }

    .connect-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: start;
    }

    .connect-copy h2 {
      font-family: var(--hind);
      font-size: clamp(24px, 3.2vw, 36px);
      font-weight: 700;
      letter-spacing: -.025em;
      line-height: 1.12;
      color: var(--white-2);
      margin-bottom: 16px;
    }

    .connect-copy p {
      font-family: var(--mono);
      font-size: 13px;
      color: var(--white);
      line-height: 1.85;
      margin-bottom: 20px;
    }

    .connect-email {
      font-family: var(--mono);
      font-size: 13px;
      color: var(--white);
      border-bottom: 1px solid var(--rule-2);
      padding-bottom: 2px;
      transition: border-color .15s;
    }
    .connect-email:hover { border-color: var(--white); }

    .social-list {
      display: flex;
      flex-direction: column;
      gap: 1px;
      background: var(--rule);
      border: 1px solid var(--rule);
    }

    .social-item {
      background: var(--bg);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 22px;
      transition: background .15s;
    }
    .social-item:hover { background: var(--bg-3); text-decoration: none; }

    .soc-name {
      font-family: var(--hind);
      font-size: 16px;
      font-weight: 600;
      color: var(--white-2);
      letter-spacing: -.01em;
    }

    .soc-handle {
      font-family: var(--mono);
      font-size: 11px;
      color: var(--white);
      margin-top: 2px;
    }

    .soc-arr {
      font-family: var(--mono);
      font-size: 14px;
      color: var(--sub);
    }

    /*  9. FOOTER */
    .rahul-home footer,
    .rahul-home .rahul-footer {
      padding: 60px 0 40px;
    }

    .footer-top {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      padding-bottom: 44px;
      border-bottom: 1px solid var(--rule);
      margin-bottom: 32px;
    }

    .footer-tagline {
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
      line-height: 1.82;
      margin-bottom: 22px;
    }

    .footer-nav { display: flex; flex-direction: column; gap: 8px; }

    .footer-nav a {
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
      transition: opacity .15s;
    }
    .footer-nav a:hover { opacity: .5; }

    .footer-nl-label {
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: var(--sub);
      margin-bottom: 12px;
    }

    .footer-nl h3 {
      font-family: var(--hind);
      font-size: 22px;
      font-weight: 700;
      color: var(--white-2);
      letter-spacing: -.02em;
      line-height: 1.18;
      margin-bottom: 10px;
    }

    .footer-nl p {
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
      line-height: 1.82;
      margin-bottom: 18px;
    }

    .footer-form { display: flex; max-width: 380px; }

    .footer-form input[type="email"] {
      flex: 1;
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
      background: var(--bg-3);
      border: 1px solid var(--rule-2);
      border-right: none;
      padding: 11px 14px;
      outline: none;
      transition: border-color .15s;
    }
    .footer-form input::placeholder { color: var(--sub); }
    .footer-form input:focus { border-color: var(--white); }

    .footer-form button {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      background: var(--white-2);
      color: var(--bg);
      border: none;
      padding: 11px 16px;
      cursor: pointer;
      white-space: nowrap;
      transition: opacity .15s;
    }
    .footer-form button:hover { opacity: .85; }

    .footer-talk {
      margin-top: 14px;
      font-family: var(--mono);
      font-size: 12px;
      color: var(--white);
    }

    .footer-talk a {
      color: var(--white);
      border-bottom: 1px solid var(--rule-2);
      padding-bottom: 1px;
      transition: border-color .15s;
    }
    .footer-talk a:hover { border-color: var(--white); }

    .footer-bottom {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 12px;
    }

    .footer-copy {
      font-family: var(--mono);
      font-size: 10px;
      color: var(--sub);
    }

    .footer-legal { display: flex; gap: 16px; }

    .footer-legal a {
      font-family: var(--mono);
      font-size: 10px;
      color: var(--sub);
      transition: color .15s;
    }
    .footer-legal a:hover { color: var(--white); }

    /*  RESPONSIVE */
    @media (max-width: 680px) {
      .about-grid { grid-template-columns: 1fr; }
      .svc-grid   { grid-template-columns: 1fr; }
      .connect-grid { grid-template-columns: 1fr; gap: 36px; }
      .footer-top   { grid-template-columns: 1fr; gap: 36px; }
      .article { grid-template-columns: 1fr; }
      .art-aside { display: none; }
      .footer-bottom { flex-direction: column; align-items: flex-start; }
      .nav-links .hide-sm { display: none; }
    }
