/* Shared base layout for Rajat Singh homepage variations j–z.
   Each variation supplies a :root theme block + font before this file. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);line-height:1.65;-webkit-font-smoothing:antialiased;
	background-image:var(--bg-image,none);background-size:var(--bg-size,auto);background-attachment:var(--bg-attach,scroll)}
img{max-width:100%;display:block}
a{color:var(--accent);text-decoration:none}
.wrap{width:100%;max-width:var(--maxw,1120px);margin:0 auto;padding:0 24px;position:relative;z-index:1}
h1,h2,h3{margin:0;font-family:var(--fhead);font-weight:var(--hweight,700);line-height:1.06;letter-spacing:var(--hls,-.02em);text-transform:var(--ht,none)}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:var(--nav-bg,var(--bg));backdrop-filter:blur(10px);border-bottom:var(--nav-bd,1px solid var(--line))}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:66px}
.brand{font-family:var(--fhead);font-weight:var(--brand-weight,800);font-size:1.2rem;color:var(--ink);text-transform:var(--brand-ht,none);letter-spacing:var(--brand-ls,normal)}
.nav-links{display:flex;align-items:center;gap:24px}
.nav-links a{color:var(--muted);font-size:.9rem;font-weight:600;text-transform:var(--nav-ht,none);letter-spacing:var(--nav-ls,normal)}
.nav-links a:hover{color:var(--accent)}
.nav-cta{background:var(--cta-bg,var(--accent));color:var(--cta-ink,var(--on-accent)) !important;padding:9px 18px;border-radius:var(--btn-radius,999px);font-weight:700;font-size:.86rem;border:var(--cta-bd,none);box-shadow:var(--cta-shadow,none)}
@media(max-width:720px){.nav-links a.hide-sm{display:none}}

/* hero */
.hero{padding:64px 0 78px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.pill{display:inline-flex;align-items:center;gap:9px;background:var(--pill-bg);color:var(--pill-ink);border:var(--pill-bd,none);font-size:.84rem;font-weight:600;padding:7px 15px;border-radius:var(--pill-radius,999px);margin-bottom:24px;text-transform:var(--pill-ht,none);letter-spacing:var(--pill-ls,normal)}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.hero h1{font-size:clamp(2.7rem,6vw,4.4rem);margin-bottom:18px}
.hero h1 .hl{color:var(--accent);background:var(--hl-bg,none);-webkit-background-clip:var(--hl-clip,border-box);background-clip:var(--hl-clip,border-box);-webkit-text-fill-color:var(--hl-fill,currentColor)}
.lede{font-size:1.16rem;color:var(--muted);max-width:40ch;margin:0 0 30px}
.lede b{color:var(--ink);font-weight:700}
.actions{display:flex;flex-wrap:wrap;gap:14px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 24px;border-radius:var(--btn-radius,999px);font-weight:700;font-size:.95rem;transition:transform .15s,box-shadow .2s;border:var(--btn-bd,none)}
.btn-primary{background:var(--accent);color:var(--on-accent) !important;box-shadow:var(--btn-shadow,none)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{background:var(--card);color:var(--ink) !important;border:var(--ghost-bd,1px solid var(--line))}
.btn-ghost:hover{transform:translateY(-2px)}
.portrait{padding:var(--portrait-pad,0);border-radius:var(--portrait-radius,24px);background:var(--portrait-bg,transparent);border:var(--portrait-bd,none);box-shadow:var(--portrait-shadow,none)}
.portrait img{width:100%;border-radius:var(--photo-radius,20px);aspect-ratio:4/5;object-fit:cover;filter:var(--photo-filter,none);border:var(--photo-bd,none)}

/* sections */
.block{padding:var(--section-pad,56px) 0}
.eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.section-head{max-width:640px;margin-bottom:40px}
.section-head h2{font-size:clamp(1.9rem,4vw,2.7rem);margin-bottom:8px}
.section-head p{color:var(--muted);margin:0}

/* experience */
.xp{display:grid;gap:20px}
.xp-card{background:var(--card);border:var(--bd,1px solid var(--line));border-radius:var(--radius,18px);padding:28px;display:grid;grid-template-columns:120px 1fr;gap:28px;align-items:start;box-shadow:var(--shadow,none)}
.xp-side{text-align:center}
.xp-logo{background:var(--logo-bg,#fff);border:var(--logo-bd,1px solid var(--line));border-radius:var(--logo-radius,14px);height:92px;display:grid;place-items:center;padding:15px;overflow:hidden}
.xp-logo img{width:auto;height:auto;max-width:100%;max-height:62px;object-fit:contain}
.xp-company{display:block;margin-top:9px;font-family:var(--fhead);font-weight:700;font-size:.92rem;text-transform:var(--company-ht,none)}
.xp-card h3{font-size:1.4rem;margin-bottom:3px}
.xp-meta{color:var(--faint);font-weight:600;font-size:.87rem;margin-bottom:14px}
.tag{display:inline-flex;align-items:center;gap:7px;background:var(--tag-bg);color:var(--tag-ink);border:var(--tag-bd,none);font-size:.77rem;font-weight:700;padding:5px 12px;border-radius:var(--tag-radius,999px);margin-bottom:16px;text-transform:var(--tag-ht,none);letter-spacing:var(--tag-ls,normal)}
.xp-card ul{margin:0;padding:0;list-style:none;display:grid;gap:11px}
.xp-card li{position:relative;padding-left:22px;color:var(--muted);font-size:.97rem}
.xp-card li::before{content:var(--bullet,"›");position:absolute;left:2px;color:var(--accent);font-weight:700}
.xp-card p.summary{margin:0;color:var(--muted)}
@media(max-width:620px){.xp-card{grid-template-columns:1fr;gap:16px}.xp-logo{max-width:132px;margin:0 auto}}

/* certs */
.certs{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:18px}
.cert{background:var(--card);border:var(--bd,1px solid var(--line));border-radius:var(--radius,18px);padding:22px;display:flex;flex-direction:column;box-shadow:var(--shadow,none);transition:transform .18s}
.cert:hover{transform:translateY(-4px)}
.cert-badge{height:82px;display:flex;align-items:center;margin-bottom:16px}
.cert-badge img{max-height:82px;max-width:160px;object-fit:contain;filter:var(--badge-filter,none)}
.cert:hover .cert-badge img{filter:none}
.cert h3{font-size:1.06rem;line-height:1.25;margin-bottom:16px;flex:1}
.cert .details{font-weight:700;font-size:.85rem;color:var(--accent);align-self:flex-start;text-transform:var(--tag-ht,none)}
.cert .details:hover{opacity:.7}
.cert .no-link{font-size:.82rem;color:var(--faint);font-weight:600}

/* interests — always full: 3 / 2 / 1 for 6 items */
.interests{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--int-gap,18px)}
@media(max-width:900px){.interests{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.interests{grid-template-columns:1fr}}
.interest{background:var(--card);border:var(--bd,1px solid var(--line));border-radius:var(--radius,18px);padding:26px;box-shadow:var(--shadow,none);transition:transform .18s}
.interest:hover{transform:translateY(-4px)}
.interest .ico{width:44px;height:44px;border-radius:var(--ico-radius,12px);background:var(--ico-bg,var(--accent));color:var(--ico-ink,var(--on-accent));display:grid;place-items:center;margin-bottom:16px;border:var(--ico-bd,none)}
.interest .ico svg{width:22px;height:22px}
.interest h3{font-size:1.14rem;margin-bottom:8px}
.interest p{margin:0;color:var(--muted);font-size:.93rem}

/* contact */
.contact{padding:76px 0 40px}
.contact-inner{text-align:center;background:var(--contact-bg,transparent);border:var(--contact-bd,none);border-radius:var(--radius,18px);padding:var(--contact-pad,0);box-shadow:var(--contact-shadow,none)}
.contact h2{font-size:clamp(2rem,5vw,3.2rem);margin:6px 0 14px}
.contact p{color:var(--contact-muted,var(--muted));max-width:46ch;margin:0 auto 32px}
.socials{display:flex;justify-content:center;gap:14px;margin-bottom:8px}
.socials a{width:54px;height:54px;border-radius:var(--ico-radius,14px);background:var(--social-bg,var(--card));border:var(--social-bd,1px solid var(--line));display:grid;place-items:center;color:var(--social-ink,var(--ink));transition:transform .16s}
.socials a:hover{transform:translateY(-4px);color:var(--accent)}
.socials svg{width:23px;height:23px}
.foot{text-align:center;color:var(--faint);font-size:.85rem;padding-top:28px}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr;gap:38px}.portrait{max-width:380px}.lede{max-width:none}}